Constructing the Ticket Details page

When a specific ticket is clicked, we need a page that shows the details of it. For example, the ticket details for a ticket with the ID 857 should be reachable at http://your-domain/tickets/details/857. This URL uses dynamic parameters in which we can simply create a suitable directory/file structure, using tickets/details/[id]/page.js. By doing so, Next.js will recognize that the part after details/ needs to be passed to us as id.

To do this, create the tickets/details/[id]/page.js file and put the following code inside of it:

export default function TicketDetailsPage({ params }) {
  return (
    <div>
      Ticket Details page with <strong>ID={params.id}</strong>
    </div>
  );
}

If you visit any URL using that scheme – for example, /tickets/details/123 – you should now see this:

Figure...