Vibe coding voor beginners: zo begin je, stap voor stap

Vibe coding voor beginners komt neer op vijf stappen: kies een tool die de app voor je draait, beschrijf één kleine app in gewone woorden, probeer hem als gebruiker, vraag steeds om één oplossing en publiceer als het werkt. Je hoeft niet te kunnen coderen. Deze tutorial loopt elke stap door aan de hand van een echt eerste project, de exacte prompts om te typen en de fouten die bijna elke beginner in de eerste week maakt.

Wil je eerst de achtergrond — waar de term vandaan komt en waarom mensen erover twisten — lees dan wat vibe coding is. Deze pagina is de praktische kant.

Wat je nodig hebt voordat je begint

Minder dan je denkt:

• Een browser en een account bij een vibe coding tool. Beginners kiezen het best een AI-appbouwer, die de code schrijft, draait en host, in plaats van een codeerassistent die verwacht dat je zelf bestanden en servers beheert.
• Eén klein idee. Niet je startup. Een tool voor één persoon (jij) met één of twee schermen.
• Een uur of twee zonder onderbrekingen. De eerste sessie leert je het ritme.

Dat is alles. Niets installeren, geen programmeercursus, geen terminal.

Welke tool als beginner

De tool doet er minder toe dan de gewoontes, maar hij moet drie dingen kunnen: een live voorbeeld tonen terwijl hij bouwt, je een slechte wijziging laten ongedaan maken en publiceren naar een link die je kunt delen. Ons overzicht van de beste vibe coding tools behandelt de belangrijkste opties eerlijk. Mythex is er een van: je beschrijft de app in de chat, het bouwt een echte full-stack app met een live voorbeeld, voegt een database toe als de app dingen moet onthouden en publiceert met één klik. Het Free-abonnement vraagt geen kaart.

Stap 1: Kies een eerste project dat je kunt afmaken

Beginners falen meestal door te groot te mikken. Een goed eerste project:

• Is persoonlijk nuttig, zodat je het goed gaat testen.
• Past op één of twee schermen.
• Bewaart een kleine hoeveelheid eigen data.
• Heeft geen betalingen, geen teams en geen gevoelige persoonsgegevens.

Goede eerste projecten:

In de rest van deze tutorial gebruiken we de leeslijst.

Stap 2: Schrijf je eerste prompt

Je eerste bericht bepaalt de vorm van alles. Zeg voor wie het is, wat het doet en hoe het eruit moet zien. Houd het bij een korte alinea.

Een zwakke eerste prompt:

Maak een boeken-app voor me.

Een goede eerste prompt:

Bouw een leeslijst-app voor mij. Ik kan een boek toevoegen met titel, auteur en status (wil ik lezen, bezig, uitgelezen). Toon de boeken als kaarten gegroepeerd op status, de nieuwste eerst. Ik kan de status van een boek wijzigen of het verwijderen. Houd het schoon en eenvoudig: witte achtergrond, één accentkleur, werkt op mijn telefoon. Sla de boeken op zodat ze er na het verversen nog zijn.

Let op wat de tweede doet. Ze noemt de velden, de acties, de lay-out en één regel die beginners altijd vergeten: sla de data op zodat ze een verversing overleeft. Zonder die zin bouwen veel tools een pagina die af lijkt maar alles vergeet als je opnieuw laadt.

Voor meer beginpunten, zie ons spiekbriefje met vibe coding prompts.

Vraag om een plan als je twijfelt

Weet je niet hoe je iets moet beschrijven, laat de AI dan plannen voordat hij bouwt:

Vertel me voordat je iets bouwt in gewone woorden welke schermen je maakt, welke data je opslaat en wat ik moet beslissen.

In Mythex dient de Plan-modus daarvoor: de agent zet de aanpak uiteen en jij keurt hem goed voordat er bestanden veranderen.

Stap 3: Test als gebruiker, niet als de bouwer

Als het voorbeeld verschijnt, bewonder het dan niet alleen. Gebruik het:

1. Voeg drie boeken toe, waaronder één met een erg lange titel.
2. Wijzig een status. Verhuist de kaart naar de juiste groep?
3. Ververs de pagina. Zijn de boeken er nog?
4. Probeer een boek toe te voegen met een lege titel. Wat gebeurt er?
5. Open het voorbeeld op je telefoon, of maak het browservenster smaller.

Schrijf in gewone woorden op wat er mis is. "De lange titel breekt de kaartlay-out" is een perfecte foutmelding. "Het is kapot" is dat niet.

Stap 4: Los één ding per bericht op

Dit is de gewoonte die mensen die afmaken scheidt van mensen die opgeven. Stuur één wijziging, controleer die en stuur dan de volgende.

