# Les 9 — Lesopdracht

## Bouw de auth-flow voor QuickPoll

Duur: ~60 minuten in-class, samen met klasgenoten.

---

### Doel

Aan het einde van deze opdracht heeft jouw QuickPoll-fork een werkende signup-, login- en logout-flow met een Navbar die de sessie-status toont.

---

### Vereisten

1. **Supabase Auth aan**
   - Open je Supabase dashboard → Authentication → Providers → Email
   - Zet "Disable Email Confirmations" tijdelijk AAN (voor testen)

2. **`/signup` pagina**
   - Form met email + password
   - Server action die `supabase.auth.signUp` aanroept
   - Bij succes: redirect naar `/`
   - Bij fout: toon de error-message

3. **`/login` pagina**
   - Form met email + password
   - Server action die `supabase.auth.signInWithPassword` aanroept
   - Bij succes: redirect naar `/`
   - Bij fout: toon de error-message

4. **Navbar component**
   - Server component
   - Vraagt `getUser()` op
   - Toont email + "Uitloggen" als ingelogd
   - Toont "Inloggen" + "Registreren" als anoniem

5. **`/signout` server action**
   - Roept `supabase.auth.signOut()` aan
   - Redirect naar `/`

6. **Middleware**
   - Gebruik de `updateSession`-helper uit de Supabase docs
   - Configureer matcher om alle routes te dekken behalve statische assets

---

### Stappenplan

1. Installeer `@supabase/ssr` (10 min)
2. Maak `lib/supabase-server.ts` (10 min)
3. Maak `/signup` route + action (15 min)
4. Maak `/login` route + action (10 min)
5. Maak Navbar component (10 min)
6. Test de volledige flow (5 min)

---

### Op te leveren

- GitHub-commit met werkende code
- Screenshot van Navbar in beide states (ingelogd + anoniem)
- 2 zinnen reflectie: wat ging makkelijker dan verwacht, wat lastiger?

**Inleveren:** Push naar je QuickPoll-repo én plaats een screenshot in de Teams chat.

---

### Hulp nodig?

- Stuck op cookies? Vraag een klasgenoot, dan Tim
- Stuck op middleware? `Les09-Live-Coding-Guide.md` heeft de complete code
- Stuck op Supabase config? Loop met Tim mee in een browser-share

Veel succes!