핵심 답변
📌 generateStaticParams는 동적 라우트 세그먼트(
[slug], [id])에서 빌드 시 미리 생성할 파라미터 목록을 반환하는 함수입니다.이 함수를 사용하면 동적 라우트도 정적 페이지(SSG)로 생성해 빠른 응답 속도와 CDN 캐싱 혜택을 받을 수 있습니다. Pages Router의 getStaticPaths에 해당합니다.
예시 코드
typescript
// app/posts/[slug]/page.tsx
// 빌드 시 생성할 slug 목록 반환
export async function generateStaticParams() {
const posts = await db.post.findMany({ select: { slug: true } });
return posts.map(post => ({ slug: post.slug }));
}
// 각 slug에 대해 자동으로 정적 페이지 생성
export default async function PostPage({ params }) {
const { slug } = await params;
const post = await getPostBySlug(slug);
return <article>{post.title}</article>;
}핵심 용어
📌 정적 경로 생성(Static Path Generation)빌드 시 동적 라우트의 모든 경로를 미리 HTML로 생성하는 과정입니다.
📌 dynamicParams
generateStaticParams에 포함되지 않은 경로의 처리 방식을 설정합니다. false로 설정하면 목록에 없는 경로는 404를 반환합니다.