Vibecoding a FOMO: Opravdu vám ujíždí vlak? Vytvořte si vlastní aplikaci.

Co je to vlastně ten vibecoding

Vysvětlení vibecodingu je v podstatě velmi jednoduché. Místo klasického programování a psaní kódu využívá uživatel AI nástroje, se kterými komunikuje skrze prompty, nebo ještě jednodušeji řečeno, tak jako by se bavil s druhým člověkem. Během krátké doby lze tímto způsobem vytvořit jednoduché aplikace, návrhy webových stránek nebo automatizace. A to úplně bez znalosti programovacích jazyků. Výsledek? To, co by dříve trvalo týdny, vznikne během pár hodin. Zní to skvěle a v mnoha případech to skutečně skvělé je. Má to ale svá ale.

Co je FOMO a proč se objevuje právě teď

Marketingový pojem FOMO je znám zejména mladší generaci. Jedná se o zkratku z anglického fear of missing out = tedy strach, že vám něco utíká. Běžně se projevuje jako pocit, že ostatní dělají něco, co byste měli dělat také, že jsou ostatní napřed, nebo že jste zkrátka zaspali dobu. V nákupním procesu se může jednat o situaci, kdy máte strach, že se vyprodá výrobek, o který máte zájem. Někteří tvůrci momentálně řeší vibecoding a AI témata opravdu intenzivně. Ve feedech se neustále objevují příspěvky o SAAS projektech postavených v podstatě za víkend. Každý technologický influencer už má minimálně 3 agenty, kteří běží 24/7 na počítačích zvlášť k tomu určených (nejčastěji se zmiňuje stroj Mac mini M4 ). Pokud sociální sítě konzumujete denně, je velmi snadné podlehnout pocitu, že kdo tyto věci nedělá, tomu ujíždí vlak.

Podobný efekt se neustále opakuje

Stejný mechanismus jste již mohli zaznamenat mnohokrát. Od vstupu umělé inteligence na trh vznikl tlak, že kdo nepoužívá AI na určité činnosti (sem si klidně dosaďte cokoliv, co se týče práce nebo osobního života) zaostává a trh ho brzy nahradí. Lidé tak začali automatizovat e-maily, používat LLM modely na vytváření všelijakých textů nebo generovat obrázky. Jen aby nebyli pozadu. Pokud tohle neděláte, AI vás brzy nahradí. Je to ale všechno opravdu potřeba?

Při automatizaci a zvyšování efektivity se často zapomíná na jednu věc. Vysoká efektivita není vždy nezbytnou nutností. Pokud vám denně nepřicházejí vyšší desítky e-mailů, stále je naprosto v pořádku odpovídat na ně ručně. Lidsky, bez workflows a bez automatizací. Zrovna u e-mailů totiž existuje i druhá strana mince. Pokud za vás odpovídá chatbot, nebo genericky vycvičené LLM, druhá strana takovou odpověď většinou velice rychlé rozpozná. A místo úspory času dojde ke ztrátě důvěry.

Klidně si vibecoding vyzkoušejte

Pokud jste ale hračička a rádi si technologie vyzkoušíte, směle do toho. Není nutné hned postavit robustní systém pro nadnárodní korporaci. Vlastně není nutné ani postavit nový Shoptet. Zamyslete se a zkuste si vytvořit jednoduchou webovou aplikaci, která vám klidně jednorázově pomůže vyřešit nějaký problém. Nebo vám jen udělá radost. Pokud vás nic nenapadá, není nutné tlačit na pilu, časem nápad přijde sám. Může se jednat o kalkulačku, o malou webovou aplikaci, která bude vytvářet graf ceny vašeho tankování nebo třeba o systém na zalévání květin. Všechny tyhle problémy už pravděpodobně řeší nějaká jiná aplikace, ale to vůbec nevadí. Vy si chcete vyzkoušet proces tvorby a na konci mít radost, že to opravdu funguje.

Ukázka Lovable.dev

Abych zde nepsal jen v teoretické rovině, pojďme si rovnou vibecoding aplikace vyzkoušet v praxi. Použiji aplikaci lovable.dev, už jen proto, že v určitém rozsahu je k vyzkoušení zcela zdarma. Každý den jsou vám přiděleny kredity, které můžete využívat k iterování vašich výstupů. Kreditů není mnoho, ale na hraní s vytvářením vlastních aplikací bohatě stačí. Po otevření webu (a registraci) začneme rovnou psát prompt, tedy nějakou naši představu. Mně osobně by se líbila aplikace na záznam tankování. Pojďme si tedy zkusit společně takovou aplikaci vytvořit.

Prompt píšu zcela podle sebe, nemusíte se bát ani zjednodušovat (počítejte ale s větším množstvím úprav, a tím pádem větší spotřebou kreditů). Zde bych doporučil si všechno nejprve promyslet a alespoň trochu naplánovat.
Prompt:

