핫트레이딩

[AI 코딩] 초보 개발자가 쉽게 이해 할 수 있도록 npm, bash 에 대해 자세히 알아보자. 본문

IT 정보/인공지능 Ai

[AI 코딩] 초보 개발자가 쉽게 이해 할 수 있도록 npm, bash 에 대해 자세히 알아보자.

HOTT 2025. 8. 23. 13:30

🧁 npm이란?

 

npmNode Package Manager의 줄임말이에요. 쉽게 말하면, 웹 개발에 필요한 도구나 라이브러리를 설치하고 관리해주는 프로그램이에요.

 

🔍 npm으로 할 수 있는 일

  • 필요한 라이브러리 설치 (예: React, Firebase 등)
  • 프로젝트 설정 (package.json 파일 관리)
  • 명령어 실행 (예: npm start, npm run build)

📦 예시: React 설치

 

이 명령어는 react라는 라이브러리를 설치해서 내 프로젝트에서 사용할 수 있게 해줘요.

 

📁 package.json이란?

npm이 설치한 모든 라이브러리와 프로젝트 정보를 담고 있는 파일이에요.

 

 


 

 

🖥️ bash란?

bash는 컴퓨터에게 명령을 내리는 **터미널(명령어 창)**에서 사용하는 언어예요. 마치 컴퓨터와 대화하는 방식이라고 생각하면 돼요.

🧑‍💻 bash로 할 수 있는 일

  • 폴더 만들기, 이동하기
  • 파일 복사, 삭제
  • 프로그램 실행
  • Git이나 npm 명령어 입력

📌 자주 쓰는 bash 명령어

 

🧪 예시: 프로젝트 폴더 만들기

 

 

🎯 초보 개발자를 위한 팁

  • VS Code의 터미널을 사용하면 bash와 npm을 쉽게 실행할 수 있어요.
  • 명령어는 무서워하지 말고 자주 써보세요. 실수해도 대부분 복구할 수 있어요!
  • npm은 마치 앱스토어, bash는 리모컨이라고 생각하면 이해가 쉬워요.

 

반드시 해당 프로젝트 폴더로 이동한 뒤에 npm run dev를 실행해야 합니다.

 

🔍 왜 폴더 이동이 필요한가요?

npm run dev 는 현재 폴더에 있는 package.json 파일을 기준으로 실행돼요. 이 파일 안에는 어떤 명령어를 실행할지, 어떤 라이브러리를 사용할지에 대한 정보가 담겨 있어요.

 

예시 상황

 

만약 my-webapp 폴더 밖에서 실행하면 이런 오류가 나올 수 있어요:

 

이건 현재 위치에 package.json이 없거나, 그 안에 "dev"라는 명령어가 정의돼 있지 않다는 뜻이에요.


 

📁 확인 방법

VS Code에서 터미널을 열었을 때, 아래처럼 현재 경로를 확인할 수 있어요:

 

이 경로가 프로젝트 폴더인지 확인하고, 아니라면 cd 명령어로 이동하세요:

 


🧠 기억하기 쉽게!

npm run dev는 "내 프로젝트 폴더 안에서만 작동하는 마법 주문"이라고 생각하세요.

 

 


 

👨‍💻 npm, npx, firebase가 설치되어 있는지 확인하는 방법을 아주 쉽게 설명드릴게요.

 

반응형