Authenticatie: Supabase Auth (email/wachtwoord)

Core bibliotheek: @supabase/supabase-js + @supabase/ssr

Hoe het werkt

Login flow:

1. Gebruiker vult email/wachtwoord in op /login
2. Optioneel: reCAPTCHA v3 verificatie via /api/auth/verify-recaptcha
3. signIn() roept Supabase aan → sessie wordt opgeslagen in localStorage
4. Redirect naar /dashboard

Routebescherming:

• De AuthGuard component (app/components/AuthGuard.tsx) omhult alle dashboard-pagina's
• Niet-ingelogde gebruikers worden doorgestuurd naar /login
• Data-queries in lib/storage.ts filteren altijd op user_id (Row-Level Security)

Sleutelbestanden

┌────────────────────┬────────────────────────────────────────┐ │ Doel │ Bestand │ ├────────────────────┼────────────────────────────────────────┤ │ Auth-functies │ lib/supabase.ts │ ├────────────────────┼────────────────────────────────────────┤ │ Login-pagina │ app/login/page.tsx │ ├────────────────────┼────────────────────────────────────────┤ │ Route-beveiliging │ app/components/AuthGuard.tsx │ ├────────────────────┼────────────────────────────────────────┤ │ Dashboard-layout │ app/dashboard/layout.tsx │ ├────────────────────┼────────────────────────────────────────┤ │ reCAPTCHA API │ app/api/auth/verify-recaptcha/route.ts │ ├────────────────────┼────────────────────────────────────────┤ │ Data-toegang (RLS) │ lib/storage.ts │ └────────────────────┴────────────────────────────────────────┘

Beveiligingsmaatregelen

• Brute-force bescherming: 5 pogingen → 30 seconden lockout
• reCAPTCHA v3 (optioneel, via NEXT_PUBLIC_RECAPTCHA_SITE_KEY)
• Row-Level Security in Supabase database
• Wachtwoord-reset via email (/forgot-password → /reset-password)