Modul 11 · První skutečná aplikace

Stavíme po částech

Pořadí, ve kterém se aplikace staví, aby byla po každém kroku spustitelná.

13 minlekce 66/107

Po lekci umíš

  • Znáš pořadí, ve kterém stavět
  • Umíš rozdělit práci na kroky, které jde ověřit
  • Víš, proč se nestaví všechno najednou
Obsah lekce (4)

Máš zadání, model a obrazovky. Teď přijde otázka, kde začít – a odpověď „všude“ je nejrychlejší cesta k projektu, který nikdy nefunguje celý.

Pravidlo: po každém kroku to musí jít spustit

Nejdůležitější pravidlo celého modulu.

Nestav tři dny a pak zkoušej. Stav tak, aby aplikace byla po každé půlhodině spustitelná, i když toho zatím moc neumí.

Pořadí, které funguje

  1. Kostra

    prázdné obrazovky, navigace

  2. Data

    ukládání a načítání

  3. Hlavní cesta

    jedna věc od začátku do konce

  4. Zbytek

    ostatní obrazovky

  5. Vyladění

    vzhled, stavy, texty

  1. Kostra

    Obrazovky s nadpisem a navigací. Nic víc. Za dvacet minut vidíš celou aplikaci proklikatelnou – a hned poznáš, jestli struktura dává smysl.

  2. Data

    Uložení a načtení jedné věci. Zatím ošklivě. Klíčové je ověřit, že to opravdu drží i po obnovení stránky.

  3. Hlavní cesta

    Ta věc, kvůli které aplikace existuje, od začátku do konce. Až tady začíná být aplikace k něčemu.

  4. Zbytek

    Ostatní obrazovky a funkce. Teď už na hotových základech.

  5. Vyladění

    Vzhled, prázdné stavy, chybové hlášky, texty. Až tady, ne dřív.

Jedna změna, jedno ověření

Rozděl práci na kroky, u kterých umíš říct, jak poznáš, že jsou hotové.

Krok, který nejde ověřit

  • „Udělej správu rezervací.“
  • „Přidej přihlašování.“
  • „Naprav ten formulář.“

Krok, který ověřit jde

  • „Na /rezervace bude seznam rezervací z databáze. Když žádné nejsou, zobraz vysvětlující text.“
  • „Přihlášení e-mailem a heslem. Po přihlášení přesměruj na /prehled. Bez přihlášení tam nikdo nesmí.“
  • „Formulář neodešle prázdné jméno a ukáže u pole červený text.“
Prompt pro Claude Code

Rozděl práci na kroky

Když víš, co chceš postavit, ale ne v jakém pořadí.

Chci postavit: [POPIS ČÁSTI APLIKACE]

Rozděl to na kroky podle těchhle pravidel:
- Po každém kroku musí jít aplikaci spustit a něco na ní vidět.
- Každý krok má být na 20 až 40 minut práce.
- U každého kroku napiš, jak poznám, že je hotový – co konkrétně
udělám a co uvidím.
- Seřaď kroky tak, aby se nemusela přepisovat práce z předchozích.

Napiš mi ten seznam. Nezačínej stavět, dokud ho neodsouhlasím.

Rytmus

  1. Zadej jeden krok

    Ne dva, ne celý seznam.

  2. Zkontroluj změny

    Pět otázek z lekce o čtení změn.

  3. Spusť a ověř

    Podle kritéria, které jsi v kroku napsal. Ne „vypadá to dobře“.

  4. Commitni

    Bod návratu. Teprve teď další krok.

Milník: aplikace umí svoji hlavní věc

Až budeš mít hotové první tři kroky (kostra, data, hlavní cesta), zastav se a projdi tohle:

  • Zapiš do aplikace jednu položku, obnov stránku – je tam pořád?
  • Otevři aplikaci s prázdnými daty – dává obrazovka smysl?
  • Zavři terminál, spusť znovu npm run dev – naběhne to?
  • Spusť npm run build – projde bez chyb?
  • Commitni a pošli na GitHub.

Když všech pět bodů projde, máš základ, na kterém se dá stavět bez strachu.

Cvičení45 minut

Postav kostru své aplikace – všechny obrazovky s nadpisem a funkční navigací, bez dat.

Proklikej to. Když ti struktura připadá divná, teď je nejlevnější chvíle ji změnit.

Commitni.

Co si odnést

  • Po každém kroku musí jít aplikaci spustit.
  • Pořadí: kostra, data, hlavní cesta, zbytek, vyladění. Vzhled až nakonec.
  • Každý krok musí mít kritérium, podle kterého poznáš, že je hotový.
  • Rytmus: zadej, zkontroluj, ověř, commitni.

Máš to za sebou?

Označ lekci jako hotovou, ať víš, kde jsi skončil. Nic se tím neuzamkne.

Obsah aktualizován: 21. srpna 2026