MGS Day-10

Node.js는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임(프로그래밍 언어가 동작하는 환경!)

 

우리는 웹브라우저를 동작시켜주는  JS도 이해를 해야겠지만,

그런 웹브라우저에서 동작되는 웹페이지를 만드는 우리의 컴퓨터 환경을 제어해주는 JS도 이해를 해야한다.

 

JavaScript라는 프로그래밍 언어의 문법을 배우게 되면

웹브라우저를 동작하는 내용도, 컴퓨터를 제어하는 내용도 같이 배울 수 있게 된다.

 

순수하게 HTML, CSS, JS만 가지고 작업할 경우 최종적으로 완성은 할 수 있지만, 비효율적인 과정이므로

보통 우리가 개발하는 컴퓨터 환경에다가 개발들을 도와주는 여러가지 모듈들을 설치해 이용하여 도움을 받아 개발한다.

하지만, 이런 모듈들은 실제적으로 직접적인 웹브라우저 상의 동작이 안되므로

도움을 받은 모듈들의 내용들을 node.js에서 HTML, CSS, JS로 변환을 해주어야 한다.

이 때의 변환 작업에 대한 명령을 작업 중인 컴퓨터에서 node.js라는 환경과 JS라는 언어로 명령을 내려주는 것이다.

이렇게 HTML, CSS, JS로 변환된 결과를 웹브라우저에 동작시켜주는 것이 최신의 웹프론트엔드 개발 환경이다.

 

cf. node.js 설치 중 

     LTS(Long Term Supported)는 장기적으로 안정되고 신뢰도가 높은 지원이 보장되는 버전으로,

                                                     유지/보수와 보안(서버 운영 등)에 초점을 맞춰 대부분 사용자에게 추천되는 버전

                                                     node.js에서는 짝수 번호로 시작하는 것이 LTS 버전.

                                                                            둘 중  홀수 번호로 시작하는 것이 최신버전.

    다만 한 버전만 설치받아 쓰는 것은 권장하지 않기 때문에,

    원할 때 언제든지 node.js의 버전을 바꿀 수 있는 노드버전매니저(nvm) 설치하기를 권장 !

 

 

 

**** macOS 기준

     nvm 깃헙 저장소 : https://github.com/nvm-sh/nvm

GitHub - nvm-sh/nvm: Node Version Manager - POSIX-compliant bash script to manage multiple active node.js versions

 

 

 

 

 

 

 

**** Windows 기준

     nvm 깃헙 저장소 : https://github.com/coreybutler/nvm-windows

GitHub - coreybutler/nvm-windows: A node.js version management utility for Windows. Ironically written in Go.

 

 

 

 

 

다운받은 압축파일을 풀어서 실행.

 

깃배쉬에서 버전 확인.

 

 

다른 실습 중에 default 브랜치의 이름이 master로 되어 있던 것을

$ git branch -M main으로 명령어 입력하여 브랜치 이름으로 다시 main으로 바꿨다.

그리고 nvm ls로 node.js version 확인해보니 현재 내가 사용하고 있는 node.js버전은 16.15.1

 

node.js가 설치되어 있지 않다면 ,

nvm install 버전이름

을 입력하면 된다.

 

설치된 버전 중 삭제를 원할 때는,

nvm uninstall 버전이름

 

 

현재 node.js 홈페이지에서 확인하여

대부분의 사용자가 추천하는 LTS버전 16.16.0 버전과 가장 최신 버전인 18.5.0 버전을 추가로 설치하였다.

 

 

 

 

 

 

사용하고자 하는 node.js를 설정하고자 할 때는, 

$ nvm use 버전 이름

 

나는 최신 버전 중 안정화된 LTS 버전으로 재설정을 했고,

사용을 지정한 버전이 현재 버전이 되었음을 창에서 * 표 이동으로 확인해볼 수 있을 것이다.

사용할 버전을 변경하고자 할 때도, 동일한 명령어를 쓰면 되겠다.

 

 

 

내 컴퓨터에 설치가 되어 node.js를 사용할 수 있을 때, 배쉬에서 node라는 명령어를 사용할 수 있게 된다.

현재 사용할 수 있는 node.js의 버전을 확인해본다.

$ node --version

 

cf. 프로젝트가 처음 만들어진 node의 버전이 프론트엔드 프로젝트에 충분히 영향을 줄 수 있다 !

     비교적 최신 프론트엔드 개발을 할 때는, 10 버전 이상의 LTS를 선택할 것을 권장함  

 

 

 

주황색 박스 부분을 클릭해서 들어가면 현재 지원하는 node.js의 최신버전이 나와있다.

진행하는 프로젝트에 따라 권장하는(최적화되는) 버전은 달라질 수 있다 !

 

 

 

그 외 nvm의 명령어들을 알고 싶을 때,

nvm --help

 

 

 

NPM(Node Package Manager) : 전 세계 개발자들이 만든 다양한 기능(패키지, 모듈)들을 관리.

                                                     node.js 환경에서 여러가지 package(다양한 기능)들을 설치하거나 관리할 때 사용.

                                                     node.js가 설치될 때 같이 설치됨.

                                                     백만개 이상의 패키지(모듈, 기능)들이 들어있고, 이를 npm 생태계라 얘기함.

                                                     NPM의 사용이 학습 난이도를 높이거나 구성이 복잡하게 하기도 하지만, 

                                                     반면 관리 효율을 증가시키고, 손쉽게 기능을 고도화한다는 측면에서 점점 사용됨.

 

 

 

NPM 처음 시작할 때,

npm init -y

 

 

하면 왼쪽에 프로젝트 구조의 package.json 파일이 생긴다. - npm으로 패키지 관리를 하려고 함

 

 

package.json 파일을 열어보면 

name에는 내가 만든 폴더의 이름이 들어가 있다.

main이라는 옵션은 현재의 프로젝트를 하나의 패키지로 만들어 NPM 생태계에 업로드할 때 필요한 옵션이다.

따라서, 하나의 웹사이트를 만드는 프로젝트에서는 필요하지 않은 옵션이라 삭제해도 된다.

scripts라는 옵션은 현재 프로젝트 내부에서 사용할 수 있는 여러가지 script 명령들을 이 곳에 명시해 놓으면, 

현 프로젝트에 관련된 명령들을 손쉽게 사용할 수 있게 된다.

그 외 키워드, 작성자, 라이센스 등의 내용이 저장되어 있거나 저장할 수 있는 것을 알 수 있다.