Diet App
Indian-food-focused macro tracking, with a body you can actually see change.
This is a Next.js app for tracking daily nutrition the way people in India actually
eat — proper portions (katori, roti, piece — not just grams), goal-aware calorie
and protein targets, and a 3D "Physique Studio" that shows you a current-vs-target
body comparison instead of just a number on a scale.
It's built to feel less like a spreadsheet and more like something that
understands your goal, whether that's losing weight, building muscle, leaning
out, or just eating a bit more consistently.
What's inside
Daily tracking
- Log meals against categories that match how Indian meals are actually
structured: breakfast, mid-day snack, lunch, evening snack, dinner, beverage.
- A content-based recommender suggests foods that fit whatever's left in your
day's macros — not a generic "eat more protein" nudge, but foods whose actual
macro shape matches your remaining calories/protein/carbs/fat.
- A recipe calculator that takes raw ingredient quantities plus the dish's final
cooked weight and works out accurate per-100g nutrition — so a dal or curry
that loses or gains water weight during cooking still gets a correct number,
without needing a separate "cooking method" adjustment.
Goals & targets
- BMR via Mifflin-St Jeor, TDEE via activity multiplier, and macro targets that
shift with your goal (lose weight, gain muscle, lean-mass recomposition,
improve cardio, or maintain) — each goal has its own calorie offset and
protein-per-kg target, not one-size-fits-all.
- Manual overrides: if you (or a coach) want to hand-set your calorie or macro
targets instead of the calculated defaults, those take priority automatically.
- A feasibility check runs behind any weight goal — it flags rates of loss/gain
that exceed safe clinical thresholds, calorie floors that dip too low, or a
target body fat % that creeps toward essential-fat territory, before you
commit to a timeline.
Physique Studio
The part that makes this more than a numbers app: a side-by-side 3D comparison
of your current body and your target goal, rendered from real body-composition
math rather than a generic avatar.
- Current body fat % is estimated from actual measurements (waist, neck,
height) using the US Navy body-fat formula — not guessed.
- Your target is projected using realistic body partitioning: losing weight
isn't 100% fat, and gaining weight isn't 100% muscle. The model splits any
weight change into a fat component and a lean component and adjusts your
projected waist, chest, hip, and bicep measurements accordingly.
- Both bodies are matched to one of five sculpted 3D archetypes — Lean/Athletic,
Overweight/Soft belly, Heavyset/Obese, Muscular/Bodybuilder, and Slim/Skinny —
chosen by body fat %, with a fat-free-mass-index check to tell "lean and
muscular" apart from "lean and just thin" at similar body fat levels.
- Each avatar rotates independently on its own base, so you can compare both
bodies from any angle without them awkwardly orbiting each other.
Nutrition & history
- A 7-day macro trend view (calories, protein, carbs, fat) with daily averages.
- A weight log with a trend chart, so activity is visible over weeks, not just
today.
Sign-in
- Google sign-in via Supabase Auth. New users go through a short onboarding
flow that collects the basics (height, weight, age, sex, activity level,
goal) before landing on their first daily targets.
Tech stack
- Framework: Next.js (App Router)
- Auth & database: Supabase (Postgres + Auth, Google OAuth provider)
- Styling: Tailwind CSS v4, with a shared style dictionary (
lib/ui.js) and
a real dark mode (CSS variable overrides, not a filter hack)
- 3D rendering:
three.js via @react-three/fiber and @react-three/drei
- Icons:
lucide-react
This is the beginning of the README. Read the rest at the original. Read the full README ↗