[Node.js] Node.js의 개념과 Vue.js 프로젝트 실행

❓ Node.js

• Chrome V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경(Runtime Environment)
• 자바스크립트 런타임 환경은 자바스크립트를 브라우저 외의 다른 환경에서도 실행할 수 있도록 지원한다.
• Node.js를 통해 자바스크립트를 이용해서 Front-end와 Back-end 애플리케이션을 모두 개발할 수 있다.

✔️ npm

• node package manager
• 패키지는 Node.js에서 자주 쓰이고 재사용되는 자바스크립트 라이브러리를 말한다.
• npm은 Node.js에 필요한 패키지들을 관리하는 프로그램이다.
• npm을 이용하면 애플리케이션에 필요한 패키지를 다운로드할 수 있다.
• 주요 명령어
  1. npm install 모듈
     • 지정된 모듈을 local 패키지로 설치한다.
       local 패키지는 해당 애플리케이션에서만 사용가능하다.
  2. npm install -g 모듈
     • 지정된 모듈을 global 패키지로 설치한다.
  3. npm install -save 모듈
     • 지정된 모듈을 설치하고, package.json의 dependencies에 추가한다.
  4. npm uninstall 모듈
     • 지정된 모듈을 삭제한다.
  5. npm init
     • package.json 파일을 생성한다.
  6. npm run 명령어
     • package.json의 scripts에 정의된 명령어를 실행한다.

✔️ package.json

• Node.js 애플리케이션의 프로젝트 정보, 의존성 정보, 실행가능한 스크립트 명령이 정의된 파일
• package.json에 정의된 의존성 정보는 npm을 이용해서 다운로드할 수 있다.
  npm install <----- 의존하는 모든 모듈(패키지, 라이브러리)를 다운받아서 node_modules 폴더를 생성하고 저장한다.

---

📌 Vue.js 애플리케이션 개발하기

1. Vue.js 프로젝트 생성하기

➖ npm create vue@latest

• 지정된 프로젝트명으로 Vue.js 프로젝트가 생성된다.
• 프로젝트 내에는
  • public 폴더 : 정적 컨텐츠가 저장되는 폴더
  • src 폴더 : Vue.js 소스파일이 저장되는 폴더
  • package.json : 프로젝트 정보, 의존성 정보 등이 정의된 파일
  • index.html : 시작페이지
    등의 폴더 및 파일이 생성된다.

2. 애플리케이션 실행에 필요한 라이브러리 다운받기

➖ npm install

• package.json의 dependencies에 정의된 모듈을 npm 저장소에서 다운로드한다.
• 다운로드한 모듈이 의존하는 모듈도 자동으로 다운로드한다.
• 다운로드한 모듈은 node_modules 폴더에 저장된다.
• git과 같은 버전관리 프로그램을 사용하는 경우 node_modules 폴더는 버전관리 대상에서 제외한다.

3. 애플리케이션 실행하기

➖ npm run dev

• package.json의 scripts에 정의된 명령어를 실행한다.