fix: add lesson 2

Les02-OpenCode/Les02-Bijlage-B-Huiswerkopdracht.md

@@ -0,0 +1,174 @@
+# Les 2 - Huiswerkopdracht
+
+**Deadline:** Voor les 3
+
+---
+
+## Opdracht 1: Nieuw Project vanaf Scratch (2 uur)
+
+In de les heb je een bestaand project uitgebreid. Nu ga je een **nieuw project** maken met OpenCode.
+
+### Stap 1: Maak een nieuw React project
+
+```bash
+npx create-next-app@latest mijn-nieuwe-project
+cd mijn-nieuwe-project
+npm run dev
+```
+
+Kies bij de prompts:
+- TypeScript: Yes
+- Tailwind CSS: Yes
+- App Router: Yes
+
+### Stap 2: Configureer OpenCode
+
+```bash
+opencode
+```
+
+Selecteer OpenCode Zen → GLM 4.7 (gratis).
+
+### Stap 3: Bouw minimaal 3 componenten
+
+Gebruik Plan mode om te ontwerpen, Build mode om te bouwen.
+
+**Verplichte componenten:**
+
+#### 1. Header/Navbar
+- Logo
+- Navigatie links
+- CTA button
+- Mobile hamburger menu (werkend!)
+
+#### 2. Hero Section
+- Headline
+- Subtitle
+- 1-2 buttons
+- Achtergrond (gradient of afbeelding)
+
+#### 3. Kies één:
+
+**Optie A: Feature Cards**
+- Minimaal 3 cards
+- Icon, titel, beschrijving per card
+- Responsive grid
+
+**Optie B: Testimonials**
+- Minimaal 2 testimonials
+- Quote, naam, foto placeholder
+- Mooie styling
+
+**Optie C: Pricing Table**
+- 3 pricing tiers
+- Features per tier
+- Highlight recommended
+
+### Stap 4: Push naar GitHub
+
+**Anders dan bij v0!** Bij v0 was Vercel automatisch gekoppeld. Nu moet je dit handmatig doen.
+
+#### 4a. Maak GitHub repository
+
+1. Ga naar github.com
+2. Klik "+" → "New repository"
+3. Naam: bijvoorbeeld `mijn-nieuwe-project`
+4. **Public** aanvinken
+5. Klik "Create repository"
+
+#### 4b. Push je code
+
+GitHub toont instructies. Voer uit in je projectmap:
+
+```bash
+git remote add origin https://github.com/JOUW-USERNAME/mijn-nieuwe-project.git
+git branch -M main
+git push -u origin main
+```
+
+**Of met GitHub Desktop:**
+1. File → Add Local Repository
+2. Selecteer je projectmap
+3. Publish repository
+
+---
+
+### Stap 5: Koppel aan Vercel
+
+1. Ga naar vercel.com (log in met GitHub)
+2. Klik "Add New..." → "Project"
+3. "Import Git Repository"
+4. Selecteer je nieuwe repo
+5. Framework: Next.js (automatisch gedetecteerd)
+6. Klik "Deploy"
+
+**Na ~1 minuut:** Je website is live!
+
+**Tip:** Elke volgende `git push` wordt automatisch gedeployed.
+
+---
+
+## Opdracht 2: Reflectie (300 woorden)
+
+Schrijf over je OpenCode ervaring.
+
+### Beantwoord deze vragen:
+
+1. **Les vs Huiswerk**
+   - Wat was het verschil tussen werken met een bestaand project (les) en een nieuw project (huiswerk)?
+   - Wat vond je makkelijker/moeilijker?
+
+2. **Plan vs Build mode**
+   - Hoe heb je Plan mode gebruikt?
+   - Wanneer switch je naar Build?
+
+3. **Vergelijking met v0**
+   - Hoe verschilt OpenCode van v0.dev?
+   - Wat zijn voor- en nadelen van beide?
+
+4. **Workflow**
+   - Hoe vaak heb je gepusht naar Vercel?
+   - Wat is je ideale workflow geworden?
+
+5. **Tips voor jezelf**
+   - Welke shortcuts gebruik je het meest?
+   - Wat zou je volgende keer anders doen?
+
+---
+
+## Inleveren via Teams
+
+1. **Link naar live website** (Vercel URL)
+2. **Link naar GitHub repository**
+3. **Screenshots** van je 3 componenten (desktop + mobile)
+4. **Reflectie** als tekst of document
+
+---
+
+## Beoordeling
+
+| Onderdeel | Punten |
+|-----------|--------|
+| Header/Navbar compleet + responsive | 2 |
+| Hero Section compleet | 2 |
+| Derde component compleet | 2 |
+| Deployed op Vercel | 1 |
+| Reflectie (inhoud + inzicht) | 3 |
+| **Totaal** | **10** |
+
+---
+
+## Bonus (optioneel)
+
+- [ ] Voeg meer dan 3 componenten toe
+- [ ] Implementeer dark mode
+- [ ] Voeg animaties toe met Framer Motion
+- [ ] Maak meerdere pagina's
+
+---
+
+## Hulp nodig?
+
+- Check de OpenCode documentatie: opencode.ai/docs
+- Bekijk de les slides nogmaals
+- Stel vragen in Teams