Vibe coding med Claude: Claude-chat, Claude Code og bygning fra Claude

Vibe coding med Claude virker på tre måder. Claude-chat bygger små apps på én side lige i samtalen. Claude Code er en agent, der redigerer et rigtigt projekt på din maskine eller i cloud'en, til folk der er trygge med en kodebase. Og Claude plus en appbygger via MCP lader dig bygge, preview'e og publicere en fuld-stack-app med database uden at forlade Claude-samtalen. Hvilken der passer, afhænger af, hvad du bygger, og hvor meget af opsætningen du vil eje selv.

Denne guide dækker alle tre med prompts og grænserne for hver. For ideen bag det hele, se hvad vibe coding er.

Mulighed 1: Claude-chat til små værktøjer

I den almindelige Claude-app kan du bede om noget interaktivt, og Claude skriver det som kode, der kører lige ved siden af samtalen: en beregner, en flashcard-øvelse, et lille spil, et diagram over data du indsætter. Du ændrer det ved at svare.

En god prompt her er selvstændig:

Lav et interaktivt værktøj, hvor jeg indsætter en liste over udgifter (én pr. linje, "beløb, kategori"), og det viser et kagediagram pr. kategori og en total. Medtag en eksempelliste, så det virker med det samme.

Det er godt til: hurtige værktøjer på én side, som du bruger selv eller deler som et link, og læring, fordi du kan bede Claude forklare hver del.

Hvor det stopper: disse kører i Claudes miljø. Der er ingen vedvarende database af din egen, ingen brugerkonti, intet eget domæne og intet sted at køre en server. Når en idé vokser ud af én side, har du brug for en af de to næste muligheder.

Mulighed 2: Claude Code til en rigtig kodebase

Claude Code er Anthropics kodeagent. Den arbejder i din terminal, i editorer som VS Code og JetBrains, i en desktop-app og på nettet. Du giver den en opgave med almindelige ord, og den læser dit projekt, redigerer filer, kører kommandoer og tests og viser dig, hvad der er ændret. Da denne tekst blev skrevet, er den inkluderet i Claudes betalte planer og tilgængelig via API'et; tjek Anthropics side for de aktuelle planer.

En typisk vibe coding-session ser sådan ud:

Tilføj en /bookings-side, der lister den aktuelle brugers bookinger, nyeste først, med en annulleringsknap, der er deaktiveret mindre end to timer før holdet. Brug den eksisterende auth-hjælper. Kør testene, når du er færdig.

Det er godt til: udviklere og tekniske grundlæggere, der allerede har et projekt, vil have fuld kontrol over stakken og er glade for selv at køre og deploye den. Den er stærk til ændringer på tværs af flere filer og til at følge de konventioner, der allerede findes i en kodebase.

Hvor det kræver mere arbejde: du har brug for en udviklingsopsætning, og Claude Code hoster ikke noget. Databaser, hemmeligheder, deployment og domæner er dit at ordne. For en sammenligning med andre udviklerværktøjer, se Cursor vs. Windsurf vs. Claude Code.

Vaner, der virker godt med Claude Code

• Bed om en plan før store ændringer. "Skitsér trinene og filerne, du vil røre ved, og vent derefter."
• Hold en projektnotefil. Claude Code læser en projekthukommelsesfil (CLAUDE.md) for konventioner, så du ikke skal gentage dem.
• Gennemgå diffen. Selv når du laver vibe coding, så gennemse hvad der er ændret i følsomme områder: login, betalinger, alt med brugerdata.
• Commit ofte. Små commits gør det nemt at fortryde et dårligt skridt.

Mulighed 3: Byg og publicér fra Claude med Mythex

Hvis du kan lide at arbejde i Claude, men vil have en rigtig app til sidst — database, logins, filopbevaring, en offentlig URL — kan du forbinde Claude til en AI-appbygger via MCP, protokollen der lader Claude bruge værktøjer, der hostes andetsteds. (Hvad MCP er forklarer det med almindelige ord.)

