How slug works

Dynamic routing in NextJS.

• Dynamic = Request time

For build time, check generateStaticParams.

// app/blog/[slug]/page.tsx
export default async function Page({
  params,
}: {
  params: Promise<{ slug: string }>
}) {
  const slug = (await params).slug;

  return <div>My Post: {slug}</div>
}

Using the above, following URLs are the translations:

// template
app/blog/[slug]/page.js

// route
/blog/a
/blog/b
/blog/c

// params
{ slug: 'a' }
{ slug: 'b' }
{ slug: 'c' }