Learning about React Router
React Router is the most commonly used routing framework in React. It is relatively simple to learn and use. Routing, as we discovered in Chapter 4, Learning Single-Page Application Concepts and How React Enables Them, is ubiquitous in web development. It is a feature expected by users of web apps, so learning how to use it for our React app is a requirement.
Routes in React Router are simply React Router components that contain our own application components, and these components in turn represent our screens. In other words, a route in React Router is a logical representation of a virtual location (by virtual location, I mean a URL that is just a label and does not actually exist on any server). The "routers" in React Router act as parent components and our screen rendering components act as children. This is a bit difficult to understand by simply reading about it, so let's create an example:
- Create a new React project under...