Vibe coding: wat het is en hoe je een echte app bouwt met AI

Vibe coding is software bouwen door in gewone taal te beschrijven wat je wilt en een AI-tool het grootste deel van de code te laten schrijven. Je vraagt om een aanmeldpagina met inloggen via e-mail, de tool schrijft hem, je draait het resultaat en je stuurt bij met het volgende verzoek. Je tijd gaat naar wat de app moet doen, in plaats van naar syntaxis.

Het werkt goed voor prototypes, interne tools en kleine producten, en kan een solomaker in een paar dagen van idee naar een live app brengen. Het gaat ook op voorspelbare manieren mis als niemand de output controleert. Deze gids behandelt de tools, een realistische workflow, kwaliteit en beveiliging, en hoe je je eerste gebruikers krijgt.

Wat is vibe coding?

De term werd begin 2025 bedacht door AI-onderzoeker Andrej Karpathy. Hij beschreef een manier van werken waarbij je volledig op de AI leunt: je accepteert de wijzigingen zonder elke regel te lezen, plakt foutmeldingen gewoon terug en kijkt wat er gebeurt. Hij presenteerde het als prima voor wegwerpprojectjes in het weekend. De term sloeg snel aan en omvat nu elke workflow waarin prompts in gewone taal het meeste programmeerwerk sturen.

In de praktijk is het een spectrum:

• Puur vibe coding. Je leest de code nooit. Goed voor experimenten, demo’s en ontdekken wat er mogelijk is.
• AI-ondersteunde softwareontwikkeling. Jij beschrijft de wijziging, de AI schrijft hem, en jij reviewt, test en commit hem zoals alle andere code. Dit wil je voor alles met echte gebruikers of echte data.

De meeste makers die echt iets uitbrengen, komen ergens in het midden uit: de AI doet het typewerk, maar zij blijven eigenaar van de structuur, de data en de beveiligingsbeslissingen. Deze gids gaat uit van die middenweg.

Tools voor vibe coding: de belangrijkste categorieën

Tools voor vibe coding vallen in twee grote groepen. Beide veranderen snel, dus controleer de actuele functies en prijzen op de site van elk product voordat je je vastlegt.

AI-code-editors en coding agents

Deze werken met een echte codebase op je eigen computer of in een repository, zodat je volledige controle over de code houdt.

• Cursor is een code-editor die rond AI is gebouwd, met chat, inline bewerkingen en een agentmodus die veel bestanden tegelijk kan aanpassen.
• Claude Code is de coding agent van Anthropic. Hij werkt in de terminal en in code-editors, leest je project, voert commando’s en tests uit en maakt wijzigingen in meerdere bestanden.
• GitHub Copilot begon als autocomplete in populaire editors en heeft nu ook chat- en agentfuncties die nauw aansluiten op GitHub.
• Windsurf is nog een AI-first editor, met een agent die wijzigingen in een heel project plant en doorvoert.

Kies deze groep als je eigenaar wilt zijn van een normale codebase, elk framework wilt kunnen gebruiken en het project maandenlang wilt laten groeien.

AI-appbouwers

Deze draaien in de browser en gaan van een prompt naar een werkende app, meestal met hosting erbij. Ze zijn de snelste manier om iets echts te zien.

• Lovable bouwt full-stack webapps vanuit een chat en koppelt met gangbare backenddiensten voor data en inloggen.
• Bolt genereert en draait webapps in de browser, zodat je kunt bewerken en bekijken zonder iets te installeren.
• Replit is een online ontwikkelomgeving met een AI-agent en ingebouwde deployment.
• v0 van Vercel richt zich op het genereren van interfaces en webapps met moderne front-endframeworks.

Kies deze groep voor prototypes en eenvoudige tools, of als je nog nooit een ontwikkelomgeving hebt ingericht. De meeste appbouwers kunnen de code exporteren of synchroniseren met GitHub; doe dat vroeg, zodat je niet vastzit.

Zo kies je

Een gebruikelijke route: maak een prototype in een appbouwer, zet de code daarna in een repository en ga verder met een editor of agent zodra het idee zich bewezen heeft.

Zo bouw je een app met vibe coding: een stappenplan

Deze workflow gaat uit van een kleine webapp, maar dezelfde stappen gelden voor mobiele apps en scripts.