Mythex kører en MCP-server. Når den er forbundet, kan Claude oprette et Mythex-projekt, skrive koden i en privat cloud-sandbox, starte et live preview, tilknytte en database og filopbevaring og publicere appen. Hvert resultat indeholder et link, så du kan følge projektet live i Mythex.

Sådan forbinder du

1. I Mythex, åbn Kontoindstillinger og kopiér MCP-URL'en: https://mcp.mythex.ai/mcp.
2. I Claude, gå til Indstillinger → Connectors → Tilføj brugerdefineret connector, indsæt URL'en og klik på Forbind.
3. En Mythex-side åbnes. Log ind, hvis det er nødvendigt, og vælg Tillad adgang. Der er ingen API-nøgle at kopiere.
4. Tilbage i Claude, bed om det, du vil have.

Alle kan forbinde på alle planer; sandbox-værktøjerne kræver Mythex Pro ($25 om måneden). Claude-forbruget bliver på din Claude-plan, og sandbox-tid, previews og hosting kommer fra dine Mythex-kreditter. Den fulde gennemgang findes i byg Mythex-apps fra Claude, Cursor eller Codex.

En første prompt at prøve

Brug Mythex til at oprette et nyt projekt: et simpelt CRM til mit lille designstudie. Kontakter med navn, firma, e-mail, telefon, fase (lead, aktiv, tidligere) og noter. En tavlevisning grupperet efter fase, hvor jeg kan trække kontakter mellem kolonner, og et søgefelt. Tilføj en database, så data bliver gemt, og et login, så kun jeg kan se det. Start preview'et, og send mig linket, når det kører.

Derefter itereres i samme samtale, én ændring ad gangen:

I Mythex-projektet, tilføj en "næste opfølgning"-dato til kontakter og en liste på forsiden over opfølgninger, der forfalder denne uge. Tjek det i preview'et.

Publicér CRM'et, og giv mig den live URL.

Det er godt til: folk, der tænker bedst i Claude og vil have resultatet hostet, med en database, uden at opsætte servere. Du kan også skifte: start i Claude og fortsæt i Mythex-chatten, eller omvendt, for det er det samme projekt.

Hvilken skal du bruge?

Prompttips, der betyder mere med Claude

Claude følger detaljerede instruktioner tæt, hvilket virker i begge retninger.

• Sig, hvad der ikke skal ændres. "Behold layoutet og farverne; ændr kun formularvalideringen."
• Giv en definition af færdig. "Færdig betyder, at en ny kontakt gemmes, vises på tavlen og overlever et genindlæs."
• Bed den tjekke sit arbejde. I Claude Code betyder det at køre tests; med Mythex betyder det at tjekke det live preview eller køre en browsertest.
• Bed om forklaringer med almindelige ord, når du ikke følger en ændring. Det er den hurtigste måde at lære, hvad din app gør.

Vores cheat sheet med vibe coding-prompts har 30 prompts, der virker i alle tre opsætninger.

Sikkerhedsnoter for alle tre

• Indsæt ikke rigtige API-nøgler eller adgangskoder i en Claude-samtale. Med Mythex hører hemmeligheder hjemme i projektets indstillinger for hemmeligheder, og Claude kan se deres navne, men ikke deres værdier.
• Tjek hvem der kan se hvad, før du publicerer. "Kan en indloggset bruger åbne en anden brugers poster?" er det første spørgsmål at stille.
• Gennemgå følsom kode. Claude er en dygtig kodeskriver, men vibe coding betyder, at du ikke læser hver linje, så vælg de linjer, der betyder noget. Se er vibe coding sikkert?.

Bruger du også ChatGPT, dækker følgeguiden vibe coding med ChatGPT og Codex. Og hvis du hellere vil springe opsætningen over helt, så åbn AI-appbyggeren og beskriv din app der.

Spørgsmål