Node.js와 패키지

Node.js

브라우저 바깥에서 자바스크립트 실행 가능한 환경(런타임)

프론트 개발에서 Node.js의 역할

Node.js라는 실행 환경 위에서 여러 패키지를 통해 개발 환경 구축과 생산성 향상

✨ 최신 스펙으로 개발: Babel

• 자바스크립트 스펙의 발전 속도 > 브라우저의 지원 속도 ⇒ 최신 스펙으로 개발하려면 트랜스컴파일러인 Babel(Node.js 위에서 구동) 필요
  

✨ 빌드 자동화 도구 제공: Webpack 등 모듈 번들러

• 빌드 과정
  1) 파일 압축
  2) 코드 난독화
  3) 폴리필 추가

NPM(Node Package Manager)

자바스크립트 프로그래밍 언어를 위한 패키지 관리자

라이브러리와 패키지

• 공통점: 특정 기능을 제공하는 코드 집합
• 차이점: 패키지는 라이브러리를 포함한다.

라이브러리는 특정 기능 수행을 위한 코드 집합이다.

패키지는 특정 기능 제공을 위한 연관 라이브러리, 모듈, 자원 등의 묶음으로 라이브러리를 포함한다.

패키지 설치

✨ CDN(컨텐츠 전송 네트워크) 제공 라이브러리 이용

HTML 문서에 script 태그로 삽입

<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>

• 단점: 외부 요인으로 장애 발생 가능 ex. CDN 서버 장애 발생시

✨ 직접 설치

프로젝트 폴더 내에 라이브러리 직접 다운

• 단점: 버전 업그레이드 대응 시 매번 직접 다운로드 해야하며 버전별 하위 호환성 여부까지 체크해야 해 번거로움

✨ 패키지 관리자 이용(NPM, Yarn)

$ npm install react or $ yarn add react

패키지 관리자로 최신 버전의 패키지를 저장소에서 찾아 프로젝트로 다운로드

이는 프로젝트 루트에 위치한 package.json에 기록됨

// package.json
{
	"dependencies": {
		"react": "^16.12.0"
	}
}

유의적 버전

버전 번호를 관리하는 체계로 주(Major), 부(Minor), 수(Patch)로 구성된다.

• 주 버전(Major Version): 기존 버전과 호환되지 않게 변경
• 부 버전(Minor Version): 기존 버전과 호환되면서 기능 추가
• 수 버전(Patch Version): 기존 버전과 호환되면서 버그 수정

틸드 기호(~)

부(Minor)버전 명시된 경우 패치버전 변경

부(Minor)버전 없는 경우 부버전 변경

[예시 1] ~1.2.3 ⇒ 1.2.3부터 1.3.0미만까지

[예시 2] ~1.2 ⇒ 1.2.0부터 1.3.0미만까지

[예시 3] ~0 ⇒ 0.0.0부터 1.0.0미만까지

캐럿 기호(^)

주(Major) 버전 고정하고 마이너와 패치 버전 변경

단, 정식 버전 미만인 0.x 버전은 패치만 갱신

[예시 1] ^1.2.3 ⇒ 1.2.3부터 2.0.0미만까지

[예시 2] ^0.3 ⇒ 0.3.0부터 0.4.0미만까지

[예시 3] ^0 ⇒ 0.0.0부터 0.1.0미만까지