PB138 Základy webového vývoje a značkovacích jazyků

Fakulta informatiky
jaro 2024
Rozsah
2/2/0. 3 kr. (plus ukončení). Doporučované ukončení: zk. Jiná možná ukončení: z.
Vyučující
prof. RNDr. Tomáš Pitner, Ph.D. (přednášející)
Mgr. Luděk Bártek, Ph.D. (přednášející)
Ing. Lukáš Grolig (přednášející)
Filip Kaštovský (přednášející)
Bc. Daniel Plakinger (přednášející)
Bc. Tomáš Sedláček (přednášející)
Ing. Petr Wehrenberg (přednášející)
Bc. Martin Bednárik (cvičící)
Branislav Bubán (cvičící)
Bc. Matej Hakoš (cvičící)
Bc. Radovan Hančuľák (cvičící)
Bc. Otakar Hirš (cvičící)
Bc. Ondřej Hrdlička (cvičící)
Bc. David Konečný (cvičící)
Ivan Kushpel (cvičící)
Bc. Daniel Múčka (cvičící)
Bc. Ondřej Planer (cvičící)
Bc. Daniel Puchala (cvičící)
Martin Ragan (cvičící)
Bc. Daniel Rozehnal (cvičící)
Samuel Wittlinger (cvičící)
Bc. Adam Zálešák (cvičící)
Radmila Čermáková (pomocník)
Ing. Marek Mišík (pomocník)
Garance
prof. RNDr. Tomáš Pitner, Ph.D.
Katedra počítačových systémů a komunikací – Fakulta informatiky
Kontaktní osoba: prof. RNDr. Tomáš Pitner, Ph.D.
Dodavatelské pracoviště: Katedra počítačových systémů a komunikací – Fakulta informatiky
Rozvrh
Po 19. 2. až Čt 9. 5. Čt 18:00–19:50 D1
  • Rozvrh seminárních/paralelních skupin:
PB138/01: Út 18:00–19:50 A319, F. Kaštovský
PB138/02: Po 16:00–17:50 B311, M. Bednárik
PB138/03: Po 16:00–17:50 B011, B. Bubán, I. Kushpel
PB138/04: Út 18:00–19:50 A215, P. Wehrenberg
PB138/05: Po 10:00–11:50 B311, O. Planer
PB138/06: St 16:00–17:50 B130, R. Hančuľák
PB138/07: Po 18:00–19:50 B311, D. Múčka
PB138/08: Po 14:00–15:50 A215, M. Hakoš, T. Sedláček
PB138/09: Po 12:00–13:50 A215, T. Sedláček, A. Zálešák
PB138/10: St 18:00–19:50 A218, S. Wittlinger
PB138/11: Út 10:00–11:50 A319, O. Hrdlička, D. Rozehnal
PB138/12: St 10:00–11:50 A215, M. Ragan
PB138/13: St 18:00–19:50 A215, D. Konečný, D. Puchala
PB138/14: Út 14:00–15:50 B311, O. Hirš
PB138/15: Út 12:00–13:50 A219, L. Bártek
Předpoklady
Předpokládají se základní znalosti z oblasti formálních jazyků, orientace v objektovém a funkcionálním programování. Doporučena je také základní znalost některého z univerzálních objektových jazyků, jako Java, C++, C#, či ECMAScript, funkcionálního jazyka, jako je Haskell a databázích. Dále je žádoucí základní znalost některého značkovacího jazyka (např. HTML) a služeb Internetu.
Omezení zápisu do předmětu
Předmět je nabízen i studentům mimo mateřské obory.
Předmět si smí zapsat nejvýše 200 stud.
Momentální stav registrace a zápisu: zapsáno: 174/200, pouze zareg.: 4/200, pouze zareg. s předností (mateřské obory): 3/200
Mateřské obory/plány
předmět má 62 mateřských oborů, zobrazit
Cíle předmětu
Předmět seznamuje se základními standardy a principy práce s technologiemi moderních značkovacích jazyků především na bázi XML, HTML a YAML. Také se seznámí s reprezentací dat ve formátu JSON. Po úspěšném zvládnutí předmětu bude student tvořit moderní aplikace psané v TypeScriptu využívající React a moderní značkovací jazyky, které získávají data z backendu pomocí RESTových rozhraní nebo dotazovacího jazyka GraphQL.
Výstupy z učení
Student bude po absolvování předmětu schopen:
vysvětlit výhody, nevýhody a účel značkovaných dat a dokumentů
aktivně použít terminologii značkovaných jazyků
zvolit vhodný značkovací jazyk pro danou aplikaci
aktivně využívat jazyka XML
popsat charakteristiky internetových technologií, jako je HTML 5, JavaScript, React, JSON, GraphQL a další moderní webové standardy a umět je použít v reálné aplikaci
popsat princip Single Page aplikací
Osnova
  • Struktura a terminologie značkovaných dokumentů. XML: standardy základní rodiny XML, analýzy a zpracování XML dat.
  • Objektový model dokumentu, událostmi řízené zpracování. Navigace a dotazování v XML datech. XPath, XML Transformace.
  • HTML dokumenty, standard HTML 5 a moderní webové stránky.
  • CSS styly: aplikování stylů, rozložení a responzivní design webových stránek.
  • Základy moderních JavaScriptových a TypeScriptových aplikací, ekosystém Node.js, řízení závislostí pomocí NPM.
  • JSON: syntaxe, datové typy, pole a objekty. Práce s databází v TypeScriptu, principy a implementace rozhraní REST v TypeScriptu.
  • GraphQL: schémata, dotazy, mutace, typy, validace.
  • React: jazyk JSX/TSX, definice komponent a jejich kompozice, životní cyklus komponent, stav aplikace, práce se seznamy.
  • React: zpracování formulářů, získávání dat z RESTových rozhraní.
  • React: směrování, knihovna react-query a mutace dat.
  • React: globální stav aplikace, komplexní správa stavů v aplikaci.
  • YAML: syntaxe a aplikace. Docker: kontejnerizace a nasazení aplikací.
