Vývoj aplikace Střelecký deník: Jak na offline-first architekturu v React Native

Vývoj aplikace Střelecký deník: Jak na offline-first architekturu v React Native

Když jsem se pustil do vývoje Střeleckého deníku, nechtěl jsem jen další jednoduchou utilitu. Chtěl jsem vytvořit robustní nástroj pro sportovní střelce, který obstojí i v náročných podmínkách na střelnici. Z vývojářského hlediska to znamenalo vyřešit zásadní výzvu: jak zajistit stoprocentní spolehlivost dat v offline prostředí a zároveň udržet kód čistý a snadno rozšiřitelný.

V tomto článku rozeberu technickou architekturu aplikace, proč jsem vsadil na konkrétní nástroje a jaké seniorní postupy mi pomohly doručit produkt, který je rychlý, stabilní a uživatelsky přívětivý.


Základní stack: Expo a moderní React Native

Aplikace běží na Expo SDK a React Native Volba Expa byla strategická – díky Continuous Native Workflow mám přístup k nativním modulům, ale zároveň těžím z rychlosti vývoje, kterou Expo nabízí.

File-based routing s Expo Router

Pro navigaci jsem zvolil expo-router. Jako vývojář oceňuji, že struktura aplikace odpovídá struktuře souborů v adresáři app/. To přináší:

  • Automatické typování: Trasy jsou díky TypeScriptu validované už při zápisu.

  • Deep Linking: Podpora pro systémové odkazy je v podstatě "zadarmo", což je klíčové pro integraci s notifikacemi.


Datová vrstva: Proč SQLite vyhrálo nad AsyncStorage

U aplikace tohoto typu je kritická práce s daty. Střelec si eviduje zbraně, střelivo, tréninkové deníky a fotky terčů. Použít pro tyto relační vztahy jednoduché klíč-hodnota úložiště by byla cesta do pekla.

Zvolil jsem Expo SQLite. Tento přístup mi umožnil:

  1. Relační integritu: Pomocí cizích klíčů (Foreign Keys) hlídám, aby záznam o střelbě nemohl existovat bez přiřazené zbraně.

  2. Výkonnou analytiku: Statistické výpočty (průměry, trendy, spotřeba střeliva) provádím pomocí SQL dotazů přímo v databázi, nikoliv iterováním v JavaScriptu.

  3. Plynulé UX: Díky asynchronnímu přístupu k databázi nedochází k blokování UI vlákna ani při načítání rozsáhlých historií.


Seniorní best practices: Typová bezpečnost a validace

Jako seniorní vývojář vím, že nejvíc času se pálí při opravování chyb způsobených nevalidními daty. Proto jsem do architektury vložil striktní validační vrstvu pomocí Zod.

Validace jako "Gatekeeper"

Každý vstup od uživatele prochází skrze Zod schéma. Tím eliminuji runtime chyby a zajišťuji, že do SQLite databáze se uloží jen to, co tam patří. V kombinaci s React Hook Form získávám výkonnou správu formulářů s minimálním počtem re-renderů.

TypeScript

// Ukázka schématu pro evidenci zbraně
export const weaponSchema = z.object({
  id: z.string().uuid(),
  brand: z.string().min(1, "Značka je povinná"),
  model: z.string().min(1, "Model je povinný"),
  caliber: z.string().min(1, "Ráže je povinná"),
  roundsCount: z.number().int().nonnegative(),
});

Separace logiky od UI

UI komponenty (stavěné na React Native Paper) jsou v mém případě striktně prezentační. Veškerá business logika – od výpočtu balistiky po správu nákupů v aplikaci (react-native-iap) – je vyčleněna do custom hooků a servisních tříd. To usnadňuje testování a budoucí refaktoring.


Práce s multimédii a systémem

Střelecký deník pracuje s fotkami terčů a zbraní. Pro plynulost aplikace jsem nasadil expo-image. Na rozdíl od standardní komponenty Image nabízí:

  • Pokročilé cachování na disku.

  • Plynulé přechody při načítání (blurhash).

  • Lepší správu paměti, což je u mobilních zařízení kritické.

Nezapomněl jsem ani na detaily, které dělají aplikaci "živou". Pomocí expo-haptics dostává uživatel jemnou vibrační odezvu při interakci (např. při uložení záznamu), což výrazně zvyšuje pocit z kvality softwaru.


Lokalizace a globální připravenost

Aplikace je od prvního dne lokalizovaná pomocí i18next. Seniorní přístup k vývoji znamená nepředpokládat, že uživatel bude mluvit jen jedním jazykem. Díky expo-localization se aplikace přizpůsobí regionu uživatele, a to včetně formátování čísel a dat, což je v analytické aplikaci zásadní.


Shrnutí

Střelecký deník je ukázkou moderního mobilního inženýrství. S využitím Expo, SQLite a striktního TypeScriptu se mi podařilo vytvořit nástroj, který je rychlý, bezpečný a plně funkční v offline režimu. Důraz na typovou bezpečnost a separaci logiky mi umožňuje aplikaci dál škálovat a přidávat nové funkce bez strachu z regresních chyb.

Odkaz na aplikaci: https://www.devboys.cz/aplikace/strelcky-denik

Co se stane po odeslání?

Jsme tu pro Vás

Vaši zprávu si přečtu přímo já nebo kolega z týmu. Do 24 hodin se vám ozveme zpět, abychom probrali detaily. Žádní obchodní zástupci, ale rovnou technická konzultace k věci, která vás posune dál.

Osobní přístup

Jednáte přímo s vývojáři, ne s account managery.

< 24 h reakční doba

Ozveme se rychle s jasnými dalšími kroky.

IČO 06109152
DIČ CZ9102040431 (Plátce DPH)
Společnost zapsaná v obch. rejstříku, vedeného MÚ Plzeň, spis. zn. 231/98.

Kontaktujte nás