Lovable návod: Kompletní průvodce pro začátečníky [2026]

Co je Lovable a proč ho používat?

Lovable (dříve GPT Engineer) je AI-powered platforma pro tvorbu webových aplikací. Na rozdíl od tradičního kódování stačí popsat, co chcete vytvořit, a Lovable vygeneruje kompletní kód — frontend v Reactu, backend přes Supabase, styling pomocí Tailwind CSS a UI komponenty ze shadcn/ui.

Proč Lovable vyniká oproti konkurenci? Zatímco Cursor vyžaduje znalost kódu a Bolt.new je zaměřený spíše na rychlé prototypy, Lovable nabízí unikátní kombinaci: vizuální náhled v reálném čase, integrovanou databázi přes Supabase, a možnost kdykoliv exportovat čistý kód do vlastního repozitáře. Pro netechnické zakladatele a vibecodery je to ideální vstupní bod.

Pro koho je Lovable ideální?

Lovable se hodí pro podnikatele, kteří chtějí rychle validovat nápad bez najímání vývojářů. Pro designéry, kteří chtějí prototypovat funkční aplikace místo statických wireframů. Pro začínající vývojáře, kteří se učí programování a chtějí vidět výsledky okamžitě. A pro freelancery, kteří potřebují rychle dodávat MVP klientům.

Krok 1: Registrace a první orientace

Přejděte na lovable.dev a vytvořte si účet. Registrace je zdarma a zahrnuje volný kredit na vyzkoušení platformy. Po přihlášení uvidíte dashboard s přehledem vašich projektů.

Na hlavní obrazovce najdete tlačítko pro vytvoření nového projektu a vstupní pole, kam napíšete popis vaší aplikace. Lovable také nabízí galerii šablon — hotových projektů, které můžete použít jako startovní bod a upravovat podle potřeby.

Cenové plány (stav k březnu 2026)

Lovable nabízí několik cenových plánů. Free plan je vhodný na vyzkoušení — zahrnuje omezený počet AI zpráv měsíčně. Starter plan za přibližně 20 USD měsíčně je dostatečný pro hobby projekty a jednodušší aplikace. Pro plan za přibližně 50 USD měsíčně je určený pro profesionální použití s vyšším limitem AI interakcí. Před nákupem vždy zkontrolujte aktuální ceny na lovable.dev/pricing, protože se mohou měnit.

Krok 2: Vytvoření prvního projektu

Nejdůležitější část práce s Lovable je první prompt — textový popis vaší aplikace. Čím konkrétnější budete, tím lepší výsledek dostanete.

Špatný prompt vs. dobrý prompt

Špatný prompt vypadá třeba takto: „Vytvoř mi aplikaci pro správu úkolů." Tohle je příliš vágní — Lovable nebude vědět, jaký design chcete, jaké funkce, ani pro koho aplikace je.

Dobrý prompt je mnohem konkrétnější: „Vytvoř webovou aplikaci pro správu osobních úkolů. Design má být minimalistický, světlý s fialovými akcenty. Na hlavní stránce bude seznam úkolů rozdělený do kategorií (Práce, Osobní, Nákupy). Každý úkol bude mít název, popis, prioritu (nízká/střední/vysoká) a deadline. Uživatel může přidávat, editovat, mazat a označovat úkoly jako hotové. Přidej filtrování podle kategorie a priority. Nahoře bude statistika: celkem úkolů, hotových, zbývajících."

Tipy pro psaní promptů

Začněte popisem účelu aplikace a cílového uživatele. Popište design — barvy, styl (minimalistický, moderní, hravý). Vyjmenujte konkrétní funkce a stránky. Zmiňte specifické požadavky na UI komponenty. Nepoužívejte technický žargon, pokud nemusíte — Lovable si sám zvolí nejlepší implementaci.

Krok 3: Práce s AI chatem — iterativní vývoj

Po vygenerování první verze aplikace začíná ta nejzábavnější část: iterativní vylepšování přes AI chat. Lovable zobrazí náhled vaší aplikace a vedle něj chat, kde můžete zadávat další instrukce.

Jak efektivně iterovat

Pracujte po malých krocích. Místo „Předělej celou stránku" raději napište „Na hlavní stránce změň barvu nadpisu na tmavě modrou a přidej pod něj krátký popis aplikace." Menší změny znamenají menší riziko, že se něco rozbije.