Vytvoříme webovou aplikaci pro zaznamenávání tankování pohonných hmot. Uživatel při každém tankování zadá následující vstupy:
1. Datum tankování
2. Stav tachometru v kilometrech v čase tankování
3. Cena pohonné hmoty, kterou natankoval, za 1 litr
4. Objem litrů, které natankoval
5. Celková cena tankování
6. Místo tankování

Údaje se zanesou do přehledné tabulky níže, kterou bude mít uživatel k dispozici. Vedle tabulky bude navíc několik grafů:
1. Vývoj ceny pohonných hmot dle záznamů uživatele. Osa x budou měsíce a roky tankování, osa y bude cena za litr.
2. Nájezd uživatelova vozu. Osa x budou měsíce a roky tankování, osa y bude nájezd vozu ze stavu tachometru.
3. Celková částka zaplacená za pohonné hmoty.

Nástroj několik minut přemýšlí, až konečně ukáže první variantu naší webové aplikace.

V pravé části vidíme náhled, který je navíc plně funkční. Nyní je tedy čas na to, si aplikaci vyzkoušet a doladit. Nejprve vyzkoušíme zadat první záznam.

Zápis funguje skvěle, bez chyb, jako malý bonus nám Lovable sám navrhnul funkci, při které násobí počet litrů cenou za litr, tudíž není nutné vyplňovat celkovou částku. Graf se zobrazí až od více záznamů, v dalším kroku si tedy otestuji i tuto funkci - pojďme přidat více záznamů.

Po přidání více záznamů si začínáme všímat prvních chyb. Metrika celkového nájezdu nedává příliš smysl a mohla by ukazovat spíše současný stav tachometru. Pro zobrazení grafů je nutné scrollovat níže, a aplikace tak není příliš praktická. Graf celkových nákladů sice znázorňuje, že celkový náklad je vyšší a vyšší, pro statistický součet nám však stačí buňka „celkem zaplaceno“, kterou si vytvořil sám Lovable. Hodnoty v grafu nájezdu vozu nejsou téměř viditelné, kvůli příliš vysokému rozptylu. Nyní je tak čas na provedení změn. Tyto změny neřešíme v kódu, ale psaním do chatu, tak jak to známe z LLM. A právě tyto změny stojí kredity.

Prompt:

1) Odstraň graf "Celkové náklady na pohonné hmoty"

2) Graf "Nájezd vozu" má příliš vysoké hodnoty na ose Y. Potřebujeme zobrazit pouze hodnoty v rozmezí 200 000 - 220 000km.

3) Informační buňku "Celkový nájezd" nahraď buňkou "Aktuální stav tachometru", která bude reflektovat hodnotu posledního záznamu stavu tachometru.

Za několik vteřin se úpravy propíší přesně podle našeho promptu. Všimněte si, že jsem nepoužíval žádné technicky složité názvy, vytvořit podobný prompt tak zvládne opravdu úplně každý. Osobně mám raději světlé varianty aplikací, stejně tak by se mi líbilo, kdyby grafy byly pod tabulkou, která by se roztáhla na celou šířku. Zbyly nám nějaké kredity, pojďme tedy napsat další prompt:

1) Celou aplikaci bych chtěl spíše ve světlém režimu. Uprav tomu i barvy dat a grafů tak, aby byly vidět na světlém podkladu.

2) Tabulku se záznamy tankování roztáhni na šířku aplikace. Grafy budou nyní vedle sebe, pod touto tabulkou.

Tahle úprava už zabrala o něco delší dobu, nicméně výsledek stojí opravdu za to. Prodal bych tento doplněk velké firmě? Pravděpodobně ne. Bavil mě proces a budu doplněk sám používat? Jednoznačně ano. Nicméně je důležité dodat, že v této podobě se data nikam neukládají (je nutné připojit - opět promptem - jednoduchou databázi). Při zveřejnění přes Lovable se vám navíc do dat může kdokoliv dostat (pokud zná vaši unikátní url adresu) a data přepsat. I na to Lovable myslí, již ale v placené verzi. Bylo by také možné přidat spoustu dalších funkcí, jako třeba přepínač světlého a tmavého režimu, databázi nákladů a oprav a spoustu dalších vychytávek. To už nechám ale na vás.

Závěrem

Jak jsme si ukázali na příkladu, vibecoding skvěle poslouží tam, kde chybí technické znalosti. Já osobně ho používám pro vytváření menších jednorázových aplikací (např. plánovač docházky) nebo na prototypování webových stránek. Je pro mě o dost jednodušší poslat programátorovi funkční klikatelné demo, které následně ladíme, než složitě popisovat moji přesnou představu. Není ale nutné implementovat AI a vibecoding do všech činností, tak jak to vídáme na sítích. Na e-maily tak v klidu odpovídejte ručně, neděste se, že nevlastníte ani jeden kus Macu mini M4, a pokud máte chuť, zkuste si něco naklikat. Třeba právě v Lovable.