Build real websites and web apps by describing them.

How it works

Five simple steps take you from an idea to a working app. You stay in plain language the whole way — the commands do the technical work.

1. 1

   Describe it

   /spec-draft

   Tell it what you want to build. It interviews you and writes a plain-language spec — what the app does and how people use it.

2. 2

   Refine it

   /spec-refine

   It asks questions, fills the gaps, and chooses the right tools for the job, so the plan is solid before any code is written.

3. 3

   Break it down

   /spec-phases

   It splits the work into small, ordered phases — bite-sized pieces you can follow one at a time.

4. 4

   Plan each phase

   /spec-plan

   It writes a short plan for every phase up front, so nothing is a surprise and you always know what’s next.

5. 5

   Build it

   /spec-implement

   It builds one phase at a time and keeps the spec up to date as it goes, so the plan always matches the app.

Each step runs in a fresh session, and the spec is always kept current — so the AI never loses track of what you’re building.

Getting set up

Building real apps needs a few tools on your machine. These commands sort that out for you — installing only what your project actually uses, and helping when something goes sideways. They’re separate from the workflow above; reach for them whenever you need.

• /spec-setup

  Run this first. It checks what your project needs and helps you install only the missing tools — one step at a time, nothing happens without your OK.

• /spec-doctor

  A quick health check. It tells you what’s installed and what isn’t — and changes nothing.

• /spec-troubleshoot

  Something not working? Describe it and it walks you through the fix, from database hiccups to setup snags.

Keep your secrets safe

Apps have secrets — passwords, API keys, access tokens. The most common security slip is one of them leaking into the part of the app that runs in people’s browsers. One command checks for it.

Here’s the important part: your actual secret values are never shown to the AI. A small local script does the checking on your machine and reports back only names and a pass/fail — so the audit is safer than pasting anything into a chat. The same check can run automatically before every save and in your project’s safety net, so a leak never makes it out the door.

Prefer not to install a plugin?

No problem — the whole thing is just markdown. Copy it and paste it into Claude, Cursor, or any AI tool, or save it as vibe-spec.md in your project so your assistant always has it on hand. It’s the same reference the plugin uses, kept in sync automatically.

# Vibe-Spec: Stack Reference Guide

A reusable blueprint for building full-stack web apps with Next.js, Prisma, and
PostgreSQL — refined through real production projects using spec-driven
development. Every section is self-contained with skip/need conditions, key
files, copy-pasteable config, and gotchas.

**Only adopt what you need.** Most projects won't need all of it: a static site
doesn't need Prisma or Docker; a simple CRUD app doesn't need S3 or push
notifications. Load only the sections relevant to the task in front of you.

---

# AI-Assisted Development (Spec-Driven Workflow)

> **Skip this if:** you don’t use AI coding tools

21 sections · ~92 KB · always current with the plugin.