전체 글(329)
-
이벤트 버블링 & 캡처링
바닐라 JS 로 프로그래밍을 하다보면 생기는 현상이 있다.이벤트를 다른 곳에 지정했는데 왜 상위요소가 지정되지?왜 하위요소도 전부..?event flow DOM 이벤트 흐름에는 캡처링, 타겟, 버블링 3가지가 있다. 캡처링은 이벤트가 하위요소로 전파되는 것이고타겟은 이벤트가 실제 타겟 요소에 전달되는 것그리고 버블링은 이벤트가 상위 요소로 전파되는 것이다. td 태그를 클릭하게 되면 이벤트가 최상위에서 시작해 아래로 전파. -> 캡처링이벤트가 타겟 요소에 도착해 실행 된다. -> 타겟그리고 다시 위로 전파된다. -> 버블링 위 그림의 3개의 phase 중에서 이벤트 핸들러가 실행되는 과정은 원래 target phase, bubbling phase 이나, 필요에 따라서 capture phase 와 targ..
2024.05.02 -
JavaScript & TypeScript
요즘 TypeScript 가 선호된다. 왜 선호되고 장점은 무엇이고 단점은 없을까?javascript & typescript 자바스크립트는 동적 웹 페이지를 만들기 위해 고안된 언어이며 브라우저를 통해 실행된다.타입스크립트는 자바스크립트의 슈퍼셋으로 정적 타입을 제공하여 대규모 애플리케이션의 개발을 용이하게 한다. 자바스크립트와 타입스크립트는 웹 개발자에게 강력한 도구를 제공한다. 이들은 개발자가 빠르게, 안정적으로 유연하게 애플리케이션을 개발 할 수 있도록 도와준다. typescript 타입스크립트는 자바스크립트 기반의 정적 타입 문법을 추가한 언어이다.타입스크립트는 자바스크립트의 슈퍼 셋, 즉 상위 확장자로 자바스크립트 엔진을 사용하며 자신이 원하는 변수의 타입을 정의하고 프로그래밍을 하면 자바스크..
2024.05.01 -
this [re:]
this 는 무엇일까?this this는 일반적으로 객체지향 언어에서 자기자신을 가리키는 객체, 즉 자기 자신과 굉장히 관련이 깊다.자바스크립트도 비슷할까?그렇지 않다. 자바스크립트가 조금 특별하기 때문인데,자바스크립트의 함수는 객체, 그 중에서도 일급 객체이다.일급 객체인 자바스크립트 함수는 변수나 데이터에 할당할 수 있고, 다른 함수에 인수 또는 반환값으로도 사용할 수 있다. // 1. 변수나 데이터에 저장const myFunc = func// 2. 함수의 인수로 전달function func1(func2) {}// 3. 함수의 반환값으로 사용function func1() { ... return func1} 이런 특징으로 자바스크립트의 함수는 다양한 환경에서 호출될 수 있다. func(), tes..
2024.04.30 -
Javascript Closure
클로져를 알기위해서는 실행 컨텍스트에 대해 알아야 한다. https://muyeon95.tistory.com/317 실행 컨텍스트실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다. 이는 자바스크립트의 동적 언어로서의 성격을 가장 잘 파악할 수 있는 개념이다. 자바스크립트는 어떤 실행 컨텍스트muyeon95.tistory.com 클로져는 무엇이고 어떻게 활용할 수 있을까?정의 MDN : 함수와 함수가 선언된 어휘적 환경의 조합 ????????????확실히 MDN 이 만능은 아니다. 코어 자바스크립트 : 어떤 함수 A 에서 선언한 변수 a 를 참조하는 내부 함수 B를 외부로 전달할 경우 A 의 실행 컨텍스트가 종료된 이후에도 변수 a 가 사라지지 않는 현상 ex code 1)functio..
2024.04.29 -
https
https 는 http 에 보안이 추가된 것이다.이는 너무 단순하며, 이렇게만 알고있으면 https 를 설명하기 어렵다. https 암호화 및 인증을 위해 SSL/TLS 프로토콜을 사용하는 http 의 보안 버전이다.기본적으로 443 포트를 사용한다. https 프로토콜을 사용하면 웹 사이트 사용자가 신용 카드 번호, 은행 정보, 로그인 자격 증명과 같은 민감한 데이터를 안전하게 전송할 수 있다.이러한 이유로 https 는 웹사이트를 보호하는데 특히 중요하기에 모든 웹사이트의 표준 프로토콜로 자리잡고 있다. https / http https 는 http 프로토콜에 암호화, 인증 및 무결성을 추가한다. 1. 암호화 http 는 원래 일반 텍스트 프로토콜로 설계되었기 때문에 중간자 공격에 취약하다. SSL/..
2024.04.26 -
argon2 vs bcrypt
언젠가 당연하게 bcrypt 를 이용해 비밀번호를 해싱했다.과연 bcrypt 가 최선이 맞을까? 암호화 암호화는 평문을 암호문으로 바꾸는 과정이다.암호화는 가장 기본적인 정보보안 방법으로 그 자체로 데이터의 유출 등을 막지는 못하지만 데이터에 담긴 정보를 알 수 없게 하는 것이 목적이다.bcrypt 가 무엇인가 단방향 암호화를 위해 만들어진 해시 함수 bcrypt 는 sha256 같은 해시 함수들의 문제점을 해결하기위해 설계되었다.sha256 는 원래 암호화를 위해 설계된 것이 아니라 짧은 시간 데이터를 검색하기 위한 자료구조로 설계가 되었다.이 때문에 빠른 속도가 장점이지만 취약점의 원인이 되기도 한다. 그래서 미리 해시값들을 계산해놓은 테이블을 가지고 해시 함수 반환값을 역추적하는 레인보우 테이블 공..
2024.04.25