Založení projektu

Teď z toho uděláme skutečný projekt.

Proč ne jeden HTML soubor

V minulém modulu jsme udělali stránku jako jeden soubor. Pro cvičení to stačí. Pro skutečný web ne, protože:

• opakující se části (hlavička, patička) bys musel psát na každou stránku znovu;
• nefunguje automatické obnovení při změně, takže bys pořád mačkal F5;
• nasazení je pak komplikovanější, ne jednodušší.

Použijeme framework. Konkrétně Next.js.

Nemusíš Next.js umět. Musíš vědět, že existuje a že Claude s ním pracuje.

Založení projektu

$cd ~/Projekty$mkdir muj-web$cd muj-web

Zkopíruj do téhle složky soubor zadani.md z minulé lekce. Pak spusť Clauda:

$claude

Přečti si soubor zadani.md v téhle složce.

Založ nový projekt v Next.js s TypeScriptem a Tailwind CSS.
Použij aktuální stabilní verze.

Zatím jen kostru: jedna stránka, sekce podle zadání, texty ze zadání.
Vzhled zatím neřeš do detailu – jde mi o to, ať to běží a vidím obsah.

NECHCI:
- žádné knihovny navíc kromě toho, co přijde se založením projektu
- žádné ukázkové stránky a demo obsah
- žádný blog, ceník ani přihlášení

Až to bude, napiš mi, jak projekt spustím.

Bude to chvíli trvat – stahují se soubory. Během toho ti Claude Code bude psát, co dělá.

Spuštění

$npm run dev

▲ Next.js 16.x.x
- Local:   http://localhost:3000

✓ Ready in 1.2s

Otevři http://localhost:3000 v prohlížeči. Uvidíš svůj web.

Dvě okna terminálu

Tady narazíš na věc, která první den mate skoro každého.

Vývojový server musí běžet, dokud pracuješ. Zabírá terminál – nemůžeš do něj psát nic jiného. Zároveň chceš pokračovat v práci s Claude Code.

Řešení: dvě okna terminálu.

1. První okno

   Tady běží npm run dev. Nech ho být.

2. Druhé okno

   Tady běží claude. Nezapomeň nejdřív cd do složky projektu.

Nové okno otevřeš na macOS Cmd+N, ve Windows Terminalu Ctrl+Shift+N (nebo novou záložkou).

Zastavení a znovuspuštění

1. Zastavit server

   V okně, kde server běží, stiskni Ctrl+C.

2. Spustit znovu

   npm run dev.

3. Když port už někdo zabral

   Hláška port 3000 is already in use znamená, že ti server běží ve starém okně. Buď ho tam zastav, nebo nech Next.js použít jiný port – většinou to nabídne sám.