Javascript란 웹 애플리케이션을 동적으로 제어하기위해 고안된 언어다.
Javascript의 변천사
1995
LiveScript라고 하는 이름으로 Netscape 탑재되어 출시
1996 (번외)
MS에서 LiveScript와 유사한 언어인 JScript를 개발, IE에 탑재시킴
1997
Ecma라고하는 표준단체에서 기존의 Livescript를 Javascript라는 이름으로 표준안을 만들기 시작
(따라서 Javascript의 공식명칭은 ECMAScript)
2009
ECMA 5.0 릴리즈, 가장 큰 변화를 갖고온 업데이트다.
트랜스파일러들이 변환하게되는 타겟 버전이 대부분 5.0 이다
현역에서 실행되는 버전의 Javascript로써, 거의 모든 브라우저가 지원하는 Javascript 버전이다.
이전 버전의 짤막한 역사
- 1.0 ~ 2.0 활발한 업데이트
- 2.0 ~ 3.0 Adobe 플래시에 밀려 암흑기를 가짐
2015 ~
ECMA Script 2015 등장
버전 네이밍에 년도를 붙이기 시작, 모던 Javascript라고 불리기 시작
개발자들은 ES2015 이후의 Modern javascript 문법으로 개발하고,
트랜스파일러로 ECMA 5.0 버전으로 변환하여 배포되어, 브라우저에서 실행된다.
웹 프론트의 구성요소
기본적으로 구성소는 다음과 같다.
- HTML: UI를 만든다.
- CSS: UI를 꾸민다.
- Javascript: UI를 조작한다. (생성도가능)
목적에 따라서 구성요소는 줄어들 수 있다.
웹 페이지
목적이 단순 정적인 데이터를 보여주는 것에 있는 웹 애플리케이션이다. 사용자와의 인터렉션이 없고 동적인 효과가 없어 javascript가 없다.
- HTML
- (CSS)
웹 애플리케이션
상태를 갖고 있고 사용자와 인터렉티브하게 액션을 주고받을 수 있어야 한다.
- HTML
- (CSS)
- Javascript
결국 결과물로는 HTML 파일이 제공되어야 한다.
웹 앱이 생성되는 방식
CSR
- 서버에서는 빈 HTML 파일이 전송되고 브라우저에서 빈 화면을 그린 후, Javascript에 의에서 UI가 생성되는 방식
- 브라우저에서 실행되는 Javascript에 의해서 화면이 그려지는 방식
- 브라우저가 주도적으로 화면을 그리는 방식
SSR
- 서버에서 다 그려진 HTML 파일이 전송되고 브라우저에서 그리는 방식
- 서버가 주도적으로 화면을 그리는 방식
앱의 성격에 맞춰서 알맞은 방식을 선택해야 한다.
프로그래밍 관점에서의 구성요소
HTML로 UI를 만들고 Javasript를 가지고 조작하는 점은 같지만, 그 안에서도 다양한 구성요소들이 존재한다.
미디어파일시스템, 웹 워커 등 다양한 구성요소들이 있는데 대표적으로 그래픽시스템이 있다.
기본적으로 웹 앱은 HTML, CSS를 가지고 그래픽을 표현한다.
그러나 좀 더 복잡한 3D나 2D를 할때 이들을 전문적으로 다룰 수 있는 도구가 필요하다.
대표적으로 canvas나 svg 태그가 있다.
이들은 2D나 3D를 표현하기위한 영역만 제공을 하고, javascript로 복잡한 그래픽요소를 다룰 수 있는 API를 제공한다.
