# Les 2: AI Code Assistants en OpenCode Desktop App

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

---

## Hoofdstuk
**Hoofdstuk 1: Fundamentals** (Les 1-3)

## Beschrijving
Introductie tot standalone AI coding tools. OpenCode als eerste hands-on ervaring met AI-geïntegreerde development.

---

## Te Behandelen

### Theorie
- Verschil tussen chat-interfaces en geïntegreerde development tools
- OpenCode als standalone desktop applicatie (geen IDE nodig)
- Installatie en configuratie met gratis modellen (Ollama lokaal of Groq API)
- Interface verkenning: code editor, chat sidebar, terminal, file browser
- Best practices voor code generation prompts
- Iteratief werken met AI
- Wanneer welk model gebruiken (snelheid vs kwaliteit)

### Praktijk
- OpenCode installeren en configureren
- Gratis modellen testen (Ollama lokaal OF Groq API)
- Interface verkennen
- Component bouwen met AI assistance

---

## Tools
- OpenCode (standalone)
- Ollama/Groq API
- Vercel

---

## Lesopdracht (2 uur)

**Deel 1: Setup (45 min)**
- Installeer OpenCode desktop app
- Koppel een gratis model: Ollama lokaal OF Groq API
- Test beide opties en kies wat voor jou werkt

**Deel 2: Interface Verkenning**
- Probeer code completion
- Test chat functionaliteit
- Terminal commands
- File operations

**Deel 3: Component Bouwen (1u 15min)**
- Bouw een complete responsive navbar component
- Mobile hamburger menu
- Alleen met AI assistance via OpenCode

**Documentatie:**
- Aantal prompts gebruikt
- Iteraties nodig
- Wat werkte goed/niet
- Hoeveel tijd bespaard vs handmatig coderen

---

## Huiswerk (2 uur)

**Component Library Bouwen:**
Bouw een volledige landing page component library met OpenCode:
- Hero section
- Features section (3 cards met icons)
- Testimonial card
- CTA section met button
- Footer

**Vereisten:**
- Alles responsive met Tailwind CSS
- Test op mobile en desktop

**Blog Post (300 woorden):**
Schrijf over je ervaring:
- Wat ging goed/fout
- Limitations van gratis modellen vs betaalde
- Hoe voelt AI-assisted coding met OpenCode standalone app
- Zou je dit blijven gebruiken?

---

## Leerdoelen
Na deze les kan de student:
- OpenCode installeren en configureren
- Gratis AI modellen gebruiken (Ollama/Groq)
- De OpenCode interface effectief gebruiken
- Components bouwen met AI assistance
- Het verschil begrijpen tussen chat-interfaces en geïntegreerde tools