65 lines
1.8 KiB
Markdown
65 lines
1.8 KiB
Markdown
# Les 6 — Huiswerk
|
|
## QuickPoll polish + voorbereiding Supabase
|
|
|
|
**Deadline:** Voor Les 7
|
|
**Inleveren:** GitHub repo via Teams
|
|
|
|
---
|
|
|
|
## Opdracht 1 — Polish je app
|
|
|
|
Kies minstens **drie**:
|
|
|
|
- **Better empty states** — als er geen polls zijn, mooie message + CTA
|
|
- **Dark mode** — toggle button + Tailwind dark classes
|
|
- **Toast notifications** — `pnpm add sonner` voor vote feedback
|
|
- **Animatie** — Framer Motion voor vote-count count-up
|
|
- **Validation** — toon errors inline (geen throw)
|
|
- **Optimistic UI** — `useOptimistic` voor instant vote-feedback
|
|
|
|
Per gekozen item: korte uitleg in REFLECTIE.md wat je hebt gedaan.
|
|
|
|
---
|
|
|
|
## Opdracht 2 — Maak een Supabase account
|
|
|
|
Volgende les koppelen we Supabase. Bereid je alvast voor:
|
|
|
|
1. Account op **supabase.com** (mag met GitHub)
|
|
2. New project — naam `quickpoll`, region `Europe (Frankfurt)`
|
|
3. Sla password op (lange random string)
|
|
4. Wacht 1-2 min op provisioning
|
|
5. Noteer in REFLECTIE.md:
|
|
- Project URL (eindigt op `.supabase.co`)
|
|
- Anon key (Settings → API)
|
|
|
|
Je hoeft NIETS in te bouwen — alleen account klaar.
|
|
|
|
---
|
|
|
|
## Opdracht 3 — Reflectie (250 woorden)
|
|
|
|
Schrijf in `REFLECTIE.md`:
|
|
|
|
- Wat is volgens jou het verschil tussen een Server Action en een traditionele API route?
|
|
- Hoe vond je werken met `useFormStatus` + `useOptimistic`?
|
|
- Welke onderdelen voelden nog onnatuurlijk of onduidelijk?
|
|
- Wat verwacht je dat met Supabase makkelijker wordt?
|
|
|
|
---
|
|
|
|
## Inleveren
|
|
|
|
GitHub repo URL via Teams. Vermeld in je commit-messages welke polish-items je gekozen hebt.
|
|
|
|
---
|
|
|
|
## Tips
|
|
|
|
- **Commits klein houden** — één polish-item per commit
|
|
- **Loop niet vast op één feature** — als iets niet werkt, kies een ander item
|
|
- **Vraag hulp** in Teams als nodig
|
|
- **Tijd:** ~2 uur
|
|
|
|
Volgende les: échte database, écht persistent. QuickPoll wordt productie-klaar.
|