Matyas.
SlužbyProjektyZkušenostiBlogKontakt
ENOzvěte se
Zpět na slovník
reactweb-dev

JSX

JSX (JavaScript XML) je syntaktické rozšíření JavaScriptu používané především v Reactu, které umožňuje psát HTML-like značkování přímo v JavaScriptovém kódu. Nástroje jako Babel nebo SWC jej transpilují na běžná volání React.createElement() před odesláním do prohlížeče. JSX podporuje vkládání dynamických výrazů pomocí složených závorek, podmíněné renderování a mapování přes pole, což z něj činí mocný a intuitivní způsob deklarativního popisu UI struktur.

#react#web-dev

Související pojmy

Storybook

Storybook je open-source nástroj pro vytváření a testování UI komponent izolovaně, mimo hlavní aplikaci. Vývojáři definují „stories" — různé stavy a varianty komponenty — které se vykreslují v samostatném prostředí v prohlížeči. Podporuje React, Vue, Angular a další frameworky, což z něj činí neocenitelný nástroj pro dokumentaci komponent, vizuální regresní testování a spolupráci designérů s vývojáři.

Media queries

Media queries jsou funkce CSS, která umožňuje podmíněně aplikovat styly na základě vlastností zařízení, jako je šířka viewportu, výška, orientace, preference barevného schématu nebo omezení pohybu. Jsou základem responzivního webového designu a umožňují různá rozvržení pro mobily, tablety a desktopy. Moderní media queries také podporují detekci uživatelských preferencí pomocí `prefers-color-scheme` a `prefers-reduced-motion` pro přístupnější zážitky.

Přístupnost

Přístupnost (často zkráceně a11y) je praxe navrhování a tvorby webových stránek a aplikací tak, aby je mohli používat všichni, včetně lidí se zrakovým, motorickým, sluchovým nebo kognitivním postižením. Zahrnuje správné sémantické značkování, podporu navigace klávesnicí, dostatečný barevný kontrast a kompatibilitu se čtečkami obrazovky. Kromě etické odpovědnosti je přístupnost v mnoha jurisdikcích stále častěji i zákonným požadavkem.

Virtuální DOM

Virtuální DOM je lehká paměťová reprezentace skutečného DOM prohlížeče, kterou React používá k optimalizaci aktualizací UI. Při změně stavu React vytvoří nový strom virtuálního DOM, porovná ho s předchozím procesem zvaným reconciliace a vypočítá minimální sadu skutečných DOM mutací. Tento přístup dávkování a porovnávání se vyhýbá nákladné přímé manipulaci s DOM a byl klíčovou inovací, díky které je deklarativní model Reactu výkonný.

Designový systém

Designový systém je sbírka znovupoužitelných komponent, pravidel a standardů, které zajišťují vizuální a funkční konzistenci napříč produktem nebo skupinou produktů. Typicky zahrnuje knihovnu komponent, design tokeny, typografická pravidla, barevné palety a dokumentaci. Designové systémy propojují práci designérů a vývojářů a umožňují týmům stavět rozhraní rychleji při zachování jednotného vzhledu.

Tmavý režim

Tmavý režim je barevné schéma rozhraní, které používá světlý text a prvky na tmavém pozadí. Snižuje únavu očí při slabém osvětlení, může šetřit baterii na OLED displejích a stal se očekávanou funkcí moderních aplikací. Implementace obvykle využívá CSS custom properties nebo design tokeny, které přepínají mezi světlým a tmavým tématem, často s respektováním systémového nastavení uživatele pomocí media query `prefers-color-scheme`.

Všechna slova
Matyas.

Weby, mobilní appky a automatizace s AI. Pomáhám firmám šetřit čas i peníze technologií, která opravdu funguje.

Odkazy

  • Služby
  • Projekty
  • Zkušenosti
  • Blog
  • Slovník
  • Kontakt

Připravuji

  • Případové studieBrzy
  • Zdroje

© 2026 Matyas Prochazka. Všechna práva vyhrazena.