Deploying Your Next.js App
정보
다음은 Next.js 공식 문서를 참고한 글입니다.
배울 내용
- How to deploy your Next.js app to Vercel.
- The DPS Workflow: Develop, Preview, and Ship.
- How to deploy your Next.js app to your own hosting provider.
Push to GitHub
배포하기 전에 앞서, 지금까지 구현한 Next js 앱을 GitHub에 배포해야한다.
Deploy to Vercel
Vercel
- Next js를 프로덕션에 배포하는 가장 쉬운 방법은 Vercel 플랫폼을 사용하는 것이다.
- Vercel은 Headless CMS, 커머스, 데이터 베이스와 통합되도록 구축된 정적 및 하이브리드 앱을 위한 서버리스 플랫폼이다.
- 프론드엔드 팀이 개발, 미리보기, 출시할 수 있도록 지원하며 신용카드 없이 무료로 사용할 수 있다.
Import your nextjs-blog repository
- https://vercel.com/import/git에서 해당 repo를 불러온다.
- 프로젝트 설정은 Vercel에서 자동으로 설정하므로 기본값을 그대로 적용할 수 있다.
- 배포가 시작되면 몇 분 이내로 끝나고 deployment URLs를 확인할 수 있다.
Next.js and Vercel
다음은 Vercel에서 Next js를 배포했을 때의 장점이다.
주요기능
- 정적 생성 및 각종 에셋(JS, CSS, 이미지, 글꼴 등)을 사용하는 페이지는 Vercel의 Edge Network에서 제공된다. 성능을 놀라울정도로 빠르다고 한다. 기회가 되면 플랫폼 별로 성능에 대해 다뤄보면 재밌을 것 같다.
- SSR과 API Routes가 적용된 페이지는 자동으로 서버리스 함수가 된다. 이를 통해 페이지와 API 요청을 무한대로 확장할 수 있다.
이외에도 다음과 같은 기능을 제공한다고 한다.
- 커스텀 도메인 기능
- 환경 변수
- 오토매틱 HTTPS
Preview Deployment for Every Push
- 브랜치 생성 및 PR을 보내면 vercel 봇의 등장과 함께 Preview URL을 확인할 수 있다고 한다. - PR이 열려 있으면 vercel은 해당 브랜치에 대한 미리보기 배포를 자동으로 생성한다고 한다. - 이를 통해 작업자와 함께 공유하고 즉각적인 피드백을 얻을 수 있다.