완전하게 만들어진 HTML 파일을 서버로부터 받아오고 이를 웹브라우저에 렌더링합니다.
웹서버에 요청을 할 때마다 브라우저 새로고침이 일어나고 새로운 페이지는 서버에 요청하는 것입니다.
클라이언트 사이드 렌더링은 처음에 웹서버에 요청할 때 데이터가 없는 문서를 반환합니다.
그 후 HTML 및 static 파일들이 로드되면서 데이터가 있으면 데이터를 서버에 요청하고 화면에 렌더링해줍니다.
즉 사용자 요청이 올 때마다 서버에 리소스를 요청하고 이를 가져와 웹 브라우저에 보여주는 방식입니다.
👍🏻 지금부터는 자바스크립트에 대한 내용입니다.
✅ 실행 컨텍스트(Execution Context)는 scope, hoisting, this, function, closure 등의 동작원리를 담고 있는 자바스크립트의 핵심원리입니다.
✅ 실행 컨텍스트는 실행 가능한 코드가 실행되기 위해서 필요한 환경이라고 할 수 있습니다.
[실행 컨텍스트 구조]
자세히는 ➡️ 실행컨텍스트
✅ iterator 은 객체를 next 메서드로 순환 할 수 있는 객체입니다.
const iterator = [1, 2, 3][Symbol.iterator]();
iterator.next().value; // 1
iterator.next().value; // 2
iterator.next().value; // 3
iterator.next().done; // true
✅ 이벤트 위임(Event Delegation) 이란 동적으로 노드를 생성하고 삭제할 때 각 노드에 대해 이벤트를 추가 하지 않고, 상위 노드에서 하위 노드의 이벤트를 제어 하는 방식입니다.
예시 : 이벤트 버블링, 이벤트 캡처 그리고 이벤트 위임까지
오늘한 내용 중 실행 컨텍스트가 가장 복잡하고 어려운 내용인 것 같습니다.
확실히 동작원리를 알고 자바스크립트를 써야한다고 느끼게 되었습니다.
CSR, SSR, SPA, MPA?
좋은정보 감사합니당