[React] GitHub Pages로 publish하기

※  AWS을 사용한 이후부터 그냥 정적인 자료면 S3 정적 호스팅에 옮겨서 해결하고 있다. 

 

---

npm i gh-pages

 

설치 후 package.json 수정.

 

  "homepage": "https://[유저명].github.io/[프로젝트 이름]/"

 

 

npm run build

 

결과로 build 폴더가 생긴다.

뒤져보면 알겠지만 우리가 작성한 코드를 한 줄로 최소화하여 공간을 아끼는 작업을 자동으로 해주었다.

 

그리고 이 폴더를 deploy에 추가한다.

 

  "deploy": "gh-pages -d build"
  
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "deploy": "gh-pages -d build"
  }

 

npm run deploy

 

실행하면 잘 작동하며 앞서 지정한 홈페이지에 접속 가능해진다.

(github 특성상 시간이 걸릴 수도 있으니 인내심을 가지고 기다려보자)

 

간단한 호스팅 작업 완료!

 

cf) 다음과 같이 "predeploy"를 실행해주면 npm run deploy 실행 시 자동으로 predeploy를 실행해준다.

  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "deploy": "gh-pages -d build",
    "predeploy": "npm run build"
  }