# Les 16: Building AI-Powered Features & Workflow Automation

> 📋 **Lesmateriaal nog niet uitgewerkt**
>
> De volgende bestanden worden gegenereerd wanneer deze les wordt uitgewerkt:
> - Les16-Slide-Overzicht.md
> - Les16-Lesplan.md
> - Les16-Bijlage-A-Lesopdracht.md
> - Les16-Bijlage-B-Huiswerkopdracht.md

---

## Hoofdstuk
**Hoofdstuk 3: Advanced** (Les 8-18)

## Beschrijving
Integreer AI mogelijkheden in apps.

---

## Te Behandelen

### AI APIs Overzicht
- OpenAI API
- Anthropic API
- Pricing
- Rate limits

### Veel Voorkomende AI Features
- Tekst generatie
- Samenvatting
- Chatbots
- Semantische zoeken
- Aanbevelingen
- Sentiment analyse
- Vertaling

### API Integratie Patterns
- Streaming responses
- Error handling
- Caching
- Prompt optimalisatie

### API Keys Verbergen

⚠️ **NOOIT in frontend!**

**Gebruik Supabase Edge Functions:**
- Server-side
- Keys in env vars
- Verify requests (auth)
- Rate limiting

### Streaming UI
- Toon AI responses real-time
- Vercel AI SDK of manual

### Cost Management
- Tokens tellen
- Cache queries
- Goedkopere modellen
- Monitor spend

### Workflow Automation
- n8n/Pipedream intro

### Praktische Automations
- Form → AI → Supabase
- Cron → data → AI → email
- GitHub webhook → AI → Slack

### Integration Patterns met Supabase

### Cursor voor Snelle API Integratie

---

## Tools
- Supabase Edge Functions
- OpenAI/Anthropic API
- n8n/Pipedream
- Cursor

---

## Lesopdracht (2 uur)

Bouw 2 features: 1 AI-powered app feature + 1 workflow automation

### Deel 1: AI Feature (1 uur)

**Kies 1 met Cursor:**

| Optie | Beschrijving |
|-------|-------------|
| A | AI Blog Post Generator |
| B | Smart Summarizer |
| C | AI Writing Assistant |
| D | Intelligent Search |

**Implementeer via Supabase Edge Function**

### Deel 2: Workflow Automation (1 uur)

**Kies n8n OF Pipedream**

**Bouw 1:**

| Optie | Flow |
|-------|------|
| A | Smart Form Processor |
| B | Daily AI Summary |

**Test end-to-end**

### Deliverable
- Beide features deployed + working + gedocumenteerd

---

## Huiswerk (2 uur)

### Polish & Extend AI Feature

### Deel 1: UX (30 min)
- Streaming
- Copy button met toast
- History (Supabase)
- Loading skeletons
- Empty states
- Keyboard shortcuts

### Deel 2: Monitoring & Safety (30 min)
- Request logging
- Usage dashboard
- Rate limiting
- Content filtering
- Timeout handling

### Deel 3: Documentation (30 min)
- API docs
- User guide
- Add to Starter Template

### Deel 4: Build 2 Automations voor Eindopdracht (30 min)
- 2 n8n/Pipedream automations die echt helpen

### Deliverable
- Production AI feature
- Automations
- Docs
- Reflectie (300 woorden)

---

## Leerdoelen
Na deze les kan de student:
- AI APIs integreren (OpenAI, Anthropic)
- API keys veilig verbergen via Edge Functions
- Streaming UI implementeren
- Kosten beheren en monitoren
- Workflow automation tools gebruiken (n8n/Pipedream)
- Praktische AI-powered features bouwen