Dynamic route static prefixes: category-[categoryId]

[dmythro]

On one of the projects, SEO requires less "levels" of url pathname so instead of category/[categoryId] they require category-[categoryId], item-[itemId] etc for some entities.

Tried with Next.js 15.5 and it doesn't work like that.

Handling all of that in a single [slug] route is super problematic: multiple entities handled in the route + it introduces a generic dynamic handler which causes many other issues, especially in the root of app routes!

[icyJoseph]

For this case you can use rewrites tough, but that may have some minor caveats. Let me find a similar thread someone opened not long ago.

[dmythro]

I tried to find something open by keywords, none covered this exact issue.
Feels like this should be out of the box, but for now only limited to a variable per segment.

[icyJoseph]

Here, #82190 (comment)

I know it is not ideal to have this layer of abstraction.

[icyJoseph]

Maybe if you read through those notes, we can work out a way forward here. Looks like /items/foo-[id]/item when hit, at say, localhost:3000/items/foo-1337/item would put foo-1337 into id, when reading the params? OP in that issue had a pages router application, and it doesn't look like I investigated this for App Router

Cuz if you can still capture the prefixed path into the parameter, again, with an additional layer of abstraction, you could still unblock yourself. It'd feel brittle though.

[dmythro]

Main issue is, I need these routes in the almost root (after locale). And more than one.
So I just add a generic [lang]/[slug] route. And this [slug] also catches some under the hood stuff like "/.../appspecific" I don't really wanna deal with :)

Just tried rewrites and for some reason it gives me 404 now on all the routes in rewrites.

Here's file structure:

Here's the config:

const nextConfig: NextConfig = {
  async rewrites() {
    return [
      {
        source: '/:lang/car-:categoryUrl(\\w+)/:rest*',
        destination: '/:lang/car/:categoryUrl/:rest*',
      },
    ]
  },
  // ...
}

Not sure what's wrong.

[dmythro]

Basically, I only need to get rid of one slash :) Without polluting the root with a generic [lang]/[slug] which catches a lot of things I don't really want plus adds a lot of unnecessary complexity to the code.