728x90

런타임이란 무엇일까?

Node.js를 설치하기 전에 런타임이란 무엇인지에 대해서 용어를 짚고 넘어가면 좋을 듯하다.

흔히들 Node.js를 이야기할 때, 자바스크립트의 대표적인 런타임 중 하나라고 말하는데 런타임이란 무엇일까?

 

런타임이란 프로그래밍 언어가 구동되는 환경이다.

즉 자바스크립트 언어로 코드를 작성하고 그 코드가 실행되는 곳이 런타임이다.

그렇다면 자바스크립트를 사용하기 위해서는 이 코드가 실행되기 위한 런타임을 정하고

해당 런타임을 사용하기 위해 필요하다면 추가설치를 진행해야 한다.


자바스크립트의 런타임은 브라우저가 대표적이다. 우리가 흔히 쓰는 웹사이트 말이다.
따라서 크롬을 켜고 개발자도구에 들어가면 기본적인 코드는 콘솔창에서 입력하고 실행해 볼 수 있는 것이다.

기존에는 브라우저가 자바스크립트의 유일한 런타임이었다. 따라서 자바스크립트로는 웹페이지만 만들 수 있었다.
하지만 Node.js가 등장하면서 브라우저가 아닌 곳에서도 JS의 문법에 따라 서버를 만들 수있게 되었다.

Javascript와 Node는 실제로 같은 개념이 아니다. 이에 대해서는 블로그로 정리해 두었으니 참고(링크)

 

Node.js 설치하기

nvm을 통해서 Node.js 설치하기

node.js를 설치하는 방법은 다양하다. 그러나 NVM을 이용한 설치가 가장 효율적이다.
그 이유는 node.js도 하나의 프로그램이므로, 계속해서 버전이 향상되고

따라서 그 버전들에 맞춰서 일일이 설치하고 다시 지우고 하는 번거로운 과정이 필요하다.
이때 NVM 즉, node version manager를 사용한다면 다양한 node version을 손쉽게 옮겨다닐 수 있다.

nvm 또한 하나의 프로그램으로 설치가 필요하다.

 

nvm 설치하기

 

1. 터미널 창을 켜고, 아래의 명령어를 입력하면 nvm 설치가 완료된다.

   sudo curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.1/install.sh | bash

 

2. 그리고 아래의 명령어로 잘 설치되었는지 확인

  nvm ls

 

여기서 나는, -bash: nvm: command not found 해당 에러가 떠서 당황...


위의 에러가 뜬다면
1. 터미널에 해당 명령어를 입력하여 vi에디터를 켜준다. 

  vi ~/.bash_profile
2. 아래의 코드가 있는지를 확인해준다. 없다면 추가!

  export NVM_DIR="$HOME/.nvm" [ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm

 

3.  그리고 아래의 명령어를 터미널에 순서대로 입력해준다.

     source ~/.bash_profile

     nvm ls

 

=> 아래의 메시지가 뜬다면 성공!

   ->    system

     node -> stable (-> N/A) (default)

     iojs -> N/A (default)

 

 

Node.js 설치하기

 

nvm install 10.13.0 해당 명령어를 터미널 창에 입력하기만 하면 된다.

 

만약 다른 버전을 사용하고 싶다면

nvm use (사용하고 싶은 Node version : use 명령어 전에 해당 node version이 설치되어있어야 한다.)

ex) nvm use 12.13.0

 

node 버전 확인하기
 node -v

package.json 확인하기

node.js를 설치하고 난 이후에, 프로그램을 만들면서 다양한 추가 기능들(모듈)을 설치하고 삭제하게 될 것이다.
기본적으로 혼자가 아닌 팀으로 프로젝트를 진행하는 경우가 많으므로 개인이 코드를 작성한 이후에,

이 코드 실행을 위해 어떠한 모듈이 필요한지 등등의 정보들을 전달해주어야 한다.


일일이 전달해야겠지만 node.js를 설치하면 자동으로 같이 설치되는 package.json 파일을 통해서

