Les 5.2 Je eerste app met vibe coding

Hoi! Fijn dat je er weer bent. In de vorige les schreef je een korte opdracht voor een app. Nu ga je hem echt bouwen, zonder zelf code te schrijven. In deze les bouw je in CivAI Coding Studio een werkende eerste versie, door in gewone taal te beschrijven wat je wilt.

Dat heet vibe coding. Jij beschrijft wat je wilt, en AI schrijft de code. CivAI Coding Studio draait in Europa, met open AI-modellen. Thorgeirsson en collega's zagen dat schrijfvaardigheid voorspelt hoe goed vibe coding lukt. Een heldere opdracht is dus het halve werk. En je stuurt bij in gewone taal: zeg wat je ziet, en wat je anders wilt.

Laten we het proberen in CivAI Coding Studio. Ik maak een nieuw project en plak mijn opdracht uit les 5.1 in de AI Companion. Je ziet de code verschijnen. Na anderhalve minuut meldt de Studio: klaar! Maar in de preview staat alles onder elkaar, en de knoppen doen niets. Er ontbreken onderdelen. Dus zeg ik in gewone taal wat ik zie, en vraag om de ontbrekende onderdelen. Nu werkt het. Typ ik het Franse woord zonder accent, dan zegt de app: fout.

En wat gaat er vaak mis? Je gelooft het woord klaar, zonder zelf te testen. In onze versie kwam een fout woordje al na één ander woordje terug, en de score telde zes woordjes in plaats van vijf. Dat is normaal voor een eerste versie. In de volgende les ga je testen en verbeteren.

Nu ben jij aan de beurt. Maak een nieuw project in CivAI Coding Studio. Plak je opdracht uit les 5.1 in de AI Companion, en bekijk de preview. Test of het werkt, en stuur één keer bij in gewone taal. Veel succes, en tot in de volgende les!

Aan de slag

Je bouwt in CivAI Coding Studio een werkende eerste versie van je app, door in gewone taal te beschrijven wat je wilt. Je gebruikt de opdracht die je in les 5.1 schreef.

Log in op civaicodingstudio.eu. Met een kosteloos account kun je 3 projecten maken en 50 AI-berichten per maand sturen. Elke vraag aan de AI Companion telt als een bericht, dus denk na voordat je iets stuurt.
Maak een nieuw project met een duidelijke naam, bijvoorbeeld "Woordjestrainer Frans". Laat Privacy Mode op Standard staan.
Open de AI Companion (de ronde knop rechtsonder) en plak je opdracht uit les 5.1, aangevuld met de keuzes die je zelf hebt gemaakt.

Een ... (soort app) voor ... (wie). Ik voer ... in. De app ... Ik zie ... Zet er alvast een voorbeeld in, zodat ik meteen kan testen.

Bekijk de preview. Geloof het woord "Klaar!" niet meteen. Lees ook de meldingen onder het antwoord van de Companion. In onze test meldde de Studio "Klaar!", maar stond er dat onderdelen ontbraken en tijdelijk waren ingevuld. In de preview stond alles onder elkaar en deden de knoppen niets.
Test of je app doet wat in je opdracht staat. Probeer ook een fout antwoord of een fout gegeven.
Stuur één keer bij in gewone taal: zeg wat je ziet en wat je anders wilt.

Ik zie ... (wat er nu gebeurt). Ik wil dat ... (wat er moet gebeuren).

Test opnieuw en schrijf op wat nog niet klopt. In onze test kwam een fout woordje al na één ander woordje terug in plaats van na twee, en de score telde zes woordjes terwijl er vijf waren. Die lijst gebruik je in les 5.3.

Tip. Gebruik geen echte namen of andere persoonsgegevens in je app of in je opdracht.

Waar doe je deze opdracht?

In CivAI Coding Studio

Je bouwt en test je app in CivAI Coding Studio. Maak daar een kosteloos account aan, of log in als je er al een hebt.

Naar CivAI Coding Studio

Via je school of opleiding

Heb je EduGPT via je school of opleiding? Log in via de link die je daar hebt gekregen.

Geen toegang tot EduGPT?

Dan kun je de vragen aan EduGPT ook in je eigen AI-tool doen. We kunnen niet garanderen dat het daar net zo goed werkt als in EduGPT. Je mist bijvoorbeeld de Kritisch Denken Engine, die eerst vragen terugstelt in plaats van meteen het antwoord te geven.

Checkvragen

Bronnen bij deze les

Thorgeirsson, S., Weidmann, T. B., & Su, Z. (2026). Computer science achievement and writing skills predict vibe coding proficiency. In Proceedings of the 2026 CHI Conference on Human Factors in Computing Systems (pp. 1–17). ACM. https://doi.org/10.1145/3772318.3791666

In een vooraf geregistreerd onderzoek met 100 studenten die apps bouwden door alleen in gewone taal te beschrijven wat ze wilden, voorspelden zowel schrijfvaardigheid als informaticakennis hoe goed dat lukte. Dat past bij deze les omdat het laat zien dat helder schrijven er bij vibe coding echt toe doet, en dat basiskennis van hoe software werkt helpt.

Kazemitabaar, M., Chow, J., Ma, C. K. T., Ericson, B. J., Weintrop, D., & Grossman, T. (2023). Studying the effect of AI code generators on supporting novice learners in introductory programming. In Proceedings of the 2023 CHI Conference on Human Factors in Computing Systems (pp. 1–23). ACM. https://doi.org/10.1145/3544548.3580919

Bij 69 beginners van 10 tot 17 jaar zorgde toegang tot een AI-codegenerator voor meer voltooide opdrachten en hogere scores, zonder dat ze slechter werden in het zelf aanpassen van code. Dat laat zien dat ook jonge beginners met AI een werkende eerste versie kunnen maken, wat aansluit bij de doelgroep vanaf het vo.

In de bronnenclip Bronnen bij hoofdstuk 5 licht Pascal toe waar de lessen van dit hoofdstuk op steunen.