Logo Vzhůru dolů: Mlátek a želízko Balíček kurzů – při objednávce ušetříte

Organizace CSS a dokumentace frontendu

Příští termín: 13. a 14. 10. 2020 v Školící místnost SUPERKODERS Brno

Prohlédnout termíny

Vydejte se na cestu k dobře organizovanému CSS kódu a ušetřete čas prací na vlastním systému komponent.

Po prvním dnu kurzu Adama Kudrny budete umět zorganizovat CSS kód tak, aby jeho správa nebolela. Ve druhém dni se pak společně zaměříte na tvorbu a údržbu vlastního systému frontendových komponent, který vám ušetří spousty času a peněz.

Lektor

Adam Kudrna

Adam Kudrna

Adam je frontend designer, konzultant a lektor na volné noze. Jeho práce se zaměřuje na mentoring a vývoj udržitelného a škálovatelného uživatelského rozhraní pro klienty jako RACOM, PragueBest nebo LMC.
Více o lektorovi

Fotky ze školení

Obsah

1. den: Organizace CSS kódu

Den je koncipován jako přednáška se společnou prací na refaktoringu.

  1. Problémy CSS a jejich řešení
    Kaskáda, specificita, globální platnost, nemodularita, blokování vykreslování a další. Jaké problémy přinášejí a jak si s nimi poradit.
  2. Proces zkvalitnění kódu
    Pravidla psaní, Stylelint, code review a refaktoring v kontextu stylů.
  3. Kategorizace stylů a organizace souborů
    Pojďme rozdělit kód do malých souborů. Ale jak? Metodika ITCSS, její principy a jak ji nasadit.
  4. Psaní komponent
    BEM a SUIT CSS. Časté chyby a obvyklé problémy při jejich zavádění.
  5. Utility třídy
    Tailwind a další frameworky. Kdy se hodí používat tento přístup? Kombinování s komponentovým přístupem.
  6. Psaní CSS kódu
    Sass, LESS, PostCSS a jejich temná strana. Kdy přidat do kódu komentář? Konkrétní nastavení Stylelintu. EditorConfig. Napojení stylů na JavaScript.

Adam vám po školení pošle prezentaci a užitečné odkazy.

2. den: Od dokumentace k systémům designu

Program jsme vymysleli jako přednášku doplněnou praktickými ukázkami.

  1. Na čem chceme pracovat?
    Co jsou „style guidy“, CSS frameworky, pattern libraries, UI knihovny a systémy designu? Jaký je mezi nimi rozdíl a jak do sebe zapadají?
  2. Anatomie komponenty
    Co je to komponenta, co do ní patří a co už ne? Jak navrhovat API, předávat data, pracovat se stavem a skládat komponenty.
  3. Layout a kompozice
    Znovupoužitelný layout. Návrh komponent pro rozvržení stránky. Využití CSS gridu. Jak z komponent a layoutů poskládat rozhraní. Využití utility tříd.
  4. Tvoříme dokumentaci
    Bez kvalitní dokumentace nemá UI knihovna šanci. Jak dokumentaci psát, co do ní patří a jaké nástroje využít?
  5. Rozvoj a údržba
    Úspěšná knihovna komponent vyroste a budeme ji nasazovat do nových projektů. Jak plánovat a řídit rozvoj, přidávat komponenty a odebírat nepotřebné?

Po školení dostanete prezentaci a užitečné odkazy.

Průměrné hodnocení 4,84 z 5 hvězdiček.
Na základě 82 hodnocení od 134 účastníků kurzu.

Více o kurzu

Tento kurz zatím nikdo nehodnotil.
Je úplně nový a čeká, až jej navštívíte a zhodnotíte.

Více o kurzu

Ohlasy účastníků

Užitečné informace

Pro koho to je?

Pro profesionální webové vývojáře a vývojářky. Školení reflektuje široké spektrum možných složení týmů: od frontendistů na volné noze, přes týmy pracující na agenturních zakázkách až po produktový vývoj.

V první dni se budeme se věnovat psaní čistého nebo „preprocesorového“ CSS.

V druhém dni se zaměřujeme na CSS i JavaScript a počítáme jak s přístupem práce v moderních komponentových frameworcích (React, Vue.js), tak s klasickým přístupem „velkého CSS“, převládajícího například na obsahových webech.

Co potřebujete?

Školení sice zvládnete i s blokem a tužkou, ale lepší je mít vlastní laptop, na kterém bude nainstalovaný váš oblíbený editor kódu.

Související školení

  • Kompletní JavaScript – JavaScript je pro vývoj webových aplikací nepostradatelný. S Riki Fridrichem ve dvou dnech projdete nejprve JS jako jazyk a pak také doporučené nástroje pro automatizaci, testování a správu balíčků.
  • Kompletní rychlost webu – Rychlost je pro weby zásadní: Zlepšuje konverze a díky tomu, že na ni hledí Google, také zvyšuje návštěvnost. Všechny vědomosti o optimalizaci rychlosti webu dostanete ve dvou dnech a pod vedením dvou špičkových odborníků.

Není podstatné, v jakém pořadí kurzy absolvujete. Na druhé a další školení dostanete desetiprocentní slevu.


Cena: 9 490 Kč

Ušetříte 490 Kč bez DPH oproti objednávce jednotlivých školení.
Cena s DPH: 11 483 Kč.

V ceně

Kurz 9:30–17:30 pro 5–16 účastníků.
Oběd a občerstvení během dne.
Konzultace e-mailem od lektora.

Slevy

Platí vždy jedna, ta vyšší:
20 % pro nepodnikající studenty.
10 % pro účastníky předchozích školení.

Veřejné termíny

13. a 14. 10. 2020
(v Brně
za 9 490 Kč)
11 míst ze 14 Objednat
13. a 21. 10. 2020
(v Brně
za 9 490 Kč)
11 míst ze 14 Objednat
20. a 21. 10. 2020
(v Praze
za 9 490 Kč)
16 míst Objednat

Jiný termín nebo firemní školení?
skoleni@vzhurudolu.cz

GoPay Mastercard VISA

Podmínky školení


Proč jít na kurzy Vzhůru dolů?

 let zkušeností

0 školení

0 účastníků

6 důvodů, proč jít na naše školení