Výukové metody
Výuka probíhá formou přednášek, cvičení a samostatné hodnocené práce na iteracích a týmovém projektu. Přednáška teoreticky objasňuje pojmy a principy z oblasti značkovacích jazyků a moderního webového vývoje. Cvičení v počítačových učebnách demonstrují vhodné postupy a nástroje pro vývoj aplikací, řeší demonstrační úlohy podobné iteracím a slouží ke konzultacím probírané látky, zadání a týmových projektů.
Metody hodnocení
Hodnocení předmětu je založeno na průběžném bodování pěti iterací (max. 40 bodů celkově, minimálně je nutno získat 20), týmového projektu, kde je bodována průběžná práce i závěrečný výsledek obhajoby (max. 40 bodů) a teoretická závěrečná zkouška, organizovaná jako odpovědník v ISu (max. 20 bodů). Z celkových 100 bodů je pro úspěšné hodnocení předmětu zkouškou třeba získat alespoň 70 bodů, pro ukončení zápočtem 60 bodů. Studenti, kteří ukončují předmět zápočtem, se taktéž mohou zapsat na zkušební termín, pokud nemají dostatek bodů z iterací a týmového projektu.
Navazující předměty
Informace učitele
Předmět předpokládá značný podíl samostatné práce navíc při studování používaných technologií, jejich (anglicky psaných) specifikací a dalších zdrojů. Většina materiálů (slidy, zadání iterací) je k dispozici v angličtině. Hodnocení iterací formou code-review také přispívá k časové náročnosti předmětu.
Další komentáře
Studijní materiály
Předmět je vyučován každoročně.
Nachází se v prerekvizitách jiných předmětů
Předmět je zařazen také v obdobích jaro 2003, jaro 2004, jaro 2005, jaro 2006, jaro 2007, jaro 2008, jaro 2009, jaro 2010, jaro 2011, jaro 2012, jaro 2013, jaro 2014, jaro 2015, jaro 2016, jaro 2017, jaro 2018, jaro 2019, jaro 2020, jaro 2021, jaro 2022, jaro 2023, jaro 2025.