Josef Ježek: V práci frontend developer, doma vládce robotů
Bez Josefa by všechny Behavio nástroje vypadaly a fungovaly jinak. Formoval Trendaro, Atlas Čechů i Minutu. Frontend developera Josefa přitom do firmy přivedla jedna věc: uměl Polymer a my s ním chtěli pracovat.
Josefe, ty jsi v oboru začínal jako síťař a správce infrastruktury. Teprve před 10 lety ses začal věnovat frontendu. Co tě k tomu vedlo?
Na vejšce jsem se rozhodl, že půjdu studovat něco kolem IT a v tu chvíli jsem si vybral síťařinu. Bavilo mě CISCO. Získával jsem různé certifikáty, školení a stal se specialistou. Navíc kolem toho byla dobře placená práce. Bavilo mě propojovat věci, servery a starat se o směrování.
Typicky vývojářské obory mě moc nezaujaly, bylo v nich příliš mnoho teorie, a já měl rád hardware. Od síťařiny jsem pak přešel na administrátora. Postupně jsem se z CISCA dostal k linuxovým serverům. V rámci jedné firmy jsme s jedním klukem spravovali celou infrastrukturu Magistrátu hlavního města Prahy. To byla dost velká škola.
Chyběl mi tam ale víc profesionální a proaktivní přístup, tak mě to vlastně začalo víc a víc odrazovat.
Časem jsem zjistil, že hardware je sice fajn, ale vlastně to není moc vidět. Navíc vychlazená serverovna není úplně hezké místo na trávení času. Tak jsem si řekl, že se začnu věnovat něčemu, co je vidět.
Právě ještě na vejšce jsem se dostal k Pythonu, který mi učaroval. Je to pěkný čistý jazyk a dost jsem si ho oblíbil. U frontendu jsem hledal něco podobně čistého. Jenže frontend znamená JavaScript a k tomu hromada frameworků, do toho se mi moc nechtělo. Chtěl jsem něco multiplatformního. Třeba teď má Google Flutter, ale to v té době nebylo.
Jediná cesta byl JavaScript (JS). To pro mě byla velká změna. Chvíli jsem zvažoval kompilátory, ale ty přináší další komplexitu. Sledoval jsem spoustu frameworků až jsem narazil na projekt Polymer.
Čím byl jiný?
Byl to nový vítr. Stál za ním Google, to znamená, že to jen tak neumře. Cílem projektu Polymer bylo vytvořit nové API pro komponenty na webové platformě. Webové komponenty představují modulární přístup k vývoji webových stránek a aplikací. Začínal jsem na úplném začátku, tedy od Web Components v0 a hrozně jsem s ním bojoval. Tato verze vyžadovala polyfilly pro všechny prohlížeče mimo Chromium. Lazení bylo dost náročné. Googlu se podařilo projít mnohaletým vývojem ke standardizovanému API W3C Web Components v1, které je v prohlížečích nativně.
Když už jsem se rozhodl, že budu dělat frontend, tak jsem se rozhodl, že půjdu cestou nativních W3C webových komponent, které jsou lehce znovu použitelné. Nechci se učit další framework, který vytváří vrstvu mezi aplikací a webovou platformou. Tato vrstva představuje nové custom API, které narušuje udržitelnost, čitelnost kódu a zpomaluje a komplikuje vykreslování UI.
V rámci projektu Polymer byla vytvořena JS knihovna, která pomáhá se zápisem webových komponent. Teď už máme Polymer knihovnu ve verzi 5 alias Lit verze 2, a to proto, že knihovna Polymer byla přejmenována na Lit.
V současné době je trendem, aby na frontendu bylo co nejméně JavaScriptu, nejlépe pak žádný v okamžiku prvního vykreslení stránky. Tomu napomáhá tenká a rychlá knihovna Lit plus podpora vykreslování komponent na straně serveru (server-side rendering SSR) nebo předem pomocí statického generátoru, tyto techniky jsou podporovány od verze Lit 2. Moderní generátor Astro podporuje knihovnu Lit a umožňuje generovat statické stránky, kde jsou komponenty předem vykresleny v HTML (Partial Hydration).
A teď co bylo dřív: Behavio chtělo Polymer vývojáře, nebo tys hledal firmu s Polymerem?
Behavio hledalo Polymer vývojáře. A byla to jedna z mála, nebo možná jediná firma, která tehdy měla takový požadavek. Důvodem byl Material design, který se Behaviu líbil. Google přišel s revolučním Material designem a implementoval ho pomocí webových komponent a knihovny Polymer. Myšlenka modularity, co komponenta to vizuální prvek material designu, byla ideou pro Design System, který si dnes zpracovává každá velká firma. Tedy podrobnou dokumentaci, jak designovat při vývoji vlastní software.
Google původně potřeboval ukázku modulárního řešení material designu a tak vytvořil Topeku. A to byl předobraz našeho Trendara. Pro něj jsme z Topeky využili UI a UX s komponenty material designu.
Začátky Polymeru v Behaviu byly hodně motivační. V prvních verzích, plných polyfillů, se všechno muselo ladit. Já jsem to měl dost podrobně nastudované, tak mi něco šlo rychle, ale něco byl vážně oříšek. Zároveň to bylo neskutečně zajímavé studium JavaScriptu.
Nicméně Polymeru už je konec. JavaScriptová komunita Polymer knihovnu nepřijala z důvodu performance, velikosti, chybějící podpory SSR (server-side rendering) a chybějící integrace s rozumným server-side frameworkem. V roce 2017 přišla tenká knihovna lit-html, která přinesla nový rychlejší způsob vykreslování HTML. A pak v roce 2019 byla knihovna Polymer nahrazena novou next-generation knihovnou LitElement. Letos v roce 2021 vyšla nová verze knihoven v balíku s názvem Lit 2. Lit má nyní podporu v moderním SSG (static site generation) generátoru Astro.
Ty sám jsi do Google komunity aktivně přispěl a chtěl si vytvořit svojí Polymer skupinu. Jak to dopadlo?
Snažil jsem se o to, byť se stránce na Facebooku už teď moc nevěnuju. Chci se k ní však časem vrátit, i přesto, že si Polymer trochu poškodil jméno a ti lidé, co byli otrávení z Polymeru, přešli k Reactu. Ve skupině mám přes sto lidí, ale je otázka, kolik z nich to ještě dělá.
Jak zvládáš vůbec sledovat všechen ten vývoj?
Hledal jsem několik cest a je to těžké. JavaScriptová komunita je obrovská. Každý se snaží něco vymyslet, vytvořit, zlepšit a je toho vážně hodně. Vůbec se nedivím lidem, že se drží jedné věci a nic dalšího je nezajímá. Ostatně proto jsem se také rozhodl věnovat jen jedné části.
Všechno sleduju pomocí Twitteru, mám tam pár lidí a projektů, které mě zajímají. Sleduji spíš věci kolem webové platformy a sem tam přesdílím něco, co by mohlo zajímat zase mojí komunitu.
A tohle své nadšení předáváš i svým synům, že? V jaké podobě?
Už od malička jsem je vedl k tomu, že když něco nevědí, tak mají použít internet a googlit. A teď se dost věnujeme robotům. Microsoft financuje vývoj Visual Studio Code, editoru pro vývojáře, a vedle toho vyvíjí editor MakeCode pro Micro:bit. To je destička s Bluetooth čipem, která se dá programovat přes pěkný webový editor MakeCode.
Vytváříme také jednoduché arkádové hry pomocí editoru MakeCode Arcade. Hry pak hrajeme na přenosné konzoli Meowbit nebo na Micro:bitu pomocí rozšíření Newbit Arcade Shield. S klukama jsme společně vytvořili hru skákací prasátko Piggy Run pro aplikaci Trendaro.
Josef vytvořil jednoduchou hru pro Trendaristy, aby zvládli zhruba hodinku plánovaného výpadku systému bez úhony.
Pro studenty, nebo i děti, které s tím začínají, je to skvělé. Vedu u nás na Sázavě malý kroužek, kde si s tím hrajeme. Do editoru je možné psát buď kód, nebo si vybíráš z barevných bloků, které mají konkrétní funkce – přehraj melodii, ukaž ikonu, nastav úhel servo motoru. Děti ta barevnost a jednoduchost baví.
Mám tu kluka v první třídě, co neumí ani číst ani psát, ale vidí, že je to barevné a že je to skládačka. Vysvětlím mu, co ten který blok dělá, vyzkouší si to a ono to funguje. Papírová housenka se mu pak plazí po zemi, nebo mu robot polyká mince a on z toho má hroznou radost.
Svoje kluky chci někam posunout a když se naučí základní logiku kódování, tak pak můžou přecházet do různých jazyků. Na pozadí robotů, které používáme, je Python a JavaScript, takže jazyky, které mi jsou nejbližší.
Ono se to nezdá, ale když se těm dětem trochu věnuješ, tak mají spoustu skvělých nápadů. Já už mám problém prosadit ty svoje.
A když se vrátíme zase zpátky k Behaviu. Jsi jedním z těch, kteří jsou v Behaviu téměř od začátku, kdy jsme se ještě vešli do jednoho auta a odjeli do Alp. Jak hodnotíš postupný vývoj?
Je pravda, že na začátku to bylo zajímavější, protože jsme si byli blíž. Baví mě, že se nedržíme pořád jedné věci. Od Trendara přes Mapu voličů, Atlas Čechů až k Saasu, rosteme. Je to fajn, že nestojíme na místě.
Vnitřně jsem ještě nenašel na frontendu to, co řeší webové aplikace tak, jak bych chtěl. Mám v hlavě takovou představu, že bych vytvořil šablonu, která by spojila různé technologie a pomohla by generovat statické stránky s minimem JavaScriptu tak, aby vůbec nedocházelo k prodlevám v načítání stránek. Aby se komponenty vykreslily předem. A to by Behavio taky dost využilo, tak je pořád co dělat.
Behavio je navíc startup plný mladých lidí. Pro mě osobně byl zajímavý i ponor do sociologie. Dokud jsem v Behaviu nebyl, tak jsem vůbec neměl představu, co tihle lidi vlastně dělají.