Vibe coding s Claude: Claude chat, Claude Code a tvorba aplikácie z Claude

Vibe coding s Claude funguje tromi spôsobmi. Claude chat vytvára malé jednostránkové aplikácie priamo v konverzácii. Claude Code je agent, ktorý upravuje skutočný projekt na vašom počítači alebo v cloude, pre ľudí, ktorí sa cítia pohodlne s kódovým základom. A Claude a tvorca aplikácií cez MCP vám umožňuje tvoriť, zobrazovať náhľad a publikovať úplnú aplikáciu s databázou bez opustenia konverzácie s Claude. Ktorý sa hodí, závisí od toho, čo stavate a koľko nastavenia chcete mať pod kontrolou.

Tento návod pokrýva všetky tri, s promptmi a hranicami každého. Pre myšlienku, ktorá za tým stojí, pozrite si čo je vibe coding.

Možnosť 1: Claude chat pre malé nástroje

V bežnej aplikácii Claude môžete požiadať o niečo interaktívne a Claude to napíše ako kód, ktorý beží priamo vedľa konverzácie: kalkulačku, kartičky na učenie, malú hru, graf z dát, ktoré vložíte. Zmeníte to odpoveďou.

Dobrý prompt tu je sebestačný:

Vytvor interaktívny nástroj, do ktorého vložím zoznam výdavkov (jeden na riadok, „suma, kategória“) a zobrazí koláčový graf podľa kategórie a celkovú sumu. Pridaj vzorový zoznam, aby to fungovalo hneď.

Vhodné na: rýchle jednostránkové nástroje, ktoré používate sami alebo zdieľate ako odkaz, a na učenie, pretože môžete požiadať Claude, aby vysvetlil každú časť.

Kde to končí: tieto bežia v prostredí Claude. Nie je tu vlastná trvalá databáza, používateľské účty, vlastná doména ani kde spustiť server. Keď nápad prerastie jednu stránku, potrebujete jednu z ďalších dvoch možností.

Možnosť 2: Claude Code pre skutočný kódový základ

Claude Code je kódový agent od Anthropic. Pracuje vo vašom termináli, v editoroch ako VS Code a JetBrains, v desktopovej aplikácii a na webe. Zadáte mu úlohu obyčajným jazykom a on prečíta váš projekt, upraví súbory, spustí príkazy a testy a ukáže, čo sa zmenilo. V čase písania je súčasťou platených plánov Claude a dostupný cez API; aktuálne plány si overte na stránke Anthropic.

Typická relácia vibe codingu vyzerá takto:

Pridaj stránku /rezervacie, ktorá zobrazí rezervácie aktuálneho používateľa, najnovšie hore, s tlačidlom na zrušenie, ktoré je neaktívne menej než dve hodiny pred hodinou. Použi existujúcu pomocnú funkciu na prihlasovanie. Keď skončíš, spusti testy.

Vhodné na: vývojárov a technických zakladateľov, ktorí už majú projekt, chcú plnú kontrolu nad technológiami a sú ochotní aplikáciu spúšťať a nasadzovať sami. Je silný pri zmenách naprieč viacerými súbormi a pri dodržiavaní konvencií, ktoré už v kódovom základe sú.

Kde je to náročnejšie: potrebujete vývojové nastavenie a Claude Code nič nehostuje. Databázy, tajomstvá, nasadenie a domény si zabezpečujete sami. Porovnanie s inými nástrojmi pre vývojárov nájdete v článku Cursor vs Windsurf vs Claude Code.

Návyky, ktoré s Claude Code dobre fungujú

• Pred veľkými zmenami si vyžiadajte plán. „Načrtni kroky a súbory, ktorých sa dotkneš, a potom počkaj.“
• Udržiavajte súbor s poznámkami k projektu. Claude Code číta súbor s pamäťou projektu (CLAUDE.md) s konvenciami, takže ich nemusíte opakovať.
• Kontrolujte rozdiel. Aj pri vibe codingu preletite, čo sa zmenilo v citlivých oblastiach: prihlasovanie, platby, všetko s používateľskými dátami.
• Commitujte často. Malé commity uľahčujú vrátenie zlého kroku.

Možnosť 3: Vytvorte a publikujte z Claude pomocou Mythex

Ak máte radi prácu v Claude, ale na konci chcete skutočnú aplikáciu — databázu, prihlasovanie, úložisko súborov, verejnú URL — môžete pripojiť Claude k tvorcovi aplikácií pomocou MCP, protokolu, ktorý Claude umožňuje používať nástroje hostované inde. (Čo je MCP to vysvetľuje jednoducho.)

