Nextjs Multiple dynamic Routes on the bases of ids

Question

enter image description here

Hi, I am working on the Nextjs project, and I have an issue, where I have Events->Event->Schedule. I just want to click on the event it will be linked to the event, inside the event there will be a schedule that will be linked to the schedule component, there will be multiple events, and the routing should be dynamic. Folder structure is visible in Pic

Answer 1

Take a look at the Next.js documentation on Dynamic Routing:

https://nextjs.org/docs/routing/dynamic-routes

You would create a file structure similar to this:

pages/
-- events/
---- [eventId]/
------ schedule/
-------- [scheduleId].js

The last file would live at pages/events/[eventId]/schedule/[scheduleId].js . In that page file, you would have access to both eventId and scheduleId as route parameters to look up the appropriate event and schedule.