Claude Code voor beginners: je eerste project

Voor een eerste project kies je iets kleins dat je in één keer kunt overzien. In deze tutorial maken we een persoonlijke takenlijst: een webpagina waarop je taken toevoegt, afvinkt en verwijdert. Het is klein genoeg om in een uur af te hebben, en groot genoeg om te zien hoe je met Claude Code samenwerkt.

Heb je liever een ander idee, zoals een pagina voor je bedrijf of een rekentool? Prima. De stappen zijn precies hetzelfde. Zorg wel dat Claude Code al geïnstalleerd is en dat je bent ingelogd. Zo niet, volg dan eerst de handleiding Claude Code installeren.

1. 1

   Maak een lege map

   Maak een nieuwe map aan, bijvoorbeeld takenlijst op je bureaublad. Een eigen map per project houdt alles overzichtelijk en zorgt dat Claude Code alleen in die map werkt.

2. 2

   Open de terminal in die map

   Open Terminal (Mac) of PowerShell (Windows). Typ cd en een spatie, sleep de map in het venster en druk op Enter. Werk je met de desktop-app, kies dan daar de map.

3. 3

   Start Claude Code

   Typ claude en druk op Enter. Claude Code start op en wacht op je opdracht.

4. 4

   Geef je eerste opdracht

   Typ in gewone taal wat je wilt. Hieronder staat een voorbeeld dat je kunt overnemen.

5. 5

   Geef toestemming

   Claude Code laat zien welke bestanden het wil maken en vraagt of dat mag. Lees kort wat het van plan is en keur het goed.

6. 6

   Bekijk het resultaat

   Open het bestand dat Claude Code heeft gemaakt in je browser, of vraag Claude Code hoe je het kunt openen. Probeer alles uit.

Een goede eerste opdracht is kort, maar zegt wel wat je wilt, voor wie het is en wat er in ieder geval in moet. Je kunt deze tekst letterlijk overnemen:

Maak een eenvoudige webpagina waarop ik mijn taken voor vandaag kan bijhouden. Ik wil een taak kunnen toevoegen, afvinken als hij klaar is en verwijderen. De taken moeten bewaard blijven als ik de pagina ververs. Houd het simpel: één HTML-bestand met een rustige, nette vormgeving. Leg na afloop in een paar zinnen uit hoe ik de pagina open.

Merk op dat je niets technisch hoeft te weten. Je beschrijft wat de pagina moet kunnen, en Claude Code kiest hoe het dat bouwt. Wil je weten waarom het iets op een bepaalde manier doet, dan vraag je dat gewoon.

De eerste versie is bijna nooit precies wat je in je hoofd had. Dat is normaal en hoort bij het werken met AI. Het bijsturen is waar je echt bepaalt hoe je project wordt.

Een paar voorbeelden van goede vervolgopdrachten:

• Maak de knop om een taak toe te voegen groter en zet hem naast het invoerveld.
• Als ik op Enter druk in het invoerveld, moet de taak ook worden toegevoegd.
• Zet afgevinkte taken onderaan de lijst en maak ze grijs.
• Er gebeurt niets als ik op verwijderen klik. Kun je uitzoeken waarom en het oplossen?
• Leg uit wat je net hebt veranderd, in gewone taal.

Vraag steeds één ding tegelijk en kijk na elke wijziging of het werkt. Gaat er iets mis, beschrijf dan wat je ziet en wat je had verwacht. Krijg je een foutmelding, kopieer die dan letterlijk naar Claude Code.

• Begin klein

  Bouw eerst de kern van je idee. Extra functies voeg je later één voor één toe.

• Lees wat Claude Code voorstelt

  Je hoeft de code niet te begrijpen, maar lees wel de uitleg. Zo leer je snel hoe je project in elkaar zit.

• Test na elke stap

  Probeer na elke wijziging uit of alles nog werkt. Dan weet je precies welke stap een probleem veroorzaakte.

• Vraag om uitleg

  Snap je iets niet, vraag het. Claude Code legt het in gewone taal uit, ook in het Nederlands.

• Bewaar tussenversies

  Werkt iets goed, bewaar dan een versie. Later leer je dat met GitHub te doen, zodat je altijd terug kunt.

• Neem pauze bij frustratie

  Blijft iets misgaan, beschrijf het probleem dan opnieuw en rustig, of begin een nieuw gesprek met een frisse uitleg.

Als je takenlijst werkt, heb je de basis van vibe coding te pakken: beschrijven, controleren, bijsturen. Daarna kun je groter gaan denken. Een website voor je bedrijf, een tool die gegevens in een database bewaart of een app voor je telefoon.

Bij grotere projecten komen er nieuwe dingen bij kijken, zoals gegevens bewaren in een database, je code bewaren met versiebeheer en je project online zetten. In de cursus vibe coding werken we daarvoor met Prisma Postgres als online database en met GitHub om je code te bewaren en online te zetten.