When you work with React (as with other frontend frameworks, such as Angular or Vue, to name just a couple) you usually develop Single Page Applications (SPAs) that never do a full-page reload when you access a different part of them; rather, new content is swapped into view, but staying put on the original page. Even if this kind of navigational experience is modern and fluid, some aspects of more traditional routing are expected: the back and forward buttons should move you, depending on your browsing story, and you should also be able to bookmark a specific part of your application to be able to quickly return to it later.

As usual, with React, there are many ways to handle routing, but react-router is currently by far the most used library, probably because it really fits the React paradigm: routes are just components that you render and work as expected! Let's start by building a simple application to show how routes work, and in the next section we'll add a bit of complexity by requiring authentication before allowing access to certain routes.