Přeskočit na hlavní obsah
Josef Kvapil

Frontend architekt — Liberec

Tlačítko postavené stejně, jako stavím platformy.

Navrhuju a vedu frontend platformy pro banky a enterprise. Tady jsou základy: šest kroků, popořadě, žádný se nepřeskakuje — u tlačítka ani u platformy.

Ozvěte se

01 — Architektura

Nejdřív nakreslím hranici.

tlačítko →
jedna komponenta, jedna jasná práce
platforma →
jedna doména, jeden jasný vlastník

02 — TypeScript

Pak mu napíšu kontrakt.

tlačítko →
typované props mezi komponentou a volajícím
platforma →
typované kontrakty mezi týmy

03 — Design systémy

Každý stav je rozhodnutí.

tlačítko →
hover, pressed, disabled — každý rozhodnutý jednou
platforma →
barvy, formuláře, vzory — každý rozhodnutý jednou, pro všechny týmy

04 — Přístupnost

Funguje pro každou ruku.

tlačítko →
jeden focus ring, jeden 44px target
platforma →
stejná laťka na každé obrazovce — WCAG 2.1 AA

05 — Review & AI

Pak to musí dokázat.

tlačítko →
jeden diff: review, testy, podpis
platforma →
každý diff desítek vývojářů: stejná laťka

06 — Dodávka

Teď je to naostro.

tlačítko →
naživo v produkci — zmáčkněte si ho
platforma →
naživo pro banky, pojišťovny a energetiku

Velké věci zvládnu vést, protože jsem nikdy nepřeskočil ty malé.

architektura · leadership · React · TypeScript · TanStack

Co umím

Co do projektu přináším.

  1. 01

    Architektura platforem a mikrofrontendů

    důkaz: architektura přestavby core systému velké pojišťovací skupiny — framework denně používaný desítkami vývojářů

  2. 02

    Vedení frontend týmů

    důkaz: vedení FE týmů na veřejné mobile-first samoobslužné aplikaci a na digitalizaci prodeje energetického giganta

  3. 03

    Dodávka v regulovaných odvětvích

    důkaz: plně online založení bankovního účtu vč. ověření identity; paperless zasmluvnění end-to-end

  4. 04

    Analýza a komunikace s klientem

    důkaz: analytická fáze sales a zákaznických portálů pro energetickou firmu — specifikace, na které staví dodávkový tým

Reálné dodávky; klienty záměrně nejmenuji.

Open source

Nástroje, které za mě mluví veřejně

  1. 01biome-you-might-not-need-an-effectBiome linter plugin odhalující zbytečné React useEffect hooky podle react.dev guidelines. Publikováno na npm.
  2. 02construePřevádí přirozený jazyk na validovaný strukturovaný výstup. React-first, provider-agnostic LLM nástroj postavený na Standard Schema.
  3. 03companionDesktopový společník reagující v reálném čase na aktivitu Claude Code přes hooky.
  4. 04openclaw-guardianHTTP proxy pro Claude API, která hlídá rate-limity a oživuje spadlé sessions. Prometheus metriky, Grafana dashboard, bez závislostí.

O mně

Zajímá mě, jak věci fungují uvnitř.

První web jsem v PHP napsal v šesté třídě a nepřestal. Dnes to znamená React a TanStack až do zdrojáků — a vědomí, kdy projekt potřebuje raději nudné a prověřené. Pracuju AI-first s jedním tvrdým pravidlem: AI draftuje, inženýr podepisuje. Vibecoding není inženýrství.

Stack

denně
React · TypeScript · TanStack · Hono · Drizzle · Astro · MUI · Vite · Biome
prostředí
vim · tmux · Claude Code · Docker · GitLab CI · Jenkins · OpenShift
zorientuju se v
Rust · Java · C# · PHP · Angular · Vue · Kotlin · Go · Elixir · Gleam · Swift

Kde jsem pracoval

  1. 2021 — teď
    Trasksenior frontend vývojář → architekt & team lead — bankovnictví, energetika, pojišťovnictví
  2. 2019 — 21
    LundegaardJavaScript vývojář — React a Angular na velkých korporátních aplikacích
  3. 2018 — 19
    TraskJavaScript vývojář — Angular, JSP, občas Java
  4. 2015 — 17
    C26.czprogramátor — PHP, C, jQuery a první klienti

Pro pořádek

AWS Certified Cloud Practitioner · Anthropic Claude Code certifikace · mentoring a interní přednášky · CZ / EN / DE

Kontakt

Ozvěte se

Rád se zakousnu do zajímavého frontend problému, architektury i open-source spolupráce.

btn / váš-projekt

další výkres může být váš