78 lines
2.2 KiB
Markdown
78 lines
2.2 KiB
Markdown
# Les 11: Vercel AI SDK — Praat met je eigen data
|
|
|
|
> ✅ **Deze les is volledig uitgewerkt**
|
|
|
|
## Lesmateriaal
|
|
|
|
- [Slide Overzicht](../Les11-AI-SDK/Les11-Slide-Overzicht.md)
|
|
- [Docenttekst](../Les11-AI-SDK/Les11-Docenttekst.md)
|
|
- [Lesstof](../Les11-AI-SDK/Les11-Lesstof.md)
|
|
- [Lesopdracht](../Les11-AI-SDK/Les11-Lesopdracht.md)
|
|
- [Huiswerk](../Les11-AI-SDK/Les11-Huiswerk.md)
|
|
|
|
---
|
|
|
|
## Deel
|
|
**Deel 3 — AI Development** (Les 11-16)
|
|
|
|
## Beschrijving
|
|
Eerste echte AI-les. We bouwen een Next.js-app from scratch, koppelen Supabase, seeden 500 fictieve bands van het "Polderfest 2027" festival en laten studenten met natuurlijke taal vragen stellen aan hun eigen data via de Vercel AI SDK.
|
|
|
|
---
|
|
|
|
## Te Behandelen
|
|
|
|
### Theorie
|
|
- Waarom een AI SDK i.p.v. de OpenAI API direct
|
|
- De vier kern-functies: `generateText`, `streamText`, `generateObject`, `streamObject`
|
|
- Provider-agnostic werken (OpenAI ↔ Anthropic ↔ Google ↔ Groq)
|
|
- Streaming en de UX-impact
|
|
- "Praat met je data": pattern voor LLM + database
|
|
|
|
### Live demo's (klassikaal)
|
|
1. Next.js scaffold + Supabase koppelen
|
|
2. Seed-script met 500 fictieve bands
|
|
3. AI SDK installeren + eerste chat-route met `streamText`
|
|
4. `useChat` hook + vragen stellen aan de data
|
|
|
|
---
|
|
|
|
## Tools
|
|
- Vercel AI SDK v6
|
|
- Next.js 16 + Server Actions
|
|
- Supabase (Postgres + seed-script)
|
|
- OpenAI / Anthropic providers
|
|
- Polderfest-demo (in repo: `Les11-AI-SDK/polderfest-demo`)
|
|
|
|
---
|
|
|
|
## Lesopdracht (in-class, 60 min)
|
|
|
|
Studenten kijken klassikaal mee tijdens de demo's. In-class oefening:
|
|
- Maak een eigen API key bij OpenAI of Groq
|
|
- Test de demo lokaal: kun je vragen stellen aan de Polderfest-data?
|
|
- Wijzig de system prompt: laat de AI antwoorden als een festival-roadie
|
|
|
|
**Inleveren:** Screenshot van werkende lokale demo.
|
|
|
|
---
|
|
|
|
## Huiswerk (take-home)
|
|
|
|
Bouw een eigen "praat met je data" mini-app:
|
|
- Eigen dataset (eigen interesse, min. 50 records)
|
|
- Werkende chat-UI via AI SDK
|
|
- Deploy naar Vercel
|
|
- README met setup-stappen
|
|
|
|
**Inleveren:** GitHub URL + Vercel URL via Teams.
|
|
|
|
---
|
|
|
|
## Leerdoelen
|
|
Na deze les kan de student:
|
|
- Een Next.js-app koppelen aan Supabase + AI SDK
|
|
- Streaming chat implementeren met `streamText` + `useChat`
|
|
- Een eigen dataset seeden en die met een LLM bevragen
|
|
- Het verschil uitleggen tussen direct OpenAI calls en de AI SDK
|