동적 라우트 params

값의 출처 결정

slug가 DB key인지, 사람이 읽는 식별자인지, 변경 가능한 이름인지 먼저 결정한다.

없는 값을 닫는다

params로 받은 값이 실제 데이터에 없으면 빈 화면보다 notFound 처리가 명확하다.

생성 전략 선택

경로 수가 작고 자주 안 바뀌면 정적 생성, 크거나 자주 바뀌면 요청 시 처리나 ISR을 고려한다.

params

URL 계약 폴더 이름의 동적 부분이 page와 layout props로 들어온다.

타입을 명시한다.

static params

빌드 시 경로 알려진 slug 목록을 미리 생성해 초기 응답을 빠르게 만든다.

목록 크기와 갱신 주기를 본다.

notFound

없는 리소스 데이터가 없을 때 404 경계를 명시한다.

SEO와 사용자 경험에 중요하다.

canonical

중복 URL 정리 같은 리소스가 여러 slug로 접근되면 표준 URL 정책이 필요하다.

redirect와 연결된다.

식별자 · 존재 확인 · 규모 점검

식별자 slug 변경이 기존 링크를 깨뜨리는지 정책이 있는가.

존재 확인 params 값이 데이터에 없을 때 명시적으로 404 처리하는가.

규모 generateStaticParams가 너무 많은 경로를 빌드에 올리지 않는가.

params 사용

export default async function Page({ params
        overflow-wrap: break-word;
        word-break: keep-all;
      }) {
  const post = await getPost(params.slug);
  if (!post) notFound();
  return <Article post={post} />;
}