Menu
FT
zimný semester
5 kreditov
Každý z nás pozná Netflix. Veľa ľudí si ho obľúbilo práve vďaka tomu, že v ňom možno jednoducho vyhľadávať filmy pomocou názvu, alebo ich vyfiltrovať podľa žánru, hodnotenia a pod. V dnešnej dobe chceme všetci pracovať s aplikáciami, ktoré sú intuitívne, rýchle a jednoducho v nich vieme nájsť to, čo hľadáme. Na frontendových technológiach sa ich naučíš programovať v Javascript frameworku, konkrétne vo Vue.js. Na tomto framweorku je založených mnoho známych appiek, ako napríklad spomínaný Netflix, Trivago alebo Adobe. Po absolvovaní tohto predmetu budeš schopný navrhnúť a vytvoráť moderné, interaktívne a rýchle webové aplikácie.
Podmienkou, pre absolvovanie predmetu je aktívna účasť na seminároch, priebežná práca na zadaniach a taktiež budeš musieť vypracovať a odprezentovať svoj finálny projekt. Hodnotenie: A: 100-95%,B: 94-90%, C: 89-85%, D: 84-80%,E: 79-70%, Fx: menej ako 69%.
1. Frontendové frameworky, princíp, filozofia, prehľad aktuálnych riešení a ich filozofia.
2. Čo je VueJS, Časti aplikácie (html, js, css), Prezentácia základných pravidiel prostredníctvom sandboxov (Vue inštancia, data, metódy), DOM model. – domáca príprava: Vyriešenie trojice úloh v sandboxe – pochopenie filozofie Vue (4 hod.)
3. Visual Studio Code, Štruktúra aplikácie, editácia a parametrizácia základného projektu (šablóna, životný cyklus, hooks), Udalosti vo webovej aplikácii, objekt udalostí, v-model ako pilier reaktívnosti, v-if, v-for a jeho obmedzenia. – domáca príprava: Tvorba jednoduchého projektu zameraného na generovanie dizajnu a spracovanie udalostí v aplikácii – zoznámenie sa s prostredím. (4 hod.)
4. Práca so zoznamom (v-for, renderovanie). Technológia Material design a techniky pre jeho aplikáciu. – domáca príprava: Vytvorenie jednoduchého projektu so zoznamom a aplikovaným material designom (4 hod.)
5. In-line editovanie. Pridávanie prvkov do zoznamu (štandardný a alternatívny prístup). Ďalšie operácie v zozname (hromadný výber elementov). – domáca príprava: Príprava prvého projektu – tvorba zoznamu s editáciou a mazaním, aplikácia Material designu. (8 hod.)
6. Komponenty (zapuzdrenosť a znovupoužiteľnosť), organizácia komponentov (kontajner – obsah), komunikácia medzi komponentami. – domáca príprava: Finalizácia úvodného projektu. (10 hod.)
7. Vue-router a URL-based komponenty. Bezpečnostné problémy a ich riešenie. – domáca príprava: Hodnotenie projektu. Každý študent hodnotí (peer-review) aplikácie 5 spolužiakov. (4 hod.)
8. SPA – jednostránková aplikácia. Skladanie aplikácie z komponentov, návrh rozhrania a komunikácie medzi komponentami. Props – premenné komponentov.
9. Vuex – manažment premenných (getters, mutations, actions). Využitie zdieľaného úložiska (store) pri komunikácii medzi komponentami. – domáca príprava: Tvorba SPA aplikácie (8 hod.)
10. Komunikácia medzi komponentami cez komponenty store, computed a mapgetters. – domáca príprava: Finalizácia SPA aplikácie (12 hod.)
11. Vuetify – predstavenie komponentov, predstavenie tém pre záverečné projekty. – domáca príprava: Hodnotenie SPA aplikácie. Každý študent hodnotí (peer-review) aplikácie 5 spolužiakov. (6 hod.)
12. Komponenty Vuetify (zoznamy, menu, komponenty podporujúce tvorbu štruktúry aplikácie, šablóny). – domáca príprava: Príprava záverečného projektu – aplikácia s komponentami Vuetify. (14 hod.)
13. Prezentácia a obhajoba záverečného projektu. – domáca príprava: Finalizácia záverečného projektu. (12 hod.)