Next.js Discord

Discord Forum

api routes with app router

Answered
Multiflora rose seed chalcid posted this in #help-forum
Open in Discord
Multiflora rose seed chalcidOP
I have a bit of an issue understanding how to efficiently structure my api routes with an app router (instead of the pages router), creating a page.ts for each route seems a bit redundant.
Answered by Common Moorhen
https://nextjs.org/docs/app/building-your-application/routing/route-handlers#dynamic-route-segments
View full answer

35 Replies

Multiflora rose seed chalcidOP
i dont get it.
Genio
What are you trying to do exactly ?
Multiflora rose seed chalcidOP
an api route at /api/events/palettes
@Multiflora rose seed chalcid an api route at /api/events/palettes
Common Moorhen
it is showing a 404 error because in your folder structure, you declared your route as "api/events/palletes" isntead of "api/event/palletes"
@Common Moorhen it is showing a 404 error because in your folder structure, you declared your route as "api/event`s`/palletes" isntead of "api/event/palletes"
Multiflora rose seed chalcidOP
right - silly mistake here, just super exhausted and nextjs magic isn't it making it easier at this point.
what about something like this?
or would i have to manually check searchParams inside the GET function of route.ts and do it that way?
Common Moorhen
the paths are determined by the folders
so if you use [id].ts it wont create any route
you should use a folder named [id] and put a route.ts inside if thats what you are trying to do
but right now if you go to api/events/palettes you should see something
Multiflora rose seed chalcidOP
so basically i end up with 9 billion route.ts files?
@Multiflora rose seed chalcid so basically i end up with 9 billion route.ts files?
Common Moorhen
one for each endpoint
what is the behavior youre trying to achive?
Multiflora rose seed chalcidOP
next js is a proxy/frontend for an internal service api
and im doing client sided fetching
with SWR
just can't figure out a way to efficiently structure my nextjs app
Common Moorhen
but youre trying to create a route api/events/palettes right?
Multiflora rose seed chalcidOP
yeah that's sorted already, now need an api/events/palettes/:id route
Common Moorhen
aah
so
inside the folder palettes, create a folder named [id] and put a route.ts inside
Multiflora rose seed chalcidOP
how would i access the [id] segment inside GET ?
Answer
Common Moorhen
like this 
export async function GET(
  request: Request,
  { params }: { params: { id: string } }
) {
  const id = params.id // 'a', 'b', or 'c'
}
Multiflora rose seed chalcidOP
no idea how i missed that - you're a legend; thanks 🙌
Common Moorhen
np
hahahaha
Multiflora rose seed chalcidOP
dying 24/7
Common Moorhen
hahh just use tabs lol
@Common Moorhen https://nextjs.org/docs/app/building-your-application/routing/route-handlers#dynamic-route-segments
Common Moorhen
if this works, please react to the message with ✅ to mark this question as answered
@ncls. You mean Right click > Apps > Mark Solution
Common Moorhen
dindt know that lol