이 모든 것들을 확인 가능하다.
만약에 내가 코드를 작성하고 여러 모듈을 작성한 다음에, 팀원에게 해당 코드를 넘겨 준다면?
다운받은 모듈들도 다같이 넘어갈까?
이것 또한 아니다. package.json에 정보만 기재된 채로 넘어가게 된다.

(모듈들까지 다같이 넘어간다면 전달될 때 시간이 엄청 오래 걸릴 것이다.)
코드를 전달받은 팀원은 package.json을 확인한 후, 

npm install 만 터미널에 입력해서 실행해준다면, 필요한 모듈들이 한꺼번에 설치된다.

npm이란?

node package manager로 말그대로 node의 다양한 패키지와 모듈들을 관리하는 일종의 앱스토어이다.
따라서 (앞으로 자주 사용하게 될것이다.) npm install ~~ 로 필요한 모듈을 설치 가능하고,

npm start로 서버 실행까지 가능하다.
처음 프로젝트를 시작할 때, npm init 명령어를 통해 시작할 수 있다.

node상의 package를 바탕으로 프로젝트를 시작하는 것이다.

npm init을 하면 package 정보가 담긴, package.json이 만들어진다.

 

package.json 기본 정보

package.json은 프로젝트의 정보와 프로젝트에서 사용 중인 패키지의 의존성을 관리한다.

서로 다른 개발자가 하나의 프로젝트를 진행할 경우 프로젝트에 패키지를 포함하지 않고

package.json을 이용해 사용 중인 패키지를 설치할 수 있는 것이다.

  • 프로젝트의 정보 - name, version 영역
  • 패키지 버전 정보 - dependencies 또는 devDependencies 영역

내가 초반에 package.json에 대해서 완전히 잘못 이해하고 있었다....ㅜㅜㅜㅜ

이런 기본적인 실수를 하다니....

dependencies와 devDependencies의 개념과 더불어서

npm install --save-dev / --save 명령어에 대해서도 다시 정리해보았다.

 

1. dependencies

  : 프로덕션 환경에서 응용 프로그램에 필요한 패키지.

 

2. devDependencies

 : 로컬 개발 및 테스트에만 필요한 패키지.

 

이 프로젝트를 개발하는 환경에서 필요한 모듈들이 무엇인지가 적혀 있다. 

해당 정보들을 협업으로도 활용 가능한데, 누군가가 코드를 작성하고 다른 사람에게 넘기면,

그 사람은 npm install이란 명령어를 통해 dependencies에 적혀있는 필요한 모듈들을 한꺼번에 설치할 수 있게 되는 것이다.

 

 

3. scripts
: npm 으로 실행시킬 수 있는 명령어를 정의한다. 명령어를 입력하면 어떤 동작을 해야하는지가 적혀 있다.

예를들면 npm test 명령어를 입력하면 "test.js 파일을 node 에서 실행시켜라!" 하는 내용들이 들어있다.

만약 npm test와 같은 명령어를 실행시켰는데 "정의되지 않은 명령어" 라는 오류 메시지가 나오면,

package.json 파일 scripts 에 해당 명령어가 정의되어 있는지를 확인하면 된다.

1
2
3
4
"scripts": {
  "start": "node app.js",
  "test": "node test.js",
}
cs

 

 

TIP. package.json과 모듈 설치

 

여기서 짚고넘어 가야할 가장 중요한 문제. 

왜 내 코드를 git(등의 코드 저장소 및 공유프로그램)을 통해 받아갔는데,

모듈이 그대로 옮겨가지 않고, npm install 이라는 명령어를 써야 할까?

 

이는 모듈들 자체를 git에 그대로 push하고 이를 팀원이 그대로 pull하려면 그 과정에서 이동되는 데이터 량이 엄청 크다.

데이터 량이 크면? 당연히 느려지고 성능상 좋지 않다는 것은 바로 이해가 될 것이다.

 

따라서 보통 협업할 때는, package.json으로 모듈 정보만 공유하고, local에서는 이 파일을 읽어서 

