Breakdown

CuteCookbook

Full-stack recipe app · Built for one real user

CuteCookbook recipe app interface

Overview

A live full-stack personal recipe app built for one real user. It combines recipe CRUD, favorites, categories, URL import, AI cooking help, sharing, image uploads, and custom personal flows like onboarding and birthday pages.

Frontend

Built with Next.js App Router and React. The app includes a dashboard with recent recipes, favorites, category shortcuts, and a custom animated hero. The recipe experience covers create, edit, detail, delete, category assignment, nutrition fields, cover images, and favorite toggling. It also includes a responsive shell with a collapsible sidebar, mobile tab bar, mobile search overlay, dark mode, accent color selection, and a share page for recipe viewing.

Backend / API

Next.js API routes handle AI chat, recipe scraping, AI parsing, URL import, login, and logout. Auth uses signed cookie sessions with middleware route protection. The login endpoint rate-limits failed attempts by source IP. The AI assistant can use saved cookbook context and return hidden structured recipe data that the frontend can save back into the app.

Database / Storage

Supabase stores profiles, recipes, categories, recipe_categories, recipe_tags, and recipe_photos. Recipes store structured JSON for ingredients and instructions, plus source URL, macros, favorite state, and cover image URL. Supabase Storage handles recipe photo uploads through a dedicated bucket.

Integrations / AI

The import pipeline tries JSON-LD recipe extraction first, then falls back to plain text extraction. The scraper supports optional ScraperAPI fallback and timeout handling, and Instagram imports use oEmbed/caption fallback. AI parsing uses OpenRouter with Gemma to structure messy recipe text, while cooking chat uses Gemini to answer questions and generate saveable recipes.

Reliability

No automated test suite yet. Reliability comes from signed sessions, login rate limiting, middleware route protection, scrape timeouts, guarded client behavior, and structured API error handling.

Outcome

A shipped personal product with live deployment, end-to-end recipe management, import automation, AI-assisted recipe generation, mobile-first navigation, theming, and custom personal touches.