github page 배포하기

Todo

[] nextjs를 이용하여 github page를 배포한다.

Git 환경설정

리포지토리 만들기

1. github page에서 리포지토리 생성(create repository)
2. 이름을 xxx.github.io) 로 설정 (계정이름 뒤에 github.io를 붙여서 생성)

github page 브랜치 설정하기

1. gh-pages 브랜치 생성하기
2. settings > pages > source 의 브랜치를 gh-pages로 변경

프로젝트 환경설정

nextjs를 이용하여 페이지를 만들었으나 github page는 정적사이트를 배포하는데 맞추어져 있음으로 ssr기능을 지원하게 된다면 다른 배포방법을 선택하는 것을 추천한다

1. nvm을 통해 현재 LTS 버전으로 변경
   팀 프로젝트로 진행하는 상황이였기 때문에 node의 버전을 맞추어야 했다.

   nvm install 16.13.2
   nvm use 16.13.2

   nextjs 설치 명령어 (typescript 지원)

   // --ts 옵션을 통해 typescript 설치 가능
   npx create-next-app --ts

   export script 추가

   ...
   "homepage": "https://liberaliberi.github.io",
   "scripts": {
    ...,
    "export": "next export"
   },

gh-pages devdependencies 설치

yarn add -D gh-pages

build와 export 실행

yarn build && yarn export

out 폴더 생기고 난 후 jykell 파일 생성해주기

touch out/ .nojykell

https://hhyemi.github.io/2021/05/26/nextGit.html

참고

bitbucket에서도 동일한 방법으로 정적사이트를 배포 할 수 있다.
대표 브랜치 설정을 gh-pages로 한것 처럼 bbc-pages로 만들어서 대표브랜치를 설정해주는 것만 다르게 해주면 잘 동작 할 것이다.