npm install로 필요한 모듈을 설치하는 작업을 진행하게 된다.

따라서 보통 모듈들은 .gitignore 파일을 만들어서, git 통신과정에서 같이 담겨서 push 되지 않도록 작업한다.

.gitignore 파일은 vsc에서 일반 파일 만들듯이 파일 명을 ".gitignore"로 설정하고, 파일 내에 git 통신 시에

push 되지 않았으 면 하는 파일 명이나 폴더 명을 입력하면 된다.

 

 

npm install 명령어

 

 - npm install --save "모듈이름"으로 모듈을 설치하면 package.json에는 설치한 모듈과 버전이 기록된다.

   이 설치한 모듈은 dependencies라는 항목에 저장된다.

 

 - 그에 반해 npm install --save-dev "모듈이름"으로 설치하는것은

    모듈을 설치할 때 package.json 내의 devDependencies 항목에 설치하는 것이다. 

    위에서 설명한 바와 같이, devDependencies 항목에 저장되면 이는 개발용으로만 쓰게 되는 모듈이라는 것이다.

 

 - 제품의 릴리즈나 구동시 꼭 필요한 모듈의 경우 --save 옵션으로 dependencies 항목에 기록하고

   제품의 개발시에 테스트를 위해서 필요한 모듈이긴 한데 실제 릴리즈시에는 필요없는 모듈의 경우

   --save-dev로 devDependencies 항목에 넣는 것

 

-  npm install'이라고 쓰면 dependencies, devDependencies 모든 모듈을 설치한다.

    => dependencies만 설치하려면 $npm install --only=prod(uction)

    => devDependencies만 설치하려면 $npm install --only=dev(elopment)

 

 

따라서 팀원에게 내가 설치한 모듈을 그대로 설치할 수 있게 해주려면 모듈을 설치할 때의 명령어에도 신경을 써야 한다.

보통, 모듈 설치할 때 npm install "설치하고자 하는 모듈" 명령어를 실행한다. 

이렇게 하면 내 local에는 문제없이 모듈들이 설치 되겠지만, 내 코드를 pull 받은 팀원은 필요한 모듈을 수동으로 일일이 다시 다 설치해야 한다. 

팀원과 같이 공유되어야 하는 모듈들은 npm install --save-dev "모듈이름" 명령어로 꼭 설치해주자!

 

위의 명령어를 사용해서 설치된 모듈들이 바로 위에서 언급한 devDependencies에 저장된다.

 

 

 

Reference

 

santacodes.com/?p=72

 

[Node.js] npm과 package.json 이해하기 | SantaCodes

Node.js를 사용할 때 많이 보게 되는 것 중 하나가 npm입니다. npm은 무엇이며 어떻게 사용하고 어떤 일을 할 수 있는지 살펴보도록 하겠습니다. npm npm은 Node Package Manager의 약자로 자바스크립트 패키

santacodes.com

velog.io/@skyepodium/package.json

 

package.json 알아보기

프론트엔드 개발하다가 잘 몰라가지고package.json은 프로젝트의 정보를 정의하고, 의존하는 패키지 버전 정보를 명시하는 파일입니다.프로젝트의 정보는 name, version 등의 메타데이터를 포함하고

velog.io

blusky10.tistory.com/282

 

npm install --save --save-dev

맨날 붙여넣기만 하다가 오늘은 갑자기 의문이 들었다. npm install --save 하고 --save-dev가 대체 뭔 차이지? 잘 안쓰고 맨날 찾아서 붙여넣기만 하니 알리가 있나.. 그래서 찾아봤다. 구글 검색을 해보

blusky10.tistory.com

ingorae.tistory.com/1754

 

npm install --save-dev를 쓰는 이유

—save-dev 옵션은 왜 넣을까? ​ Node.js의 npm로 모듈을 설치할 때 아래처럼 --save-dev 옵션을 넣는 경우가 있습니다. 이 옵션은 어떤 의미일까요? $npm install --save-dev babel-cli ​ Node.js에서는 보통..

ingorae.tistory.com

 

728x90

+ Recent posts