client.ts - Client-side Supabase client (browser-safe, gebruikt anon key)
server.ts - Server-side Supabase client (admin, gebruikt service role key)
types.ts - TypeScript types (auto-gegenereerd uit database schema)
index.ts - Export file voor makkelijke imports

Gebruik

Client-side (React components)

import { supabase } from '@/lib/supabase'

// Voorbeeld: ophalen van clients
const { data, error } = await supabase
  .from('clients')
  .select('*')

Server-side (API routes, Server Components)

import { supabaseAdmin } from '@/lib/supabase/server'

// Voorbeeld: admin operatie
const { data, error } = await supabaseAdmin
  .from('clients')
  .insert({ ... })

TypeScript Types Genereren

Na het aanmaken van database schema (EP01), run:

pnpm run types:generate

Dit genereert TypeScript types uit je Supabase database schema.

Environment Variables

Zorg dat deze variabelen in .env.local staan:

NEXT_PUBLIC_SUPABASE_URL=https://dqugbrpwtisgyxscpefg.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=...
SUPABASE_SERVICE_ROLE_KEY=...

Security

⚠️ Belangrijk:

NEXT_PUBLIC_* variabelen zijn zichtbaar in de browser
SUPABASE_SERVICE_ROLE_KEY moet NOOIT naar de client worden gestuurd
Gebruik supabase (client) voor frontend operaties
Gebruik supabaseAdmin (server) alleen in API routes en Server Components

Volgende Stappen

✅ EP00-ST03: Supabase configuratie (Done)
⏳ EP01-ST01: Database schema aanmaken
⏳ EP01-ST02: Row Level Security policies
⏳ EP02-ST01: Authentication implementeren