This course contains 137 interactive scrims spread across 6 modules.
20 lessons1 hour 27 min
23 lessons2 hours 6 min
24 lessons1 hour 35 min
12 lessons 40 min
40 lessons2 hours 39 min
18 lessons1 hour 13 min
What are SPAs?
Basic router setup
Nested routes and Outlet
Layout and Index routes
404 page / Splat routes
Form & form data
Error handling & errorElement
Deploying with Netlify
Using Firebase for data storage
An awesome app for renting decked-out travel vans for your next road trip adventure! 🚐
Head of Education at Scrimba. Passionate about learning 📚, helping others achieve their career goals 👩💻, tennis 🎾, woodworking 🪑, and my family 👨👩👦👦.Follow me on twitter
In this 121-part course, you’ll learn the ins and outs of React Router v6, the most popular routing library for React applications and one of the most downloaded React support libraries ever.
React Router is the primary way most applications handle client-side routing, which allows React developers to create “single-page” web apps. Unlike the name might seem to imply, a “single-page” app is one that has many different web pages that are all handled by the React app directly on the client, without necessarily needing to make extra requests of the server every time the user navigates to a new page.
Instead of loading new pages for each route, a Single-Page App (SPA) updates the document that has already loaded in the browser to display the new information. This leads to an extremely snappy-feeling website that doesn’t have the tell-tale flicker of a site that loads a new HTML page on every route transition.
In this course, you’ll learn the most important parts of the React Router (v6) library while building an app called “VanLife”, an app for renting decked-out travel vans for your next road trip adventure.
This course is filled with interactive coding challenges, small and large, to help drill in the topics you’ll be learning, all while building the main VanLife project. Repetition and practice is the real way to avoid tutorial hell and build the muscle memory needed to truly understand what you’re learning.
So if you’re looking to escape tutorial hell, this course (and Scrimba courses in general) is the way to go!
Don’t forget: learning should never be lonely - that’s why we’ve set up the Scrimba Discord server. Make sure you drop in, say hello, and share your goals and achievements. If you get stuck, there is even a dedicated React help channel.
React Router is the most popular 3rd-party (I.e. not developed by the React core team) library for handling client-side routing. At its core, it’s a library built for conditionally rendering certain “pages” depending on the current URL route of the app. (E.g. example.com/about, example.com/contact-us, example.com/products/123, etc.)
With over 10 million downloads per week, it’s safe to say React Router is used by most React applications that need to handle client-side routing. There are alternatives out there (most notably TanStack Router), but none of them are as ubiquitous as React Router at this time.