GitHub Pages 무료 호스팅 사용하기
멍카 웹페이지 - 3
이은 글입니다.
이번 글에서는create-react-app으로생성한 React js 페이지를 Github Pages에 올려봅니다.
GitHub Pages는 GitHub에서 무료로 호스팅을 제공하는 공개 웹페이지이다. github에 올린 소스들을 웹페이지로 띄어주는 것인데, 용량 제한이 없고 개인 도메인도 연결 가능하여 보통 기술 블로그 같은 정적인 페이지로 사용되고 있다.
pages를 만드는 방법은 아래 두 가지이다.
개인 사이트 (User or organization site)
프로젝트 사이트 (Project site)
개인 사이트는 repository를 생성할 때 저장소명을 자신의 계정으로 ex) go-rani.github.io 생성하면 master 브랜치의 내용이 페이지에 보이게 되면서 pages가 생성되고, 카지노 가입 쿠폰젝트 사이트는 약간의 설정을 통해 pages를 생성할 수 있다. 지난 글에 이어 우리는 생성한 카지노 가입 쿠폰젝트를 pages에 띄어보겠다.
URL 형식은 ex) go-rani.github.io/MeongcaWeb 같이 생성된다.
react-test 폴더에 접근해 gh-pages package를 설치하고
npm install gh-pages --save-dev
설치가 완료되면 react-test 폴더의 package.json 파일을 열어 프로덕션 빌드를 생성하고 GitHub Pages에 배포하기 위한 스크립트를 추가한다.
"homepage": "https://<GitHub-유저명.github.io/<카지노 가입 쿠폰젝트-저장소명"
"deploy" : "npm run build&&gh-pages -d build"
다시 터미널로 돌아와 react-test 폴더에서 추가 한명령어를 실행하면 Published가 된다.
npm run deploy
이제 Github MeongCaWeb repository Settings 페이지의 GitHub Pages세션을 확인해보면, 너의GitHub 페이지 사이트는 현재 gh-pages 카지노 가입 쿠폰로 구축되었다는 문구를 확인할 수 있다.
Your site is published atURL을 클릭하여 local에 생성한 페이지가 노출되는지 확인해보자.
마지막은 잊지 말고 수정사항커밋하기
git add *
git commit -m "publish it to github pages"
git push
[참고 자료, 이미지 출처]
https://github.com/gitname/react-gh-pages
