Intermediate
A dashboard with nested routes
Turn the flat routes into nested ones. Dashboard (path dashboard) is a frame with <h2 id="dash-title">Dashboard</h2>, a nav, and an <Outlet /> where its pages appear.
Its children: an index route showing <p id="overview">Overview</p> at /dashboard, and settings showing <p id="settings">Settings</p> at /dashboard/settings. Add a top-level not-found route (*) that shows <h1 id="not-found">Page not found</h1>.
In the dashboard nav, the Overview NavLink must be active only on /dashboard itself, not on /dashboard/settings.
What Check tests
/dashboardshows the frame and the Overview index page- Settings appears inside the dashboard frame
- On
/dashboard/settingsonly the Settings link is active - An unknown URL shows
Page not found - Going back to the dashboard shows Overview again
Stuck? One hint at a time
The solution unlocks after your first Check. Try first: that is where the learning happens.
Runs in your browser. Your code is saved here.
Your page
Press Run to see the page.
Console
Nothing logged yet.