Javascript Essenetials

Node.js

Node.js는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임. (프로그래밍 언어가 동작하는 환경)

웹 브라우저에서는 HTML, CSS, JS가 동작하는데, 여러가지 도움을 주는 모듈을 Node.js 환경에서 브라우저에서 동작하는 언어들로 변환된 결과를 다시 브라우저로 보낸다.

NVM

Node Version Manager

• 설치된 버전 확인
  nvm ls

• 버전 설치
  nvm install '원하는 버전'

• 사용할 버전
  nvm use '사용할 버전'

• 버전 삭제
  nvm install '삭제할 버전'

nvm use 12.14.1 을 실행했을 때

exit status 5: �׼����� �źεǾ����ϴ�.

exit status 1: ������ �̹� �����Ƿ� ���� �� �����ϴ�.

이런 오류가 나서 구글링 해보니 다양한 방법을 찾을 수 있었는데,
나는 vscode를 관리자 권한으로 실행한 뒤 실행하니 잘 동작하였다.

NPM

Node Package Manager
전 세계의 개발자들이 만든 다양한 기능(패키지, 모듈)들을 관리하는 도구.

😥 관리 효율 증가, 손 쉬운 기능 고도화

😊 학습 난이도 증가, 구성이 복잡

NPM 시작

• npm init -y

package.json 파일 생성

• npm install parcel-bundler -D
• npm install lodash

parcel-bundler, lodash와 그것을 사용하기 위한 다른 모듈들까지 모두 설치
package-lock.json과 node-modules 생성

package.json에 이미 설치되었던 패키지, 모듈들은 해당 파일 내에서 자동으로 관리가 된다.
node_modules가 없어도 npm install 해주면 package.json 파일에 있는 패키지, 모듈들에 필요한 것들 자동으로 설치해준다.

'-D' 태그

• -D 가 있으면
  개발용 의존성 패키지 설치하겠다. 개발할 때만 사용하겠다.

• -D 가 없으면
  일반 의존성 설치하겠다. 웹사이트에서 동작시킬 때 사용하겠다.

개발 서버 실행과 빌드

parcel 명령어를 사용해서 브라우저를 실행해야한다.

package.json "scripts" 안에

"dev": "parcel index.html"
를 명시해주어야 한다.

npm run dev
명령어로 로컬에서 동작시킬 수 있다.

import _ from 'lodash';

console.log('Hi');
console.log(_.camelCase('hello world'));

hello world를 camelcase로 변환해서 console에 찍어준다.

"build": "parcel build index.html"
추가 하고

npm run build

실제로 사용자들이 보는 용도의 서버가 열린다.
dist 라는 폴더가 생성되고 폴더 내에 index.html은 난독화 된 상태로 생성된다.
dist 폴더 내에 있는 파일들은 브라우저에서 동작 시키는 용도이기 때문에 필요 없는 부분은 지우거나 해서 최적화 해둔 파일들이다.

유의적 버전(SemVer)

semantic Versioning, SemVer

Major.Minor.Patch
위와 같은 방식으로 버전을 명시한다.
ex) 12.14.1

• Major
  기존 버전과 호환되지 않는 새로운 버전

• Minor
  기존 버전과 호환되는 새로운 기능이 추가된 버전

• Patch
  기존 버전과 호환되는 버그 및 오타 등이 수정된 버전

• ^
  버전 앞에 '^' 이 붙어있으면
  Major 버전 안에서 가장 최신 버전으로 업데이트 가능

downgrade/upgrade

• npm install lodash@4.17.20
  현재 4.17.21 버전으로 설치 되어있는데, 4.17.20 버전으로 설치(덮어쓰기)하겠다.

• npm update lodash
  최신 버전으로 update 하겠다.
  만약 버전 앞에 ^ 기호를 수동으로 없애면 해당 명령어는 듣지 않는다.

NPM 프로젝트의 버전 관리 (.gitignore)

우리의 프로젝트를 제품으로 만들어주는 파일들은 저장소에 따로 옮길 필요가 없다. 우리가 버전 관리를 할 필요가 없다.

앞서 말했듯이 package.json 파일 내에 우리가 쓸 패키지나 모듈이 명시되어 있으면 언제나 다시 설치할 수 있는 파일들이 있다. (node_modules, dist ...)

이런 파일들을 .gitignore 파일에 따로 명시해주면 git이 무시한다.