How It Works

The technical details behind the scenes

100% Vibe Coded

This entire project — the processing pipeline, the website, the infrastructure, even this page — was built through conversation with Claude Code (Anthropic's AI coding agent). No code was written by hand. Every file, every component, every deployment script was generated through natural language prompts and iterative dialogue.

The Pipeline

Grandmother's handwritten recipe cards are scanned as photos. The pipeline processes each scan through multiple AI models in parallel:

  1. 1

    Dual OCR — Both Gemini 2.5 Flash and Claude Opus 4 read the handwriting independently, extracting the recipe text and translating it to Hebrew

  2. 2

    Ranking — Claude compares both results and picks the more accurate transcription

  3. 3

    Orientation — Gemini analyzes each scan photo and detects the correct rotation so pages display upright

  4. 4

    Illustration — Gemini generates a watercolor-style food illustration for each recipe

  5. 5

    Output — Structured bilingual JSON with ingredients, instructions, tags, and metadata

The Website

A static Next.js site built at deploy time from the recipe JSON files. No server, no database — just HTML, CSS, and JavaScript served from CloudFront's global CDN.

  • Next.jsStatic export with App Router
  • Tailwind CSSStyling with RTL support
  • Fuse.jsClient-side bilingual search
  • S3 + CloudFrontHosting & CDN
  • GitHub ActionsAutomated deployment

Architecture

scans/*.heic
  │
  ▼
┌─────────────────────────────┐
│  Pipeline (TypeScript)      │
│                             │
│  Gemini OCR ──┐             │
│               ├── Ranker    │
│  Claude OCR ──┘     │       │
│                     ▼       │
│              Best result    │
│                     │       │
│  Orient scans ◄─────┤       │
│  Illustrate   ◄─────┘       │
└──────────────┬──────────────┘
               │
               ▼
     data/recipes/*.json
     data/scans/*.jpg
               │
               ▼
┌─────────────────────────────┐
│  Website (Next.js)          │
│  Static build → S3 + CDN   │
└─────────────────────────────┘

Open Source

The full source code — pipeline, website, infrastructure, and every conversation log from the vibe coding sessions — is available on GitHub.

MoLow/SavtasRecipes

Credits

Recipe scans provided by Neal Atlow and Stuart Atlow. Thank you to Roi and Yuval Atlow for helping scan all the photos. Built with Claude Code by Moshe Atlow.