VanLife

This repository contains my learning project built while following the Scrimba course: "Learn React Router 6" by Bob Ziroll.
The project is called VanLife a fictional van rental web app that helps users browse, learn about, and manage rental vans for trips and travelling.

About the VanLife Project

VanLife is a multi-page React application built to demonstrate the power of React Router.

In the project, a van rental platform where users can:

• View a homepage and learn about the company
• Browse a list of available vans to rent
• Click on a van to view detailed information
• Navigate between different pages using routes
• Use dynamic URLs to load van-specific data
• Manage a "host dashboard" area with nested routes and protected pages

What I Learned

• How to configure React Router with <BrowserRouter>, <Routes>, and <Route>
• Setting up static and dynamic routes
• Creating nested layouts and using Outlet
• Using useParams hook
• Implementing route protection with a mock auth system
• Organizing routes with layout and dashboard structure

Tech Stack

• React
• React Router
• Vite
• Tailwind CSS (for styling for UI)
• MirageJS
• clsx

Getting Started

1. Clone the repo

git clone https://github.com/your-username/vanlife-react-router.git

2. Install dependencies

npm install

3. Run the development server

npm run dev

Course Reference

Scrimba Course: Learn React Router 6 by Bob Ziroll