Od souboru na počítači k veřejné adrese

Stránka je hotová a otevřená v prohlížeči. Vypadá jako web a chová se jako web: na odkazy jde kliknout, tlačítka reagují. Pošlete ji někomu a dostanete odpověď "neotevírá se". Nebo se otevře, ale bez stylů a obrázků. Nic se nerozbilo. Stránka žije jen na jednom místě, na vašem disku, a adresní řádek prohlížeče to ukazuje - stačí vědět, kam se podívat.

Otázka "jak dostat web na internet" zní, jako by existovalo tlačítko, které je třeba najít. Užitečnější je zeptat se jinak: kde musí web žít, aby ho neviděl jen já? Odpověď se skládá po částech: server, dvě adresy, cesta, hosting a nasazení. Potom: jak aktualizovat to, co už je venku, proč hosting potřebuje klíč a co dělá agent, když mu řeknete "zveřejni".

1. Soubor žije na jednom počítači

Podívejte se na adresní řádek, když je stránka otevřená z disku. Není tam odkaz, ale cesta k souboru:

file:///C:/projects/landing/index.html    # cesta k souboru na vašem disku
https://landing-demo.tiiny.site/          # adresa na jiném počítači

První řádek je váš disk. Prohlížeč tu funguje jen jako program na prohlížení: otevřel soubor, přečetl ho, zobrazil. Do sítě nikam nechodil. Druhý řádek je adresa jiného počítače. První se otevře jen u vás, druhý z jakéhokoli zařízení s internetem.

Odtud to "neotevírá se". Poslat soubor a zveřejnit stránku jsou dvě různé věci. Stránka obvykle není jeden soubor, ale složka: index.html, vedle něho style.css a obrázky. Pošlete jen jeden index.html - příjemci se otevře, ale styly a obrázky nebude mít kde hledat. A máte tu "otevře se, ale nějak divně".

A druhé omezení, prostší. Večer zavřete notebook, strčíte ho do tašky a odnesete domů. A je to, notebook spí a nikomu nic nedá. Aby stránku viděli všichni a kdykoli, její soubory musí ležet jinde než u vás.

"Funguje u mě" a "otevírá se všem" jsou dva různé stavy. Zbytek článku je o tom, co leží mezi nimi.

2. Server

Klíčové slovo je server. Není to tajemná skříň se světýlky, ale prostě počítač, který je pořád zapnutý a posílá soubory ostatním. V tom je celý jeho smysl: být k dispozici, i když vy nejste.

Zdá se, že to jde i bez něj. Pošlete kamarádovi obrázek v messengeru - ten přece letí z vašeho telefonu rovnou k němu? Ne. Nejdřív se dostane na server messengeru a teprve odtud ke kamarádovi. Proto ho můžete poslat, vypnout telefon a jít spát, a kamarád si ho otevře za dvě hodiny. Server stojí uprostřed, i když ho nevidíte.

Závěr pro stránku je stejný: aby ji viděli všichni, soubory musí být na takovém počítači. Internet není společný oblak, kam se věci dostanou samy, ale jiný počítač, který nespí. Zpočátku to i trochu zklame, je to až moc přízemní. Zato je to srozumitelné.

3. Doména a IP

Serverů je na světě hodně a na ten správný se nějak musíte dostat. Podle adresy. Server má adresy dvě, jako obyčejný dům: souřadnice a vývěsní štít.

První je IP. Číselná adresa jako 192.0.2.1: přesná, ale pro člověka nečitelná, holé souřadnice. Počítače spolu komunikují právě takto.

Druhá je doména. Jméno pro lidi, třeba example.com. To je ten vývěsní štít: kamarádovi přece neřeknete "sejdeme se u budovy na souřadnicích padesát celá čtyřicet pět, třicet celá padesát dva". Řeknete "u kavárny na rohu".

192.0.2.1        # IP: číselná adresa serveru, pro počítače
example.com      # doména: stejné místo, se jménem pro lidi

Jak spolu souvisejí: když napíšete jméno, prohlížeč se nejdřív zeptá adresáře jmen, jaká IP za ním stojí, a teprve pak jde podle čísel. Tomu adresáři se říká DNS a víc o něm teď vědět nemusíte: napíšete jméno, zbytek se stane sám.

