Podobně jako v dalších programovacích jazycích, i v Pythonu se dají vytvářet dynamické webové stránky. V tomto článku najdete krátký úvod do technologií, možnou cestu a vysvětlení pojmů, se kterými se po své cestě budoucího vývojáře webových stránek můžete potkat.
Každá webová stránka je popsaná pomocí HTML (Hypertext Markup Language). Nejedná se o programovací jazyk, ale tzv. "značkovací jazyk", ve kterém pomocí speciálních značek (tagů) popisujeme, jak má webová stránka vypadat. Pro představu si ve svém webovým prohlížeči zkuste kliknout pravým tlačítkem kdekoliv do prostoru a v nabídce zvolte položku "Zobrazit zdrojový kód stránky" (Chrome) či její alternativu v jiném prohlížeči. HTML tagy jsou do sebe skládány a zanořeny tak, že tvoří stromovou strukturu. Často pak v tomto kontextu hovoříme například o "kořenu" (tag, který je v hierarchii nejvýš a nemá žádného dalšího rodiče - nejčastěji tag <html>) nebo "uzlu" (obecně jakýkoliv jiný tag, který může mít potomky a rodiče). Tato stromová a objektová reprezentace pak tvoří něco, čemu se říká DOM (Document Object Model).
<html>
<title>Ahoj světe!</title>
<h1>Ahoj světe!</h1>
<div class="wrapper">
<p>Můj odstavec textu</p>
</div>
</html>
Dnes čisté HTML nestačí a kvůli pochopitelným požadavkům na vzhled a interaktivitu webových stránek, je oživujeme pomocí kaskádových stylů (CSS) a JavaScriptu. Kaskádové styly přidávají jednotlivým tagům vzhled; to, jak mají vypadat. JavaScript se dnes na webu stará o spoustu věcí: od rozbalovacího meníčka, přes multimediální přehrávače a vykreslení kompletní webové stránky, až po 3D hry v prohlížeči.
V tomto bodě se rád odkážu na web JakPsátWeb.cz, jakožto nejpodrobnější truhlici znalostí kolem HTML a webu jako takového.
Na co potřebuji při tvorbě webu Python?
Webové stránky se dají psát čistě pomocí textového editoru a HTML jazyka. Vyrobíte si textový soubor, uložíte si ho například jako index.html a přetáhnete do okna prohlížeče... voilà, vykreslila se vám vaše první webová stránka. Jenže, teď se podívejte do adresního řádku prohlížeče. Není tam žádná krásná doména, ale najdete tam celou systémovou cestu k souboru jako takovému. Jak si takovou stránku otevře například váš kamarád nebo jak ji dohledá webový vyhledávač? K tomu potřebujete nějaký webový server, který bude přijímat požadavky uživatelů a vydávat jim správné statické soubory ven. V tomhle okamžiku, pokud vlastníte nějaký server (třeba VPS), se možná začnete poohlížet například po projektu Nginx, který poslouží pro výdej statických dat a do budoucna třeba i jako reverzní nebo cache proxy. S hostováním webových stránek napsaných v Pythonu je to sice oproti PHP trošku složitější, ale můžete najít třeba české Roští.cz nebo zahraniční Heroku. Pokud jste ostřílenější mazáci a znáte třeba Docker, tak těch možností pak je mnohem víc.
Ale zpátky k hlavnímu tématu. Na co teda potřebuji Python, když si můžu napsat pár html souborů a mám hotovo?
- Díky Pythonu dostanete k ruce například spoustu šablonovacích enginů. Každý webový portál či aplikace se skládá z několika podstránek. Tyto podstránky vypadají dost podobně a sdílí mezi sebou jednotlivé prvky. Typicky to může být hlavička, patička nebo postranní meníčko, které je na všech podstránkách stejné a liší se pouze vybranou aktivní položkou. Představte si, že takovou webovou stránku děláte pomocí statických souborů. Co se stane, když budete do meníčka chtít přidat další položku? Budete muset projít všechny statické soubory a HTML každého z nich upravit. S šablonovacím enginem můžete například embedovat jeden soubor do druhého, případně nechat celé menu vykreslit průchodem přes pole položek.
- Dynamický obsah. Například na základě requestu, který vám do aplikace přijde, jste schopni vyčíst cookies a přihlásit uživatele. Podle přihlášeného uživatele pak webová stránka může vykreslit jemu personalizovaný obsah. Další příklad mohou být e-shopy a filtry, pomocí kterých si zboží třídíte. Každý uživatel si chce vyfiltrovat jiný cenový interval, barvu zboží, velikost. To pomocí statických souborů uděláte velice těžko.
- Připojení k databázi a dalším komponentám. Data, která webová stránka vykresluje, jsou většinou uložena v nějaké databázi. Díky pythonní aplikaci jste schopni data z databáze vyčíst a udělat nad nimi určitý "pohled". Jednou chcete seznam všeho zboží, jindy detail konkrétního výrobku. Na základě requestu uživatele data načtete, zpracujete a pošlete šablonovacímu systému je vykreslit.
- ...
Webová stránka nebo API?
Dnes se setkáme s dvojím přístupem tvorby webových stránek. Řekněme, že jeden z nich nazveme obecně MPA (multipage application) a druhý SPA (singlepage application). MPA aplikace je taková aplikace, která s každým klikem, který uživatel na webové stránce udělá, pošle request na server, server request zpracuje a uživateli pošle vyrenderovanou html stránku. V takovém případě si vystačíme pouze s Pythonem. Druhý způsob, SPA, k tomuto přistupuje trošku jinak. U uživatele v prohlížeči se spustí kousek javascriptového kódu (Python má v prohlížeči smůlu 🤫), který dokáže vykreslit potřebné HTML tagy, ale nemá data. Neví, jaký nadpis nebo obsah článku má uživateli vykreslit. Pro ně si musí sáhnout na nějaké API.
API (Application Programming Interface) vystavuje nějaké komunikační rozhraní. Klient (webová stránka, nebo kterákoliv jiná aplikace) toto rozhraní zná a ví, jakým HTTP requestem se má zeptat, pokud chce získat například data nějakého článku. API data vrátí ve strojově čitelné a zpracovatelné podobě, nejčastěji v JSONu nebo XML. Pro webovou komunikace se aktuálně nejčastěji setkáte s API typu REST nebo GraphQL.
Jak mám začít s tvorbou webu?
Určitě se podívejte po nějakých webových frameworcích, které vám ušetří spoustu práce. Každý dobrý framework umí pracovat s URL, HTTP requesty, šablonovacím systémem nebo formuláři, takže nemusíte začít od píky. Ve světě Pythonu často uvidíte framework Flask nebo Django. Pokud chcete začít vyrábět API, které bude vydávat data jiným aplikacím, najdete i nástavby těchto knihoven jako například flask-restful, flask-graphl nebo Django REST framwork či Graphene Django.