fix: add lesson files
This commit is contained in:
145
Samenvattingen/Les14-Samenvatting.md
Normal file
145
Samenvattingen/Les14-Samenvatting.md
Normal file
@@ -0,0 +1,145 @@
|
||||
# Les 14: Supabase Advanced - Realtime, Storage & Edge Functions
|
||||
|
||||
## Hoofdstuk
|
||||
**Hoofdstuk 3: Advanced** (Les 8-18)
|
||||
|
||||
## Beschrijving
|
||||
Geavanceerde Supabase features voor productie apps.
|
||||
|
||||
---
|
||||
|
||||
## Te Behandelen
|
||||
|
||||
### Realtime Subscriptions
|
||||
- Hoe Postgres broadcasts
|
||||
- Subscriben op table changes
|
||||
- Channel-based real-time (presence, broadcast)
|
||||
- Collaborative features
|
||||
- Reconnections handlen
|
||||
|
||||
### Supabase Storage
|
||||
- File uploads (images, PDFs)
|
||||
- Buckets organiseren
|
||||
- Image transformations (resize, format, quality)
|
||||
- Signed URLs
|
||||
- Storage RLS policies
|
||||
|
||||
### Edge Functions Deep Dive
|
||||
- Deno runtime
|
||||
- TypeScript
|
||||
- At edge
|
||||
- Waarom gebruiken:
|
||||
- Hide API keys
|
||||
- Server-side logic
|
||||
- Scheduled tasks
|
||||
- Webhooks
|
||||
|
||||
### AI Integratie Patterns
|
||||
- Call OpenAI/Anthropic veilig
|
||||
- Streaming responses
|
||||
|
||||
### Praktische Patterns
|
||||
- Form processing
|
||||
- Emails
|
||||
- Data verrijking
|
||||
|
||||
### Authentication Advanced
|
||||
- Social logins (Google, GitHub, Discord)
|
||||
- Magic links
|
||||
- Email confirmatie
|
||||
- Password reset
|
||||
- Session management
|
||||
|
||||
### Error Handling & Debugging
|
||||
- Supabase error messages
|
||||
- RLS debuggen
|
||||
- Logging
|
||||
|
||||
### Cursor Composer
|
||||
- Voor complexe multi-feature development
|
||||
|
||||
---
|
||||
|
||||
## Tools
|
||||
- Supabase (Realtime, Storage, Edge Functions)
|
||||
- Cursor
|
||||
- OpenAI/Anthropic API
|
||||
|
||||
---
|
||||
|
||||
## Lesopdracht (2 uur)
|
||||
|
||||
### Level Up Todo App met 3 Advanced Features (met Cursor)
|
||||
|
||||
### Feature 1: Realtime Collaboration (40 min)
|
||||
|
||||
Real-time updates wanneer user A/B changes:
|
||||
- Subscribe
|
||||
- Update UI
|
||||
- Show "live" indicator
|
||||
- Handle reconnection
|
||||
|
||||
**Test met multiple windows**
|
||||
|
||||
### Feature 2: File Attachments met Storage (40 min)
|
||||
|
||||
Attach files (images/PDFs):
|
||||
- Upload button
|
||||
- Thumbnail voor images (transformations)
|
||||
- Download voor PDFs
|
||||
- Delete optie
|
||||
- Proper RLS
|
||||
|
||||
### Feature 3: AI-Powered Task Suggestions met Edge Function (40 min)
|
||||
|
||||
"Suggest Subtasks" button:
|
||||
- Edge Function
|
||||
- OpenAI/Anthropic API (hide key)
|
||||
- AI returns 3-5 subtasks
|
||||
- Auto-create in database
|
||||
- Stream results
|
||||
|
||||
**Use Cursor Composer voor alle 3 features orchestreren**
|
||||
|
||||
---
|
||||
|
||||
## Huiswerk (2 uur)
|
||||
|
||||
### Bouw Production-Ready Supabase Starter Template
|
||||
|
||||
**Use Cursor Composer + Skills**
|
||||
|
||||
### Include:
|
||||
|
||||
| Feature | Details |
|
||||
|---------|---------|
|
||||
| Complete Auth | Email + Google, protected routes HOC, profile met avatar |
|
||||
| Database Examples | Schema met relationships, RLS gedocumenteerd, types auto-generated |
|
||||
| Realtime Demo | Chat of live updates |
|
||||
| Storage Demo | Upload met preview, optimization |
|
||||
| Edge Function | Met AI, error handling, rate limiting |
|
||||
| Documentation | Setup, env vars, extend, patterns, troubleshooting |
|
||||
|
||||
### Structureer als GitHub Template
|
||||
|
||||
**Test:**
|
||||
- Clone
|
||||
- Rename
|
||||
- Deploy naar Vercel
|
||||
- Aim: <10 min
|
||||
|
||||
### Deliverable
|
||||
- Template repo
|
||||
- Setup video
|
||||
- Reflectie
|
||||
|
||||
---
|
||||
|
||||
## Leerdoelen
|
||||
Na deze les kan de student:
|
||||
- Realtime subscriptions implementeren voor collaborative features
|
||||
- Supabase Storage gebruiken met transformations en RLS
|
||||
- Edge Functions schrijven met AI integratie
|
||||
- Advanced authentication implementeren (social, magic links)
|
||||
- Errors debuggen in Supabase (RLS, queries)
|
||||
- Een production-ready Supabase starter template bouwen
|
||||
Reference in New Issue
Block a user