novi-lessons/Samenvattingen/Les09-Samenvatting.md

Les 9: Supabase Auth — Eerste Login Flow

✅ Deze les is volledig uitgewerkt

Lesmateriaal

• Slide Overzicht
• Docenttekst
• Lesstof
• Lesopdracht
• Huiswerk
• Live Coding Guide

---

Deel

Deel 2 — Technical Foundations (Les 4-10)

Beschrijving

Eerste kennismaking met Supabase Auth in de QuickPoll-app: signUp, signIn, signOut, een werkende Navbar met sessie-status en een middleware die routes beschermt. We sluiten af met een eerste blik op Row Level Security (RLS).

---

Te Behandelen

Theorie

• Waarom je auth nooit zelf moet bouwen
• Supabase Auth in vogelvlucht (e-mail, magic link, OAuth)
• Sessie-cookies en @supabase/ssr in Next.js 16
• Middleware-patroon voor beschermde routes
• Eerste introductie van RLS: "wie mag wat zien?"

Live coding

• signUp + signIn server actions
• Navbar component met user-prop
• signOut server action + redirect
• middleware.ts met updateSession
• RLS-policy voor polls tabel

---

Tools

• Supabase (Auth + Postgres + RLS)
• Next.js 16 App Router + Server Actions
• @supabase/ssr
• TypeScript + Tailwind CSS

---

Lesopdracht (in-class, 60 min)

Bouw de signup + login + Navbar in je eigen QuickPoll-fork:

• /signup en /login routes met server actions
• Navbar toont "Inloggen" of "Uitloggen" op basis van sessie
• middleware.ts blokkeert /create voor anonieme bezoekers
• Werkende redirect na succesvolle login

Inleveren: GitHub repo + screenshot van werkende flow.

---

Huiswerk (take-home)

• Voeg een /profile pagina toe die alleen ingelogd zichtbaar is
• Toon e-mailadres en gebruikers-ID
• Schrijf een korte RLS-policy zodat gebruikers alleen hun eigen polls zien
• Reflectie van 300 woorden: wat is het verschil tussen authenticatie en autorisatie?

Inleveren: Via Teams/Brightspace.

---

Leerdoelen

Na deze les kan de student:

• Het verschil tussen authenticatie en autorisatie uitleggen
• Een werkende signup/login/logout-flow bouwen met Supabase Auth
• Een Next.js middleware schrijven die routes beschermt
• Een eerste RLS-policy formuleren en activeren