#7.7 Publishing

 

gh-pages 라는 툴을 설치한다

$ npm i gh-pages

 

gh-pages란?

결과물을 github pages에 업로드 할 수 있게 해주는 나이스한 패키지

package.json에 있는 scripts를 먼저 확인

 

script의 build를 실행하면

  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

웹사이트의 production ready code를 생성하게 된다 

production ready란
=> 코드가 압축되고 모든 것이 최적화된다는 뜻

$ npm run build

아래 명령어를 실행하고 나면 build라는 폴더가 생긴다

이상한 자바스크립트 파일로 가득하다

 

script에 아래 코드를 추가하고

"homepage": "https://[github-id].github.io/react-movie-list"

 

이번에는 다른 스크립트 deploy를 작성한다 

build를 하고나서 deploy를 실행해야 한다는 것을 기억하고 싶지 않기 때문에

predeploy command도 작성한다

즉 deploy를 실행하면 predeploy가 먼저 실행된다

 

"deploy": "gh-pages -d build",

이 역할은 build 폴더를 아까 작성한 "homepage"의 깃허브 주소에 업로드하는 것이다

약간의 시간이 걸린다

 

이렇게 배포 완료

 

우리가 한 것은 

1. package.json에 "homepage" github 레포지토리 주소 추가

2. script의 deploy 그리고 predeploy 추가

"deploy": "gh-pages -d build",
"predeploy": "npm run build"

나중에 수정하고 싶은 사항이 생기면, npm run deploy만 하면 된다