Mission 6 of 12
Build a Smart Home Security Dashboard
Build a dashboard for smart-home devices behind a login. Add Supabase Auth with Google OAuth sign-in so only signed-in users get in, and protect the dashboard routes with JWT.
By the end of this mission: “I can build an auth-protected React app using Supabase Auth (Google OAuth) and JWT-secured routes.”
The tech stack for this mission
React
Supabase Auth
Google OAuth
JWT
React Router
VercelWhat you learn, checkpoint by checkpoint
Checkpoint A
Build the device dashboard UI with reusable components
- Design a dashboard layout for devices, status and controls
- Build small, reusable React components and compose them
- Manage view state and wire up React Router navigation
Checkpoint B
Add Supabase Auth with email + Google OAuth sign-in
- Set up Supabase Auth with email + Google OAuth sign-in and logout
- Store and read the signed-in user across the app
- Show different UI depending on whether the user is signed in
Checkpoint C
Protect routes with tokens and deploy
- Protect dashboard routes so only authenticated users get in
- Use the auth token to authorise access and guard actions
- Redirect unauthenticated users to login, then deploy
AI companion mode · AI as Reviewer
You write the code · AI reviews it
Companion suggests refactors and reviews PRs. You write the code; AI catches what you miss. You decide what to accept.
What proves you’re done
Auth-gated smart-home dashboard + auth explanation
Every mission ships something real and public. If you can’t explain it, you can’t submit it.
Reading is not building.
This mission is part of the paid 12-week programme - but the way we teach is free to try. The free trial puts you inside Sigmo, the learning portal our students use daily, with the 6 Projects in 6 Days precourse: real projects, real code, published to your own GitHub.
Start the free trialReady for the real thing?
The AI-Native Software Development Programme - all 12 missions with a live cohort, daily Buildroom, and mentors watching your back.