Claude Code Tutorial: Van Nul naar Eerste Build
De eerste keer dat ik Claude Code vanuit de terminal draaide, gaf ik het één regel instructie en keek toe hoe het in ongeveer vier minuten een werkend 2D-spel genereerde.
Geen speelgoeddemo. Een speelbare top-down shooter — HTML, CSS, JavaScript, game loop, collision detection, het hele pakket — zat in mijn projectmap en draaide in een browser voordat ik mijn koffie op had.
Ik codeer al jaren professioneel. Ik weet hoe lang het duurt om iets te bouwen dat echt werkt vanaf nul. Vier minuten is dat niet. Vier minuten is iets anders.
Wat me verraste was niet de snelheid — ik verwachtte dat AI snel zou zijn. Wat me overrompelde was hoe gestructureerd het proces aanvoelde. Claude dumpte niet zomaar code op me. Het planste eerst, stelde de architectuur voor, wachtte op mijn bevestiging, en bouwde het vervolgens methodisch. De output was georganiseerd, leesbaar en gedocumenteerd. Geen vibe-gecodeerd rommel dat technisch werkt maar structureel nergens op slaat.
Die kloof tussen wat ik verwachtte en wat ik kreeg, is precies waarom ik deze gids wilde schrijven. De meeste Claude Code-tutorials richten zich op ontwikkelaars die het gereedschap al kennen, of slaan te snel de delen over die mensen daadwerkelijk laten struikelen.
Deze niet. Of je nu nog nooit een terminal hebt geopend of je een ontwikkelaar bent die over Claude Code heeft gehoord maar er nooit goed mee aan de slag bent gegaan — dit behandelt wat je echt moet weten, in de volgorde waarin je het moet weten.
Één ding dat ik nu vermeld en later terugkeer: er is een persistente geheugensfunctie waar bijna niemand over praat in beginnerstrends, en het is waarschijnlijk het allerbelangrijkste om in te stellen vóór je eerste echte project. Houd dat in gedachten terwijl je verder leest.
Wat Claude Code Eigenlijk Is (En Wat Het Niet Is)
Vóór de setup telt het mentale model. Claude Code wordt veel beschreven als "een AI-coding-assistent" — wat accuraat is maar onderschat wat het anders maakt.
De meeste AI-coding-gereedschappen zijn geïntegreerd in editors. Je schrijft code, de AI suggereert aanvullingen of beantwoordt vragen in een zijbalk. De workflow is mensgestuurd; de AI assisteert. Claude Code draait dit om. Je beschrijft wat je wilt bouwen in natuurlijke taal, en de AI genereert, wijzigt en beheert de codebase. Je geeft richting, je typt niet.
Het is een CLI-gereedschap — een opdrachtregelinterface — wat betekent dat het binnen je terminal draait. Geen desktop-app met knoppen en menu's. Een terminalprompt waar je instructies typt en Claude bouwt. Het terminal-eerste ontwerp is opzettelijk: het houdt Claude Code dichtbij waar code echt leeft en geeft het directe toegang tot je bestandssysteem, draaiende processen en shell-commando's.
Anthropic heeft een aparte desktop-app voor Claude — een visuele interface met chatmodus, codemodus en GitHub-integratie. Dat gereedschap is uitstekend voor beginners die een gentlere instap willen. Maar de CLI is waar de echte kracht zit, en deze gids richt zich daarop.
Claude Code vereist een betaald Claude-abonnement: Pro, Max, Teams of Enterprise. Je kunt ook een API-sleutel met credits gebruiken. Een eerlijke opmerking over kosten: zwaar gebruik verbrandt credits sneller dan je verwacht, vooral bij complexe projecten met het krachtigste model. Beginnen met een goedkoper plan en upgraden zodra je je gebruikspatronen kent, is de verstandige keuze.
De beschikbare modellen — Opus, Sonnet en Haiku — zijn niet alleen kwaliteitslagen. Het zijn verschillende gereedschappen voor verschillende taken. Opus voor complexe architectuur en multi-bestandredenering, Sonnet voor gebalanceerd middelmatig werk, Haiku voor snelle iteratie bij eenvoudige taken. Je wisselt er tijdens een sessie tussen met /model. Begrijpen welk model je moet pakken, ontwikkel je met gebruik, niet iets wat je vooraf uitzoekt.
Instellen: Het Deel Dat Elke Tutorial Te Snel Voorbijgaat
Installatie is via de terminal. Windows-gebruikers openen PowerShell; Mac- en Linux-gebruikers gebruiken Terminal. Het exacte installatiebevel verschilt per besturingssysteem en staat in de documentatie van Anthropic — ik plak hier geen commando dat verouderd kan zijn tegen de tijd dat je dit leest.
Na de installatie authenticeer je via je Anthropic- of Claude-account in de browser. Dat deel is eenvoudig.
De stap die veel beginners struikelblok is: wanneer je voor het eerst naar een projectmap navigeert, zal Claude Code vragen of je die map vertrouwt. Dit is een beveiligingscontrole — je vertelt Claude Code expliciet dat het toestemming heeft om bestanden op die locatie te lezen en te wijzigen. Sla dit niet achteloos voorbij. Begrijp in welke map je bent en wat je toegang verleent.
Nu — voordat je iets anders doet — installeer Git.
Ik zeg dit met nadruk omdat het de meest consequente setup-stap is en de stap die de meeste tutorials als optioneel behandelen. Dat is het niet. Werken met AI-gegenereerde code zonder versiebeheer is een specifiek soort pijn: de AI produceert iets wat werkt, je itereert erop, iets breekt, en je hebt geen manier om terug te keren naar de werkende toestand.
Git is het checkpointsysteem. Elke keer dat je een toestand bereikt die je bevalt, doe je een commit. Als iets breekt — AI-hallucinatie, slechte instructie, onverwacht randgeval — draai je terug. Claude Code kan helpen met Git-installatie als je niet bekend bent met de terminal, inclusief het verwerken van de beheerdersrechtenverzoeken die op Windows opduiken.
Nadat Git lokaal is ingesteld, koppel je het aan een gratis GitHub-account met gh auth login. Claude kan dit commando voor je uitvoeren. Wat je krijgt: je code is op afstand geback-upt, een geschiedenis van elke werkende toestand, en de mogelijkheid om te delen of samen te werken als je wilt. Deze setup duurt misschien vijftien minuten en bespaart je later uren pijn.
Claude Code koppelen aan een code-editor maakt de setup compleet. VS Code en Cursor werken beide goed. De workflow is: open je projectmap in de editor, gebruik de geïntegreerde terminal van de editor om Claude Code te draaien, en kijk hoe de bestandsverkenner in real time bijwerkt terwijl Claude bestanden genereert en wijzigt. De visuele laag maakt het proces aanzienlijk leesbaarder dan een ruwe terminal, vooral wanneer je multi-file projecten beheert.
Een praktische tip over het koppelen van de editor: houd de bestandsverkenner en de terminal naast elkaar. Wanneer Claude een nieuw bestand genereert, open het meteen en scan het voordat je de volgende instructie geeft. Je reviewt niet elke regel — je bouwt een mentale kaart van wat er bestaat zodat je volgende instructies accuraat zijn. Claude vertellen om "het header-component bij te werken" wanneer het bestand eigenlijk navbar.jsx heet, verspilt een heen-en-weer. Je bestandsstructuur kennen betekent dat je prompts de eerste keer goed landen.
Cursor heeft hier een licht voordeel boven VS Code omdat zijn eigen AI-integratie vanzelfsprekend naast Claude Code werkt zonder dat de twee elkaar in de weg zitten. Je kunt de inline-suggesties van Cursor gebruiken voor kleine bewerkingen terwijl je Claude Code gebruikt voor alles wat meerdere bestanden of projectbrede redenering betreft. De gereedschappen vullen elkaar aan in plaats van te concurreren.
De Drie Modi Die Veranderen Hoe Je Werkt
Claude Code heeft drie bedrijfsmodi, elk nuttig voor verschillende situaties. Wisselen tussen hen is één Shift + Tab.
Vraagmodus is de standaard. Claude vraagt je om bevestiging voordat het een commando uitvoert of een bestand schrijft. Elke actie vereist je expliciete bevestiging. Dit is de juiste modus voor onbekend terrein — wanneer je werkt in een codebase die je niet hebt gebouwd, aan een taak met een hoog risico op het breken van iets, of op elk moment dat je volledige zichtbaarheid wilt voordat Claude handelt.
Auto-acceptatiemodus (ook wel codermodus genoemd) verwijdert de bevestigingsstap. Claude voert bewerkingen uit en draait commando's automatisch. Het snelheidsvoordeel is reëel: taken die tientallen kleine bestandswijzigingen vereisen, gaan aanzienlijk sneller zonder constante goedkeuringsprompts. Gebruik dit voor projecten die je goed begrijpt en Claude vertrouwt te verwerken, niet voor je eerste sessies met een onbekende codebase.
Planningmodus is degene die de meeste beginners overslaan en de meeste gevorderde gebruikers zweren bij. Voordat er een enkele regel code wordt geschreven, genereert Claude een gedetailleerd plan — de architectuurbenadering, de bestandsstructuur, de implementatievolgorde, de randgevallen die het anticipeert. Je reviewt het plan, wijzigt het indien nodig, en bevestigt dan. Claude bouwt volgens het plan.
Het verschil in outputkwaliteit tussen direct naar codering springen en eerst planningmodus draaien is niet subtiel. De geplande aanpak produceert code die als systeem samenhangt. De spring-er-direct-in aanpak produceert code die werkt voor de beschreven taak en vaak herstructurering nodig heeft op het moment dat je iets vraagt dat aangrenzend is aan het oorspronkelijke verzoek.
Begin voor elk project groter dan een enkel bestand in planningmodus. De paar minuten die het kost om een plan te genereren en te reviewen, betalen zichzelf onmiddellijk terug.
Je Eerste Echte Project: Hoe de Workflow Echt Stroomt
Zo ziet een echte projectsessie eruit van begin tot eind.
Open je terminal (of de geïntegreerde terminal in je editor), navigeer naar de map waar je het project wilt laten leven, en start Claude Code. Vertrouw de map wanneer daarom wordt gevraagd.
Schakel over naar planningmodus met Shift + Tab. Beschrijf je project in natuurlijke taal — wees specifiek over wat je wilt. "Bouw een 2D top-down shooter game" geeft je iets. "Bouw een 2D top-down shooter game in vanilla JavaScript met toetsenbordbesturing, een spelergezondheidssysteem, vijanden die herrijzen nadat ze zijn vernietigd, en een scoreteller weergegeven in de rechterbovenhoek" geeft je iets aanzienlijk beters. Specificiteit is een vaardigheid in AI-ondersteunde ontwikkeling, en het combineert snel.
Claude genereert een plan. Lees het. Lees het echt — scroll niet gewoon naar de onderkant en bevestig. Het plan vertelt je welke aannames Claude maakt. Als je iets ziet dat niet overeenkomt met je intentie, corrigeer het voordat de build begint. Van richting veranderen tijdens een plan kost je dertig seconden. Van richting veranderen nadat twintig bestanden zijn gegenereerd, kost je veel meer.
Bevestig het plan. Kijk toe hoe Claude bouwt.
Het project zal een .claw-map bevatten die Claude gebruikt voor interne tracking. Je hoeft dit niet handmatig te beheren. Je werkelijke projectbestanden verschijnen ernaast. Wanneer de build klaar is, test de output — bij een webproject open je de gegenereerde HTML in een browser en interageer je ermee. Echt testen brengt echte problemen aan het licht die geen hoeveelheid code review vindt.
Itereer van daaruit. "Het herrijzen van vijanden is te snel, voeg een vertraging van drie seconden toe" is een geldige instructie. "Het lettertype van de scoreteller moet overeenkomen met de algemene game-esthetiek" is een geldige instructie. Verfijning in natuurlijke taal werkt gedurende de hele sessie — je hoeft niet over te schakelen naar een coderingsmentaliteit om aanpassingen te maken.
Na een betekenisvolle iteratie — iets werkt zoals je wilt, een functie is voltooid, een bug is opgelost — commit naar Git. Dit duurt tien seconden. git add . dan git commit -m "spelergezondheidssysteem werkt". Claude Code kan dit voor je afhandelen als je de commando's liever niet handmatig typt: vraag het gewoon om de huidige toestand te committen met een beschrijvend bericht en het zal dat doen. De discipline van committen bij stabiele punten is wat productieve AI-ondersteunde ontwikkeling onderscheidt van sessies die eindigen met "Ik moet opnieuw beginnen omdat ik niet terug kan naar wanneer het werkte."
Twee sneltoetsen die je direct moet kennen: Alt + Enter (Windows) of Option + Enter (Mac) voegt een regelafbreking in je prompt in zonder te verzenden. Essentieel voor instructies van meerdere alinea's. Esc Esc (twee snelle drukken) wist de huidige prompt als je je instructie opnieuw wilt beginnen. En @ gevolgd door een bestandsnaam laat je een specifiek bestand verwijzen in je instructie — "update de logica in @game.js om de vijandsnelheid met 20% te verhogen na elke golf" is preciezer dan "update de gamologica," en precisie is wat sessies op koers houdt.
De Functies Die Veranderden Hoe Ik Echt Werk
Persistent geheugen met CLAUDE.md.
Sessies behouden geen onbeperkte context. Wanneer je Claude Code sluit en de volgende dag heropent, begint het opnieuw. Voor een kort script is dit prima. Voor een project dat je aan het bouwen bent over dagen of weken, is het een serieus probleem — elke sessie vereist opnieuw uitleggen wat het project is, welke conventies je gebruikt, welke beslissingen je al hebt genomen.
CLAUDE.md lost dit op. Aangemaakt met het /init-commando (soms weergegeven als /nit in documentatie), is het een markdown-bestand dat in je projectroot leeft en alles opslaat dat Claude nodig heeft om continuïteit te behouden: projectoverzicht, ontwerppatronen, naamgevingsconventies, architectuurbeslissingen, beperkingen, en eventuele voorkeuren voor hoe Claude zich moet gedragen in deze specifieke codebase.
Elke nieuwe sessie leest Claude eerst CLAUDE.md. Het pikt op waar je gebleven was zonder dat je het opnieuw hoeft bij te praten.
Investeer tijd in het schrijven van een goede CLAUDE.md aan het begin van elk multi-sessieproject. Werk het bij wanneer je significante beslissingen neemt tijdens het project. Zie het als de projectbriefing die je zou schrijven voor een nieuw teamlid — uitgebreid genoeg dat iemand zonder eerdere context het systeem zou kunnen begrijpen.
Modelselectie tijdens de sessie.
Het /model-commando laat je op elk moment wisselen tussen Opus, Sonnet en Haiku. Praktisch gebruik: begin planning- en architectuurwerk in Opus waar de redenerkwaliteit het meest telt, schakel over naar Sonnet of Haiku voor de mechanische implementatiestappen waar je gewoon boilerplate genereert of kleine repetitieve wijzigingen maakt. Deze aanpak beheert kosten zonder kwaliteit op te offeren waar kwaliteit telt.
Achtergrondtaken.
Sommige commando's blokkeren de terminal — een lokale ontwikkelserver draaien, kijken naar bestandswijzigingen, een lange bewerking verwerken. Claude Code laat je deze naar de achtergrond duwen zodat je instructies kunt blijven geven terwijl ze draaien. Ctrl + T toont actieve achtergrondtaken; K beëindigt een geselecteerde taak. Dit houdt je workflow ononderbroken in plaats van je te dwingen een tweede terminalvenster te openen voor alles dat continu draait.
Agents en skills.
Agents zijn gespecialiseerde parallelle processen die verschillende delen van een project gelijktijdig verwerken. Eén agent beheert frontend-styling terwijl een andere back-endlogica verwerkt, beide parallel draaiend en terugrapporten naar de hoofdsessie. De MCP-serverintegratie breidt dit verder uit — agents kunnen verbinding maken met Notion, Gmail, Google Drive en andere externe diensten, en echte context uit je daadwerkelijke werkomgeving ophalen.
Skills zijn herhaalbare workflows die je Claude traint om consistent uit te voeren. Als je dezelfde deployvolgorde, dezelfde testroutine of dezelfde contentgeneratieworkflow herhaaldelijk uitvoert, verpakt een skill dat in een herbruikbaar commando. In de loop van de tijd wordt je skills-bibliotheek een persoonlijk automatiseringssysteem gebouwd rond hoe jij echt werkt.
Wat Je Kunt Verwachten vs. Wat de Demo's Laten Zien
Eerlijke beoordeling, want dit telt voordat je tijd investeert in het instellen.
Claude Code is werkelijk indrukwekkend voor goed gedefinieerde taken met duidelijke inputs. Spelgeneratie, API-scaffolding, hulpscripts, documentatiegeneratie, gestructureerde dataverwerking — deze categorieën produceren consistent uitstekende eerste concepten. De planningmodusoutput is coherent en de implementatie volgt hem.
Waar het ingewikkeld wordt: grote bestaande codebases die niet zijn geschreven met AI-ondersteuning in gedachten. Claude Code in een complex legacyproject voeren en het vragen om functies te refactoren of uit te breiden, vereist zorgvuldigere promptconstructie en meer actief toezicht dan iets vanaf nul bouwen. Het contextvenster van het model heeft limieten, en complexe multi-file systemen met diepe onderlinge afhankelijkheden kunnen wat het schoon vasthoudt, overschrijden.
Instructies moeten specifiek zijn. "Maak dit beter" is geen nuttige instructie. "De mobiele lay-out breekt bij 375px — de navigatie overlapt de hero-sectie, herstel de z-index en pas de flex-wrap-regels aan" is een nuttige instructie. De kwaliteit van wat je krijgt, schaalt direct met de specificiteit van wat je invoert. Dit is een vaardigheid die bewuste oefening vereist om te ontwikkelen, en de vroege sessies produceren vaak middelmatige resultaten niet omdat het gereedschap zwak is, maar omdat de prompts vaag zijn.
Creditverbruik bij intensieve sessies loopt op. Complexe multi-file generatie op Opus kan in één middag aanzienlijke credits verbranden. Als je experimenteert zonder een duidelijk projectdoel, doe dat op Haiku. Bewaar Opus voor het werk dat het echt nodig heeft.
En review altijd AI-gegenereerde code voordat je het uitvoert in een omgeving die telt. Niet omdat Claude Code onbetrouwbaar is — de outputkwaliteit is hoog — maar omdat AI-gegenereerde code randgevallen, beveiligingsoverwegingen of aannames over je omgeving kan bevatten die het niet kon weten zonder expliciet te worden verteld. Review is een professionele gewoonte, geen teken dat het gereedschap heeft gefaald.
Het Juiste Mentale Model Opbouwen
De ontwikkelaars die het meeste uit Claude Code halen, delen één eigenschap: ze zijn gestopt met het zien als autocomplete en zijn begonnen het te zien als richting geven.
Een goede regisseur schrijft niet elke dialoogregel. Een goede regisseur heeft een duidelijke visie, communiceert die specifiek, geeft feedback op wat niet werkt, en vormt de prestatie naar iets dat hij alleen niet had kunnen produceren. Dat is de vaardigheid om te ontwikkelen met Claude Code — niet de mogelijkheid om slim te promtten, maar de mogelijkheid om een duidelijke visie te hebben op wat je bouwt, die precies te communiceren en er efficiënt naartoe te itereren.
Beginners die gefrustreerd raken met het gereedschap, proberen het meestal hun gedachten te laten lezen. "Bouw iets cools" levert iets generisch op. "Bouw een persoonlijk financiëel overzicht met wekelijkse bestedingssamenvattingen weergegeven als staafdiagrammen, een eenvoudig categorietagsysteem en CSV-export — geen login vereist, alleen lokale opslag" levert iets op dat je echt kunt gebruiken.
De setup die ik in deze gids heb beschreven — Git-integratie, CLAUDE.md voor persistent geheugen, planningmodus vóór elk substantieel project, modelselectie afgestemd op taaakcomplexiteit — creëert de omstandigheden voor het gereedschap om goed te presteren. Dit zijn geen optionele best practices. Dit is de fundering die alles else laat werken.
Eén ding dat de moeite waard is om vandaag te beginnen: maak een scratch-projectmap, installeer Claude Code, stel Git in, en bouw iets kleins met planningmodus actief. Een to-do-app, een eenvoudige rekenmachine, een statische landingspagina. Niet omdat de output nuttig zal zijn — dat zal het niet, het is een scratch-project — maar omdat de spiermemory van de workflow het werkelijke product van die eerste sessie is. Alles daarna gaat sneller.
De ontwikkelaars die het meest effectief zullen zijn met AI-gereedschappen in de komende jaren zijn niet noodzakelijk de beste programmeurs. Het zijn de mensen die vroeg leerden hoe ze goed richting konden geven.
🤝 Laten We Samenwerken
Wil je AI-systemen bouwen, workflows automatiseren of je tech-infrastructuur schalen? Ik help je graag.
- 🔗 Fiverr (custom builds & integraties): fiverr.com/s/EgxYmWD
- 🌐 Portfolio: mejba.me
- 🏢 Ramlit Limited (zakelijke oplossingen): ramlit.com
- 🎨 ColorPark (design & branding): colorpark.io
- 🛡 xCyberSecurity (beveiligingsdiensten): xcybersecurity.io
