Javascript (1) : 개발환경 설정하기

Javascript (1) : 개발환경 설정하기

자바스크립트(JS) 시작하기

(1) Node. js

자바스크립트 개발을 위해서는 Node.js라는 런타임을 설치해야 한다.

Node.js는 JS가 동작할 수 있는 환경을 구축해주며, 각종 추가설치 모듈들을 HTML/CSS/JS로 변환시켜 브라우저가 해석할 수 있도록 도와주는 역할을 한다. nvm(node version manager)와 npm(node package manager)로 나뉜다.

Node.js 공식 홈페이지. 일반적으로 최신버젼보다 안정성이 높은 LTS 버젼의 설치를 권장한다.

[nvm 관련 주요 터미널 명령어]

node --version: 현재 인스톨된 node.js의 버젼을 보여준다.

(2) npm

노드 환경에서 사용할 수 있는 각종 패키지와 모듈들을 관리해주는 프로그램.

[npm 관련 주요 터미널 명령어]

npm init -y : npm 환경 최초 등록. 프로젝트에 package.json 파일이 생성된다. npm i [프로그램명] : (=npm install [프로그램명]) 일반, -D(= --save-dev)의 두가지 옵션이 있다. -D 옵션을 붙일 경우 해당 패키지는 dev-dependencies에 개발시에만 사용하는 패키지로 등록된다.

(3) package.json 파일 뜯어보기

npm을 통해 모듈을 설치하면 node_modules폴더와 package-lock.json 파일이 생성된다.

node-modules 폴더의 내용은 npm i 명령어를 통하여 언제든 재설치할 수 있으므로 지워도 무방하지만 package.json 파일의 dependency 내용을 기준으로 설치되는 것이기 때문에 package.json과 설치한 모듈에 필요한 추가 모듈을을 선언해둔 파일인 package-lock.json파일은 삭제되어서는 안된다.

개발서버를 열기 위한 dev 명령어와 배포용 파일 생성을 위한 build 명령어를 추가해두었다.

- main: 개발시보다는 배포시에 필요한 옵션. 컴파일 언어로 따지면 main함수 위치쯤 되지 않을까

- scripts: 항목 안에 직접 사용할 npm 명령어를 등록할 수 있다.

npm run [명령어] 형태로 등록된 명령어들을 사용할 수 있다.

- dependencies : dev-dependencies와 dependencies로 나뉜다.

버젼명 앞에 붙어있는 ^는 Semantic Versioning의 표시로, 해당 모듈이 npm update [모듈명] 명령어를 통하여 메이저 버젼 내에서 최신버젼으로 업데이트될 수 있음을 의미한다.

from http://hardblackpencil.tistory.com/20 by ccl(A) rewrite - 2021-09-07 16:26:40