Next.js dynamic segment

A dynamic segment is a folder name wrapped in square brackets. For example:

• A [slug] folder with the path src/app/blog/[slug]
• A[user] folder with the path src/app/users/[user]

Dynamic segments let you create dynamic pages. For example, you can define a app/blog/[slug]/page.tsx file like this:

export default async function BlogPostPage({
  params,
}: {
  params: Promise<{ slug: string }>
}) {
  const { slug } = await params
  const post = await getPost(slug)
 
  return (
    <div>
      <h1>{post.title}</h1>
      <p>{post.content}</p>
    </div>
  )
}