- Běžně používané HTML tagy, jejich attributy a jejich použití
- Běžně používané meta tagy
- Vědět proč a kam vkládat link a script tagy
- Zakladni CSS3 styly a jejich vhodné použití
- Jednotky velikostí - px / em / rem
- Selektory čím podrobněji tím lépe, ale pro začátek stačí selektory podle třídy, attributu ([attribute=value]), stavu (:active) a pořadí ve struktuře (:nth-child)
- Pozicování elementů (static, relative, absolute, fixed, float) vědět jaké následky má která volba.
- absolutní pozicovaní je relativní k nejbližšímu nadřazenému elementu s position relative a ne jen ke stránce
- pokud element napozicuji s pomocí float nebo position absolute/fixed, tak je vytržen z kontextu stránky a jeho nadřazený element už nepočítá s jeho výškou
- Animace, transformace a transitions (alespoň základy)
- Media queries a jejich použití pro stylování obsahu pro různá zařízení (podle velikosti, pro tisk a podobně)
- Preprocessory jako jsou SCSS nebo LESS
- Proměnné a jejich proužití pro rychlejší změny v rámci celé aplikace
- Zanoření stylů pro přehlednější kód
- Autoprefixing, umožňující neřešit browser prefixy pro běžně používané styly (např. opacity nebo transform)
- Mixiny pro sdílení stylů, zjednodušení kódu a odstranění copy/paste chyb
- Některé užitečné funkce jako lighten / darken pro úpravy barvy
- Webové fonty a jak a proč je používat lokálně na místo tahání z jiných stránek
- Perfektní znalost základů JS, není potřeba znát jak se jmenuje která funkce, to jde vždy dohledat, ale je nutné vědět jak se píšou proměnné, podmínky, switche, cykly a funkce, a jak se používají objekty a pole.
- Porovnávání proměnných
- rozdíl mezi === a ==
- jak porovnávat objekty a pole
- jak zjistit jestli je proměnná null
- jak zjistit má proměnná nějaký typ (operátor typeof)
- Jak procházet objekt jako pole (funkce Object.keys(objekt))
- verze ES6 a co přináší javascriptu
- const a let operátory pro definování constant a proměnných
- bloky a jak ovlivňují proměnné
- dát pozor na zanoření definice proměnné do bloku, jelikož pak není možné ji použít mimo daný blok
- arrow funkce pro zjednošení psaní funkcí
- dát pozor na to jak arrow funkce řeší klíčové slovo this a předává kontext
- defaultní hodnoty pro parametry funkcí
- dekonstrukce proměnných a parametrů
- operátor ... a jeho použití pro rozpad objektů a polí
- vytažení proměnných z objektu
- importování a exportování modulů
- použití import ... from '...'
- použití export a export default
- tvorba řetězců - používání
`${neco} je krasne`
namistoneco + ' je krasne'
- třídy a definování funkcí třídy (důležité pro react)
- Async/Await a jeho použití s Promise pro vyčistění kódu od zanořených callbacků v asynchronním javascriptu
- Immutability a rozdíl mezi úpravou objektu/pole vs vytvoření nového objektu/pole s novými údaji a kdy je lepší použít kterou variantu
- funkce Object.assign() pro tvorbu nových objektů
- knihovna Immutable pro práci s immutable typy
- rozdíl mezi Array(List), Map a Set
- Stateless funkcionalní komponenta
- Jak a kdy ji použít a jaké má výhody a nevýhody
- Klasická komponenta a její lifecycle
- Proč použít klasickou komponentu třídou místo stateless funkce
- Jaké lifecyclové metody má komponenta kdy je použít např.:
- componentWillMount vs ComponentDidMount
- componentWillReceiveNewProps vs componentWillUpdate
- render
- Zanořování komponent a předávání proměnných (props)
- Změna vzhledu komponenty předáním proměnné v prop
- Předání dat komponentě pro jejich zobrazení, například tabulka předávající data jednotlivým řádkům, které tyto data zobrazují
- Úskalí spojená s použítím props pro předání informace o změně stavu komponenty
- Zobrazení různých komponent na základě podmínky, například zobrazení komponenty pouze pokud pro ni máme data
- Stav komponenty, rozdíl mezi state a props a v jakých metodách měnit stav
- Důležité hlavně vědět proč v metodách render, componentWillReceiveNewProps a componentWillUpdate neměnit stav komponent, jelikož hrozí riziko zacyklení
- Eventy v React komponentách
- jak zpracovávat eventy, měnit stav komponenty na základě událostí a podobné
- dávat pozor na to, že metodám komponenty volaných v rámci zpracování události je potřeba předat kontext (např. pomocí bind funkce, více v dokumentu coding guidelines react)
- Routing a práce s URL (react-router)
- zobrazení komponenty na základě aktuálního URL
- Přesměrování (
<Redirect />
) v rámci aplikace bez refreshe prohlížeče - Link a klikatelné odkazy
- router v kontextu a metoda router.transitionTo()
- Animování React komponent
- Použití JS knihoven nedělaných pro React
- Tvorba webového serveru pro zpracování požadavků vracení obsahu s pomoci Express.JS
- Inicializace serveru a tvorba route a funkcí pro zpracování požadavků
- REST a využití http metod GET/POST/PUT/DELETE
- Odpovědi, vracení JSON obsahu a HTTP stavy (200, 204, 400, 403, 404, 500)
- Requesty a zpracování dat příchozích z prohlíče (QUERY vs BODY)
- Validace a čištění dat
- Mongoose a práce s MongoDB (případně jinými databázemi)
- Co je MongoDB a jaký je rozdíl mezi SQL a NoSQL databází
- Tvorba modelů
- Ukládání dat
- Vyhledávání - find, findOne a findById
- Agregace dat pro statistiky
- GM (ImageMagic) a práce s obrázky
- NodeMailer a odesílání emailů
- proč udržovat stav aplikace na jednom místě
- akce aplikace a jejich bindování(kontext) a vyvolání
- reducery měnící stav aplikace na základě akcí
- Immutable v reduxu a proč je důležité
- payload akce a předávání dat reduceru
- asynchroní akce a jejich zpracování
- react-redux a napojení React component na Redux pomocí connect
- redux dev tools pro sledování stavu aplikace a toho jak akce mění její stav