자바스크립트 변천사 / 모던 자바스크립트

iamsummer__·2021년 10월 27일
0

essential

목록 보기
1/1

javascript 활성화되는 계기

2000년대 flash player의 전성기로 인해 javascript의 발전이 크게 없었습니다.
그러다... 두둥탁!
스티븐 잡스가 만든 아이폰으로 인해 스마트폰의 세계가 시작되면서,
flash player의 전성기가 꺾이고 javascript가 활성화 되는 계기가 되었습니다.

모던 자바스크립트

보통 모던 자바스크립트라고 하면 ES2015입니다. 연도별로 자바스크립트에 새로운 기능들이 추가되고 ES에 연도를 붙여서 구분짓고 있습니다.

요즘 FE가 복잡해진 이유?

자바스크립트라는 언어는 디자인 자체가 간단한 페이지를 만들기 위해 탄생하였습니다.
그러나 웹/앱의 규모가 커지면서 간단한 자바스크립트 언어를 통해 복잡한 웹/앱을 만들기에는 무리가 있었겠죠..
그러다보니 여러기능들도 추가되고, 중간에 nodejsnpmjs의 탄생으로 인해 범위가 넓어지게 되었습니다.

javascript는 모듈 스펙을 지원하나?

html에 script태그를 통해 js파일을 연결시켜 사용하고 있습니다.
그러나 기본적으로 javascript는 모듈스펙을 지원하지 않으므로, 모든 js소스들을 script태그에 연결해야하는 불편함이 있었습니다.
연결해야할 파일이 많을수록 script태그의 갯수는 천차만별로 늘어나게 됩니다.ㅠ

이때 ES2015 문법에서 모듈스펙을 지원하게 됩니다.
export/import를 통해서 js코드안에서 다른 js코드을 불러 사용할 수 있게 됩니다.
모듈스펙과 함께 bundler의 탄생을 통해 HTML에 하나의 파일만 script태그에 연결할수 있게 됩니다.

bundler란?

시작하는 자바스크립트 파일(entry)을 지정하면 모듈 스펙(export/import)을 통해 다른 js코드를 불러사용한 경우, 해석하여 하나의 파일로 만들어주는 역할

대표적으로 webpack이 있습니다.

js파일 외에도 다양한 파일들을 받아서 축약된 형태로 ouput을 제공해줍니다.
위 그림에서 볼 수 있듯이, ouput의 파일 형태도 다양합니다.

이렇게 많은 작업을 bundler를 통해 하다보니까, 프로젝트마다 세팅도 복잡해지게 됩니다.

ES2015, ES2016, ... ES2021은 모든 브라우저에서 사용가능한가?

매해마다 새로운 문법이 추가되고 있는 자바스크립트,
모든 브라우저에서 업데이트된 자바스크립트 문법들을 사용가능할까요?
놉!.ㅠㅠ IE만 해도 지원하지 않는 기능이 굉장히 많습니다.
브라우저 호환성 이슈로 인해 babel이라는 것을 통해 하위 버전의 자바스크립트의 코드로 변환해야지만 사용가능합니다.

javascript는 브라우저에서만?

javascript는 브라우저서만 실행가능할까요?
과거에는 그랬습니다만, nodejs가 탄생한 후부터는 브라우저가 아닌 환경에서도 javascript가 실행가능합니다.

nodejs의 탄생배경?

크롬에서 V8엔진을 개발하여 js코드를 빠르게 실행할 수 있는 환경을 제공하였습니다.
이때 라이언달이라는 사람이 V8엔진만 있으면 브라우저가 아닌 다른 환경에서도 자바스크립트 코드를 실행시킬 수 있지 않을까? 라는 생각으로 인해 nodejs가 탄생하게 됩니다.
즉, nodejs는 브라우저가 아닌 일반 운영환경 체제에서도 js가 실행가능합니다.

nodejs의 개발로 인해 npmjs가 탄생하게 됩니다.
npmjs는 여러 개발자들이 개발한 오픈소스들을 쉽게 다운로드 받을 수 있습니다.

nodejs, npmjs등의 탄생으로 인해 프론트엔드 개발이 더욱 발전할 수 있게 되는 계기가 되었습니다.

profile
개발하는 프론트엔드개발자

0개의 댓글