React나 Node.js를 공부하기 시작하면 거의 반드시 보게 되는 명령어가 있다.
npm install
처음에는 이게 정말 이상하게 느껴진다. 나는 분명 React를 설치한 것 같은데, 왜 또 무언가를 install해야 하는지 이해가 안 된다. 심지어 유튜브 강의를 보다 보면 npm install을 몇 번이고 반복해서 입력한다.
나도 처음에는 그냥 “해야 하니까 하는 명령어” 정도로 생각했다. 그런데 어느 날 install을 안 하고 코드를 실행해봤더니, 화면에 빨간 오류만 잔뜩 떴다.
그때 알게 됐다. npm install은 단순히 프로그램 하나를 설치하는 것이 아니라, 내 프로젝트에 필요한 부품들을 가져오는 과정이라는 것을.
npm은 무엇일까
npm은 Node Package Manager의 줄임말이다. 이름 그대로, Node.js에서 사용하는 프로그램이나 기능들을 관리해주는 도구다.
쉽게 말하면, 필요한 도구를 다운로드해주는 앱스토어 같은 역할을 한다.
예를 들어 휴대폰에서:
- 카카오톡 설치
- 유튜브 설치
- 게임 설치
를 하려면 앱스토어가 필요하다.
프로그래밍에서도 마찬가지다. React, Vue, Express, Tailwind 같은 기능을 사용하려면 어딘가에서 받아와야 한다.
그 역할을 하는 것이 npm이다.
즉:
- 앱스토어 → 휴대폰 앱 설치
- npm → 프로그래밍 기능 설치
라고 생각하면 이해하기 쉽다.
그럼 install은 무엇을 설치하는 걸까
예를 들어 React 프로젝트를 만들었다고 해보자.
프로젝트 폴더 안에는 보통 package.json이라는 파일이 있다.
이 파일 안에는 “이 프로젝트가 어떤 기능들을 필요로 하는지”가 적혀 있다.
예를 들어:
"dependencies": {
"react": "^18.0.0",
"react-dom": "^18.0.0"
}
처럼 적혀 있을 수 있다.
즉, 이 프로젝트는 React와 React DOM이 필요하다는 뜻이다.
그런데 package.json에는 이름만 적혀 있고, 실제 파일은 아직 없다.
그래서 npm install을 입력하면 npm이 인터넷에서 필요한 파일들을 모두 다운로드해서 내 컴퓨터에 가져온다.
그리고 그 파일들은 node_modules라는 폴더 안에 들어간다.
즉:
- package.json = 필요한 목록
- npm install = 실제로 다운로드
- node_modules = 다운로드된 파일들
이라고 생각하면 된다.
왜 install을 안 하면 오류가 날까
예를 들어 React 코드 안에:
import React from "react";
라고 써 있다고 해보자.
그러면 컴퓨터는 “React라는 파일을 가져와”라고 생각한다.
그런데 npm install을 하지 않았다면, 컴퓨터 안에는 React 파일이 없다.
그래서 아래처럼 오류가 나온다.
Cannot find module 'react'
즉, “react를 찾을 수 없습니다”라는 뜻이다.
나도 처음에는 이 오류를 보고 코드가 틀린 줄 알았다. 그런데 알고 보니 코드는 맞았고, 단지 install을 안 해서 React 파일이 없었던 것이었다.
그래서 프로젝트를 처음 다운로드했거나, GitHub에서 받은 뒤에는 거의 항상 가장 먼저:
npm install
을 입력하게 된다.
왜 node_modules 폴더는 이렇게 클까
npm install을 하고 나면 프로젝트 폴더 안에 node_modules라는 폴더가 생긴다.
그런데 이 폴더를 열어보면 정말 엄청나게 많은 파일이 들어 있다.
처음 보면 “왜 React 하나 설치했는데 파일이 이렇게 많지?”라는 생각이 든다.
이유는 React도 혼자만 사용하는 것이 아니기 때문이다.
예를 들어 React는 또 다른 작은 기능들을 사용하고, 그 기능들도 또 다른 기능들을 사용한다.
즉, 하나의 앱을 설치하면 그 안에 필요한 부품들도 같이 설치되는 것과 비슷하다.
그래서 node_modules는 점점 커진다.
심지어 작은 프로젝트라도 수백 MB가 되는 경우가 많다.
왜 GitHub에는 node_modules를 안 올릴까
초보자가 가장 많이 헷갈리는 것 중 하나가 이것이다.
“node_modules가 필요한데, 왜 GitHub에는 안 올리지?”
이유는 간단하다. node_modules는 너무 크고, 어차피 다시 만들 수 있기 때문이다.
GitHub에는 보통:
- package.json
- package-lock.json
만 올린다.
그러면 다른 사람이 프로젝트를 다운로드한 뒤, npm install만 입력하면 똑같은 node_modules를 다시 만들 수 있다.
즉, node_modules는 “완성된 결과물”이고, package.json은 “설명서”에 가깝다.
그래서 GitHub에는 설명서만 올리고, 실제 부품은 각자 npm install로 다시 받는 것이다.
npm install 뒤에 이름을 쓰면 무슨 뜻일까
가끔은 이렇게 쓰는 경우도 있다.
npm install axios
그러면 axios라는 기능을 설치한다는 뜻이다.
axios는 API를 쉽게 요청할 수 있게 해주는 라이브러리다.
즉, npm install 뒤에 이름을 쓰면 원하는 기능 하나만 설치할 수 있다.
예를 들어:
npm install reactnpm install expressnpm install tailwindcss
처럼 사용할 수 있다.
그러면 npm이 인터넷에서 해당 기능을 다운로드하고, package.json에도 자동으로 기록해준다.
npm은 왜 이렇게 중요할까
예전에는 개발자가 필요한 기능을 직접 파일로 다운로드하고, 폴더에 넣고, 버전을 맞춰야 했다.
하지만 npm이 생기면서 필요한 기능을 몇 초 만에 설치할 수 있게 되었다.
예를 들어 React 프로젝트를 만들 때도:
npm install react
한 줄이면 끝난다.
그래서 개발자들은 npm을 거의 매일 사용한다.
특히 React, Node.js, Express를 배우기 시작하면 npm install은 정말 자주 쓰게 된다.
처음에는 단순히 따라 쓰는 명령어처럼 보일 수 있다. 하지만 사실 npm install은 “이 프로젝트에 필요한 부품을 가져오는 작업”이다.
그래서 install을 해야 코드가 제대로 실행된다.
한 번에 정리하면
| 이름 | 역할 |
|---|---|
| npm | 필요한 기능을 설치하는 도구 |
| npm install | 필요한 파일을 다운로드 |
| package.json | 무엇이 필요한지 적혀 있는 파일 |
| node_modules | 실제로 설치된 파일들 |
즉, npm은 개발자의 앱스토어이고, npm install은 필요한 부품을 가져오는 버튼이다.