Pokud se vám výsledek nelíbí, použijte funkci Undo (vrátit zpět). Lovable uchovává historii všech změn, takže se můžete kdykoliv vrátit k předchozí verzi.

Buďte konkrétní v popisu problémů. Místo „Nefunguje to" napište „Po kliknutí na tlačítko Přidat úkol se nic nestane — formulář se neodešle a úkol se nepřidá do seznamu."

Krok 4: Připojení databáze přes Supabase

Pro aplikace, které potřebují ukládat data (registrace uživatelů, obsah, objednávky), nabízí Lovable integraci se Supabase — open-source alternativou k Firebase.

Jak připojit Supabase

V Lovable projektu klikněte na ikonu databáze v horním panelu. Lovable vás provede propojením se Supabase — buď vytvoří nový projekt automaticky (Lovable Cloud), nebo můžete připojit existující Supabase instanci.

Lovable Cloud vs. externí Supabase

Lovable Cloud je nejjednodušší varianta — databáze je součástí platformy, nemusíte nic konfigurovat. Má ale jedno důležité omezení: data vložená přes AI chat jdou do testovací databáze, ne do produkční. Pro vložení dat do produkce musíte použít SQL editor v Lovable Cloud a přepnout na „Live" režim.

Externí Supabase vám dává plnou kontrolu — vlastní projekt na supabase.com, přímý přístup k SQL editoru, edge funkcím a všem nastavením. Doporučujeme pro produkční aplikace.

Krok 5: Přidání autentizace

Většina aplikací potřebuje přihlašování uživatelů. V Lovable stačí napsat:

„Přidej přihlašování a registraci uživatelů přes email a heslo. Po přihlášení přesměruj na dashboard. Nepřihlášený uživatel vidí jen landing page s tlačítkem Přihlásit se."

Lovable automaticky nastaví Supabase Auth s formuláři pro registraci, přihlášení a reset hesla.

Krok 6: Nasazení na vlastní doménu

Klikněte na tlačítko Publish v pravém horním rohu. Lovable nasadí aplikaci na subdoménu vašeho projektu. Pro připojení vlastní domény přejděte do nastavení projektu, zadejte doménu a nastavte DNS záznamy u svého registrátora.

Lovable také umožňuje exportovat celý zdrojový kód do GitHub repozitáře — doporučený postup pro produkční aplikace.

Krok 7: Tipy pro pokročilé

Používejte referenční obrázky: Lovable umí pracovat s obrázky — nahrajte screenshot designu a napište „Vytvoř stránku podle tohoto návrhu."

Pracujte s existujícím kódem: V záložce Code můžete prohlížet a ručně upravovat vygenerovaný kód.

Integrujte externí API: Platební brána, emailová služba nebo AI model.

SEO: Přidejte meta title, description a Open Graph tagy pro každou stránku.

5 nejčastějších chyb začátečníků (a jak se jim vyhnout)

1. Příliš velký první prompt — začněte základní strukturou a přidávejte funkce postupně.
2. Ignorování error messages — přečtěte si chybovou hlášku a popište problém svými slovy.
3. Zapomenutí na mobilní zobrazení — vždy testujte na mobilním rozlišení.
4. Žádné testování dat — před nasazením otestujte celý flow včetně Row Level Security.
5. Neukládání verzí — používejte Git export pro zálohu kódu.

Lovable vs. alternativy: Kdy zvolit co?

Lovable je nejlepší volba pro kompletní full-stack aplikaci bez psaní kódu. Pro jen frontend prototyp zvažte v0 od Vercelu. Pro plnou kontrolu nad kódem sáhněte po Cursor. Pro rychlý experiment bez registrace zkuste Bolt.new.

Detailní srovnání najdete v našem článku Lovable vs Cursor vs Bolt na blogu.

Shrnutí: Váš akční plán

1. Zaregistrujte se na lovable.dev (5 minut).
2. Napište konkrétní prompt pro vaši první aplikaci (10 minut).
3. Iterujte design a funkce přes AI chat (1–3 hodiny).
4. Připojte Supabase pro ukládání dat (15 minut).
5. Přidejte autentizaci uživatelů (10 minut).
6. Otestujte celou aplikaci na desktopu i mobilu (30 minut).
7. Publikujte a sdílejte se světem.

Celkem od nuly k funkční aplikaci: půl den až víkend — podle složitosti projektu.