RayFitnessPal: building the MyFitnessPal that MyFitnessPal refuses to build

I've used MyFitnessPal on and off since 2014. Every couple years the UX gets a little worse, the premium paywall a little more aggressive, and the food database a little more cluttered with phantom entries from people who don't know how a serving size works. So I built my own.

The official-sounding name is "Nutrition Tracking App." The disk-folder name is myfitnesspal-clone. The name I actually call it is RayFitnessPal.

What it does

  • Food logging — search, scan, or photograph a meal and get detailed nutrition
  • AI food recognition — Gemini analyzes a photo and names what's on the plate, then macros get pulled from the actual nutrition databases
  • Barcode scanning — point the phone, get the food, done
  • Camera integration — meal photos saved against entries, plus AI-recognition source
  • Real-time calculations — serving-size scaling that doesn't make you do arithmetic
  • Meal planning — schedule future meals
  • Water tracking — daily intake with reminders
  • Recipe builder — combine ingredients into a custom recipe with computed nutrition
  • Exercise integration — workouts and fitness activity logs
  • Progress analytics — trends, weekly summaries, goal hit-rate
  • Smart notifications — reminder cadence based on actual behavior
  • Data export/import — your data is yours

Crucially: dark mode that actually works, offline support via Dexie + localStorage, and real-time sync via Supabase for authenticated users.

The stack

Frontend     Next.js 15, React 19, TypeScript
Styling      Tailwind CSS
Backend      Supabase (Auth + Postgres + Realtime)
Food DB      USDA FoodData Central (free) + Nutritionix (free tier)
AI           Google Gemini (food recognition + Quick-Log)
Camera       WebRTC getUserMedia
Barcode      ZXing + HTML5 QR Code
Offline      Dexie (IndexedDB) + localStorage for preferences

The interesting choice here is going to free public APIs for the food database. The USDA FoodData Central is genuinely huge — about 1.9M entries — and it's a US government dataset, so it's not going behind a paywall. Nutritionix's free tier fills in the gaps for branded foods. Between them you get coverage that's competitive with MyFitnessPal Premium without any subscription.

The Gemini Quick-Log trick

The single feature that justifies the whole project is "Quick-Log." You point your phone at your plate, snap a photo, and a few seconds later you have a logged meal with macros within ~10% of correct.

The flow is:

  1. Capture the image via getUserMedia
  2. Send it to Gemini with a prompt that asks for a JSON list of {food_name, estimated_grams} per visible item
  3. For each food_name, query Nutritionix for the closest match
  4. Scale macros by estimated_grams / standard_serving_grams
  5. Sum, show the user, let them edit before saving

The estimated_grams output from Gemini is genuinely accurate enough — within a slice of bread for most everyday meals. I don't trust it for restaurant portions, but for cooking-at-home it's better than my own eyeballing.

What was hard

The Firebase → Supabase migration. The original prototype was Firebase and the data model was wrong for relational queries (you can't really say "show me protein totals per week" cleanly in Firestore without denormalizing aggressively). Supabase + Postgres made every analytics query 3–5 lines instead of a custom Cloud Function. The data types are generated directly from the schema, so the TypeScript layer never drifts from the database.

Offline-first via Dexie was the second-hardest. Every log is staged locally first, then synced. The sync resolver has to handle: same-meal-edited-on-two-devices, item-deleted-on-one-device-but-not-the-other, and the "I logged 3 weeks of meals while on a camping trip with no service" case.

What I'd build next

A coach that actually understands my goals. The current "Quick-Log" tells me what's on the plate; it doesn't tell me whether I should be eating it given that I told it I'm trying to hit 180g protein this week. That's the next feature: a passive nudge layer driven by the same Gemini calls that already see every meal.

The codebase lives on my GitHub. It is enormously over-engineered for a personal nutrition app. That's the point.