famfin

Aplikácia na rodinné financie. Mobile-first SPA (PWA), pripravená na neskoršie obalenie Capacitorom.

• Špecifikácia: docs/famfin-specifikacia.md
• Plán míľnika M1: docs/m1-plan.md

Spustenie

Potrebuješ Node 20+ a pnpm.

pnpm install
cp .env.example .env   # doplň hodnoty z projektu Supabase
pnpm dev               # vývojový server na http://localhost:5173

Bez .env sa aplikácia spustí tiež — beží potom len v demo režime, bez pripojenia k Supabase.

Skripty

Príkaz	Čo robí
pnpm dev	vývojový server s HMR
pnpm build	typová kontrola + produkčný build do dist/
pnpm preview	náhľad produkčného buildu
pnpm typecheck	tsc --noEmit
pnpm test	testy (vitest, jednorazovo)
pnpm test:watch	testy v režime sledovania
pnpm lint	eslint
pnpm format / pnpm format:check	prettier

Stack

Build	Vite 8
UI	React 19 + TypeScript (strict)
Routing	react-router 7, SPA — žiadne SSR
Štýly	Tailwind CSS v4
Dáta	TanStack Query 5, @supabase/supabase-js 2
PWA	vite-plugin-pwa (manifest, offline = read-only cache)
Testy	vitest + Testing Library
Kvalita	eslint + prettier

Štruktúra

index.html            vstupný HTML dokument
vite.config.ts        Vite, Tailwind, PWA a konfigurácia testov
tsconfig.json         TypeScript v strict režime, alias @/ → src/
public/               statické súbory a ikony PWA
src/
  main.tsx            bootstrap aplikácie
  App.tsx             QueryClientProvider + BrowserRouter
  index.css           jediný import Tailwindu (tokeny pridá src/styles/)
  routes/             adresy, app shell so spodnou navigáciou, placeholdery obrazoviek
  i18n/               všetky texty (v1 iba SK)
  platform/           abstrakcia nad window/localStorage a premennými prostredia
  ui/                 dizajnový systém (T2)
  styles/             tokeny a témy (T2)
  charts/             vlastné grafové komponenty (T3)
  domain/             doménové výpočty (T4)
  data/               dátová vrstva nad Supabase (T5)
  screens/            obrazovky (T6)
  demo/               demo fixtúra (T7)
supabase/             migrácie a RLS (T1)

Vlastníctvo priečinkov medzi súbežnými úlohami je v docs/m1-plan.md.

Obrazovky

Adresa	Obrazovka
/	Prehľad
/prijem	Príjem
/vydaj	Výdaj
/majetok	Majetok
/review	Review

Komponenty v src/routes/*Route.tsx sú dočasné placeholdery. Nahradia sa obsahom zo src/screens/ — telo komponentu je jednoriadkové práve preto, aby výmena bola triviálna. Adresy a poradie záložiek sú v src/routes/paths.ts a src/routes/navigation.ts.

Spodná navigácia v src/routes/AppLayout.tsx je zámerne bez vizuálu — obsahuje len rozloženie a odkazy. Vzhľad dodá dizajnový systém v src/ui/.

Konvencie

• Peniaze sú vždy celé čísla v centoch. V celej aplikácii — v doméne, v dátovej vrstve aj v props komponentov — sa suma prenáša ako number v centoch (napr. 1 193,45 € je 119345). Desatinné čísla sa používajú výhradne pri formátovaní na zobrazenie. Nikdy sa v nich nepočíta.
• Kód po anglicky, aplikácia po slovensky. Identifikátory, komentáre v kóde aj názvy súborov sú anglické; všetky texty pre používateľa žijú v src/i18n/. Žiadna i18n knižnica sa zatiaľ nepoužíva — je to obyčajný modul s reťazcami, ktorý sa dá neskôr vymeniť bez zásahu do komponentov.
• Bez závislosti na serverovom runtime. Žiadne SSR, žiadne API routes. Build je statický a dá sa nasadiť na Cloudflare Pages či Vercel, alebo zabaliť Capacitorom.
• window, document, localStorage a premenné prostredia iba cez src/platform/. Priamy prístup hlási eslint. Vďaka tomu sa dá úložisko vymeniť za natívne.
• Alias @/ ukazuje na src/, napr. import { strings } from '@/i18n';.
• Offline = read-only cache. Service worker cachuje app shell a GET odpovede API; zápis vyžaduje pripojenie.
• Skutočný .env sa nekomituje. V repozitári je len .env.example.