자바스크립트 생태계의 비밀, npm부터 모노레포까지!

자바스크립트는 단순한 프로그래밍 언어를 넘어 전 세계 개발자들이 활용하는 방대한 생태계를 만들어냈습니다. 하지만 매일 사용하는 npm과 package.json, 다양한 번들 도구와 모듈 시스템의 작동 원리, 그리고 모노레포 환경까지 제대로 이해하기는 쉽지 않습니다. 이 책은 이러한 자바스크립트 생태계의 복잡한 퍼즐을 하나씩 풀어가며 실무에 꼭 필요한 지식을 제공합니다.

《npm Deep Dive》는 단순히 사용법을 나열하는 데 그치지 않고, 각 도구와 개념의 작동 원리와 선택 기준을 깊이 있게 다룹니다. npm의 기본 원리와 유의적 버전 관리, CommonJS와 ESModule의 차이점과 활용법, Webpack, Rollup, Vite 같은 최신 번들 도구의 비교와 실무 적용법, 그리고 모노레포를 활용한 대규모 프로젝트 관리 방법까지, 자바스크립트 생태계의 핵심을 체계적으로 정리했습니다.

초보 개발자라면 복잡한 개념을 단계적으로 이해할 수 있도록, 숙련된 개발자라면 실무에 바로 적용할 수 있는 팁과 전략을 통해 자바스크립트를 한층 더 깊이 이해하고 활용할 수 있도록 도와드립니다. 이 책을 통해 여러분은 자바스크립트 생태계를 자유롭게 탐험하며, 더 나은 개발 환경을 만드는 것뿐만 아니라 평소에 하던 웹 서비스 개발만으로는 이해하기 힘든 지식을 얻을 수 있을 것입니다.

★ 이 책에서 다루는 내용 ★

◎ npm과 node_modules, 그리고 유의적 버전 관리의 원리

◎ CommonJS와 ESModule의 역사와 차이점

◎ Webpack, Rollup, Vite 번들 도구의 비교와 선택 방법

◎ 트랜스파일러와 폴리필: Babel, core-js 활용법

◎ 모노레포 환경에서 대규모 프로젝트를 효율적으로 관리하는 법

◎ 나만의 npm 패키지와 CLI 도구를 만드는 방법

자바스크립트 생태계의 과거와 현재, 그리고 미래를 이해하고 싶다면 이 책이 여러분의 길잡이가 되어줄 것입니다. 지금까지의 고민을 해결하고, 더욱 생산적이고 전문적인 개발자로 성장해 보세요!

▣ 01장: npm과 유의적 버전 

1.1 npm의 정의와 역사 

__1.1.1 npm의 역사와 배경 

__1.1.2 npm의 주요 기능 

__1.1.3 npm과 관련된 유용한 사이트 

__1.1.4 정리 

1.2 유의적 버전이란? 

__1.2.1 유의적 버전의 등장 배경과 정의 

__1.2.2 유의적 버전의 구체적인 명세 

__1.2.3 유의적 버전의 문법 

__1.2.4 Node.js와 npm에서 사용하는 유의적 버전 

__1.2.5 정리 

1.3 유의적 버전과 npm 생태계의 명과 암 

__1.3.1 left-pad: 수천만 패키지에서 의존하는 유틸 패키지가 사라지면 어떻게 될까? 

__1.3.2 everthing: 의존성으로 있으면 패키지 삭제가 안 된다고? 그렇다면 모든 자바스크립트 패키지를 의존성으로 가져본다면 어떨까? 

__1.3.3 is-promise: 잘못된 부 버전 업데이트가 만들어낸 사태 

__1.3.4 colors.js와 faker.js: 섣부른 부, 수 버전 업데이트는 독이 될 수도 있다 

__1.3.5 event-stream 사건: 오픈소스는 얼마나 안전한가? 

__1.3.6 유의적 버전과 npm을 사용할 때 주의할 점 

__1.3.7 정리 

▣ 02장: package.json과 npm 파헤치기 

2.1 package.json 톺아보기 

__2.1.1 package.json 

__2.1.2 package.json의 주요 필드 

__2.1.3 package.json 생성하기 

__2.1.4 npm config와 .npmrc 살펴보기 

__2.1.5 정리 

2.2 dependencies란 무엇일까? 

