

Let’s get started! Prerequisites - What You Need To Know # The first two will use the Link and NavLink components, while the last one will make use of the Redirect component. To make this easier to follow, we’ll create a small application that has three pages: By the end of the tutorial, you should understand how Link, NavLink and Redirect work, so that you can create a functional multi-page application. This short guide will give you a basic understanding of how to handle navigation in a React application. Now let’s see the React Router Link in action! WYWL: What You Will Learn #

This ensures faster page speeds and a better use of resources, and contributes to a nicer user experience, since the page doesn’t fully reload with every click.

React Router switches from server-side to client-side routing, so when you click on the Link component, the app checks the route and loads the requested component without reloading the full page in the browser. This means that whenever you click on the tag to access another page, a new request is sent to the server, and the current page is redirected in the browser to the new page. The same can be used in React, but the problem with the these tags is that they create server-side links. In non-React apps, the navigation between pages is done through tags. However, most web applications are multi-page. React is an awesome library for single page applications that require fast loading speeds and real-time updates based on user interactions.
