🔮 자바스크립트 실행 환경
모든 브라우저는 자바스크립트를 해석하고 실행할 수 있는 자바스크립트 엔진을 내장하고 있다. Node.js 또한 자바스크립트 엔진을 내장하고 있다.
👉 하지만 브라우저와 Node.js는 용도가 다르다.
브라우저
- HTML,CSS,자바스크립트를 실행해 웹페이지를 브라우저 화면에 렌더링하는 것이 주목적.
- 보안상의 이유로 브라우저 환경의 자바스크립트는 파일을 생성하고 수정할 수 있는 파일 시스템을 제공 ❌ : 각 사용자의 브라우저를 통해 사용자 컴퓨터 로컬의 파일을 삭제하거나 수정할 수 있다면 이는 사용자 컴퓨터가 악성 코드에 그대로 노출되는 것이나 다름없다.
- 클라이언트 사이드 Web API 제공.
Node.js
- 브라우저 외부에서 자바스크립트 실행 환경을 제공하는 것이 주목적.
: 따라서 브라우저에서 제공하는 DOM API는 Node.js에서 제공되지 않는다. - 파일을 생성하고 수정할 수 있는 파일 시스템을 기본 제공한다.
- Node.js의 고유의 API를 제공.
🔦 웹 브라우저
구글 크롬 브라우저의 점유율은 65.47%!
개발자 도구
-
Elements : 로딩된 웹페이지의 DOM과 CSS를 편집해서 렌더링 된 뷰를 확인해 볼 수 있다. 단 편집한 내용이 저장되지 않는다. 웹페이지가 의도된대로 렌더링 되지 않았다면 이 패널을 확인해 유용한 힌트를 얻을 수 있다.
-
Console : 로딩된 웹페이지의 에러를 확인하거나 자바스크립트 소스코드에 작성한
console.log메서드의 실행 결과를 확인할 수 있다. -
Sources : 로딩된 웹페이지의 자바스크립트 코드를 디버깅할 수 있다.
-
Network : 로딩된 웹페이지에 관련된 네트워크 요청 정보와 성능을 확인할 수 있다.
-
Application : 웹 스토리지, 세션, 쿠키를 확인하고 관리할 수 있다.
🪜 Node.js
클라이언트 사이드, 즉 브라우저에서 동작하는 간단한 웹 애플리케이션은 브라우저만으로도 개발이 가능하다.
하지만 프로젝트의 규모가 커짐에 따라 React, Angular, Lodash 같은 프레임워크또는 라이브러리를 도입하거나 Babel, Webpack, Eslint 등 여러가지 도구를 사용할 필요가 있다.
Node.js와 npm
Node.js
2009년, 라이언 달이 발표한 Node.js는 크롬 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경이다. 간단히 말해 브라우저에서만 동작하던 자바스크립트를 브라우저 이외의 환경에서 동작시킬 수 있는 자바스크립트 실행 환경이다.
npm
npm은 자바스크립트 패키지 매니저다.
Node.js에서 사용할 수 있는 모듈들을 패키지화해서 모아둔 저장소 역할과 패키지 설치 및 관리를 위한 CLI(Command Line Interface)를 제공한다.
