자바스크립트의 변천사
1995 - 최초로 출시 ( livescript ) - html을 조작하는 목적
1997 - javascript ecma
2009 - ecmascript 5.0 <- 주도적인 버전
2015 - ES2015 (모던 자바스크립트)
현재 사용되고 있는 자바스크립트의 번전은 ES2015 이후 버전으로, ES2015 이후의 버전으로 개발을 한 뒤 모든 브라우저에서 호환이 가능하도록 5.0버전으로 변환을 해서 웹브라우저에서 동작시킨다.
웹앱의 구성요소
HTML / JAVSCRIPT / CSS
브라우저 : 웹앱을 실행시키는 역할을 하는 것 (런타임 환경을 제공하는 환경)
과거에는 브라우저에서만 자바스크립트를 실행시킬 수 있었는데, 시간이 지나며 node.js와 같이 다양한 환경이 만들어졌다.
node.js와 같은 런타임 환경 덕분에 자바스크립트를 웹 뿐만이 아니라 PC나 서버 내에서도 동작할 수 있게 되었다.
CSR&SSR
HTML을 언제 만드느냐에 따라서 렌더링 방식은 두가지로 나뉘게 된다.
일반적인 렌더링 방식이라 하면 아래와 같다.
1. 웹서버가 HTML파일을 브라우저에게 전송한다.
2. 브라우저가 html을 해석해서 ui를 그려낸 후 자바스크립트가 실행된다.
javascript도 html을 조작할 수 있는데, 이 말은 브라우저가 웹앱을 실행시킨 다음에도 UI가 조작될 수 있다는 말이다.
위의 설명과 같이 최초 전송된 html에는 거의 내용이 없고 javascript가 실행된 이후에 필요한 ui가 그때그때 javascript로 인해 생성되는 방식을 클라이언트 사이드 렌더링이라고 한다. 브라우저에서 실행되는 javascript의 결과로 ui를 주도적으로 만드는 것이다.
반면 javascript의 실행의 결과로 html이 만들어지는 것이 아니라 웹서버에서 html이 만들어져서 브라우저로 전송되는 방법이 존재하는데, 이는 서버사이드 렌더링이라고 한다. 서버에서 html을 만들어서 브라우저에 전송하는 것이다.
'프로그래밍 > javascript&typescript' 카테고리의 다른 글
첫번째 프로젝트:hacker news(7) 템플릿 (0) | 2021.09.15 |
---|---|
첫번째 프로젝트:hacker news(6) 페이징 (0) | 2021.09.13 |
첫번째 프로젝트:hacker news(5) 라우터 (0) | 2021.09.12 |
첫번째 프로젝트:hacker-news(1-4) (0) | 2021.09.11 |
node.js & npm (0) | 2021.09.10 |