CH03 자바스크립트 개발환경과 실행환경

JS 실행환경

JS엔진은 브라우저에도있으나 Node.js도 JS엔진을 내장하고 있음

기본적으로 브라우저에서 동작하는 코드는 node.js에서도 동일하게 동작함

주의점

1. 용도
   1. 브라우저
   2. HTML, CSS, JS를 실행해 브라우저 화면에 렌더링하는 것이 주된 목적
   3. Node.js
   4. 브라우저 외부에서 자바스크립트 실행환경을 제공하는 것이 주된 목적
2. 차이점

| 분류 | 웹브라우저 | nodejs |
| --- | --- | --- |
| DOM API | O | X |
| 파일 생성, 수정 | X | O |
| WEB API | O | X |
| NodeJS고유 API | X | O |

브라우저

개발자도구

자주사용하는 기능

Elements

로딩된 웹페이지의 DOM과 CSS를 편집하여 렌더링된 뷰를 확인할 수 있음

HTML문서 확인이 가능함

Console

웹페이지 에러 확인, console.log 결과 확인가능

Sources

로딩된 페이지의 자바스크립트 코드 디버깅이 가능함

Network

로딩된 웹페이지에 관련된 네트워크 요청 정보와 성능을 확인 가능

Application

웹스토리지, 세션, 쿠키 확인가능

Node.js

브라우저 외부에서 작동하는 어플리케이션을 위한 환경

덕분에 React, Babel, Webpack, ESLint등을 활용할 수 있음

nodejs와 npm

nodejs는 V8엔진으로 빌드된 JS 런타임 환경이다.

npm은 node package manager의 줄임말으로, 패키지 매니저이다. node.js에서 사용할 수 있는 모듈을 패키지화해서 모아둔 저장소 역할과 패키지 설치 및 관리를 위한 CLI를 제공한다.

REPL

Read Eval Print Loop의 약자로 간단하게 JS코드를 실행해 결과를 확인해 볼 수 있는 기능이다.

node

를 입력한 뒤에 실행하고싶은 코드를 입력하면 된다.

파일을 실행시키려면

node index(.js)

형태로 실행시키면 된다. 괄호는 있어도, 없어도 상관없다.