Frontend: Dva světy technologií

Termín Frontend označuje „přední část“ systému, která slouží jako rozhraní pro vstup dat – ať už jde o lidského uživatele nebo zdrojový kód programu.

1. Webový Frontend (Klientská část)

Ve světě webu je frontend vše, co běží v prohlížeči uživatele. Je to kombinace designu, interaktivity a logiky uživatelského rozhraní.

Základní technologie (Svatá trojice)

HTML (Struktura): Definuje obsah stránky (nadpisy, odstavce, obrázky).

CSS (Vzhled): Určuje barvy, fonty, rozložení (layout) a animace.

JavaScript (Logika): Zajišťuje interaktivitu, komunikaci s API a dynamické změny obsahu.

Moderní Frameworky

Dnešní frontend se málokdy píše v čistém JavaScriptu. Používají se knihovny, které usnadňují tvorbu složitých aplikací:

React: Knihovna od Facebooku založená na komponentách.

Vue.js: Flexibilní a progresivní framework oblíbený pro svou jednoduchost.

Angular: Robustní framework od Google pro velké podnikové aplikace.

[Image of frontend vs backend architecture diagram]

2. Frontend v kompilátorech (Přední část překladače)

V kontextu nástrojů jako GCC, LLVM nebo Clang je frontend první fází procesu překladu programu.

Úlohy kompilátorového frontendu

Jeho úkolem je rozumět konkrétnímu programovacímu jazyku a převést jej do univerzální formy:

1. **Lexikální analýza:** Rozbití textu na základní stavební kameny (tokeny).
2. **Syntaktická analýza:** Kontrola, zda kód dodržuje gramatiku jazyka (vytvoření stromu AST).
3. **Sémantická analýza:** Ověření logiky (např. zda proměnná byla deklarována).
4. **Generování IR:** Převod do mezikódu (např. LLVM IR).

Srovnání: Frontend vs. Backend

Kontext	Frontend	Backend
Web	Prohlížeč, UI, uživatelský zážitek (UX).	Server, databáze, API, business logika.
Kompilátor	Zdrojový kód (C++, Rust), syntaktická kontrola.	Optimalizace pro procesor, generování binárky.

—

Zajímavost: Hranice mezi webovým frontendem a backendem se dnes stírá díky technologiím jako Server-Side Rendering (SSR), kde se část frontendu připravuje už na serveru pro rychlejší načítání.

Související: Clang, LLVM, GTK, Qt, JavaScript