← Back

Next.js 정적 배포 가이드

Next.js 앱을 정적 사이트로 빌드하고 배포하는 방법을 알아봅니다.

#nextjs#deploy#static

Next.js Static Export

Next.js는 output: "export" 설정을 통해 정적 HTML로 빌드할 수 있습니다.

설정 방법

next.config.ts 파일에 다음과 같이 설정합니다:

const nextConfig: NextConfig = {
  output: "export",
  images: {
    unoptimized: true,
  },
};

빌드 및 배포

# 빌드
npm run build

# out/ 폴더가 생성됩니다
# 이 폴더를 정적 호스팅 서비스에 업로드하면 됩니다

배포 옵션

  1. GitHub Pages - 무료, GitHub 저장소와 연동
  2. Vercel - Next.js 공식 플랫폼
  3. Netlify - 간편한 정적 사이트 배포
  4. Cloudflare Pages - 글로벌 CDN

주의사항

  • Server Components의 서버 전용 기능 (cookies, headers 등)은 사용할 수 없습니다
  • API Routes는 정적 배포에서 동작하지 않습니다
  • generateStaticParams로 동적 경로를 미리 생성해야 합니다