Scribd
Upload
5 views1 page

React Router v6 Navigation Guide

React Router v6 is a routing library for React applications that allows declarative routing. It can be set up by installing react-router-dom and wrapping the app with BrowserRouter. Key features include defining routes with the Routes and Route components, using the useNavigate hook for programmatic navigation, and supporting nested routes for modular structures.

Uploaded by

Girish G
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
5 views1 page

React Router v6 Navigation Guide

React Router v6 is a routing library for React applications that allows declarative routing. It can be set up by installing react-router-dom and wrapping the app with BrowserRouter. Key features include defining routes with the Routes and Route components, using the useNavigate hook for programmatic navigation, and supporting nested routes for modular structures.

Uploaded by

Girish G
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

React Router & Navigation (v6)

Introduction
React Router v6 is the latest version of the routing library that provides declarative routing for React
applications.

Setting Up React Router


Install it using npm install react-router-dom and wrap your app with BrowserRouter.

Routes and Route


Define navigation paths using the Routes and Route components.
<Routes>
<Route path='/' element={<Home />} />
<Route path='/about' element={<About />} />
</Routes>

useNavigate Hook
useNavigate allows programmatic navigation to other routes.
const navigate = useNavigate();
<button onClick={() => navigate('/home')}>Go Home</button>

Nested Routes
Nested routes allow building modular and hierarchical routing structures.

Summary
React Router enables seamless single-page application navigation and dynamic URL
management.

You might also like