Programování Začátečník lovable

Generátor responzivních webových aplikací

Pomocník pro rychlý návrh a stavbu moderní webové aplikace pomocí platformy Lovable.

Prompt text

Délka: Dlouhý

Jsi expertní vývojář a produktový designér se specializací na platformu Lovable. Tvým úkolem je vytvořit strukturovaný návrh a kódovou architekturu pro aplikaci na základě mého zadání.

Při tvorbě postupuj následovně:
1. **Analýza:** Definuj klíčové funkce aplikace, uživatelské role a hlavní datové entity.
2. **UI/UX:** Navrhni moderní, čistý designový systém (použij Tailwind CSS stylizaci). Popiš rozvržení hlavní stránky (dashboardu) a navigace.
3. **Komponenty:** Rozepiš seznam nezbytných komponent, které musím v Lovable vytvořit (např. formuláře, datové tabulky, karty s informacemi).
4. **Logika:** Navrhni základní logiku pro propojení dat.

Moje zadání je: [Popis aplikace, např. CRM pro malou kavárnu]
Cílová skupina uživatelů: [Cílová skupina]
Hlavní barvy a styl: [Styl, např. minimalistický, tmavý režim, modré odstíny]

Nezapomeň navrhnout responzivní chování pro mobilní zařízení. Pokud je potřeba nějaká složitější databázová struktura, popiš ji srozumitelně tak, abych ji mohl v Lovable snadno implementovat. Celý výstup napiš přehledně pomocí odrážek a zvýrazni klíčové technické kroky.

Interaktivní tvůrce

Příklad použití

Vstup:

Zadání: Aplikace pro sledování osobních výdajů.
Cílová skupina: Studenti a mladí profesionálové.
Styl: Minimalistický, světlý režim, akcentní barva zelená.

Výstup:

**1. Analýza aplikace:**
- Funkce: Přidávání transakcí, kategorizace výdajů, měsíční graf útrat.
- Entity: Transakce (datum, částka, kategorie, poznámka), Kategorie (jméno, ikona).

**2. UI/UX Design:**
- Hlavní dashboard: Horní karta s celkovým zůstatkem, pod ní seznam posledních transakcí.
- Navigace: Spodní lišta (Mobil) / Boční menu (Desktop) s ikonami Domů, Přidat (+), Statistiky.
- Styl: Použij Tailwind třídy jako `bg-emerald-500` pro hlavní tlačítka a `rounded-2xl` pro karty.

**3. Komponenty:**
- `TransactionCard`: Komponenta pro zobrazení řádku výdaje.
- `AddTransactionModal`: Formulář s validací částky.

**4. Logika:**
- Data ukládej do Supabase tabulky `expenses`. Pro grafy použij knihovnu Recharts kompatibilní s Lovable.

Kde použít tento prompt?

Najděte vhodné AI nástroje pro použití tohoto promptu a maximalizujte jeho efektivitu.

🔧 Vhodné nástroje 📖 Návody 📚 Slovník

Podobné prompty

Expert

Advanced AI Features - Deep Dive do Pokročilých Funkcí

Komplexní průvodce pokročilými funkcemi AI nástrojů - od extended context a multimodality po tool use, streaming, a fine-tuning. Naučte se využívat plný potenciál moderních AI systémů.

Programování

Zobrazit

Expert