De lange titel "The Hitchhiker's Guide to the Galaxy: The Complete Trilogy" loopt over de kaart heen. Breek lange titels af over twee regels en kap de rest af met "…".

Daarna:

Als ik het formulier verstuur met een lege titel gebeurt er niets en is er geen melding. Toon "Voeg een titel toe" onder het veld en sla het boek niet op.

Waarom één tegelijk? Als je in één bericht om vijf wijzigingen vraagt, doet de AI er misschien vier goed en breekt stilletjes iets anders, en weet je niet welke wijziging dat veroorzaakte. Kleine stappen maken ook ongedaan maken nuttig: gaat een wijziging mis, ga dan terug naar de versie net ervoor en probeer een duidelijker verzoek.

Als er iets kapotgaat

Dat gebeurt. Elke bouwer loopt tegen fouten aan. Kopieer de exacte foutmelding, of beschrijf precies waarop je klikte en wat je zag, en plak het terug:

Als ik op Verwijderen klik op een kaart zie ik "Er is iets misgegaan" en blijft het boek staan. Zoek uit waarom en los het op. Vertel me wat de oorzaak was.

Vragen naar de oorzaak is belangrijk. Het leert je hoe apps werken en voorkomt dat de AI gaat gokken. Onze gids over een door AI gebouwde app debuggen gaat dieper.

Stap 5: Maak het van jou

Werkt het, verbeter het dan in dezelfde kleine stappen:

• "Voeg een beoordeling van 1–5 sterren toe die bij uitgelezen boeken wordt getoond."
• "Voeg boven de kaarten een zoekvak toe dat filtert op titel of auteur."
• "Gebruik een warme gebroken witte achtergrond en een donkergroen accent."
• "Voeg bovenaan een teller toe: boeken uitgelezen dit jaar."

Elk daarvan is één enkele, testbare wijziging.

Stap 6: Publiceer en deel het

Doet het wat je nodig hebt, publiceer het dan. Op Mythex is dat één klik en krijg je een openbare URL die je op elk apparaat kunt openen of naar een vriend kunt sturen. Wil je later een eigen domein, dan is dat een Pro-functie en legt onze gids over een eigen domein koppelen het uit.

Lees voordat je iets met meer dan een paar vrienden deelt is vibe coding veilig?. Voor een persoonlijke leeslijst is het risico laag. Voor een app waar vreemden zich aanmelden en data opslaan zijn er controles die je eerst moet doen.

Beginnersfouten om te vermijden

• Alles tegelijk vragen. "Bouw Goodreads voor me" levert iets op dat indrukwekkend lijkt en slecht werkt. Begin met de kleinste nuttige versie.
• Verversen niet testen. Data die verdwijnt bij herladen is de meest voorkomende verrassing voor beginners.
• Je verzoek elke keer opnieuw schrijven. Zeg wat je wilt wijzigen en wat je wilt behouden: "Houd de lay-out, verander alleen de kleuren."
• "Het is opgelost" blind geloven. De AI zegt vaak dat een bug is opgelost. Controleer het elke keer zelf.
• Wachtwoorden of API-sleutels in de chat plakken. Heeft je app een sleutel nodig voor een externe dienst, zet die dan in de geheimeninstellingen van de tool, nooit in een bericht of in de code. Zie API-sleutels veilig houden.
• Opgeven na de eerste fout. Fouten zijn normaal. Plak ze terug en vraag naar de oorzaak.

Wat je onderweg kunt leren

Je hebt geen cursus nodig, maar een paar begrippen maken elk verzoek scherper. Vraag de AI ze uit te leggen aan de hand van je eigen app:

• Frontend en backend: wat in de browser van de bezoeker draait en wat op een server. (Frontend vs backend)
• Database: waar je app zijn data bewaart. (Wat is een database?)
• Authenticatie: hoe de app weet wie iemand is.
• Geheimen: privésleutels die de app gebruikt en die bezoekers nooit mogen zien.

Een goede prompt hiervoor: "Leg uit hoe mijn leeslijst een boek opslaat, van het klikken op Toevoegen tot de opgeslagen data. Gebruik gewone woorden en verwijs naar de echte bestanden."

Je tweede en derde project

Kies na de eerste app iets wat een stap moeilijker is. Een gewoontetracker met een wekelijkse grafiek. Een boekingsformulier dat je een e-mail stuurt. Een klein dashboard dat uit een Google Sheet leest. Onze vibe coding voorbeelden tonen echte apptypes met de prompts erachter en wat er misging, en een app bouwen met vibe coding brengt een groter project van idee naar een gepubliceerde app met gebruikers.

Ben je klaar om te beginnen, open dan de AI-appbouwer, plak de leeslijst-prompt hierboven en pas hem aan op je eigen idee.

Veelgestelde vragen