JS | 자바스크립트 프로젝트 시작하기(?)

프로젝트 생성부터 핫리로드까지.. 설정을 해보자
요즘 하도 스프링부트만 해서 자바스크립트를 공부하고싶어졌다... 그립네...

npm 설치

node를 설치해서 npm도 함께 설치하자!

프로젝트 폴더 생성

mkdir는 폴더를 생성하는 명령어다.

$ mkdir [projectfoldername]

npm init

npm init으로 여러 라이브러리를 사용할 준비를 해보자.. package.json파일이 생성되면 성공

$ cd [projectfoldername]

$ npm init

babel 설치

babel은 뭔지 다들 알테지..?

babel은 ES6이상 문법을 사용해 코드를 작성하면 어떤 브라우저들은 인식하지 못하기 때문에 es6문법을 es5문법으로 뾰로롱 변환해준다.
그냥 바벨을 사용하고, ES6문법으로 편하게 코드를 작성하면 그 뒷처리는 바벨이 알아서 해줌.. 고맙네...

$ npm install --save-dev @babel/core @babel/cli

babel 사용 설정

package.json파일에 devDependencies항목에 추가한다

  "devDependencies": {
    "@babel/cli": "^7.0.0",
    "@babel/core": "^7.0.0"
  },

parcel 설치 및 사용설정

parcel은 뭐,,나의 경우 최대 사용 이유는 핫리로드 때문이다. 변경내용이 저장되면 알아서 리프레시 되기 때문에 매우편함!

$ npm install parcel-bundler

그리고 npm start를 입력하면 촤라랑 브라우저에서 열리도록 package.json을 수정해주자

"scripts": {
    "start": "parcel index.html --open",
    "test": "echo \"Error: no test specified\" && exit 1"
  },

끝!