1. Schrijf een briefing van één pagina. Voor wie is het, welk probleem lost het op, wat is de ene kernactie, en wat valt er voor versie één uitdrukkelijk buiten de scope? Bewaar het in een bestand dat de tool aan het begin van elke sessie kan lezen.
2. Kies een saaie, populaire stack. AI-tools schrijven doorgaans betere code voor veelgebruikte frameworks en databases, omdat daar veel meer voorbeelden van bestaan.
3. Zet versiebeheer op vóór de eerste functie. Maak een Git-repository aan, commit het lege project en commit opnieuw na elke werkende wijziging. Zo heb je altijd een weg terug.
4. Bouw één dunne verticale slice. Laat de kernactie van begin tot eind werken, van het scherm naar de database en terug, voordat je iets anders toevoegt. Lelijk is in dit stadium prima.
5. Werk met kleine, specifieke prompts. ‘Voeg aan elk item een verwijderknop toe die om bevestiging vraagt’ werkt beter dan ‘verbeter de itemlijst’. Eén wijziging per prompt houdt diffs leesbaar en maakt meteen duidelijk welke wijziging iets kapotmaakte.
6. Draai de app na elke wijziging. Klik zelf door de kernflow. Gaat er iets stuk, geef de AI dan de exacte foutmelding, wat je deed en wat je verwachtte.
7. Voeg tests toe voor de kernlogica. Vraag de AI om tests te schrijven voor de onderdelen die nooit kapot mogen gaan, zoals prijzen, rechten en wijzigingen in data, en draai ze vóór elke commit.
8. Gebruik gevestigde diensten voor de moeilijke onderdelen. Authenticatie, betalingen, e-mail en bestandsopslag zijn opgeloste problemen. Gebruik een bekende aanbieder.
9. Deploy vroeg. Zet de app in de eerste dagen online, ook als alleen jij hem gebruikt. Problemen met deployment zijn makkelijker op te lossen zolang de app klein is.
10. Houd een kort notitiebestand bij. Leg beslissingen, conventies en bekende problemen vast. Veel agents lezen zo’n bestand automatisch, waardoor nieuwe sessies consistent blijven.

Zo houd je de kwaliteit hoog als AI de code schrijft

Snelheid is het makkelijke deel. De gewoontes hieronder maken het verschil tussen een demo en een product waarop mensen kunnen vertrouwen.

Versiebeheer en kleine commits

Commit elke werkende toestand met een duidelijk commitbericht. Slaat de AI een verkeerde weg in, rol dan terug in plaats van te vragen om de reparatie te repareren.

Review elke diff

Lees vóór je commit wat er veranderd is. Je hoeft niet elke regel te begrijpen, maar je moet wel opmerken wanneer een klein verzoek tien bestanden raakte, een controle verwijderde, echte data verving door voorbeelddata of een package toevoegde waar je niet om vroeg. Is een diff te groot om te reviewen, dan was de prompt te groot.

Tests als vangnet

Wijzigingen door AI repareren vaak het ene en breken stilletjes het andere. Een handvol geautomatiseerde tests op je kritieke paden vangt dat meteen op. Wees op je hoede voor tests die alleen bevestigen dat de code doet wat hij nu doet.

De beveiligingsbasis die je niet mag overslaan

De meeste beveiligingsproblemen in apps die met vibe coding zijn gebouwd, komen voort uit een paar steeds terugkerende fouten. De OWASP Top Ten is een goede algemene referentie, en dit zijn de essentiële punten:

• Geheimen. API-sleutels en inloggegevens van je database horen in omgevingsvariabelen op de server, nooit in front-endcode of in de repository. Zet je omgevingsbestand in .gitignore. Belandt een sleutel ooit in een commit of op een openbare pagina, trek hem dan in en maak een nieuwe aan.
• Authenticatie en autorisatie. Gebruik een beproefde inlogdienst. Controleer daarna op de server, bij elk verzoek, of de ingelogde gebruiker dat specifieke record mag lezen of wijzigen. Een knop verbergen in de interface is geen beveiliging.
• Toegangsregels voor de database. Praat je front-end rechtstreeks met een gehoste database, zet dan de toegangsregels aan en test ze, zoals row-level security, zodat de ene gebruiker de gegevens van een andere niet kan lezen.
• Invoervalidatie. Valideer elke invoer op de server: type, lengte, formaat en toegestane waarden. Gebruik geparametriseerde queries of een ORM, en escape content van gebruikers voordat je die op een pagina toont.
• Dependencies. Controleer of elk package dat de AI toevoegt echt bestaat, onderhouden wordt en goed gespeld is. AI-tools stellen soms packages voor die niet bestaan, en aanvallers kunnen die namen registreren.
• Limieten tegen misbruik. Zet rate limits op inloggen, aanmelden en elk endpoint dat e-mail verstuurt of een betaalde API aanroept, zodat één script je rekening niet kan opjagen.

Het helpt ook om de AI te vragen om een beveiligingsreview van één specifiek onderdeel, en de bevindingen daarna zelf te controleren.

Veelvoorkomende valkuilen bij vibe coding

Wie deze van tevoren kent, bespaart dagen.

• De fixlus. De AI lost een bug op, waardoor iets anders breekt, wat hij oplost door het eerste weer te breken. Stop, rol terug naar de laatste goede commit en beschrijf het probleem anders, of vraag de AI eerst de oorzaak uit te leggen voordat hij iets verandert.
• Contextdrift. In lange sessies verliest de AI eerdere beslissingen uit het oog. Begin nieuwe sessies voor nieuwe taken en verwijs de tool naar je notities.
• Verzonnen API’s. De code roept functies aan die in jouw versie van de library niet bestaan. Plak de relevante pagina van de officiële documentatie in de chat.
• Stille nepoplossingen. Om een fout te laten verdwijnen, kan de AI voorbeelddata hardcoderen, een controle overslaan of een exception afvangen en negeren. Een review van de diff vangt dit op.
• Gigantische bestanden. Alles komt in één bestand terecht dat niemand, ook de AI niet, nog veilig kan bewerken. Splits het op in kleinere modules zolang de app nog klein is.
• Scope creep. Functies toevoegen is zo makkelijk dat versie één nooit af raakt. De lijst met wat buiten de scope valt in je briefing is er om dit te stoppen.
• Geen begrip als het misgaat. Faalt de app in productie en kun je de code niet lezen, dan zit je vast. Vraag de AI de architectuur in gewone taal uit te leggen en bewaar dat in je notities.

