이 글의 내용은 영상으로도 보실 수 있습니다.
프론트엔드 개발자에게 Node.js는 피할 수 없는 툴입니다. 제가 이야기한 중요한 네가지 툴 중에 Sass와 BrowserSync가 바로 Node.js 환경에서 돌아가는 자바스크립트 프로그램입니다.
Node.js란?
Node.js는 서버 쪽에서 돌아가는 자바스크립트 런타임 환경입니다.
런타임 환경이란 그럼 뭘까요? 런타임 환경이란 프로그램이 실행되는 환경을 말합니다(런타임은 실행 시간을 말하는 것이고, 대비되는 말은 컴파일 타임입니다). 프로그램이 실행되는 동안 메모리 관리, 입출력 처리, 변수 접근, 운영체제와 통신 같은 일을 하는 거죠.
PHP의 런타임 환경은 php-fpm이 있고요, 자바의 런타임 환경은 JVM입니다. 이렇게 언어마다 런타임 환경이 있는 것이죠.
자바스크립트의 대표적인 런타임 환경은 브라우저입니다.
그 의미
Node.js 이전에도 서버측에서 자바스크립트를 돌릴 수 있는 런타임 환경이 있기는 했습니다. 그러나 너무 느렸고, 수요도 적었습니다. 아마도 아직 JS가 본격적으로 프로그래밍 언어라는 인식이 없을 때였기 때문일 겁니다.
그런데 웹기술의 발전과 함께 상황이 달라졌습니다. 구글 크롬은 자바스크립트 실행 엔진의 성능을 엄청나게 개선했습니다. 이 엔진이 V8입니다.
또한 jQuery, ajax 같은 혁신적인 기술의 등장과 함께 자바스크립트는 이제 웹사이트 장식용 장난감 언어라는 인식에서 벗어나기 시작했습니다. 본격 웹 어플리케이션(Rich Web Application)을 만드는 주요한 언어로 등극하게 된 것입니다.
이런 배경에서 2009년에 미국의 개발자 리안 달(Ryan Dahl)이 V8 기반의 서버측 자바스크립트 실행 환경인 Node.js를 발표했습니다. 이 실행 환경은 기존의 서버측 자바스크립트 실행 환경과 달리 큰 인기를 끌었습니다.
Node.js의 대중화로 수많은 웹개발자들이 자바스크립트라는 하나의 언어로 서버단과 클라이언트단의 코드를 모두 개발할 수 있게 됐습니다. 서버단 개발자가 갑자기 엄청나게 많아졌습니다. 이것이 Node.js의 중요한 의미중 하나입니다.
이후 수많은 프론트엔드 툴이 Node.js에 기반해서 나오게 된 것은 자연스러운 일이었습니다.
영상으로 보기
이 내용은 “프로젝트 중심 실전 CSS”의 다섯 번째 영상에 나오는 내용입니다.
영상에서는 윈도우에 Node.js를 설치하고, Sass와 BrowserSync를 설치해 실제 활용하는 방법까지 다룹니다.
