← Alle guides

DEL 3 · VÆRKTØJER I PRAKSIS

Vibecoding med Claude Code: Byg apps uden at skrive kode

Lær at bygge fungerende websites og interne værktøjer ved at beskrive dem på almindeligt dansk — uden én linje kode.

10 min Benjamin Ittaouil
claude codevibecodingAI-værktøjerno-codeproduktivitetdansk AI

Efter at have læst denne guide kan du sætte Claude Code op fra bunden, bruge en klar prompt-skabelon til at bygge dit første projekt, undgå de typiske fejl der spilder tid og penge, og overdrage et færdigt prototype til en rigtig udvikler.

Hvad er vibecoding — og hvorfor gider du det?

Vibecoding betyder at du beskriver hvad du vil have på almindeligt dansk, og et AI-system skriver al koden selv. Du ser aldrig en linje kode. Du skriver bare hvad du ønsker, og det opstår.

Det er godt til præcis to ting:

Ting 1: Du bygger en klikbar version af din idé og sender den til en udvikler eller designer, så de stopper med at gætte hvad du mener. En håndværksmester kan forklare i timevis hvad han vil have — eller sende et fungerende mockup.

Ting 2: Du bygger et lille internt værktøj der løser en kedelig opgave bedre end en generisk AI-chat. Til dig selv, dit team eller et par kunder. Ru kanter er fint, for ingen andre ser dem.

Det er ikke vejen til hurtige millioner. Men det er den hurtigste vej til at gå fra idé til noget der faktisk eksisterer.

Sådan sætter du Claude Code op — 7 trin

Trin 1: Hent appen. Gå til claude.com/download, installer den, og tegn et Pro-abonnement for ca. 140 kr. om måneden. Åbn fanen "Code" øverst. Vil du have flere tokens, koster Max-planen ca. 700 kr. om måneden.

Trin 2: Lav en ren mappe. Opret én tom mappe på din computer kun til dette projekt. Ingen passwords, ingen private filer, intet du ikke kan leve uden. Claude rører kun ved den mappe du peger den mod — og ingenting andet.

Trin 3: Slå bypass-tilladelser til. Uden denne indstilling beder Claude om din godkendelse til hvert eneste lille skridt, og du klikker "tillad" 30 gange pr. session. Gå til Indstillinger → Claude Code → slå "Allow bypass permissions mode" til. Nu arbejder Claude, mens du gør noget andet.

OBS: Hvis du er på en virksomhed, spørg IT-afdelingen først. Og vær opmærksom på at indstillingen nogle gange kan være lidt ustabil i nyere versioner.

Trin 4: Tilslut Netlify og Supabase. Begge er gratis til grundlæggende brug.

  • Netlify er det der sender dit site live på internettet.
  • Supabase er der hvor data og logins bor, når du får brug for det.

Gå til Indstillinger → Connectors → tilføj de to tjenester. Opret gratis konti og godkend adgangen. Det er engangsopsætning.

Trin 5: Vælg din mappe. Klik på + og peg Claude mod den mappe du oprettede i trin 2.

Trin 6: Vælg din model. Brug Opus 4.8 på High-niveau for de bedste resultater. Jo smartere model, jo flere tokens bruges der — men mere om det under priser.

Trin 7: Du er klar. Nu kan du bygge.

Kopier denne mega-prompt og brug den hver gang

Når du åbner Claude Code, indsætter du denne prompt som udgangspunkt:

Du er min CTO. Jeg er direktør, jeg skriver ikke kode, og jeg vil ikke læse det. Bypass-tilladelser er slået til, så stop ikke for at bede mig godkende tekniske skridt. Byg det bare.

Tal til mig på almindeligt dansk — kun om det jeg kan se, klikke på eller beslutte. Ingen kode, ingen fagjargon.

Jeg vil have [dit mål, fx "en simpel bookingside til min rådgivningsvirksomhed, hvor folk vælger et tidspunkt"].

Før du bygger noget, interviewer du mig. Stil mig alt hvad du skal bruge for at gøre det rigtigt — ét spørgsmål ad gangen — så jeg kan klikke mine svar. Hold spørgsmålene om hvad det skal gøre og hvordan det skal se ud. De tekniske valg træffer du selv. Når du har nok, fortæller du mig planen i et par klare sætninger — og bygger så.

Brug Netlify til at sende det live og giv mig et link alle kan åbne.

Brug Supabase til data og tilføj Google-login med Row Level Security, så hver bruger kun ser sine egne data.

Brug det screenshot jeg har delt som designreference.

Byg ét stykke ad gangen. Efter hvert stykke: åbn det selv, tjek at det virker (også på telefon) og ligner skærmbilledet — og ret hvad der er galt, inden du viser mig det. Fortæl mig derefter hvad jeg skal kigge på.