__2.2.1 npm 버전과 버전에 사용되는 특수 기호 

__2.2.2 dependencies 

__2.2.3 devDependencies 

__2.2.4 peerDependencies 

__2.2.5 peerDependenciesMeta 

__2.2.6 정리 

2.3 npm의 주요 명령어 

__2.3.1 npm run 

__2.3.2 npm install과 npm ci 

__2.3.3 npm update 

__2.3.4 npm dedupe 

__2.3.5 npm ls 

__2.3.6 npm explain 

__2.3.7 npm audit 

__2.3.8 npm publish 

__2.3.9 npm deprecate 

__2.3.10 npm outdated 

__2.3.11 npm view 

__2.3.12 정리 

2.4 npm install을 실행하면 벌어지는 일 

__2.4.1 의존성 트리 분석의 핵심 @npmcli/arborist 

__2.4.2 패키지 설치를 위한 패키지, pacote 

__2.4.3 node_modules 살펴보기 

__2.4.4 정리 

2.5 node_modules는 무엇일까? 

__2.5.1 node_modules의 역할 

__2.5.2 node_modules의 구조 

__2.5.3 심볼릭 링크 

__2.5.4 정리 

2.6 bin 필드와 npx 

__2.6.1 CLI 패키지 

__2.6.2 bin 필드 

__2.6.3 npx 

__2.6.4 정리 

▣ 03장: npm의 대항마 yarn과 pnpm 

3.1 npm의 문제점과 한계 

__3.1.1 유령 의존성 

__3.1.2 디스크 I/O 부하 

__3.1.3 너무 거대한 node_modules 

__3.1.4 변경에 취약한 락 파일 

__3.1.5 정리 

3.2 yarn: 신속하고 안정적인 패키지 관리를 위한 패키지 관리자 

__3.2.1 yarn 소개와 역사 

__3.2.2 특징 

__3.2.3 정리 

3.3 pnpm: 디스크 공간 절약과 설치 속도의 혁신을 가져온 패키지 관리자 

__3.3.1 pnpm의 소개와 역사 

__3.3.2 특징 

__3.3.3 정리 

3.4 npm, yarn, pnpm 비교 

__3.4.1 워크스페이스 

__3.4.2 명령어 비교 

__3.4.3 벤치마크 테스트 

__3.4.4 정리 

▣ 04장: CommonJS와 ESModule 

4.1 자바스크립트 모듈화의 역사 

__4.1.1 자바스크립트 모듈화의 배경 

__4.1.2 모듈화 이전의 자바스크립트 

__4.1.3 자바스크립트 모듈의 여러 시도들 

__4.1.4 오늘날의 자바스크립트 모듈 시스템 

__4.1.5 정리 

4.2 CommonJS란 무엇일까?

__4.2.1 CommonJS의 탄생 배경

__4.2.2 CommonJS의 명세 

__4.2.3 Node.js의 CommonJS 

__4.2.4 소스코드를 CommonJS로 빌드하기 

__4.2.5 정리 

4.3 ESModule이란 무엇일까?

__4.3.1 ESModule의 탄생 배경과 도입 

__4.3.2 ESModule의 특징 

__4.3.3 Node.js의 ESModule 

__4.3.4 정리 

4.4 Node.js는 어떻게 node_modules에서 패키지를 찾아갈까? 

__4.4.1 모듈 해석 알고리즘 

__4.4.2 모듈 이름 지정자로 모듈을 로드하는 방법 

__4.4.3 정리 

4.5 CommonJS와 ESModule, 무엇이 정답일까? 

__4.5.1 오픈소스 패키지가 CommonJS와 ESModule을 동시에 지원하는 이유 

__4.5.2 CommonJS와 ESModule을 동시에 지원하는 듀얼 패키지 개발하기 

__4.5.3 순수한 ESModule 패키지 개발하기 

__4.5.4 CommonJS와 ESModule, 무엇이 정답일까? 

__4.5.5 정리 

▣ 05장: 트랜스파일과 폴리필 

5.1 트랜스파일을 도와주는 도구, 바벨 

__5.1.1 바벨의 필요성 

__5.1.2 바벨의 동작 방식 

__5.1.3 바벨 사용해보기 

__5.1.4 정리 

5.2 폴리필을 도와주는 도구 core-js 

__5.2.1 core-js란 무엇인가? 

