The Missing Introduction to React Router
Project Setup and Walkthrough
Introducing the <BrowserRouter />
<Route /> and Path declarations
Switching <Route /> elements with <Routes />
Handling 404 Not Found routes
Redirecting 404 Not Found routes
Declarative Navigation and Links
Navigating to routes with <Link />
Active link states with <NavLink />
Active styles on <NavLink />
Advanced Routing Practices
Nested Routes and <Outlet />
Fetching Data in Nested Routes
Relative and Absolute Navigation with <Link />
Creating Dynamic Routes
Reading Route Params with useParams() Hook
Fetching Dynamic Data with Route Params
Programmatic Navigation with useNavigate()
Replacing Router State on Navigation
Passing State on Navigation alongside useLocation()
Understanding Navigation Deltas with useNavigate()
Domain-Driven Nested Routes
Restricting Access with a <ProtectedRoute /> Component
CRUD Operations and Bonus Techniques
Re-investigating Relative <Link /> Paths
Using <Link /> with Nested Routes
Creating a new Product from a Form
Redirecting upon Product Create
Retrieving an existing Product
Updating an existing Product
Deleting an existing Product
Passing Props to Routed Components
Reading Search Params with useSearchParams()
Syncing Search Param State with UI State
Rendering UI from Search Param State
Scrolling to Top after Route Transitions
Object-based Route Config with useRoutes()
Code Splitting and Lazy-Loading Components
Creating a Suspense-ready Lazy-Load Component
Get the complete bundle...
Everything you need to start mastering React today
Nail that interview with your new skills that will set you apart.
All the best practices
Best practices, design patterns, performance and architecture.
Stream or download
Learn at home at your own pace, download for offline viewing.
Built by Google Developer Experts, there's no better place to learn web.
Access full course source code and experiment in the browser too!
Exclusive access to our members-only community (6,500+ members).
React Kickstart Bundle
Secure SSL encrypted payments
30-day money back guarantee
These courses are empowering thousands with expert knowledge - they will you too. If you're disappointed for whatever reason, you'll get a full refund.
Location + Student discounts
Not-so-good exchange rate (i.e. India/Brazil)? Are you a student? Contact us for a coupon with your location or student details.
React Basics85 lessons
React Styling9 lessons
React Router v638 lessons
React State Management23 lessons
React MasterclassAlmost ready
React UniversalAlmost ready