Cílem předmětu bude seznámit studenty s použitím JavaScriptových technologií na klientovi (webový prohlížeč) a serveru. V průběhu kurzu budou představeny nástroje a návrhové vzory, které vývoj aplikací usnadní
- Úvodní informace, Vanilla JS, ES6+, vlastnosti jazyka
- Node.js (package.json, npm), asynchronní požadavky, tvorba web serveru (Express.js)
- React - funkcionální UI komponenty a jejich kompozice, Next.js
- React - aplikační stav a side efekty, styly v JS, komponenty třetích stran
- Databáze - kategorie přístupů k DB, tvorba RESTového API
- Nerelační databáze (MongoDB), ORM (Prisma), TSDB, časové řady
- GraphQL - SDL, tvorba API
- WebSocket (Socket.io), Message Queue knihovny (ZeroMQ)
- Správa aplikačního stavu, immutabilní datové struktury
- Statické typy (TypeScript), TS Runtime (Deno), Dokumentace (JSDoc)
- Multiplatformní vývoj (Electron)
- Funkcionální programování na platformě JS (fp-ts, ClojureScript)
- Je nutné ovládat alespoň základy JavaScriptu a mít základní zkušenosti s tvorbou webových aplikací
- Dále je nutné znát základní principy z oblasti databázových systémů, počítačových sítí (zejména aplikační vrstvy)
- Preferovaný editor VSCode, linuxová konzole (MINGW pro Windows - součást instalace Gitu).
- Běhové prostředí Node.js
- Znalost Gitu výhodou
-
Historie JS sahá do poloviny 90. let, kdy postupně vzniklo několik prototypů univerzálního jazyka pro webové prohlížeče. Z těch pak vychází standardizovaná specifikace jazyka JS známá jako ECMAScript
-
V roce 2009 bylo uvedeno běhové prostředí Node.js, které se stalo určitou platformou pro tvorbu aplikací a na které mohou být zároveň hostované jiné jazyky a technologie. Na prohlížeč lze navíc nahlížet též jako na určitou platformu, která nám poskytuje API k systémovým zdrojům
-
JS je skutečně špatný jazyk ve smyslu, že existuje spousta pastí, do kterých se nezkušený JS programátor může dostat (zejména díky slabým dynamickým typům nebo užívání dvojího rozsahu platnosti)
-
Má však ale mnoho zajímavých vlastností a při dodržování správných programátorských přístupů v něm lze programovat efektivně. Dle statistik GitHubu je nejrozšířenějším programovacím jazykem vůbec. Také má bezpochyby největší open-source zázemí
- Při tvorbě interaktivních webových aplikací, které budou pracovat s DOM prohlížeče na klientské straně
- Pro rychlé prototypování aplikací - dostupné řešení (nejen) pro malé projekty/startupy
- Výhodou je použití jednotné technologie na klientovi a serveru
- Otázka by se dala zobecnit - proč vlastně používat jakoukoliv knihovnu pro tvorbu frontendu? Důvodů je hned několik. V dřívějších dobách, kdy se API prohlížečů velmi lišilo, bylo nutné sjednotit a zjednodušit práci s DOMem. S řešením přišla knihovna jQuery, která kromě sjednocení rozdílných funkcionalit prohlížečů usnadnila také práci s asynchronními požadavky (AJAX) nebo CSS selektory. Stala se tak jakousi náhradou tzv. "Vanilla JavaScriptu"
- Zlomovým bodem bylo vydání JS standardu ES6, se kterým přišla řada nových vlastností jazyka. Spolu s příchodem frontendových frameworků typu Angular nebo React pak vývoj frontendu dostal úplně nový rozměr
- Pro zachování kompatibility se staršími prohlížeči, podporující starší verze ECMAScriptu vznikly transpilery (jako je Babel), které tyto frontendové frameworky používají. Mimo jiné také obsahují řadu optimalizací, které výsledný kód rozdělují (Webpack) a umožňují ho tak načítat po částech. Mezi další optimalizace patří například minifikace CSS stylů a JS skriptů
- Knihovna React je sama o sobě zaměřena čistě na tvorbu UI, veškeré React komponenty = JS funkce, s čímž je spojena celá řada výhod. React je také dle týdenních statistik stažení (npm balíčku) nejrozšířenější knihovnou pro tvorbu UI (v porovnání např. s Vue nebo Angularem). Díky její jednoduchosti a rozšíření je proto vhodným kandidátem