🗓 진행일: 2022.04.14
Node.js에 대한 기초

4-1. Node.js란?

• 자바스크립트는 자바스크립트 엔진을 기반으로 하는데, 이 엔진이 웹 브라우저에 존재하기 때문에 웹 브라우저의 동작밖에 할 수 없다
• 그래서 C++을 기반으로 만들어진 자바스크립트 엔진 v8을 이용하여 웹이 아닌 다른 곳에서도 사용해볼 수 있게 하였고, 그게 바로 node.js (=자바스크립트의 실행 환경, 자바스크립트의 런타임)
• 그래서 이걸로 웹서버도 만들 수가 있다...!!
• 리액트는 node.js를 기본으로 한다

4-2. Node.js & VsCode 설치하기

1. Node.js 설치하기
   1. 구글에 검색
   2. org로 끝나는 페이지 들어가서 다운로드
   3. LTS 버전 설치 (기업용으로 안정되어있음)
2. 설치 확인

   1. 터미널 창 열기

   2. 버전 확인 (버전이 나옴)

      node -v
      npm -v

   3. npm: node package manager

3. VsCode 설치하기 (난 되어있음 ㅎㅎ)
   1. index.js 만들어보기
   2. calc.js 생성
   3. 확장 프로그램 설치
      1. 왼쪽 하단의 Extensions > Prettier 검색 후 설치
      2. Code > Preferences > Settings > format on save 검색 > 체크
         이렇게 하면 더러운 코드도 저장 시에 깔끔하게 된다는데 난 안 되는 중
      3. Extensions > Material Icon Theme 검색 후 설치 (activate 할 건지 뜸 ㅇㅇ 한다고 한다)

4-3. Node.js Hello World & Common JS

1. index.js에 글을 작성하고 어떻게 보는지?

   1. View > Appearance > Show Pannel > 현재 디렉토리에 맞춰진 터미널이 보임

   2. CLI (Command Line Interface) 방식으로 실행

   3. 터미널에서 파일 실행

      node index.js

calc.js

// 계산 기능을 하는 파일

const add = (a, b) => a + b;
const sub = (a, b) => a - b;

module.exports = { // module로 만들어서 내보내기
    moduleName: "calc module",
    add: add,
    sub: sub,
};

index.js

const calc = require("./calc");
// 내장함수 require를 사용해서 해당 위치의 calc.js를 불러옴

console.log(calc.add(1, 2));
console.log(calc.add(4, 5));
console.log(calc.sub(10, 2));

4-4. Node.js 패키지 생성 및 외부 패키지 사용하기

• Package? 다른 사람이 만들어놓은 모듈 (npm으로 가져오기 가능)
• 패키지를 담고 있을 root 폴더 생성하기
• Command + J로 터미널 열기

npm init

• 패키지 생성

  • 이름: package-example1
  • author: seul
  • 외의 다른 건 다 엔터로 넘어가기
  • package.json 파일 생성됨

• package.json

  • 우리가 만들 패키지의 환경설정 파일
  • main: 이 패키지를 실행할 때 어떤 파일을 실행할지 명시하는 것
  • script: 자주 실행해야 하는 명령어를 사전에 정의할 수 있음
    • ex) “start”: “node index.js” 라고 해두면 명령어가 실행됨

• 동일 디렉토리에 index.js를 생성하고, 터미널에서 npm start 입력 > 실행됨

• 다른 사람의 패키지를 가져오기

  • 구글에 npmjs 검색해서 상단 페이지 접속
  • 테스트로 간단하게 해보기 위해 randomcolor 검색
  • 상세페이지 상단에 설치하는 코드 복사하여 터미널에 넣기 (ex. npm i randomcolor, 여기서 i = install)
  • package.json에 dependencies가 추가 됨
  • package-lock.json에 정확한 모듈 버전이 기재되어있음

• 외부패키지 RandomColor 사용해보기

  • index.js에 아래와 같이 코드 넣고, npm start 실행

const randomColor = require('randomcolor');
// 외부 패키지는 경로를 명시할 필요 없음

let color1 = randomColor();
let color2 = randomColor();
let color3 = randomColor();

console.log(color1, color2, color3);