BEM

Atomický design je metodologie Brada Frosta pro tvorbu designových systémů rozdělením rozhraní do pěti hierarchických úrovní: atomy (základní HTML elementy), molekuly (jednoduché skupiny komponent), organismy (složité UI sekce), šablony (rozvržení na úrovni stránky) a stránky (konkrétní instance se skutečným obsahem). Tento přístup poskytuje konzistentní mentální model pro organizaci knihoven komponent v React, React Native nebo Flutter projektech a zajišťuje systematickou škálovatelnost UI.

Design tokeny jsou nejmenší jednotky designového systému — pojmenované hodnoty reprezentující barvy, rozestupy, typografii, zaoblení rohů a další vizuální vlastnosti. Fungují jako jediný zdroj pravdy, který lze převést do formátů specifických pro danou platformu (CSS proměnné, Swift konstanty, XML resources). Změnou hodnot tokenů na jednom místě lze aktualizovat vzhled celé aplikace napříč platformami najednou.

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.

Docker je platforma, která balí aplikace a jejich závislosti do lehkých, přenositelných kontejnerů běžících konzistentně v jakémkoli prostředí. Dockerfile definuje kroky sestavení a obrazy lze sdílet přes registry jako Docker Hub. Kontejnery jsou klíčové pro automatizaci, protože zaručují stejné chování kódu v CI pipeline, stagingu i produkci a eliminují problém „u mě to funguje".

Ve Flutteru je strom widgetů hierarchická struktura vnořených widgetů, která definuje celé UI aplikace. Vše ve Flutteru je widget — od rozvržení jako `Column` a `Row` přes stylovací obaly jako `Padding` a `Theme` až po interaktivní prvky jako `GestureDetector`. Flutter udržuje tři paralelní stromy (widget, element a render object), které spolupracují na efektivním přestavění pouze těch částí UI, které se skutečně změnily při aktualizaci stavu.

Headless UI označuje knihovny komponent, které poskytují chování, správu stavu a logiku přístupnosti bez jakéhokoliv předdefinovaného stylování nebo markupu. Knihovny jako Radix Primitives, Headless UI od Tailwind Labs a React Aria dávají vývojářům plnou kontrolu nad vizuální prezentací a zároveň řeší složité vzory jako správu fokusu, klávesovou navigaci a ARIA atributy. Tento přístup odděluje funkcionalitu od designu, což je ideální pro vlastní designové systémy.