Home Meal Plan

The whole week's meals, planned around each person's goals.
The homemealplan.com landing page — “The whole week's meals, planned around your goals”
Year2026
RoleSolo founder & engineer
StatusPrivate beta
TechnologyNext.js 15 · React 19 · TypeScript · Tailwind CSS v4 · Supabase Postgres · Clerk · Anthropic Claude API · Vercel
Overview

Home Meal Plan is a multi-tenant web app where a household of one to five people generates an AI-drafted weekly meal plan around each member's nutrition goals, dietary restrictions and allergies — then shapes it by hand, tracks calories and macros against calculated targets, keeps a shared recipe library, and gets an aisle-grouped shopping list.

I designed and built it end to end in 2026 as a solo product, and I built it with AI as much as for AI: the whole project ran on an agentic engineering workflow I designed around Claude Code.

The Problem

Planning a week of meals for more than one person means juggling goals that disagree (one person cutting, one bulking), restrictions that don't overlap, recipes scattered across PDFs and bookmarked sites, and a shopping list that is always rewritten from scratch.

Existing apps are single-user, or they generate a plan you can't edit without starting over. I wanted “AI proposes, you control”: a generated draft you can pin, swap, drag and argue with.

How It Works

Plan the week. Set each member's goals and restrictions once. The planner drafts all 28 slots (7 days × 4 meal types) from the household's own recipe library, respects pinned meals, avoids repeating a protein within three days, and shows per-day and per-week macro bars against targets computed from Mifflin-St Jeor BMR, activity and goal.

Shape it by hand. Edit mode turns the grid into a board: drag meals between slots, swap a single slot for a fresh AI suggestion, lock the meals that survive regeneration, link leftovers to the meal they came from, or pick from saved, AI, quick-entry and recent meals.

Ask the nutritionist. A streaming chat sidebar — Sage — knows the current plan and the household's goals. When it proposes a change it returns a typed tool call (swap a meal, save a recipe, add to the shopping list) rendered as a button you confirm, so the model never writes to the plan on its own.

Feed the recipe library. Recipes come in by hand, by AI quick-create, by PDF (sent to Claude as a document), or by URL — with a tiered fallback for sites behind bot protection. Nutrition is estimated on import.

Shop by aisle. One click aggregates the week's ingredients, normalises units and groups them by aisle into a mobile-first checklist.

Under The Hood
  • No separate backend: Next.js 15 App Router with Server Actions for every mutation and Route Handlers only for the six AI endpoints; React 19 (useActionState, useOptimistic, Suspense); strict TypeScript.
  • Supabase Postgres accessed server-side only, 18 hand-written SQL migrations, row-level security on every table as defence in depth on top of household scoping in every query; Supabase Storage for recipe images and PDFs.
  • Clerk for auth and tenancy: a Svix-verified webhook provisions the household; requireHousehold / requireOwner / requireAdmin guards on every action; owner and member invitations with expiring tokens.
  • Anthropic Claude API: structured JSON generation for the 28-slot plan, document extraction for PDFs, and streaming tool use for the chat — accumulated into a newline-delimited JSON stream the client renders live.
  • Cost and resilience: per-household rolling 24-hour AI rate limit backed by a usage log, timeouts on every outbound fetch, structured error codes, free-tier fallbacks — zero incremental cost for the import path.
  • Tailwind CSS v4 design system (OKLCH tokens, CVA variants), dnd-kit drag and drop, pure-CSS :has() leftover hover-linking, Plausible analytics behind a first-party proxy, Resend email, Vercel hosting, dynamic Open Graph images.
  • Security pass before opening the beta: audited and fixed an over-permissive RLS policy and missing ownership checks, added the rate limiter, and wrote a two-account isolation test protocol.
How I Built It
  • Two-phase workflow: product discovery and PRD in the Claude app, one question at a time; implementation in Claude Code from a PRD containing the sequence of scoped “commands”, each naming the skills to use and the files, routes and components to touch.
  • Persistent project memory: a CLAUDE.md with the stack, rules and gotchas, plus a project-plan handoff updated at the end of every session.
  • A custom skill library with a hard gate — no code until a dated design spec is approved — and skills for the design system, React best practice and UI copy.
  • Parallelisable task prompts: self-contained prompts with a dependency graph, locked decisions and “done means” criteria, so independent pages landed as focused PRs from separate agent sessions.
  • Research with AI where it paid off: a root-cause analysis of Cloudflare-protected recipe sites that shipped a free tiered fallback instead of a paid scraping vendor.
By The Numbers
Idea to private beta5 weeks
Lines of TypeScript~22.8k
SQL migrations18
AI endpoints6
Pull requests, solo~60