NPM 프로젝트 생성

node.js

개발환경을 이해하고 설정

(1) 프론트엔드 개발에 Node.js 가 필요한 이유

• 최신 스펙으로 개발 가능
  웹팩이나 npm 같은 node.js 기술로 만들어진 환경에서 자동화된 프론트엔드 개발환경을 갖출 수 있다.
  타입스크립트나 SASS같은 프로그래밍 언어를 사용하려면 node 환경이 뒷받침 되어야 한다.

• 빌드 자동화
  파일 압축, 난독화, 폴리필 추가하는 등 개발 이외의 후속작업이 필요하다.
  라이브러리의 의존성을 해결하고 테스트를 자동화하는데 사용

• 개발환경 커스터마이징
  리액트의 create-react-app이나 뷰의 vue-cil같은 프레임워크에서 제공하는 도구를 이용해 쉽게 개발환경을 갖출 수 있다.
  자동화 환경을 사용할 수 없으면 직접 환경을 커스터마이징해야한다.

(2) Node.js 설치

• Nodejs.org 페이지에서 운영체제별 설치파일 다운
• LTS버전이 안정적이고 신뢰도가 높은 검증된 버전
• 홀수 버전은 최신이고 아직 불안정할 수 있다.
• 개발환경은 최신버전이어도 괜찮고, 서버를 구성할 때는 안정성을 우선으로.

설치확인은 터미널에서 node를 입력하면 노드 터미널도구 REPL 이 실행된다.
자바스크립트 코드를 입력하고 즉시 결과를 확인할 수 있는 프로그램이다.
버전은 node --version으로 확인할 수 있다.

터미널에 npm을 입력하면
npm의 command가 나오고 프로그램이 종료된다.

Usage: npm <command>
where <command> is one of:
    access, adduser, audit, bin, bugs, c, cache, ci, cit,
    clean-install, clean-install-test, completion, config,
    create, ddp, dedupe, deprecate, dist-tag, docs, doctor,
    edit, explore, fund, get, help, help-search, hook, i, init,
    install, install-ci-test, install-test, it, link, list, ln,
    login, logout, ls, org, outdated, owner, pack, ping, prefix,
    profile, prune, publish, rb, rebuild, repo, restart, root,
    run, run-script, s, se, search, set, shrinkwrap, star,
    stars, start, stop, t, team, test, token, tst, un,
    uninstall, unpublish, unstar, up, update, v, version, view,
    whoami

npm <command> -h  quick help on <command>
npm -l            display full usage info
npm help <term>   search for help on <term>
npm help npm      involved overview

Specify configs in the ini-formatted file:
    C:\Users\peace\.npmrc
or on the command line via: npm <command> --key value
Config info can be viewed via: npm help config

npm@6.13.4 C:\Program Files\nodejs\node_modules\npm

(3) 프로젝트 생성

node.js 이용해 프로젝트 개발 프로젝트를 만들어본다.

• 설치는 npm init을 이용한다.
• 설치하고자 하는 폴더를 mkdir로 만들어
• cd를 이용해 안으로 이동하고
• npm init을 한다.
  npm init은 프로젝트를 하나 생성하고 프로젝트의 메타정보를 입력하는 화면이 제공된다. 엔터를 치면 디폴트값이 사용된다.
• package.json파일이 생성된다.

package.json 파일 내부 확인

 {
  "name": "frontend",  //프로젝트 이름
  "version": "1.0.0",  //버전정보
  "description": "",   // 설명
  "main": "index.js",  // node.js에서 사용
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
    // 프로젝트를 자동화할 수 있는 쉘 스크립트를 입력하는 곳
  },
  "author": "", //프로젝트 작성자
  "license": "ISC"  //라이센스 정보
}

(4) 프로젝트 명령어

scripts 부분의 test는
"test": "echo \"Error: no test specified\" && exit 1"
echo를 이용해 Error~~ 문장을 출력하고, 에러코드 1번을 반환한다.

터미널에 npm test를 입력하면 echo 명령어로 해당 문장이 출력되고 1번 에러코드에 맞는 메시지가 출력된다.

npm은 테스트 외에도 다양한 스크립트 명령어를 가지고 있다.

보통 test, start, install 을 많이 사용한다.
커맨드 추가는 "scripts"에 직접 추가할 수 있고
터미널에 npm run 추가한 커맨드 를 입력해서 사용할 수 있다.