Using a routing library
In the previous section, you learned how to manually implement routing with Redux and React without using a library. While this approach works, there are a couple issues with our solution:
- When creating a new route, we have to adjust the code in multiple parts of our project:
- In the
Router
component, where we decide which route shows which page. - In the
Navigation
component, where we have to add a link to the new route.
- In the
- It is not possible to create more complicated routes, like a separate page for each post.
- It is not possible to link to a certain page via a URL. The current route is only stored in the Redux store.
- Route changes are not reflected in the browser history. This means that the user can't go back and forth between pages with browser features.
In this section, we are going to use two libraries to implement routing: react-router and react-router-redux. The first library, react-router, allows us to define routes and links to certain routes. It works similar to...