3장. 자바스크립트 개발 환경과 실행 방법

3.1 자바스크립트 실행 환경

자바스크립트는 브라우저 환경 또는 Node.js 환경에서 실행할 수 있다.

브라우저와 Node.js의 차이점

• 브라우저

  : 웹페이지를 화면에 렌더링하는 것이 주된 목적
  클라이언트 사이드 Web API를 지원한다.(ex. DOM, fetch, SVG,,)
  
  

• Node.js

  : 브라우저 외부에서 실행 환경을 제공하는 것이 주된 목적
  클라이언트 사이드 Web API를 지원하지 않고, ECMAScript와 Node.js 고유의 API를 지원한다.

3.2 웹 브라우저

가장 많이 사용하는 구글 크롬 브라우저 사용.

3.2.1 개발자 도구

크롬 브라우저가 제공하는 개발자 도구는 웹 애플리케이션 개발에 필수적인 강력한 도구다.

3.2.2 콘솔

개발자 도구의 콘솔 패널은 코드에서 에러가 발생해 애플리케이션이 정상적으로 동작하지 않을 때 가장 우선적으로 살펴봐야 할 곳이다.

3.2.3 디버깅

디버깅은 에러 메시지를 확인하고 에러가 발생한 원인을 제거하는 것이다.

3.3 Node.js

3.3.1 Node.js와 npm

Node.js는 자바스크립트 런타임 환경이다.

npm은 자바스크립트 패키지 매니저다.
Node.js에서 사용할 수 있는 모듈들을 패키지해서 모아둔 저장소 역할과 패키지 설치 및 관리를 위한 CLI를 제공한다.

3.4 비주얼 스튜디오 코드

코드 에디터를 사용하면 코드 자동 완성, 문법 오류 감지, 디버깅, Git 연동 등 강력하고 편리한 기능을 활용할 수 있다.

3.4.4 Live Server 확장 플러그인

Live Server라는 확장 플러그인을 이용하면 소스코드를 수정할 때마다 수정 사항을 브라우저에 자동으로 반영해주기 때문에 매우 편리하다.