Independent · Web · PWA

Body Recomp Tracker

At a high level: client → domain engines → local storage → optional cloud sync → UI delivery.


1. Client layer — web PWA

  • React 19 + Vite + TypeScript
  • Tailwind UI, React Router, Recharts, Framer Motion
  • Installable PWA via vite-plugin-pwa
  • Surfaces: Dashboard, Daily Log, Food / Meals, Weekly Review, Calculators, Analytics, Learn, Recipes, Profile
  • Feature flags for Recipes (on) and Key Lift (off for MVP)

2. Domain engines

  • Recomp / coaching engine — BMR, maintenance, calorie & protein targets, body fat (Navy tape), pace, adaptive calories from trend
  • Recipe / cooked-yield engine — raw ingredients → solid & gravy pools → user pot weight → per-gram macros & micros → plate servings & leftovers
  • Nutrition data — IFCT-backed ingredient catalog (macros + optional micros)
  • Macros: calories, protein, carbs, fat, fibre
  • Micros: sodium, potassium, calcium, iron, zinc, magnesium, vitamin C, folate (when present)

3. Local storage layer

  • localStorage-first — works without an account
  • Persists profile, daily logs, weekly reviews, recipes, recipe batches (open pots), meal entries, custom foods
  • Metric values stored in kg/cm; units preference is display-only
  • Defensive parsers at the storage boundary

4. Sync / cloud layer (optional)

  • Firebase Auth when web keys are configured
  • Firestore mirror under users/{uid}
  • DataService: sync write to local → best-effort cloud queue
  • Without Firebase config, app stays fully local-only

5. Delivery / consumption

  • Dashboard trends and day intake cards
  • Meal sheets pull macros/micros from open pots or custom foods
  • When meals exist for a day, calorie/protein totals prefer meal sums
  • Calculators and analytics for targets, goal date, and history
  • Netlify-ready static build (dist/)