Kurz Reactu1.0.0 beta
Beta verze 1.0 – zpětná vazba vítána

Pochop React, ne jen jeho syntaxi

Interaktivní kurz s živými ukázkami a výzvami přímo v prohlížeči – od JavaScriptu, který React potřebuje, po routování, načítání dat a správu stavu.

  • ✓ Celý kurz je zdarma
  • ✓ Nic se neinstaluje
  • ✓ React 19 a TypeScript

Všechno je zdarma. Pár bonusových lekcí a výzev se odemkne po přihlášení – stačí e-mail, žádné heslo ani platba.

Začít →Nevíš, kde začít? Udělej si krátký test

Vyzkoušej si to hned

Změň text na tlačítku nebo ať počítá po desítkách – výsledek se mění, jak píšeš.

Načítám interaktivní část…

Co tě čeká

Živé ukázkyKaždý koncept si proklikáš a podíváš se do jeho kódu.
Výzvy přímo v prohlížečiPíšeš skutečný React, výsledek vidíš hned a testy ti řeknou, co funguje.
Přirovnání místo suché teorieKomponenta je jako recept: podle jednoho receptu uvaříš jídlo pro každého hosta zvlášť. Takový obrázek si zapamatuješ líp než definici.
JavaScript, který React potřebujeKapitola JavaScript doplní mezery: pole, objekty, asynchronní kód a reference.
Kvízy a postupOvěř si porozumění, sbírej odznaky a drž sérii dnů.
Moderní ReactReact 19, TypeScript, React Router, TanStack Query, Zustand a Redux Toolkit.

Pro koho je kurz

  • Znáš trochu JavaScript a chceš začít s Reactem – začni kapitolou JavaScript.
  • V Reactu už píšeš, ale občas nevíš, proč něco (ne)funguje – test ti ukáže, kde máš mezery.
  • Chystáš se na pohovor nebo první práci – pomůžou výzvy a principy z lekce React 16.

Jak kurz funguje

  1. Čti a zkoušej. Každá lekce vysvětluje koncept, proč existuje a kde ho použít. Živé ukázky si můžeš proklikat a podívat se na jejich kód tlačítkem </> Kód.
  2. Řeš výzvy přímo na stránce. Každá výzva má editor kódu; výsledek se ukazuje průběžně a tvoje řešení se ukládá v prohlížeči. Testy ti řeknou, které kroky už máš hotové.
  3. Porovnej se vzorem. Záložka Vzorové řešení ukáže, jak se má výsledek chovat. Kód řešení je schovaný, dokud si ho sám nerozbalíš.
  4. Kontroluj typy. Spusť npm run typecheck – TypeScript ti často řekne, co je špatně, dřív než prohlížeč.

Obsah

KapitolaJavaScriptVšechno z JavaScriptu, co React potřebuje: od proměnných po async a vzory, které v Reactu potkáš všude.10 lekcí →KapitolaTypeScriptKam se píšou typy, union typy a zúžení, stavy jako discriminated union a bezpečná práce s daty zvenku. Než typy potkáš v React lekcích.2 lekce →React 01Rychlé opakování základůJSX, komponenty, props, children, podmínky, seznamy a proč na key záleží.React 02Stav a události (useState)Immutabilita, updater funkce, batching, lifting state up a odvozený stav.React 03Efekty (useEffect)Synchronizace s okolním světem, cleanup, race conditions a kdy efekt NEpotřebuješ.React 04Refy (useRef)Přístup k DOM, hodnoty bez překreslení, ref jako prop a useImperativeHandle.React 05Složitější stav (useReducer)Kdy místo useState sáhnout po reduceru a jak ho psát čistě a typově bezpečně.React 06ContextKonec prop drillingu, vzor Provider + hook a výkonnostní pasti.React 07Vlastní hookyJak vytáhnout a znovu použít logiku: useLocalStorage, useMediaQuery, useDebounce…React 08Formuláře a React 19 ActionsControlled vs. uncontrolled, useActionState, useFormStatus a useOptimistic.React 09Výkon a renderování🔓 zdarma po přihlášeníKdy se komponenta překresluje, memo, useMemo, useCallback, useTransition, useDeferredValue.React 10Návrhové vzory komponent🔓 zdarma po přihlášeníKompozice, compound components, render props, portály a error boundaries.React 11TypeScript s ReactemTypování props, událostí, hooků, generické komponenty a discriminated unions.React 12Routování (React Router)Stránky, parametry, vnořené layouty, stav v URL, loadery a chráněné cesty.React 13Načítání datProč fetch v useEffect nestačí, TanStack Query, Suspense a use().React 14Správa stavu aplikaceDruhy stavu a jak vybrat: Context vs. Zustand vs. Redux Toolkit.React 15Závěrečný projekt: KanbanPoskládej všechno dohromady do jedné aplikace.React 16Shrnutí: principy Reactu🔓 zdarma po přihlášení15 principů celého kurzu s vysvětlením a příklady „takhle ne / takhle ano“.

Odznaky (0/10)

První lekceDočti lekci až do konce.
První výzvaVyřeš a odškrtni první výzvu.
RozcvičenýSplň pět rozcviček.
Bystrá hlavaOdpověz správně na deset kvízů hned napoprvé.
Tři dny v řaděUč se tři dny po sobě.
JavaScript zvládnutýPřečti všechny lekce kapitoly JavaScript.
Deset výzevSplň deset výzev.
Celý týdenUč se sedm dní po sobě.
V půlce cestyPřečti polovinu všech lekcí.
AbsolventPřečti všechny lekce kurzu.
Kdo za kurzem stojíZdeněk Grežďo

Programuji ve volném čase. Kurz jsem napsal jako pomůcku pro sebe – a budu rád, když pomůže i tobě.

Víc o kurzu →