Tillbaka till översikten

Från papper och penna till AI-genererad music quiz 

Systemutveckling

När OpenAI lanserade sin kodningsagent Codex i maj så ville jag genast prova den. Att kunna skriva kod med promptar, eller ”vibe coding” som det brukar kallas, tyckte jag då lät lite för bra för att vara sant. Går det verkligen att skapa något vettigt utan att skriva en kodrad? Jag testade att göra en music quiz-applikation där den som håller i tävlingen har en adminsida där poängställningen presenteras och att deltagarna använder sin mobil för att svara på frågor. 

Bild på chatgpt codex

Första stapplande stegen 

För att komma igång behöver man skapa ett github repository och koppla ihop det med codex och sedan är det bara att sätta igång. Här är min första prompt: 

”I want to create a node based application that uses typescript. The application shall provide multiple users to participate in a music quiz where one admin is showing the next question on all users screens with four answer alternatives and the user that first clicks the correct alternative scores highest on that question.” 

Det tog några promptar till att få till lite konfiguration, beroenden, körning av tester, m.m. men till slut skapade jag min första pull request. Den hade skapat 10 filer med kod. Det var spännande att checka ut och provköra och resultatet blev helt ok. Sedan rullade det på, det var väldigt lätt att lägga till nya funktioner.  
 

Bild på kod

Fallgropar och lärdomar

Att börja koda med AI som medhjälpare kan kännas som att få en supersnabb kollega, men en kollega som ibland gissar lite för självsäkert. Under arbetet med Codex har jag stött på både smarta genvägar och klassiska snedsteg. Här är några av de mest lärorika ögonblicken, och vad de lärde mig.

Hantera regression med cypress 

Efter ett tag insåg jag dock att nya funktioner började förstöra saker som tidigare hade fungerat. Codex hade skapat lite enhetstester men det var ganska blygsamt. Så det var dags att steppa upp testningen till en ny nivå. Jag sade åt codex att använda cypress för att göra end to end-tester för all ny funktionalitet den skrev och det blev ett vinnande koncept, i synnerhet eftersom samtliga tester körs som en del av kodgenereringen. Så när den är klar med en prompt så vet man om alla tester fungerar eller ej. 

För den som vill testa detta då gör man detta genom att skapa en fil som heter AGENTS.md. I den filen skriver man in regler som codex skall rätta sig efter för varje nytt jobb den gör. Jag skrev in följande: 

” Add unit tests for new logic and Cypress tests for new UI flows. Investigate and resolve any failing tests before submitting the PR. ” 

Snabbare prompting med cachade beroenden 

Efter ett tag insåg jag att det tog lite väl lång tid att genomföra en enkel kodändring med en prompt. Jag läste på ytterligare och insåg att jag hade helt missat att man kan lagra alla nedladdade beroenden så som npm-paket och image:ar i ett cacheminne som man sedan kan återanvända när man kör nästa prompt. När jag började utnyttja den så gick allt mycket snabbare. 

Lösa timeingproblem med promptgenerator 

En annan sak som tog lång tid att inse är att korta promptar gör ett sämre jobb, vilket egentligen är ganska logiskt men det är lätt att glömma bort. När resultatet av en prompt blev att ett cypress-test failade så skrev jag något i stil med: 

 ”Investigate why this test is failing and fix it” 

Det lyckades ibland men oftast inte. Orsaken var att jag hade fastnat i ett beroende av timeing relaterade tester som ibland gav ett resultat och ibland ett annat. Jag testade en prompt-generator speciellt anpassad för codex. Den skapade en jätteprompt med rubriker som Role, Task, Context, Expected Output och Guidance for Codex. Totalt var prompten på ca 80 rader med text, där uppdraget var att se över testerna och förbättra dem. Resultatet blev över förväntan, codex gjorde en total omskrivning av testerna där den bl.a. använder cypress egna klockfunktion där den kan stega fram tiden deterministiskt med cy.tick(<ms>). Då försvann alla timingrelaterade problem och testerna började fungera felfritt igen.  

Skarpt läge på årliga musiktävlingen 

Så hur skulle jag använda mig av detta då? Jo, Masarin kör en årlig höstresa till ett nytt ställe varje år. Där brukar vi ha ett par utvecklingsdagar och en ledig dag och där lär vi känna varandra ordentligt. Riktigt härliga dagar som alla ser fram emot. Av någon outgrundlig anledning har det blivit något av en tradition att jag kör en music quiz på en av kvällarna varje gång vi är på en sådan resa. Tidigare gånger har det varit papper och penna som gällt för att anteckna svaren, men den här gången kände jag mig så pass säker på att det skulle fungera att jag avslöjade redan i förväg att det skulle bli en helt digital music quiz.  

Kvällen kom, vi körde igenom quizen och det visade sig några buggar. Jag hade ju faktiskt inte kört den med någon större deltagarmängd än mig själv men på det stora hela kändes det som att det blev en succé. Stort jubel, ”de va bästa ever!” och massor med positiv uppskattning och även lite synpunkter. 

Bild på färdiga quizet

Slutsats 

Så vad kan man dra för slutsats av detta då? Ja, jag är fortfarande förvånad över att det över huvud taget går att skapa en applikation, som i mitt fall nu är uppe i 64 filer och tusentals rader med kod, utan att jag har skrivit en enda av dom. Men fungerar gör det i alla fall, så detta är nog bara början på vad som kommer framöver. Det har hur som helst varit otroligt intressant och lärorikt. Jag känner att jag fått inspiration till att testa nya saker med codex.  

Vill du prata AI-promtar?

Håkan Wiklund, Masarin Consulting Group
072-232 88 09 | E-post
Till kontaktsidan

PS. Som lite kuriosa kan jag nämna att jag testade att skicka in denna text i ChatGPT och bad den skriva ett blogginlägg men det blev alldeles för finputsat och opersonligt. Jag vill behålla mina stav och syftningsfel så att det blir tydligt att det faktiskt är jag som skrivit detta. 😊

Håkan Wiklund

Nästa inlägg

Grattis till Caroline som vann en AI-workshop!

Läs inlägg