Post 11 of the Pepper & Carrot AI flipbook series. Post 10 left a streaming chat panel and an honest admission: the engineering guarantees structure and safety, but it doesn't guarantee taste. This post is the prompt-engineering pass that closes that gap on a 7B local model — a markdown stripper on every piece of text entering the prompt, a closed-world grounding contract, a page-mode anti-recitation block, a strict response-format cap, a much sharper suggestion-chip prompt with bad/good examples, and react-markdown in the chat panel as the belt-and-suspenders safety net.

Post 10 of the Pepper & Carrot AI flipbook series. Post 9 left a spoiler-safe chat pipeline you could only reach with curl. Now we put it in the browser: tokens stream over Server-Sent Events into a React chat panel, the user picks page or wiki mode per message, and two follow-up suggestion chips render below each answer — generated by a second model call, constrained to a JSON schema, and validated server-side before a single chip reaches the DOM. Plus a light wiki ingestion path so wiki mode has something to say.

Post 9 of the Pepper & Carrot AI flipbook series. The flipbook from Post 8 knows which page you're on. Now we build the chat pipeline that answers questions about that page — and we make spoiler safety a property of the database query, not a line in the prompt. Build a RetrievalService whose Chroma filter is derived from server-side reading progress, wire it into a FastAPI chat endpoint, drive it with curl, and prove the boundary holds even when the user tries to jailbreak it. No chat UI yet — that's Post 10.

Post 8 of the Pepper & Carrot AI flipbook series. Post 7 built two typed REST routes that return episode JSON with absolute image URLs; this post renders that data as a real page-flipping flipbook in the browser. A Vite + React + TypeScript frontend, a hand-rolled types.ts that mirrors the Pydantic models, an episode picker, and a wrapping StPageFlip — single page in portrait, two-page spread in landscape. Ends with appendices on the SQLAlchemy idioms behind the handlers and how Settings reads your .env.

Post 7 of the Pepper & Carrot AI flipbook series. With one episode sitting in Postgres + LocalStorage from Post 5, it's time to surface it. Build two typed FastAPI routes — list episodes and episode detail — that resolve relative storage keys into absolute URLs at response time via the Storage Protocol, with the OpenAPI spec as the wire-format contract. By the end you have two endpoints returning episode JSON your browser can consume.

Post 6 of the Pepper & Carrot AI flipbook series. Post 5 built the ingest-from-images skill that writes one JSON description per page; this post is the Stage-2 Python pipeline that consumes those JSONs — image variants via Pillow, uploads through the storage abstraction, pages and page_characters rows, a per-episode plot summary, and embedded chunks in ChromaDB's pages_v1 collection. By the end, one full episode is ingested end-to-end, with the two-stage design, the recovery story, and the reproduction recipe all walked through.

Post 5 of the Pepper & Carrot AI flipbook series. The comic is images, not text — so before any RAG can happen, every page needs a description. This post is about who writes those descriptions: a tour of the three vision-provider options (local VLM, hosted API, Claude Code itself), why the Claude Code path wins for a portfolio project, and a section-by-section walk through the `ingest-from-images` skill that produces a JSON description per page. The right vision provider is context-specific, and the post includes a decision matrix mapping each constraint to the right choice — plus an appendix on how a VLM actually sees an image.

Post 4 of the Pepper & Carrot AI flipbook series. Build three typed Protocol interfaces — Storage, EmbeddingClient, ChatClient — and the factory that picks the right implementation from a .env file. By the end you have LocalStorage serving images end-to-end and a working embedding client producing real 1024-dim vectors against the local Ollama you set up in Post 2.

Post 3 of the Pepper & Carrot AI flipbook series. Post 2 stood up Postgres and applied the first migration; this post explains what that migration created and why. How Alembic works, why not Base.metadata.create_all(), how ten tables map one-to-one onto product features, four design decisions that pay off later, and a column-by-column tour of the SQLAlchemy 2.0 models.

Post 2 of the Pepper & Carrot AI flipbook series. Stand up the local workshop: Postgres in Docker, Ollama serving qwen2.5:7b and bge-m3, a typed FastAPI scaffold that passes mypy strict, the first Alembic migration, and one downloaded episode on disk. By the end you have the workshop every later post is built on.