__5.2.2 바벨과 core-js 

__5.2.3 정리 

5.3 최선의 폴리필과 트랜스파일은 무엇일까? 

__5.3.1 지원 환경 명시하기 

__5.3.2 정리 

5.4 바벨과 core-js의 대안 

__5.4.1 타입스크립트 컴파일러 

__5.4.2 SWC(Speedy Web Compiler) 

__5.4.3 es-shims 

__5.4.4 polyfill.js 

__5.4.5 정리 

▣ 06장: 자바스크립트 번들 도구 살펴보기 

6.1 번들링은 무엇이고 왜 필요할까? 

__6.1.1 번들링의 역사 

__6.1.2 번들링의 역할 

__6.1.3 정리 

6.2 웹서비스 번들의 표준, 웹팩 

__6.2.1 웹팩 소개 및 주요 특징 

__6.2.2 웹팩의 기본 개념과 동작 원리 

__6.2.3 간단한 웹팩 서비스 만들기 

__6.2.4 정리 

6.3 패키지 번들의 선두주자, 롤업 

__6.3.1 롤업의 등장 배경과 소개 

__6.3.2 롤업의 기본 개념과 특징 

__6.3.3 정리 

6.4 번들 도구의 신흥 강자, 비트 

__6.4.1 비트의 등장 배경과 소개 

__6.4.2 비트의 기본 개념과 특징 

__6.4.3 설정에 필요한 주요 필드 

__6.4.4 정리 

▣ 07장: 직접 자바스크립트 패키지 만들기 

7.1 나만의 npm 패키지 만들기 

__7.1.1 패키지 개발을 위한 체크리스트 

__7.1.2 프로젝트 환경 설정 

__7.1.3 실제 코드와 테스트 코드 작성 

__7.1.4 번들 및 트랜스파일하기 위한 환경 구축 

__7.1.5 간단한 테스트 코드 작성 

__7.1.6 깃허브 액션을 활용한 CI 파이프라인 구축 

__7.1.7 changesets를 활용한 배포 

__7.1.8 정리 

7.2 나만의 CLI 패키지 만들기 

__7.2.1 제작할 CLI 패키지 구상 

__7.2.2 프로젝트 환경 설정 

__7.2.3 실제 코드 작성 

__7.2.4 결과물 확인 

__7.2.5 배포 후 사용 

__7.2.6 CLI를 만드는 데 유용한 패키지 

__7.2.7 정리 

▣ 08장: 모노레포로 서비스와 라이브러리 모두 관리하기 

8.1 모노레포와 터보레포 

__8.1.1 모노레포란? 

__8.1.2 npm 워크스페이스 

__8.1.3 모노레포를 구성하는 도구, 터보레포 

__8.1.4 정리 

8.2 나만의 모노레포 프로젝트 만들기 

__8.2.1 디자인 시스템 소개 

__8.2.2 pnpm 워크스페이스 및 터보레포 구성하기 

__8.2.3 shared 공유 패키지 구현하기 

__8.2.4 @ndive/design-tokens 구현 

__8.2.5 @ndive/design-components 구현 

__8.2.6 @ndive/design-tracker 구현 

__8.2.7 애플리케이션 작성 

__8.2.8 배포 살펴보기 

__8.2.9 정리 

▣ 09장: 패키지 개발에 도움이 되는 도구와 팁 

9.1 패키지 개발에 도움이 되는 도구 

__9.1.1 패키지를 업로드하는 또다른 방법 JSR 

__9.1.2 복잡한 번들 프로세스를 한 번에 수행하는 도구, t sup 

__9.1.3 구성 파일의 표준 cosmiconfig 

__9.1.4 성능 분석을 위한 도구 Tinybench 

__9.1.5 손쉬운 코드 마이그레이션을 도와주는 jscodeshift 

__9.1.6 정리 

9.2 패키지 개발에 도움이 되는 팁 

__9.2.1 선택이 아닌 필수, ESModule 

__9.2.2 package.json 올바르게 작성하기 

__9.2.3 올바른 트랜스파일과 폴리필 적용하기 

__9.2.4 dependencies는 신중하게 추가하라 

__9.2.5 코드에 신뢰를 주는 테스트 코드와 벤치마크 테스트 

__9.2.6 올바른 문서 작성법 

__9.2.7 정리