AI Tool
ingredientbot.com
Live siteA split-panel kitchen app where users enter their available ingredients and Claude streams personalized recipe suggestions in real time.
Recipe apps assume you already know what you want to make. ingredientbot.com starts from the other direction: enter what is in your fridge, and Claude streams a personalized recipe back in real time. The streaming UX — watching the recipe appear word-by-word — is qualitatively different from a spinner followed by a wall of text.
<3s
Time to first recipe
2
AI models used
None
Core feature paywall
Screenshots
The Problem
Recipe apps require you to search for a dish you already have in mind. The real problem is "I have eggs, spinach, and leftover rice — what do I make?" There was no good tool for ingredient-first, zero-waste cooking discovery.
The Process
The split-panel kitchen UI was the design challenge: a clean ingredient entry panel on the left, streaming recipe results on the right. Built with the Anthropic streaming SDK so recipes appear word-by-word as Claude generates them. A secondary Claude haiku model provides quick ingredient commentary while the main recipe streams.
The Solution
A streamlined kitchen app with split-panel ingredient entry + live streaming recipe output. Uses Claude Sonnet for full recipes and Claude Haiku for fast ingredient commentary. Saves recipes to a Prisma model for later access.
What Was Built
- Split-panel kitchen UI with live streaming output
- Claude Sonnet for recipes, Haiku for ingredient commentary
- Recipe save/history with Prisma storage
- Zero-friction public access — no paywall on core feature
- Mobile-responsive panel layout
Feature Breakdown
Core Kitchen
- Split-panel ingredient entry + streaming recipe output
- Claude Sonnet for full recipes, Haiku for ingredient commentary
- Photo-based ingredient detection via vision API
- Under 3s time-to-first-recipe including LLM latency
Recipe Management
- One-click recipe variations and tone modifications
- Recipe save/history library via Prisma
- Shared recipes with public permalinks (virality mechanic)
- Cooking Mode: full-screen step-by-step with screen-lock
Meal Planning
- Persistent pantry inventory (session-aware)
- Weekly meal planner with slot assignments
- Auto-generated grocery list from meal plan
- Expiry-first and leftovers optimizer mode
Tech Stack
Source Code
Private repository
Behind the Build
The streaming UX was the whole point — seeing the recipe appear word-by-word feels qualitatively different from a spinner and a wall of text. The middleware file is named src/proxy.ts instead of middleware.ts (Next.js 15 convention), which caused an unexpected amount of confusion during auth setup. The dual-model approach (Sonnet for recipes, Haiku for ingredient commentary) keeps costs down while keeping quality high where it matters.