78 lines
2.4 KiB
Markdown
78 lines
2.4 KiB
Markdown
# Les 10: Supabase Auth & Row Level Security — Verdieping
|
|
|
|
> ✅ **Deze les is volledig uitgewerkt**
|
|
|
|
## Lesmateriaal
|
|
|
|
- [Slide Overzicht](../Les10-Supabase-Auth/Les10-Slide-Overzicht.md)
|
|
- [Docenttekst](../Les10-Supabase-Auth/Les10-Docenttekst.md)
|
|
- [Lesstof](../Les10-Supabase-Auth/Les10-Lesstof.md)
|
|
- [Lesopdracht / Hands-on](../Les10-Supabase-Auth/Les10-Lesopdracht.md)
|
|
- [Huiswerk](../Les10-Supabase-Auth/Les10-Huiswerk.md)
|
|
|
|
---
|
|
|
|
## Deel
|
|
**Deel 2 — Technical Foundations** (Les 4-10)
|
|
|
|
## Beschrijving
|
|
Vervolg op Les 9: we bouwen de complete auth-flow uit met sessie-management, beschermde routes en gedegen RLS-policies. De QuickPoll-app krijgt een professioneel niveau van autorisatie en is daarmee klaar voor de AI-lessen.
|
|
|
|
---
|
|
|
|
## Te Behandelen
|
|
|
|
### Theorie
|
|
- Drie auth-methodes in Supabase (e-mail/password, magic link, OAuth)
|
|
- Hoe sessies werken (JWT, refresh tokens, cookies)
|
|
- Server- vs. client-componenten in Next.js voor auth
|
|
- Row Level Security in detail: `using` vs. `with check`, `auth.uid()`
|
|
- Beschermde routes via middleware vs. server components
|
|
|
|
### Hands-on
|
|
- Supabase Auth provider configureren in dashboard
|
|
- Login + registratie pagina's met error handling
|
|
- Sessie ophalen in server components
|
|
- Drie RLS-policies: read-eigen, insert-eigen, update-eigen
|
|
- Test scenario: hoe weet je dat RLS écht werkt?
|
|
|
|
---
|
|
|
|
## Tools
|
|
- Supabase (Auth + RLS)
|
|
- Next.js 16 App Router
|
|
- `@supabase/ssr` + `@supabase/supabase-js`
|
|
- TypeScript + Tailwind CSS
|
|
|
|
---
|
|
|
|
## Lesopdracht (in-class, 60 min)
|
|
|
|
Uitbreiding van de QuickPoll-app:
|
|
- Authenticatie volledig werkend (signup, login, logout, sessie)
|
|
- Beschermde `/create` en `/my-polls` routes
|
|
- RLS-policies geactiveerd op `polls` en `options`
|
|
- "My Polls" pagina toont alleen polls van ingelogde gebruiker
|
|
|
|
**Inleveren:** GitHub repo + screen-recording van werkende auth-flow.
|
|
|
|
---
|
|
|
|
## Huiswerk (take-home)
|
|
- Voeg "Edit poll" toe die alleen werkt voor eigenaar (RLS-check)
|
|
- Voeg "Delete poll" toe met confirm-dialog
|
|
- Test wat er gebeurt als je de RLS-policy uitzet (security demo)
|
|
- Reflectie van 500 woorden: waarom is RLS beter dan auth-checks in code?
|
|
|
|
**Inleveren:** Via Teams/Brightspace.
|
|
|
|
---
|
|
|
|
## Leerdoelen
|
|
Na deze les kan de student:
|
|
- Een complete auth-flow opzetten in Next.js + Supabase
|
|
- Sessies veilig beheren via cookies + middleware
|
|
- Effectieve RLS-policies schrijven met `auth.uid()`
|
|
- Verschil uitleggen tussen auth in code vs. auth in database
|
|
- Een poll-app maken die multi-user-veilig is
|