Erstat kun linjen med dit mål. Vedhæft gerne et screenshot af et site du kan lide, så Claude har et visuelt udgangspunkt.

Fire vaner der gør dig til en bedre vibecoder

Start fra et screenshot. Fundet et site du kan lide? Screenshot det, træk det ind i Claude, og skriv: "Byg mig dette, men til mit formål." Det er den hurtigste start der findes. Gode steder at finde inspiration: Dribbble, Awwwards, Mobbin, One Page Love og SaaS Landing Page.

Beskriv slutresultatet. Sig hvad du vil have til at eksistere — lad Claude vælge fremgangsmåden. Fx: "En ren landingsside til min regnskabsvirksomhed. Stor overskrift, tre pakker med priser, en kontaktknap og adresse i bunden."

Ét stykke ad gangen. Byg forsiden. Få den til at virke. Så næste side. Hvert besked er én lille opgave — ikke tolv på én gang.

Kør løkken. Se hvad Claude har bygget. Skriv ned hvad der er galt i klart sprog, nummereret liste. Sæt det ind. Claude retter. Opdater siden og kig igen. Du kører typisk fem-seks runder pr. side — og det er faktisk tilfredsstillende.

Sidder du fast på en fejl? Screenshot fejlen, indsæt den, skriv "ret dette". Hurtigere end at forklare det.

Hvorfor dit site ligner alle andres — og hvad du gør ved det

Første gang vibecoding lykkedes, føles det mærkeligt godt. Men du opdager hurtigt at alle andre sidder med den samme generiske AI-æstetik.

Her er tre måder at fix det på:

Brug en DESIGN.md-fil. Det er et simpelt tekstdokument der definerer et fuldt designsystem: præcise farver, fonte, afstand og regler. Du lægger filen i din projektmappe og skriver til Claude: "Brug denne fil til al styling." Claude følger den overalt, og hele sitet ser ud som om én designer har lavet det.

Du behøver ikke skrive den selv. På getdesign.md finder du færdige filer for kendte virksomheder som Stripe, Notion og Airbnb. Download én, træk den ind, og dit site har pludselig en rigtig æstetisk identitet.

Vil du have endnu flere muligheder: designmd.app har over 400 designsystemer.

Brug et rigtigt komponentbibliotek. Fortæl Claude: "Brug shadcn/ui-komponenter." Det er det toolkit de fleste veldesignede moderne sites er bygget på. Dine knapper, menuer og formularer ser professionelle ud i stedet for hjemmelavede. Det koster ekstra tokens, men virker særligt godt til dashboards, SaaS-apps og sider med mange formularer.

Vær specifik med referencer. Screenshot to sites du kan lide og indsæt dem begge. Navngiv fonten. Bed om mere luft. Angiv de præcise farver. Jo mere specifik du er, jo mindre generisk bliver resultatet.

Og stop med at skrive "gør det pænt". Det hjælper ingenting.

Hvornår bruger du IKKE Claude Code?

Claude Code er det forkerte valg til en hel del opgaver:

Opgave Brug i stedet
Lille widget du kigger på én gang Artifact i normal Claude-chat
Dokument eller regneark Claude direkte i chatten
Enkelt billede eller infografik ChatGPT med High-indstilling
Hurtigt svar eller analyse Almindelig Claude-chat

Min tommelfingerregel: Brug ikke længere tid på at bygge det end på at bruge det.

Mange elsker at vibecoder i timevis på noget de aldrig kommer til at bruge. Det er performativ produktivitet. Det koster dig tid — og tokens.

Hvad koster det egentlig?

Pro-abonnementet til ca. 140 kr./md. er nok til at komme i gang. Du behøver ikke den dyre plan for at prøve det af.

Men Claude Code bruger dit kreditforbrug hurtigere end en normal chat, fordi hvert besked gensender hele samtalen plus alle filer Claude har læst.

Fire vaner der holder dig under grænsen:

  • Start en frisk chat til hver ny opgave
  • Brug Sonnet-modellen hvis du er på 140 kr./md.-planen
  • Brug kun Opus 4.8 High hvis du betaler for Max-planen
  • Bed Claude om en plan inden store ændringer, så du ikke betaler for et forkert spor

Skriv /usage i din Claude Code-chat for at se dit aktuelle forbrug.

8 prompts du kan kopiere med det samme

Landingsside:

En landingsside til min [HR-rådgivningsvirksomhed] der sælger [mit gruppeforløb]. Stor overskrift, kort pitch, [3] pakker med priser, et par kundecitater og en [booking]-knap. Rolig og professionel stil med masser af luft.

Mockup til din udvikler:

En klikbar mockup af [den funktion jeg ikke kan forklare]: [et overbliksdashboard over teamets opgaver]. Den behøver ikke virke rigtigt. Jeg skal bare vise min [udvikler] skærmene og flowet. Skriv bagefter en kort klar beskrivelse af hvad du har bygget, så jeg kan aflevere den.

Automatiseringsværktøj:

Et værktøj der tager [min eksport af ordrer] og [laver en ren månedlig rapport med totaler pr. produkt]. Jeg smider filen ind, og jeg får rapporten tilbage. Kun til mig — ru kanter er fint.

App med login:

En simpel app hvor [mine kunder] logger ind med Google og ser [deres egne projekter og næste opgave]. Hver person ser kun sine egne data. Start med [én skærm], vi tilføjer mere bagefter.

Dashboard:

Et dashboard der læser [regnearket i denne mappe] og viser [omsætning, nye kunder og refusioner] som simple grafer. Opdater det når jeg smider en ny fil ind.

Erstat et dyrt abonnement:

Et internt værktøj der erstatter [den platform vi betaler 1.500 kr./md. for til [vagtplanlægning]]. Det skal kun gøre de [3] ting vi faktisk bruger: [list dem]. Kun til mit team — og gør det hurtigere end det vi dropper.

Læs en bunke filer:

Et værktøj der læser [alle PDF-filer i denne mappe] og trækker [kundenavn, udløbsdato og total] ud i ét rent regneark. Jeg smider filerne ind, det klarer resten.

Marketingvariationer:

Et værktøj hvor jeg indsætter [min bedste annonce], og det giver mig [10] nye versioner til [forskellige målgrupper] — med min tone bevaret. Sæt dem i en simpel liste jeg kan kopiere fra.

Sådan overdrager du til en rigtig udvikler

På et tidspunkt bliver dit projekt alvorligt. Det skal håndtere 1.000+ brugere, eller det skal opbevare andres private data. Det er det tidspunkt du henter en menneskelig udvikler ind.

Overdragelsen er enkel, fordi alt ligger i én mappe. Send mappen.

Brug denne prompt inden du sender:

Du er min CTO, og vi overdrager dette projekt til en rigtig udvikler.

Skriv dem en overdragelsefil kaldet HANDOFF.md og gem den i denne mappe. Almindeligt dansk, ingen fluff:

- Hvad denne app gør, og hvem den er til.
- Hvad der er bygget og virker, og hvad der stadig er ru eller uafsluttet.
- Hvilken stak du brugte (Netlify, Supabase) og hvor de vigtige dele bor.
- Hvad en udvikler skal vide inden de rører det: hvordan logins virker, hvor data bor, eventuelle hemmeligheder eller faldgruber.
- En ærlig note: dette er en prototype jeg har bygget ved at beskrive det — ikke produktionsklar kode.

Hold det til fem minutters læsning, så de hurtigt kan overtage.

Den blå HANDOFF.md-fil i din mappe er det du sender videre.


Når du har afprøvet Claude på en konkret opgave, kan du tage næste skridt på Claude-masterclassen. Det er en 4-timers hands-on masterclass for dig, der allerede bruger Claude, med fokus på grundprincipperne: Du arbejder med en reel opgave, får feedback og bygger et personligt setup med projekter, instruktioner og prompts til gentagne opgaver samt en 30-dages plan.

Ofte stillede spørgsmål

Skal jeg kunne kode for at bruge Claude Code?

Nej. Hele pointen er at du beskriver hvad du vil have på almindeligt dansk, og Claude skriver koden selv. Du behøver aldrig åbne en kodefil.

Hvad koster det at komme i gang?

Pro-abonnementet koster ca. 140 kr. om måneden og er nok til at eksperimentere. Netlify og Supabase er gratis til grundlæggende brug. Vil du have den kraftigste model (Opus 4.8 High) på fuld gas, koster Max-planen ca. 700 kr./md.

Kan jeg bruge Claude Code til rigtige kundevendte produkter?

En prototype, ja. Et produkt med rigtige brugeres private data og seriøse sikkerhedskrav: nej, ikke direkte. Brug vibecoding til at afklare og vise din idé — og overdrag derefter til en udvikler med HANDOFF.md-filen.

Hvad gør jeg hvis Claude løber ind i en fejl jeg ikke forstår?

Take et screenshot af fejlen og indsæt det i chatten med teksten "ret dette". Det er hurtigere end at forsøge at forklare det. Starter du en frisk chat, undgår du også at betale tokens for en lang samtalehistorik der ingen gavn gør.

Hvad kan AI gøre for dig?

Skriv et par linjer — jeg vender tilbage inden for 24 timer.

Kom i gang →