Next.js

정적 데이터 생성 (SSG)

Next.js는 요청 시점에 매번 렌더링하지 않아도 되는 페이지를 빌드 시점에 HTML로 만들어 둘 수 있습니다. 그 전략이 정적 사이트 생성(Static Site Generation, SSG)입니다.

데이터 변경 빈도와 빌드 시점 확보 가능성을 기준으로 SSG 적용 여부를 정리합니다.

정적 데이터 생성 흐름

1

SSG 개념

정적 사이트 생성(SSG)은 웹 페이지의 모든 콘텐츠가 애플리케이션 빌드 타임(Build Time)에 미리 생성되는 방식입니다.

2

App Router에서 SSG 구현하기

Next.js App Router에서 SSG를 구현하는 핵심은 동적 라우트([slug], [id] 등)와 함께 generateStaticParams 함수를 사용하는 것입니다.

3

generateStaticParams의 작동 방식

빌드 시 실행: generateStaticParams는 npm run build 명령이 실행될 때만 한 번 실행됩니다.

4

SSG와 ISR

generateStaticParams를 통해 SSG된 페이지는 기본적으로 빌드 시점에 고정됩니다.