flowsmithonline

Z nuly na živý web

Nikdy jsi nic „nekódil/a"? Nevadí. S těmihle připravenými postupy se klidně do hodiny dostaneš od prázdného počítače k vlastní stránce na internetu, kterou pošleš kamarádům. Půjdeme krok po kroku a u každého řekneme i proč — ať tomu rozumíš, ne jen klikáš.

Příkazy a prompty níž se podle toho samy přepíšou. Složka bude www-hello-world, na stránce bude nadpis „Hello World".
Úroveň:
Co budeš mít na konci 1 · Účty 2 · Terminál + Homebrew 3 · První projekt 4 · Stránka (přes agenta) 5 · Na GitHub 6 · Na internet 7 · Vlastní doména 8 · Doladění

Co budeš mít na konci

Funkční webovou stránku na adrese typu www-www-hello-world.pages.dev (a později klidně na vlastní doméně), kterou kdokoli na světě otevře v prohlížeči. A hlavně postup, který si zopakuješ pro libovolný další nápad.

Těžké nástroje (build, knihovny) běží v cloudu a v sandboxu agenta — do svého počítače skoro nic neinstaluješ. Počítač je jednorázový, pravdou je cloud.
Profík kontext: deploy jede z gitu (Cloudflare staví na každý push), nikdy ručně z notebooku. Tvůj počítač drží jen pracovní kopii — zdroj pravdy je git + cloud. To je celé tajemství „disaster-proof" setupu.

1 · Založ si tři účty (zdarma)

Budeš potřebovat tři věci. Všechny mají bezplatnou variantu, která ti na začátek bohatě stačí:

Zaregistruj se do všech tří, ověř e-mail a můžeš jít dál. Hesla si ulož do správce hesel (na Macu appka Hesla) — ať je máš bezpečně a nemusíš si je pamatovat.

Správa hesel a zálohování klíčů má vlastní návod — sem ji teď netaháme, ať tě to nezahltí. Pro první web ji nepotřebuješ.

2 · Terminál a Homebrew

„Terminál" je okno, kam píšeš příkazy textem. Vypadá to vážně, ale je to jen způsob, jak počítači říct přesně, co má udělat. Otevři appku Terminál (přes Spotlight: ⌘ Space → napiš Terminal).

Nainstaluj Homebrew

Homebrew je „obchod" pro instalaci nástrojů jedním příkazem. Zkopíruj následující řádek, vlož do Terminálu a stiskni Enter (poprosí tě o heslo k počítači — to je v pořádku):

Nainstaluj pár nástrojů

Teď přes Homebrew přidáme git (verzování), gh (GitHub z příkazové řádky) a GitHub Desktop (klikací appka na git):

Profík: drž si Brewfile v repu (jeden řádek na nástroj) a na novém stroji jen brew bundle — celý toolchain je reprodukovatelný z manifestu.

3 · Vytvoř si první projekt

Všechny své weby budeš mít hezky pohromadě ve složce Projects. Vytvoř ji a v ní složku pro tenhle web:

Pojmenování www-… je naše konvence pro weby — přehledné, až jich budeš mít víc.

4 · Stránku napíše agent (ty jen řekneš co)

Tady přichází kouzlo: nepíšeš kód, popíšeš výsledek. V Coworku otevři složku ~/Projects/www-www-hello-world a napiš agentovi tenhle pokyn (zkopíruj — je už nastavený na tvůj název):

Agent soubor vytvoří. Otevři index.html dvojklikem — měl/a bys svou stránku vidět rovnou v prohlížeči (zatím jen u sebe v počítači).

Nelíbí se ti to? Řekni agentovi, co změnit — „dej nadpis modře", „přidej dole rok". Zkoušej, čti výsledek, uprav. Přesně takhle se s agentem pracuje.

5 · Ulož web na GitHub

Teď web dostaneme do gitu — bezpečného úložiště, ze kterého se bude i zveřejňovat. Nejjednodušší klikací cesta:

  1. Otevři GitHub Desktop → přihlas se svým GitHub účtem.
  2. File → Add Local Repository → vyber složku ~/Projects/www-www-hello-world. Nabídne „create a repository" — potvrď.
  3. Klikni Publish repository (klidně nech jako Private). Hotovo — tvůj web je v cloudu.
Profík (přes příkazovou řádku):

6 · Pusť web na internet (Cloudflare)

Propojíme repozitář s Cloudflare Pages. Od té chvíle platí: kdykoli něco pushneš na GitHub, Cloudflare web sám postaví a zveřejní.

  1. V Cloudflare dashboardu jdi na Workers & Pages → Create → Pages → Connect to Git.
  2. Vyber repozitář www-www-hello-world. Build nastavení nech prázdné (je to čisté HTML) a dej Save and Deploy.
  3. Za chvilku dostaneš živou adresu typu www-www-hello-world.pages.dev. Otevři ji — tvůj web je na internetu! 🎉

Pošli odkaz kamarádům. Vážně. Tohle je ta chvíle. 🎉

Tady končí „hračka". Hotový Hello World je super na vyzkoušení — testovací stránku na ostrou doménu obvykle nedáváš. Kroky 7–8 níž jsou pro chvíli, kdy stavíš reálný web.

7 · Vlastní doména pro reálný web

Až budeš chtít místo .pages.dev vlastní adresu: v Cloudflare Pages u projektu zvol Custom domains → Set up a domain. Cloudflare tě provede.

💡 Kde doménu koupit: Cloudflare umí většinu domén registrovat přímo za velkoobchodní cenu — bez marže (národní jako .cz/.eu zatím přes jiného registrátora). U většího portfolia to dělá výrazné úspory: třeba na doméně .group jde o desítky tisíc Kč ročně. A hlavně máš pak doménu, hosting i web pod jednou střechou — celé AI-agent-friendly, což je krédo celého Flowsmith.
Pozor: nastavení domény míchá i e-maily a zabezpečení (SPF/DKIM/DMARC). Ať si nerozbiješ poštu, tohle bereme jako samostatný návod — nepatří do první lekce.

8 · Doladění pro reálný web

Pár věcí, co dělá web „dospělým": ikonka v záložce (favicon), robots.txt, llms.txt (aby web rozuměly i AI), sitemap.xml. Nemusíš nic ručně — řekni agentovi:

(My na tohle máme připravený skill, takže to agent udělá podle osvědčeného postupu.)

Co sis právě osahal/a: účty → nástroje → projekt → web napsaný agentem → git → živý web. Stejný postup zopakuješ pro cokoli dalšího — měníš jen obsah.

Kam dál