Agentic Engineering Hackathon · Vol. II · Mariefred 2026
Agentic Engineering för nyfikna
Från “jag är inte teknisk” till första prototypen
Den här sessionen är särskilt för dig som inte ser dig själv som teknisk.
Du är precis rätt person att vara här.
Om mig
Magnus Gille
Sveriges första AI-promptingmästare
Driver Magnus Gille Consulting från Mariefred
Tidigare uppdrag: IKEA, Saab, Epidemic Sound, Koenigsegg
Hjälper folk att använda AI — inte bara teknikfolk
gille.ai · magnus@gille.ai
Alla
Vad är ett hackathon?
1
Kom på en kul idé
2
Bygg idén
3
Mingla och ha trevligt
4
Visa hur långt du kom — helt, delvis eller inte alls — och berätta hur det gick
Bästa bidraget vinner ett pris! 🏆
Dagens tema
trumvirvel…
SKÄRMFRI TID
Tolka det precis så fritt du vill.
Alla
Min dotter, 8 år
⌨️
Bad AI:n bygga ett spel
→
🎮
Spelade det hon byggde
Innan vi börjar
Vet du inte hur? Fråga AI:n.
Det är den enda regeln som gäller idag. Allt annat följer av den.
Alla
Efter den här sessionen ska du kunna…
Beskriva en idé och få en plan från AI:n
Bygga en liten, fungerande prototyp under eftermiddagens hackathon
Spara ditt arbete tryggt med Git
Veta exakt hur du ber AI:n om hjälp — på dina villkor
Alla
Dagens resa
Idé
→
Plan
→
Första filer
→
Git
→
Förbättra
→
Demo
Det handlar inte om att bli proffs. Det handlar om att bygga tryggt — steg för steg.
Alla
Vad är det här, egentligen?
AI-assisterad utveckling betyder att du samarbetar med ett AI-verktyg som kan:
Läsa och förstå dina filer
Föreslå ändringar i koden
Köra kommandon steg för steg
Förklara sina val på vanlig svenska
Det mer tekniska begreppet är Agentic Engineering — AI:n agerar, inte bara svarar.
Alla
Vibe coding: frihet och risk
Friheten
Snabb utforskning. Du kan testa idéer direkt utan att kunna syntaxen. Perfekt för att komma igång.
Risken
Blind tillit. Du accepterar allt utan att förstå. Projektet växer snabbt, men ingen vet vad som händer under ytan.
“Fart är bra. Omdöme är bättre.”
Vibe coding + checkpoints = en bra metod.
Vibe coding utan kontroll = en tickande bomb.
Nybörjare
Miniordlista
Terminal
Textfönstret där du skriver kommandon direkt till datorn. Ser hackigt ut, men är bara ett annat sätt att prata med datorn.
Repo (repository)
En projektmapp som Git håller koll på. Alla filer + all historik, samlat på ett ställe.
Prompt
Det du skriver till AI-verktyget. En instruktion, en fråga, eller en beskrivning av vad du vill uppnå.
Kontext
Allt som AI:n "har i huvudet" just nu — dina filer, er konversation, projektinställningar. Mer kontext = bättre svar.
Git
Ett program som sparar ändringshistorik i ditt projekt. Som ctrl-Z för hela projektmappen — du kan alltid gå tillbaka.
GitHub
En webbplats där du lägger upp din kod. Backup i molnet, plus möjlighet att dela och samarbeta med andra.
Committa
Att spara en namngiven version av ditt projekt. Som en checkpoint i ett datorspel — om något går fel kan du alltid gå tillbaka hit. Du väljer själv när du committar och vad du kallar versionen.
Alla
Git vs GitHub
Branches och pull requests finns, men är inte något ni behöver dag ett.
Alla
Det enklaste trygga Git-flödet
Att committa ofta är inte byråkrati — det är din säkerhetslina.
Du skriver till AI:n
"Commita till git."
Verktyget kör i bakgrunden
$ git add -A
$ git commit -m "Add team registration form"
[main a3f2c1] Add team registration form
2 files changed, 47 insertions(+)
Alla
Terminal eller grafiskt gränssnitt?
Obs: Olika gränssnitt kan ha olika behörigheter, internetåtkomst och säkerhetsinställningar. Men grundflödet — hur du tänker och arbetar — är detsamma.
Alla
Kom igång — verktygen idag
claude
TerminalMac & Win
macOS
~npm install -g @anthropic-ai/claude-code
~/projektclaude
✔ Claude Code redo.
PS
Windows
─ □ ✕
PS C:\>npm install -g @anthropic-ai/claude-code
PS C:\>claude
✔ Claude Code redo.
claude
Desktop-appMac & Win
ChatCoworkCode
+🔍🕐📅
Jag vill bygga en enkel webbapp...
Auto accept editsSelect folder · Local
B
OpenCodeTerminal — Mac & Win
berget
~npm install -g opencode-ai
~/projektopencode
▶ Berget Code startar...
✔ Redo. Vad ska vi bygga?
Baserat på OpenCode — körs i terminalen precis som Claude Code.
🌐
Ännu enklare — inget att installera: Lovable (lovable.dev) körs i webbläsaren. Beskriv vad du vill ha så bygger den en webbapp live. Mindre kontroll, men den enklaste vägen in.
🎁
Berget AI sponsrar generöst med 25 euro i krediter per deltagare — tillgång till deras AI-modeller under hela hackathonet.
🔔
Osäker på vilket du ska använda? Fråga en handledare innan hackathon börjar — vi hjälper dig komma igång på fem minuter.
Alla
Välj rätt modell
Alla verktyg låter dig byta modell — det påverkar kvalitet, hastighet och kostnad.
claude
Claude Code & Codex
Byt modell med ett slash-kommando:
/model
▶ Välj modell från listan
Claude Code ingår i Claude-prenumerationen. Codex ingår i ChatGPT-prenumerationen. Inget extra att betala.
B
OpenCode via Berget AI
Kör öppna modeller via Bergets infrastruktur. Tillgängliga idag:
✔GLM 4.7
✔Mistral Small 3.2 24B Instruct 2506
OBS: Varje modell debiteras separat — era 25 euro i Berget-krediter täcker detta.
⚡ Snabb & billigmer tokens = mer tid & pengarSmart, långsam & dyr 🧠
Varje svar förbrukar tokens, och tokens kostar tid och pengar. En större modell är bättre på svåra problem men kostar mer per svar. Matcha modellen mot uppgiften — enkelt jobb, liten modell.
💡
Osäker? Börja med standardmodellen. Byt upp om det känns långsamt eller svar saknar djup.
Nybörjare
Den viktigaste prompten
Berätta alltid för verktyget hur mycket stöd du behöver:
Jag kan inte programmera. Svara på enkel svenska.
Vägled mig steg för steg.
När du gör tekniska val — förklara varför,
som om jag aldrig kodat förut.
Varför det funkar
AI:n anpassar sitt språk, tempo och detaljnivå efter dig. Utan den här instruktionen gissar den — och gissar ofta fel.
Kombinera med din idé
"Jag är inte teknisk. Jag vill bygga en liten webbapp där hackathon-deltagare kan hitta teamkompisar. Hjälp mig steg för steg."
Nybörjare
Be verktyget lära dig verktyget
AI:n kan inte bara hjälpa dig bygga — den kan hjälpa dig förstå hur man använder den.
Jag är helt ny med det här verktyget.
Visa mig de 5 viktigaste sakerna jag behöver veta
för att komma igång med ett litet webbprojekt.
Förklara som om jag aldrig använt en terminal förut.
Fråga om kommandon
"Vilka kommandon kan jag använda?"
Fråga om arbetsflöde
"Vad är ett bra sätt att jobba med dig?"
Fråga om hjälp
"Jag förstår inte vad som hände. Förklara."
Alla
Kom igång — och hitta din idé
1
Beskriv dig själv
Jag heter X. Så här mycket har jag jobbat med AI-kodning: … Hjälp mig längs vägen.
2
Beskriv sammanhanget
Jag är på ett hackathon och behöver något klart på 4–5 timmar. Temat är ‘skärmfri tid’.
3
Ingen idé än? Be AI:n intervjua dig
Jag vet inte vad jag vill bygga. Intervjua mig för att hitta ett lämpligt projekt.
Steg 3 — AI:n kan fråga dig om…
Vad du jobbar med · vad som känns onödigt krångligt · problem eller något roligt · vem som ska använda det
“Ska det vara en mobilapp, något som körs på din dator, eller något på nätet?”
Fundera på arkitekturen innan du börjar. Osäker på vad ett val innebär? Be AI:n förklara konsekvenserna.
Alla
Plan före kod
“Börja inte med kod. Börja med frågor och en plan.”
Utan plan
"Bygg en enkel webbapp"
AI:n gissar allt: teknologi, struktur, design. Resultatet kanske funkar — men ni vet inte varför.
Med plan
"Jag vill bygga en enkel webbapp. Ställ frågor om vad du behöver veta innan du börjar koda. Gör sedan en plan som jag kan godkänna."
AI:n frågar, ni svarar, ni godkänner. Ni behåller kontrollen.
/plan
Skriv /plan manuellt för att säkerställa att verktyget går in i planeringsläge innan det skriver en rad kod.
Fördjupning
Subagenter — specialiserade hjälpare
Ibland delar huvudverktyget upp arbetet i specialiserade deluppgifter.
Ni behöver inte styra subagenter — verktyget gör det automatiskt. Bra att veta att det händer i bakgrunden.
Alla
Varför verktyg tappar tråden
AI:n har ett begränsat arbetsminne — ett “kontextfönster”. Långa, röriga sessioner gör att den tappar tråden.
Verktyget hanterar det automatiskt:
Auto compaction — när minnet börjar ta slut sammanfattar verktyget konversationen automatiskt och fortsätter. Du märker det knappt.
/clear — startar om minnet från noll. Bra när du byter uppgift eller känner att verktyget "glömt" vad ni höll på med.
/context — visar hur fullt kontextfönstret är. Eller fråga: "Hur ser mitt kontextfönster ut? Förklara enkelt."
Alla
Små steg, checkpoints och återhämtning
Så här håller du ordning:
1
Be om ett steg i taget
"Gör bara det första steget i planen."
2
Kolla vad som ändrades
"Vad ändrade du just? Förklara."
3
Committa ofta
"Vad borde jag committa nu?"
4
Be om sammanfattning
"Sammanfatta vad vi gjort och vad som är kvar."
Det här är inte långsamt — det är kontroll. Och kontroll sparar tid.
Om något går fel
Backa till tidigare commit:
"Oj, det blev fel. Hjälp mig gå tillbaka till förra fungerande versionen."
Alla
Iterera — så förbättrar du det du byggt
Bygg något litet
↓
Öppna i webbläsaren och kolla
↓
Berätta vad som är fel eller ser konstigt ut
↓
Upprepa
Du behöver inte förstå koden — du behöver kunna beskriva vad du ser:
"Knappen syns inte på mobilen."
"Det händer ingenting när jag klickar."
"Texten ser konstig ut — för liten och fel färg."
"Här är en screenshot — vad är fel?"
Tips: Bifoga en screenshot direkt — fungerar även i terminalen! AI:n ser vad du ser.
Skärmbild: Mac ⌘⇧4 (markera område) · ⌘⇧5 (fler val). Windows ⊞+Shift+S (markera område) · PrtSc (hela skärmen).
Kom ihåg: AI:n kan guida dig i hur du använder och felsöker appen du precis byggt.
Överkurs
Be AI:n bygga ett CLI-gränssnitt — då kan den köra och testa programmet helt själv.
Alla
Vad är CLAUDE.md och AGENTS.md?
Projektinstruktionsfiler — textfiler som berättar för AI-verktyget hur det ska arbeta i just ert projekt.
De hjälper verktyget komma ihåg ert projekts regler
De finns kvar mellan sessioner
De gör AI:ns hjälp mer konsekvent
Obs: De är vägledning, inte magiska garantier. AI:n gör sitt bästa att följa dem, men ni bör fortfarande granska resultatet.
Alla
Vad ska stå i filerna?
Projektmål: Vad ska appen göra?
Användare: Vem är den till för?
Teknik: Vilka verktyg och språk?
Starta: Hur kör man appen?
Testa: Hur kontrollerar man att det fungerar?
Begränsningar: Vad ska undvikas?
Färdigkriterier: När är det klart?
Förklaring: Förklara tekniska val som om jag vore nybörjare
Vårt exempel:
Projektmål: En enkel webbapp för hackathon
Användare: Hackathon-deltagare
Teknik: HTML, CSS, JavaScript
Start: Öppna index.html
Test: Öppna i webbläsaren
Begränsning: Håll det enkelt — funkar utan inloggning
Förklara: All teknik på vanlig svenska
Kort, konkret, praktiskt. Inte ett akademiskt dokument.
Alla
Låt AI:n skapa filen åt dig
Ni börjar troligen med ett tomt repo — ingen kod, ingen struktur. Perfekt läge att låta AI:n intervjua er om vad ni vill bygga och sedan skapa filen åt er:
Skapa ett första utkast till CLAUDE.md / AGENTS.md.
Eller mer detaljerat:
Jag börjar med ett tomt projekt. Intervjua mig om vad jag
vill bygga och skapa sedan ett utkast till CLAUDE.md /
AGENTS.md baserat på mina svar.
Tips: Håll filen kort, korrekt och praktisk. Ni kan alltid lägga till mer senare.
Alla
Söka information på nätet
AI:n kan hjälpa till med
Söka efter bibliotek och dokumentation
Jämföra tekniska alternativ
Planera utifrån beprövade metoder
Hitta exempel och tutorials
Tänk på
Använd pålitliga källor
Fråga vad den hittade och varför
Klistra aldrig in lösenord eller nycklar
Lita inte blint på kodsnuttar från nätet
Obs: Internetåtkomst, behörigheter och säkerhetsinställningar kan variera mellan verktyg och miljöer. Fråga verktyget vad det har tillgång till.
Alla
Hackathon-spelplan
1
Välj en liten idé — något som går att demo:a
2
Beskriv användaren — vem är det till för?
3
Berätta att du är nybörjare — be om stöd
4
Be om frågor och plan — innan kod
5
Bygg minsta prototypen — en sak som funkar
6
Testa tidigt — se att det fungerar
7
Committa ofta — spara tryggt
8
Dokumentera — skriv ner vad ni lärde er
“Litet och fungerande slår stort och halvtrasigt.”
Alla
Vanliga misstag och avslutning
✗För stor ambition — börja smått
✗För mycket tillit — granska alltid
✗För lite kontext — berätta vad du vill
✗För få commits — spara ofta
✗För mycket kaos i en session — sammanfatta och dela upp
“Ni behöver inte förstå allt. Ni behöver förstå tillräckligt för att bygga tryggt.”
Nu är det er tur. Vi ses på hackathon!
Startprompts att kopiera
Jag är inte teknisk. Förklara i vanlig svenska. Hjälp mig steg för steg.
Jag vill bygga [min idé]. Ställ frågor innan du börjar koda. Gör en plan som jag kan godkänna.
Jag är helt ny med det här verktyget. Visa mig de 5 viktigaste sakerna jag behöver veta för att komma igång.
Vad ändrade du just? Förklara varje ändring så jag förstår.
Vad borde jag committa nu? Formulera ett commit-meddelande åt mig.
Skapa ett första utkast till CLAUDE.md / AGENTS.md för det här projektet.
CLAUDE.md / AGENTS.md — mall
# Projektnamn
En mening som beskriver vad projektet gör.
## Användare
Vem är appen till för? Vilken teknisk nivå har de?
## Teknik
HTML, CSS, JavaScript (inga ramverk)
## Köra projektet
Öppna index.html i webbläsaren
## Testa
Öppna i webbläsaren och kontrollera att formuläret fungerar
## Regler
- Förklara tekniska beslut och avvägningar som om jag vore nybörjare