NutriPal — snap a photo, know what you ate.

Why do calorie-tracking apps fail their users?

Every calorie tracker forces you to search a database, guess portions, and log everything manually. The friction is the reason people quit. What if the app did the thinking for you — from a single photo?

Most nutrition apps suffer from the same three problems: manual logging is tedious, AI nutrition estimates are unreliable without validation, and free-tier AI services introduce rate-limit failures that crash the experience. NutriPal was built to solve all three — not as separate features, but as a coherent engineering challenge.

Three hard constraints shaped the architecture from day one:

• AI must be the core, not a feature — Every major interaction should have AI behind it: photo analysis, meal planning, delivery curation, diet personalization.
• Rate limits are an infrastructure problem — Free-tier Gemini keys have strict quotas. A single-key setup collapses under normal usage. The solution had to be baked into the architecture, not patched later.
• Data must feel live — Logging a meal and seeing the dashboard update without a page refresh is the difference between an app that feels like a product versus a prototype.

Three layers, one coherent system.

Next.js handles rendering and routing. Genkit owns all AI logic. Supabase manages data, auth, and realtime sync. Each layer has one job and doesn't bleed into the others.

Design principles that held the system together.

Five flows, one typed contract each.

Every AI feature in NutriPal is a Genkit flow — a typed, server-side function with a Zod input schema and Zod output schema. The model never returns free-form text; it returns a validated object or throws.

LLMs are non-deterministic. Without output validation, a single malformed response can crash the UI or silently show wrong data. Every Genkit flow defines both an input schema and an output schema using Zod. If Gemini returns something that doesn't match — wrong types, missing fields, out-of-range values — the flow throws before the data ever reaches the frontend. See the exact schema in the Technical Deep Dive below.

The code that makes the three challenges work.

AI Output Validation — Zod schema on analyze-meal

Every field has a type constraint. healthScore is bounded 0–100. expertInsight is capped at 200 chars to prevent model verbosity. allergenWarning is optional — the schema encodes the business rule.

// Output schema — Gemini must return exactly this shape or the flow throws
const AnalyzeMealOutputSchema = z.object({
  name:            z.string(),
  calories:        z.number(),
  macros: z.object({
    protein:       z.number(),
    carbs:         z.number(),
    fat:           z.number(),
  }),
  healthScore:     z.number().min(0).max(100),
  expertInsight:   z.string().max(200),
  allergenWarning: z.string().optional(),
});

Key Rotation — 4-key failover at the AI layer

The loop tries each key in sequence. If a rate-limit error is caught and there are keys remaining, it continues to the next. Only after all keys are exhausted does the error propagate up — and the user never sees it happen.

for (let i = 0; i < GEMINI_KEYS.length; i++) {
  try {
    const tempAi = genkit({ plugins: [googleAI({ apiKey: GEMINI_KEYS[i] })] });
    return await fn(tempAi);
  } catch (error) {
    if (isRateLimitError(error) && i < GEMINI_KEYS.length - 1) {
      continue; // rotate to next key transparently
    }
    throw error; // all keys exhausted — surface the error
  }
}

Realtime Subscription — database as the state layer

Each hook subscribes to a Supabase channel scoped to the current user and date. When any row changes — from any device, from any AI flow — the hook fires and the component re-renders. No Redux, no polling, no prop drilling.

// useDailyLog.ts — Supabase realtime replaces global state
useEffect(() => {
  const channel = supabase
    .channel(`food-${userId}-${date}`)
    .on('postgres_changes', {
      event: '*', schema: 'public', table: 'food_records',
      filter: `user_id=eq.${userId}`
    }, () => fetchRecords())
    .subscribe();

  return () => { supabase.removeChannel(channel); };
}, [userId, date]);

Building AI products is infrastructure work.

The AI itself — calling Gemini, writing a prompt — is the easy part. The hard part is everything around it.

• AI reliability matters more than prompt quality. The allergen warning prompt took multiple iterations to stop hallucinating warnings. But the realtime subscription and key rotation — infrastructure decisions — are what make the app actually usable.
• Realtime UX dramatically changes how a product feels. The moment dashboard hooks subscribed to Supabase channels, the app felt like a native app rather than a web form. The technical cost was minimal. The product impact was significant.
• Infrastructure decisions determine AI product stability. Rate limits aren't a billing problem — they're an architecture question. How you handle them (retry, rotate, degrade gracefully) is what separates a working demo from a reliable product.