A ještě jedna část adresy, kterou snadno přehlédnete: https:// úplně na začátku. Není to část jména, ale způsob spojení: komunikace se serverem je šifrovaná. Prohlížeče to zobrazují různě, zato http:// bez s všechny označují jako nezabezpečené. Šifrování zajistí hostingy samy.

4. Cesta a výchozí soubor

Na serveru obvykle leží spousta souborů. Který z nich je potřeba, říká cesta (path) - část adresy za doménou. Když je doména budova, cesta určuje, ke kterému pultu uvnitř jít.

Adresa se čte zleva doprava a není to žádné zaklínadlo, ale tři odpovědi. https://example.com/about/team.html znamená "na serveru example.com otevři soubor about/team.html".

Cesta je doslova cesta k souboru na disku serveru: složka about, v ní team.html, stejně jako cesta ke složce na vašem počítači. Velké weby často skládají stránky za běhu, ale logika je stejná: adresa vede na konkrétní místo.

A co když je cesta prázdná? Napíšete https://example.com/ - který soubor otevřít? Na tom se všichni dávno dohodli: server pošle index.html z kořenové složky webu, tak to dělají skoro všechny hostingy. Z toho plyne pravidlo, které se brzy bude hodit: index.html leží v kořeni složky, kterou zveřejňujete, ne v některé vnořené.

5. Celá trasa

Teď jsou všechny části na místě a dají se poskládat do jednoho řetězce.

Napíšete adresu. Prohlížeč zjistí v adresáři jmen, jaká IP patří k doméně, obrátí se na server, ten podle cesty najde soubor a pošle ho. Prohlížeč dostane stejný HTML text, jaký by mohl ležet u vás na disku, a vykreslí stránku.

Podstatné je tohle: značky a styly prohlížeč vykreslí stejně, ať soubor přišel z disku, nebo ze serveru. Rozdíl je v tom, kdo další se k tomu souboru dostane. Pravda, část možností JavaScriptu prohlížeč u souborů z disku omezuje, takže na serveru se stránka někdy chová plnohodnotněji než tatáž stránka lokálně.

6. Hosting

Server v datovém centru nemáte a ani ho nepotřebujete. Existuje hosting - server k pronájmu: předáte mu složku se stránkou, on ji uloží na svůj stále zapnutý server a vrátí vám veřejný odkaz. Nic víc.

Odkaz bude na doméně hostingu a vaše jméno stojí vlevo od ní: landing-demo.tiiny.site, jmeno.github.io. Doména patří hostingu, vám připadne jméno před ní: někdy si ho zvolíte sami, jindy ho hosting přidělí. Jde to i s vlastní doménou jako mysite.com, ale o jejím nákupu a nastavení teď mluvit nebudeme: k tomu, abyste stránku ukázali, ji nepotřebujete.

Pro stránku z hotových souborů, která na serveru nepotřebuje žádný program (říká se jí statická, to je na samostatné povídání), existují i bezplatné hostingy. Stávat se administrátorem nemusíte.

7. Nasazení

A slovo, kvůli kterému to celé bylo. Nasazení, anglicky deploy: zkopírujete své soubory tam, kde nejsou dostupné jen vám, tedy z vašeho disku na server hostingu. Složka vám zůstane a objeví se i tam.

Po nasazení leží jedna a táž složka na dvou místech a odkaz vede na tu vpravo. Levá nikam nezmizela, můžete s ní dál pracovat.

Co přesně putuje:

landing/
  index.html
  style.css
  img/
    hero.png

Zveřejňuje se celá landing/, takže style.css a obrázky dál leží vedle index.html a najdou se na stejných cestách. A index.html je v kořeni této složky. Zveřejníte složku o úroveň výš - a odkaz ukáže seznam složek nebo prázdno.

Jak se složka dostane na server, má každý hosting po svém. Nejjednodušší ruční cesta: otevřít web hostingu, přetáhnout tam složku nebo archiv se soubory a kliknout na tlačítko nasazení. Jde to i příkazem v terminálu nebo přes repozitář. Podstata je stejná: kopie vaší složky na jejich serveru. Způsob záleží i na tom, kdo nasazuje: vy to zvládnete přes web, agent jen příkazem.

Dvě slova odsud budete potkávat pořád. Lokálně - na vašem počítači, jen pro vás. Venku - na serveru, pro všechny. Nasazení je most mezi nimi a je kratší, než se zdá: jedna složka a jedna její kopie.

