10 min Beginner Gratis

Je eerste project bouwen

In de vorige les heb je Claude Code gestart en een vraag gesteld. Nu gaan we iets veel indrukwekkenders doen: een complete website bouwen — met één zin. Kijk maar:

Demo: Claude Code bouwt een bakkerij website met één prompt

En dit is het eindresultaat:

🥐
Bakkerij “De Gouden Korst”

Een complete website — gebouwd met één prompt. Klik om te bekijken.

→

Klaar? Laten we het stap voor stap doen.

Stap 1: Maak een projectmap

Elk project begint met een eigen map. Open je terminal en typ:

mkdir bakker
cd bakker
Terminal — Mac
~$ mkdir bakker
~$ cd bakker
~/bakker$

Stap 2: Start Claude Code

claude

Het welkomstscherm verschijnt — je kent dit al van de vorige les.

Stap 3: Bouw een website — met één zin

Nu komt het magische moment. Kopieer deze prompt en plak hem in Claude Code:

Maak een simpele website voor bakkerij "De Gouden Korst" met openingstijden, een paar producten en een warm design. Eén HTML bestand is genoeg.
Let op

Druk op Enter en wacht. Claude gaat nu nadenken, een plan maken, en de code schrijven. Dit duurt 1-2 minuten.

Terwijl je wacht, gebeurt dit achter de schermen:

  1. Claude bedenkt een plan voor de website
  2. Claude schrijft de HTML, CSS en inhoud
  3. Claude maakt het bestand index.html aan in je map

Stap 4: Bekijk je website!

Je website is klaar! Vraag Claude om hem te openen:

Open de website die je net hebt gemaakt in mijn browser

Claude opent je browser en je ziet het resultaat. Jij hebt dit net gebouwd — met één zin.

Tip

Jouw website ziet er anders uit dan die van ons — en dat is prima! Claude maakt elke keer iets unieks. Wil je vergelijken? Bekijk ons voorbeeld.

Wil je iets aanpassen?

Niet helemaal tevreden? Vraag het gewoon:

Verander de achtergrondkleur naar warm beige en voeg een banner toe met "Vers gebakken, elke ochtend"

Claude past de code aan en je ziet het resultaat direct. Je hoeft nooit zelf in de code te kijken. Dit is vibe coding — je beschrijft wat je wilt, Claude bouwt het.

Het werkproces

Wat je net deed volgt een patroon dat je bij elk project gaat gebruiken:

  1. Jij beschrijft wat je wilt
  2. Claude maakt een plan
  3. Claude schrijft de code
  4. Jij bekijkt het resultaat
  5. Jij geeft feedback → Claude past aan
  6. Herhaal tot je tevreden bent

Werk opslaan (optioneel)

Tevreden? Je kunt Claude vragen om je werk op te slaan met Git:

Sla alles op met git. Commit message: "Eerste versie bakkerij site"

Experimenteer!

Probeer nu zelf nog een project:

  • Een receptenwebsite — met een lijst van je favoriete gerechten
  • Een quiz — stel zelf de vragen
  • Een countdown timer — tel af naar een evenement

Hoe meer je experimenteert, hoe beter je wordt in het geven van goede prompts.

Checkpoint bereikt!

Wat je nu moet kunnen:

Je hebt:

  • Een complete bakkerij-website gebouwd met één prompt
  • Het resultaat bekeken in je browser
  • Het werkproces geleerd: beschrijven → plan → code → resultaat → feedback
  • (Optioneel) Je werk opgeslagen met Git

Dit is de basis voor alles wat komt in deze cursus.