React › Routing
What is client side routing in a React app, and how does React Router help with it?
BeginnerAnswer
Client side routing lets a user navigate between different pages of a single page app without the browser actually reloading the page from the server every single time. React Router is the most popular library for this, letting you define which component shows for each specific web address, called a route.
import { BrowserRouter, Routes, Route } from 'react-router-dom';
function App() {
return (
<BrowserRouter>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/about" element={<About />} />
</Routes>
</BrowserRouter>
);
}Real-world example A company website switches between its home page and about page instantly, without any visible page reload, thanks to React Router handling navigation entirely on the client side.