8. Jak aktualizovat zveřejněné

Opravili jste nadpis v index.html, obnovili stránku v telefonu - a tam je pořád starý. Tak to má být. na hostingu leží kopie z okamžiku nasazení, a vy jste upravovali originál. Aby se na odkazu objevila nová verze, musíte složku poslat znovu: aktualizace je opakované nasazení.

Má to jeden háček. Poslat složku znovu na stejnou adresu jde jen tehdy, když vás hosting pozná. Proto existují dva druhy odkazů.

Dočasný. Některé hostingy dají odkaz úplně bez účtu - abyste mohli stránku ukázat a probrat. Dlouho nevydrží: u Tiiny Host třeba zhruba hodinu. Hosting po vás může i kvůli němu chtít e-mail, není to registrace, jen způsob, jak nahrání s něčím propojit. Takový odkaz aktualizovat nejde, složku můžete jen nahrát znovu pod novou adresou.

Trvalý. S účtem odkaz nezmizí, adresu si můžete zvolit, aktualizovat i smazat; bezplatné tarify obvykle omezují počet webů a aktualizací. Účet je zdarma na stejných hostingech, které dávají dočasné odkazy. Spolu s ním dostanete klíč, ten ale není potřeba vždycky.

Když nasazuje agent, rozdíl mezi prvním nahráním a aktualizací je v jedné větě:

Zveřejni složku landing na hostingu. Potřebuju odkaz, který půjde otevřít v telefonu.

Upravil jsem nadpis v index.html. Zveřejni landing znovu, na stejnou adresu, pokud to půjde.

Druhá prosba je poctivá. "Pokud to půjde" nechává na agentovi, jestli to bude dočasný, nebo trvalý odkaz, a on vám řekne, který z nich vyšel. Odpovědi agenta neukazuji: u každého hostingu a skillu jsou jiné.

9. Přístupový klíč

Účet na hostingu vám dá přístupový klíč: dlouhý řetězec písmen a číslic, podle kterého vás hosting pozná. Při ruční práci ho nepotřebujete: přihlásíte se na webu hostingu, přetáhnete složku, kliknete na nasazení - a hosting i tak ví, kdo jste. Klíč potřebuje agent: přes web nechodí, složku posílá příkazem a příkaz hosting pozná jen podle klíče. S klíčem uloží nasazení soubory na vaši trvalou adresu, bez něj dostanete jen dočasný odkaz.

Klíč má své místo, odkud si ho nástroje čtou samy: proměnnou prostředí nebo soubor, který skill pro nasazení otevře bez vás. Když se vás skill zeptá, kam klíč uložit, odpovězte místem, ne řetězcem v chatu.

Stává se i opak: klíč přijde do konverzace sám, jako odpověď služby na požadavek agenta. Pak ho uložte na to místo a pamatujte, že konverzace už ten tajný údaj viděla.

Na první zveřejnění klíč nepotřebujete: stačí dočasný odkaz nebo nahrání přes web.

10. Jak to funguje s Claude Code

Když agentovi řeknete "zveřejni", stane se zhruba tohle.

• Agent se podívá na složku a uvidí stránku z hotových souborů. Pokud pro hosting nemá skill, nabídne jeho instalaci nebo se zeptá, kam stránku zveřejnit. Hosting vybíráte vy.
• Odeslání provede příkazem. V režimech, kde agent žádá o povolení, uvidíte příkaz ještě před spuštěním: stojí v něm, kterou složku a kam posílá, a stojí za to ho přečíst, ne jen ze zvyku kliknout na "ano". Pokud o potvrzení nežádá - takové režimy existují a můžou být zapnuté hned od začátku -, požádejte ho, ať vám příkaz a složku ukáže před odesláním.
• Výsledkem je odkaz v odpovědi agenta. Otevřete ho v telefonu: agent žádné druhé zařízení nemá, sám to neověří.
• Aktualizace je stejná prosba, "zveřejni znovu". Na stejnou adresu to vyjde jen tehdy, když vás hosting pozná podle klíče. Jinak vám agent poctivě vrátí nový dočasný odkaz, a to není chyba.
• O e-mail pro dočasný odkaz vás agent požádat může, to není tajný údaj. O klíč ne: když se na něj zeptá, odpovědí je místo, odkud se dá klíč přečíst, ne řetězec v chatu.