Git & Etc

Github로 React project 호스팅하기

판교너굴맨 2022. 1. 13. 22:25

GitHub에서는 Repository를 무료로 호스팅해주는 서비스를 제공하고 있습니다.

 

1. React project 생성

프로젝트를 생성할 폴더 위치에서 React project 생성 명령어를 입력합니다.

저는 TypeScript가 적용된 프로젝트로 생성하겠습니다.

# npx
npx create-react-app [project name] --template typescript

# yarn
yarn create react-app [project name] --template typescript

2. gh-pages 패키지 설치

# npm
npm i gh-pages

#yarm
yarn add -D gh-pages

3. GIt Repository 생성 및 push

4. package.json 설정

{
    // "http://username.github.io/repository name"
    "homepage": "http://2myungho.github.io/leemh",
    ...,
    "scripts": {
    	...,
        "deploy": "gh-pages -d build",
    	"predeploy": "yarn build" // "npm run build"
    }
}

5. build 및 deploy

# npm
npm run build
npm run deploy

# yarn 
yarn build      
yarn deploy

6. homepage 

package.json에 입력한 homepage 주소를 검색창에 입력한다.