How to render different data every time upon clicking each item from a list of .map items?

Th question is so confusing in itself but all I want to implement that I’ve three restaurants data in a database and I’m displaying their names on three cards by calling .map method on restaurants names list, now I want to do something like whenever someone click on a card it will take him to a page where he can find all the information about that specific restaurant, it’s dishes and should be able to rate them, so how this routing take place? Should I have to create three separate pages but what if I have more than three so it would be a mess? or there’s a way to dynamically display different data upon clicking different cards? for your reference, I’m using MERN Stack for this project.

Source: React Router Questions