Built in a Single Day
The complete, unedited Claude Code session that designed, planned, and shipped this entire platform—from first prompt to production deploy.
By the Numbers
Real metrics from the session that built this entire platform
Why Share This?
Complete transparency in AI-assisted development
Transparency
AI-assisted development shouldn't be a black box. By sharing the complete transcript, you can see exactly how the prompts, decisions, and iterations led to this final result. Nothing is hidden or cherry-picked.
Education
Learn prompt engineering from hundreds of real examples. See how to guide an AI coding agent through complex tasks, handle errors, iterate on designs, and make architectural decisions collaboratively.
Meta-Demonstration
The prompts on this site helped build this site. It's a recursive demonstration of the very techniques we're sharing. The Idea Wizard generated improvements, the Robot-Mode Maker informed the CLI design.
The annotated build guide
Each phase of the original session distilled into practical steps, outcomes, and the exact artifacts that landed the feature.
Project Kickoff & Planning
Initial concept discussion, exploring brenner_bot patterns, and creating the comprehensive markdown plan
We began by turning the original prompt ideas into a formal plan, then ran a GPT Pro revision pass before any code landed. The Idea Wizard prompt helped expand and prune scope options, while the plan itself became the product spec. This planning-first discipline is the signature move: spend human effort up front so execution is fast, aligned, and low-drama. It is deliberately different from the usual "just start coding" approach — prompts are the operating system that drives the build.
- Started by re-reading AGENTS and README to lock constraints before coding.
- Ran bv triage to pick the highest-leverage bead after the plan was set.
- Used a GPT Pro pass to critique the markdown plan before execution.
- Mapped prompt tweets into a full product scope (web + CLI).
- Adopted brenner_bot as the design and stack reference point.
- Produced the end-to-end build plan to drive execution.
Core Infrastructure
Setting up monorepo, TypeScript config, packages structure, and prompt types
Prompts became typed TypeScript objects so the registry is the source of truth for every surface (web, CLI, exports). The "data is code" choice avoids brittle markdown parsing and keeps changes precise, which matters when prompts are the product itself. Most prompt libraries stay file-based; this one treats the registry like a real API.
- Split shared logic into packages/core so web + CLI never diverge.
- Defined prompt types early to lock categories and metadata.
- Made the registry a real module, not a pile of markdown files.
- Established the monorepo layout for core, CLI, and web packages.
- Defined prompt/category/meta types as the single source of truth.
- Set the registry contract that every feature relies on.
Prompt Registry & Search
Building the TypeScript-native prompt registry and BM25 search engine
Search relevance was solved early with deterministic BM25 scoring. We deliberately avoided embeddings here because the catalog needs stable, explainable ranking that agents can trust across runs. This is part of the broader philosophy: build mechanical systems first, then add fancy layers only if needed.
- Implemented weighted BM25 so titles and tags outrank raw body text.
- Kept semantic reranking optional to preserve deterministic defaults.
- Search became a reusable core primitive, not a UI-specific hack.
- Implemented BM25 scoring with weighted fields for better relevance.
- Built the search pipeline: tokenize, score, rank, and return.
- Added export helpers for markdown, YAML, and skill formats.
Web Application Foundation
Next.js 16 setup with React 19, Tailwind CSS 4, and shadcn/ui components
The web app was built quickly but intentionally: strong hero, clear navigation, and a UI system tuned for prompt browsing. The UI/UX prompt used in other projects shows up here too — iterate aggressively on layout and polish so the interface feels deliberate rather than template-driven.
- Bootstrapped the App Router, Tailwind 4, and shadcn primitives.
- Built hero + nav first so the rest of the UI had an anchor.
- Iterated on cards, spacing, and motion using the UI/UX prompt.
- Bootstrapped the Next.js 16 App Router foundation.
- Established Tailwind 4 + shadcn/ui styling patterns.
- Built the initial layout, navigation, and hero system.
CLI Development
Building the jfp CLI with fuzzy search, JSON output, and skill installation
The CLI is treated as a first-class agent surface, not a secondary tool: fuzzy search, JSON/markdown modes, and skill installation are all tuned for automation and token efficiency. This is where the Robot-Mode Maker prompt shows up — build tools the agents can run reliably, then let them scale the work.
- Defaulted to JSON when piped to keep the CLI agent-first.
- Used CAC to make command parsing + help output reliable.
- Designed skill install/export to be automation-friendly.
- Built the `jfp` CLI entrypoint and command registry.
- Added fuzzy search plus JSON/markdown output modes.
- Enabled prompt export and skill installation workflows.
Feature Implementation
SpotlightSearch, basket system, prompt cards, and interactive features
User-facing workflows snapped into place: Spotlight search, prompt cards, and the basket flow for bulk export. The goal is throughput — letting you explore, collect, and ship prompts quickly without the friction most catalogs impose.
- Spotlight search (Cmd+K) became the default discovery surface.
- Prompt cards shipped with fast copy and quick actions.
- The basket flow turned bulk export into one gesture.
- Shipped SpotlightSearch (Cmd+K) for prompt discovery.
- Designed prompt cards with copy and quick actions.
- Implemented the basket workflow for bulk downloads.
Polish & Refinement
Bug fixes, test coverage, documentation updates, and final polish
The final stretch was about trust and portability: hardening tests, refining docs, and producing a single-file CLI binary. The README Reviser prompt helps keep documentation aligned with reality instead of chasing drift. This is the less flashy part of the workflow, but it is what lets agents (and humans) rely on the tooling without surprises.
- Ran tests and lint to catch edge cases before shipping.
- Docs were tightened with a dedicated README revision pass.
- Single-file Bun builds were treated as a core deliverable.
- Expanded tests and hardened edge cases before shipping.
- Polished docs and release scripts for distribution.
- Prepared single-binary builds with Bun.
Refined by Multiple AI Models
After Claude created the initial plan, it was reviewed by GPT Pro and Gemini for architectural improvements, bug fixes, and feature ideas.
Shared packages/core Package
GPT ProDecouple CLI from web app with shared core package for types, registry, and search
BM25 Search Engine
GPT ProReplace hash embeddings with proper BM25 ranking algorithm for better relevance
CAC CLI Parser
GPT ProReplace ad-hoc flag parsing with cac for robust parsing, help generation, and completions
Skill Manifest System
GPT ProTrack installed skills with SHA256 hashes to detect user modifications before updates
YAML-Safe Frontmatter
GPT ProUse JSON.stringify for YAML values and add x_jfp_generated marker for safe updates
Health Check Endpoints
GPT ProAdd /api/health for monitoring, load balancers, and CI/CD health gates
Prompt Templating System
GPT ProSupport {{VARIABLE}} placeholders with --fill flag for CLI variable substitution
Prompt Changelog/Versioning
GPT ProTrack changes to prompts with version history and change types
Stale-While-Revalidate Registry
GeminiCLI phones home for updated prompts without blocking startup
Progressive Web App
GPT ProService worker for offline access and installability
Workflow Builder UI
GPT ProDrag-and-drop interface for chaining prompts into workflows
Second-pass plan refinement (web session)
The initial plan was refined in GPT Pro with additional architectural safeguards and scope adjustments. The guide steps above link directly to the revisions below.
GPT Pro plan fusion (web session)
This was the dedicated GPT Pro pass that merged multiple model plans, tightened constraints, and locked the execution rules before build-out.
Methodology notes tied to the guide
These posts capture the planning-first workflow, the coordination stack, and the prompting philosophy that shaped the build. Each card links back to the relevant guide step.
GPT Pro plan revision pass
Paste the full markdown plan into GPT-5.2 Pro for critique before any code is written.
Comprehensive plan beats skeleton
The model performs best when it sees one detailed, end-to-end plan instead of a thin scaffold.
Multi-model plan fusion
Collect plans from multiple frontier models, then fuse them in GPT Pro for a single revision pass.
GPT Pro writes the first plan
Generate the initial markdown plan with GPT Pro or Claude web before handing execution to agents.
Best-practices doc as a contract
Use a detailed stack guide as the ruleset that every agent and plan must align to.
UI/UX upgrade prompt
The UI polish prompt used to push layout, spacing, and motion beyond defaults.
Prompt in action
A public example of the UI/UX prompt producing a fast, polished site in ~2 days.
Workflow for web apps
A full-stack workflow for building web apps with Claude Code and similar agents.
Beads + bv accelerate execution
Structured task graphs plus bv triage remove coordination drag in multi-agent builds.
AGENTS.md teaches the stack
AGENTS.md is the way tools like beads become part of the agent's operating context.
Multi-agent bug-fix pass
Spin up parallel Claude Code instances to clear bugs and type errors in one sweep.
Lint-first refinement loop
Run lint first, then feed the exact failures into the agent for surgical fixes.
The meta-demonstration: This multi-model review process is itself a prompt engineering pattern — using diverse AI perspectives to catch blind spots and improve architectural decisions.
Key Insights
Notable moments and decisions from the development session
Try These Prompts Yourself
The same prompts that built this site are available for you. Browse, copy, or install them as Claude Code skills.