Dynamic routes
Create the Pokémon route
The homepage is ready. We have the full list of Pokémon and they are all links. Great!
Now we want to make those links actually point to a real page. Let’s create the dynamic route.
Create the folder routes/pokemons
and then create the two files [pokemon].tsx
and [pokemon].rs
.
These two will handle every request that points to http://localhost:3000/pokemons/bulbasaur..mew
.
Let’s first work on the server side file. Paste into the new [pokemon].rs
file the following code:
Then let’s work on the frontend. Paste into the [pokemon].tsx
file the following code:
The browser should complain that the component PokemonView
does not exist. Let’s create it then!
To have the proper style consider adding a new css module file: