2분 안에 Netlify에 Next.js 앱 배포

좋습니다. Next.js 앱이 로컬 컴퓨터에서 올바르게 작동하고 있습니다. 이제 온라인으로 빠르게 배포하여 친구나 팀과 공유하려고 합니다. 프로젝트가 있는 Github 리포지토리에 연결하기만 하면 정적 웹 사이트를 무료로 게시할 수 있는 몇 가지 CI/CD 서비스가 있습니다.

Netlify

Surge

AWS Amplify

Heroku

Vercel

여기에서 Netlify에 집중합시다.

프로덕션을 위해 package.json 편집

npx create-next-app 명령을 사용하여 Next.js 앱을 만든 경우 package.json 파일의 스크립트 개체는 다음과 같아야 합니다.

  "scripts": {
    "dev": "next dev",
    "build": "next build ",
    "start": "next start"
  },

다음과 같이 수정하십시오.

  "scripts": {
    "dev": "next dev",
    "build": "next build && next export",
    "start": "next start"
  },

이제 npm run build 로 프로덕션 빌드를 생성하면 빌드 파일을 out 디렉터리로 내보냅니다.

Netlify 계정 설정

이것은 가장 쉬운 부분입니다.

계정 만들기here

Git에서 새 사이트 클릭

연결 워크플로에 따라 Github/Gitlab 저장소(Next.js 앱이 있는 저장소)를 연결합니다

.

다음과 같이 배포 설정을 지정해야 합니다.

배포를 클릭하고 몇 초만 기다리면 앱이 활성화됩니다.

선택 사항: Connect a custom domain 도메인의 DNS A 레코드 편집

이제부터는 Git 리포지토리에 새 커밋을 푸시할 때마다 Netlify가 업데이트를 가져오라는 알림을 자동으로 받은 다음 Next.js 프로젝트를 다시 빌드합니다.

즐기고 최고!