2.9 KiB
2.9 KiB
Les 7: Backend Made Easy met Supabase + AI + Skills
📋 Lesmateriaal nog niet uitgewerkt
De volgende bestanden worden gegenereerd wanneer deze les wordt uitgewerkt:
- Les07-Slide-Overzicht.md
- Les07-Lesplan.md
- Les07-Docenttekst.md
- Les07-Bijlage-A-Lesopdracht.md
- Les07-Bijlage-B-Huiswerkopdracht.md
Hoofdstuk
Hoofdstuk 2: Intermediate (Les 4-9)
Beschrijving
Gebruik AI om backend te bouwen zonder backend expert te zijn. Focus op Supabase + AI + Skills combinatie.
Te Behandelen
Supabase Overview
- Open-source Firebase alternative
Core Features:
- Postgres database
- Authentication
- Storage
- Realtime
- Edge Functions
- Vector database
Waarom Supabase + AI Perfect Combo
- AI helpt met complexe database dingen
Skills voor Supabase
- "supabase-postgres-best-practices" skill
Database Design met AI + Skills
- Natuurlijke taal → genormaliseerd schema
Row Level Security (RLS)
- RLS policies met AI + Skills
- Waarom RLS belangrijk is
TypeScript Types
- Supabase CLI auto-genereert types van database
Supabase Client
- Setup
- Basis CRUD operaties
- Realtime subscriptions intro
- Supabase Storage intro
Focus
AI + Skills doen zwaar werk, jij leert concepten
Tools
- OpenCode/WebStorm
- Supabase
- supabase-postgres-best-practices skill
- Next.js
Lesopdracht (2 uur)
Deel 1: Supabase Skills Setup (10 min)
- Installeer "supabase-postgres-best-practices" skill in OpenCode/WebStorm
- Maak gratis Supabase project
- Bewaar credentials
Deel 2: Bouw Todo App Backend (1u 50min)
Database Schema met AI + Skill (30 min):
- Prompt: "Ontwerp database schema voor todo app met users, todos (title, description, due_date, priority, completed), categories, proper relationships."
RLS Policies met AI + Skill (30 min):
- Prompt: "Maak RLS policies: users kunnen alleen hun eigen todos zien/bewerken."
Next.js Integratie (50 min):
- Setup Supabase client
- Bouw UI:
- Create todo
- List todos
- Complete/delete
- Filter by category
- Implementeer CRUD met error handling
- Test of RLS werkt
Huiswerk (2 uur)
Extend Todo App
Nieuwe Features:
- Categories systeem - create/assign/filter, colors
- User profile pagina - avatar upload naar Storage, display name
- Stats dashboard - completed vs incomplete charts, trends
Deployment:
- Deploy naar Vercel met proper env vars
Reflectie (400 woorden)
Schrijf over:
- Verschil in security/quality met vs zonder Supabase skill?
- Nieuwe patterns geleerd?
- Queries die je fout zou schrijven zonder AI?
- Zou je backend bouwen zonder AI hulp?
Leerdoelen
Na deze les kan de student:
- Supabase project opzetten en configureren
- Database schema's ontwerpen met AI + Skills
- Row Level Security (RLS) policies implementeren
- TypeScript types genereren van database
- CRUD operaties implementeren met Supabase client
- De supabase-postgres-best-practices skill effectief gebruiken