scrimba
Learn React Router
Nested Routes
Fixing the Navbar with a Layout Route part 2
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Fixing the Navbar with a Layout Route part 2
AboutCommentsNotes
Fixing the Navbar with a Layout Route part 2
Expand for more info
index.jsx
run
preview
console
import React from 'react';
import ReactDOM from 'react-dom/client';
import { BrowserRouter, Routes, Route, Link } from "react-router-dom"
import Home from "./pages/Home"
import About from "./pages/About"
import Vans from "./pages/Vans"
import VanDetail from "./pages/VanDetail"

import "./server"

function App() {
return (
<BrowserRouter>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/about" element={<About />} />
<Route path="/vans" element={<Vans />} />
<Route path="/vans/:id" element={<VanDetail />} />
</Routes>
</BrowserRouter>
)
}

ReactDOM
.createRoot(document.getElementById('root'))
.render(<App />);
Console
/vans/2
-7:42