Dynamic route

kita bisa membuat folder seperti ini [slug].

contoh:

// @filename: app/blog/[slug]/page.tsx

export default function Page({ params }: { params: { slug: string } }) {
  return <div>My Post: {params.slug}</div>
}

kita bisa mengaksesnya /blog/a

Catch-all Segments

kita bisa membuat folder seperti ini […slug]

contoh:

// @filename: app/blog/[...slug]/page.tsx

export default function Page({ params }: { params: { slug: string } }) {
  return <div>My Post: {params.slug}</div>
}

jika kita mengakses misal /shop/a/b/c, maka paramsnya akan seperti ini

{ slug: ['a', 'b', 'c'] }

Optional Catch-all Segments

jika dengan Catch all Segments, kita tidak bisa mengakses seperti ini saja /shop. ini akan menyebebkan error not-found. jika kita menemukan kasus dimana kita ingin masih bisa akses tanpa menyertakan params kita bisa gunakan Optional Catch-all Segments. kita cukup membungkus nya seperti ini [[…slug]]