Van werkende app naar eerste gebruikers

Een app die op je laptop werkt, is nog niet gelanceerd. Met deze stappen komt hij in echte handen.

1. Zet hem op een echt domein met HTTPS, een duidelijke paginatitel en één zin die zegt wat de app doet en voor wie.
2. Voeg een feedbackkanaal toe, zoals een e-mailadres of een eenvoudig formulier, plus eenvoudige foutlogging, zodat je van crashes hoort voordat gebruikers het opgeven.
3. Meet één ding dat ertoe doet, zoals hoeveel mensen de kernactie voltooien.
4. Vertel het aan de mensen die het probleem hebben. Deel de app in de communities waar je gebruikers al tijd doorbrengen, volgens de regels van elke community. Leg uit wat je hebt gebouwd en waarom, en vraag om eerlijke feedback in plaats van upvotes.
5. Zet hem op plekken waar makers en nieuwsgierige bezoekers rondkijken. Directories en lanceersites geven een af project een vaste plek die mensen later kunnen vinden. Op One Dollar Planet kost een punt voor je project op een 3D-planeet bijvoorbeeld $1 en blijft het voor altijd staan, en een logo met een vermelding in de catalogus en een eigen pagina kost $10. Je kunt je project toevoegen en in de projectcatalogus bekijken wat andere makers hebben gebouwd.
6. Praat één voor één met je eerste gebruikers. In het begin leren een paar gesprekken je meer dan welk dashboard ook.
7. Blijf in kleine stappen uitbrengen. Dezelfde workflow voor vibe coding dient nu je gebruikers: kleine prompts, gereviewde diffs, tests en dan deployen.

Voortgang en lessen delen terwijl je bouwt, geeft mensen ook een reden om je al vóór de lanceerdag te volgen. Meer over het lanceren van kleine projecten lees je op de blog.

De belangrijkste punten

• Vibe coding betekent beschrijven wat je wilt en AI de code laten schrijven. Combineer het met review en tests voor alles met echte gebruikers.
• Gebruik AI-editors en agents voor code die je op lange termijn in eigen hand houdt, en appbouwers voor snelle prototypes.
• Commit vaak, houd prompts klein en review elke diff.
• Houd geheimen op de server, controleer rechten bij elk verzoek en valideer alle invoer.
• Draait de AI in rondjes, rol dan terug in plaats van fixes op fixes te stapelen.
• Een werkende app moet nog steeds gelanceerd worden: met een echt domein, een feedbackkanaal en mensen die het probleem hebben.

Veelgestelde vragen

Wat is vibe coding in eenvoudige woorden?

Vibe coding is software maken door een AI-tool in gewone taal te vertellen wat je wilt, in plaats van de code zelf te schrijven. De AI genereert de code, jij draait die en je stuurt de volgende stap met nieuwe instructies. Het is het snelst voor prototypes en kleine apps.

Moet ik kunnen programmeren om een app te bouwen met vibe coding?

Nee, je kunt zonder programmeerervaring een werkend prototype bouwen, vooral met appbouwers in de browser. Om iets te lanceren dat echte gebruikers en data aankan, heb je de basis nodig: hoe je app in elkaar zit, hoe je een diff leest en hoe je geheimen en rechten veilig houdt. De AI kan je dat gaandeweg leren.

Wat zijn de beste tools voor vibe coding?

Dat hangt af van je doel. Appbouwers zoals Lovable, Bolt, Replit en v0 zijn de snelste weg naar een werkend prototype. Editors en agents zoals Cursor, Claude Code, GitHub Copilot en Windsurf passen bij langere projecten met een codebase die van jou is.

Is software die met vibe coding is gebouwd veilig genoeg voor productie?

Dat kan, als je de output van de AI behandelt als code van een nieuwe collega: review hem, test hem en controleer hem op beveiligingsproblemen voor de release. De meest voorkomende problemen zijn API-sleutels die openliggen, ontbrekende rechtencontroles op de server en ongevalideerde invoer. Code die niemand heeft gereviewd of getest, hoort niet met gegevens of geld van anderen te werken.

Hoe lang duurt het om een app te bouwen met vibe coding?

Een eenvoudig prototype kan een middag kosten, en een degelijke eerste versie vaak dagen tot een paar weken, afhankelijk van de scope en je ervaring. De meeste tijd gaat naar testen, randgevallen en deployment, niet naar de eerste opzet. Een strakke scope is de grootste factor die je zelf in de hand hebt.