Vercel 배포기
이전 프로젝트에서 Jenkins를 이용한 자동 배포를 해본적이 있어 자동 배포를 시도하려 했지만 NEXT JS 사이트에 위와 같이 recommended => vercel이라고 되어 있는게 아닌가? 그래서 우리 팀은 vercel에 배포를 시도해보기로 했다.(새로운 것 시도를 좋아하는 우리팀원들...)
GitHub으로 회원가입도 해주고~
공식 문서를 보며 따라가보기로 했다.
두 가지 옵션이 있었으나 우리는 깃허브에 있는 레포지를 이용해보는 것으로...
주소도 쇽~
Yes 클릭 해 주고~
나중에 팀원들도 사용할 수 있도록 Team으로 생성해보자.(생성하고 다음쪽으로 넘어가고 나서 사진 안찍은 걸 알고 돌아왔으나 이미 Team이 생성되어 있었다...)
원래 초록색 불 슥쇽삭 해주는 것은 국룰...
나의 레포지가 organization에 속해 있기 때문에 주인의 허락을 기다려야 한다고 한다... 메일을 넣어보고 기다려보자...
URL을 통해 프로젝트에 권한을 받고 들어가니 이렇게 root directory를 설정하는 화면이 나온다. 현재 화면을 보니 master branch가 나오는데 우리는 개발 과정에서 dev 브랜치에 매주 pr을 하고 master에는 최종적으로 넣을 생각이어서 아무것도 나타나있지 않다... branch를 변경하는 방법을 알아보자.
공식문서에 따르면 main branch를 가져오는 것이 default고 없으면 master branch, 이마저도 없으면 github의 default page를 가져온다고 한다. 뒤의 내용을 보면 후에 바꿀 수 있는 것으로 보이므로 일단은 그냥 진행을 해 보겠다.
프로젝트 이름, 사용한 프레임워크 종류, build 명령어 및 output directory, 환경 변수 등을 작성하게 되어있다.
현재 아무것도 세팅할 만한게 없으므로 next.js로 framework만 설정해놓고 다음으로 넘어가겠다.
이후 계속해서 넘어가다 보면 아래와 같이 완료되었다는 화면이 나오니 본격적으로 setting을 해보도록 하자.
open dashboard를 통해 이동하면 다음과 같은 화면이 보이게 된다. 공식 문서에 나왔던 것 처럼 settings의 git으로 오게 되면 아래와 같은 화면이 존재한다.
여기서 나는 custom을 선택 후 web이 개발할 때 사용하는 web branch로 선택해 해당 branch에 push가 오면 새로 deploy가 되도록 설정했다.
이후 아까 폴더가 없어 제대로 설정하지 못했던 root directory(./web)와 build & deployment settings(npm 명령어)를 완료하도록 한다.
그리고 redeploy를 하면 완성!!
잘 작동하는 것을 확인할 수 있다 :) 무료 버전은 하루 deploy 수가 정해져있으므로 유의하도록 하자!