Mythex prevádzkuje MCP server. Keď je pripojený, Claude dokáže vytvoriť projekt Mythex, napísať kód v súkromnom cloudovom sandboxe, spustiť živý náhľad, pridať databázu a úložisko súborov a publikovať aplikáciu. Každý výsledok obsahuje odkaz, kde môžete projekt sledovať naživo v Mythex.

Ako pripojiť

1. V Mythex otvorte Nastavenia účtu a skopírujte MCP URL: https://mcp.mythex.ai/mcp.
2. V Claude prejdite do Nastavenia → Konektory → Pridať vlastný konektor, vložte URL a kliknite na Pripojiť.
3. Otvorí sa stránka Mythex. Ak treba, prihláste sa a zvoľte Povoliť prístup. Nič nekopírujete ako API kľúč.
4. Späť v Claude požiadajte o to, čo chcete.

Pripojiť sa môže ktokoľvek na ľubovoľnom pláne; nástroje sandboxu vyžadujú Mythex Pro ($25 mesačne). Použitie Claude zostáva na vašom pláne Claude a čas sandboxu, náhľady a hosting pochádzajú z vašich kreditov Mythex. Celý postup nájdete v článku tvorba aplikácií Mythex z Claude, Cursor alebo Codexu.

Prvý prompt na vyskúšanie

Použi Mythex a vytvor nový projekt: jednoduchý CRM pre moje malé dizajnérske štúdio. Kontakty s menom, firmou, e-mailom, telefónom, fázou (lead, aktívny, bývalý) a poznámkami. Zobrazenie nástenky podľa fázy, kde môžem presúvať kontakty medzi stĺpcami, a vyhľadávacie pole. Pridaj databázu, aby dáta pretrvali, a prihlasovanie, aby ich videl iba ja. Spusti náhľad a pošli mi odkaz, keď bude bežať.

Potom iterujte v tej istej konverzácii, jedna zmena naraz:

V projekte Mythex pridaj ku kontaktom dátum ďalšieho sledovania a na domovskej obrazovke zoznam sledovaní, ktoré sú na tento týždeň. Over to v náhľade.

Publikuj CRM a daj mi živú URL.

Vhodné na: ľudí, ktorí najlepšie premýšľajú v Claude a chcú výsledok hostovaný s databázou bez nastavovania serverov. Môžete aj prepínať: začať v Claude a pokračovať v chate Mythex, alebo naopak, pretože je to rovnaký projekt.

Ktorú možnosť zvoliť

Tipy k promptom, ktoré s Claude viac záležia

Claude pozorne dodržiava podrobné pokyny, čo funguje na oboch stranách.

• Povedzte, čo nemeniť. „Ponechaj rozloženie a farby; zmeň iba validáciu formulára.“
• Dajte mu definíciu hotovosti. „Hotovo znamená, že sa nový kontakt uloží, zobrazí na nástenke a prežije obnovenie.“
• Požiadajte ho, aby skontroloval svoju prácu. V Claude Code to znamená spustiť testy; s Mythex to znamená skontrolovať živý náhľad alebo spustiť test v prehliadači.
• Žiadajte vysvetlenia obyčajnými slovami, keď nerozumiete zmene. Je to najrýchlejší spôsob, ako zistiť, čo vaša aplikácia robí.

Náš cheat sheet s promptmi pre vibe coding má 30 promptov, ktoré fungujú v ktoromkoľvek z troch nastavení.

Bezpečnostné poznámky pre všetky tri

• Nevkladajte skutočné API kľúče ani heslá do konverzácie s Claude. S Mythex patria tajomstvá do nastavení tajomstiev projektu a Claude vidí ich názvy, ale nie hodnoty.
• Pred publikovaním skontrolujte, kto čo môže vidieť. „Môže prihlásený používateľ otvoriť cudzie záznamy?“ je prvá otázka, ktorú treba položiť.
• Kontrolujte citlivý kód. Claude je schopný programátor, ale pri vibe codingu nečítate každý riadok, takže vyberte tie, na ktorých záleží. Pozrite si je vibe coding bezpečný?.

Ak používate aj ChatGPT, sprievodca k nemu pokrýva vibe coding s ChatGPT a Codexom. A ak chcete preskočiť nastavovanie úplne, otvorte AI tvorcu aplikácií a opíšte svoju aplikáciu tam.

Otázky