|
| 1 | +# Spec-Driven Development |
| 2 | + |
| 3 | +This document defines the structure and conventions for the `docs/specs/` directory used in spec-driven development. Features and bug fixes are planned as specifications before implementation begins. |
| 4 | + |
| 5 | +## Overview |
| 6 | + |
| 7 | +Every non-trivial change goes through a specification phase: |
| 8 | +1. A GitHub issue describes the **what** and **why** |
| 9 | +2. A spec folder contains the **how** — technical design, behavioral scenarios, and optionally implementation steps |
| 10 | +3. Implementation follows the spec, and is verified against it |
| 11 | + |
| 12 | +## Directory Structure |
| 13 | + |
| 14 | +Specs live in a `docs/specs/` directory, alongside the project's other documentation under `docs/` — such as `docs/adr/` (architecture decision records), `docs/releases/` (release notes and upgrade guides), and `docs/TODO.md` (the lightweight backlog of parked ideas; see [TODO Backlog](#todo-backlog)). Each spec gets its own sub-folder: |
| 15 | + |
| 16 | +``` |
| 17 | +docs/specs/ |
| 18 | +├── INDEX.md |
| 19 | +├── 001-user-auth-flow/ |
| 20 | +│ ├── design.md |
| 21 | +│ ├── behaviors.md |
| 22 | +│ └── steps.md (optional) |
| 23 | +├── 002-csv-export-api/ |
| 24 | +│ ├── design.md |
| 25 | +│ └── behaviors.md |
| 26 | +└── ... |
| 27 | +``` |
| 28 | + |
| 29 | +### Folder Naming |
| 30 | + |
| 31 | +- Format: `<ID>-<short-description>` — the three-digit ID followed by a kebab-case description (e.g., `001-user-auth-flow`, `002-csv-export-api`) |
| 32 | +- Keep the description to 3–4 words. |
| 33 | +- The ID prefix must match the sequential ID in `INDEX.md`. |
| 34 | + |
| 35 | +### `INDEX.md` — Spec Overview |
| 36 | + |
| 37 | +The file `docs/specs/INDEX.md` is a central index of all specs. It provides Claude and developers with an at-a-glance overview of which specs exist, what they cover, and whether they have been implemented. |
| 38 | + |
| 39 | +Format: |
| 40 | + |
| 41 | +```markdown |
| 42 | +# Spec Index |
| 43 | + |
| 44 | +| ID | Spec-Folder | Name | Areas | Description | GitHub Issue | Status | |
| 45 | +|-----|-------------|------|-------|-------------|--------------|--------| |
| 46 | +| 001 | 001-user-auth-flow | User auth flow | backend, authentication, database | JWT-based login and registration with refresh tokens | #42 | done | |
| 47 | +| 002 | 002-csv-export-api | CSV export API | backend, frontend | REST endpoint to export filtered datasets as CSV | #87 | open | |
| 48 | +| 003 | 003-rate-limiting | Rate limiting | backend, security | Token-bucket rate limiting for all public API endpoints | — | in progress | |
| 49 | +``` |
| 50 | + |
| 51 | +Rules: |
| 52 | +- Every spec must have an entry in `INDEX.md`. A spec without an index entry is incomplete. |
| 53 | +- **Spec-Folder** contains the exact folder name under `docs/specs/` (e.g., `001-user-auth-flow`). This allows Claude and developers to navigate directly to the spec folder without ambiguity. |
| 54 | +- **Areas** lists the affected parts of the project as comma-separated lowercase tags. Common values: `frontend`, `backend`, `database`, `build`, `docker`, `styling`, `documentation`, `authentication`, `security`, `architecture`, `api`, `testing`, `infrastructure`. Use project-appropriate terms — this list is not exhaustive. |
| 55 | +- **Status** values: `open` (not started), `in progress` (being implemented), `done` (implemented and verified). |
| 56 | +- **GitHub Issue** column contains the issue reference (e.g., `#42`) or `—` if no issue exists. |
| 57 | +- The index is updated whenever a spec is created or its status changes. |
| 58 | +- The sequential ID in the index determines the canonical order of specs. |
| 59 | + |
| 60 | +## Files |
| 61 | + |
| 62 | +### `design.md` — Technical Design |
| 63 | + |
| 64 | +Describes the technical approach for the change. Sections (include only what is relevant): |
| 65 | + |
| 66 | +- **GitHub Issue** — Link to the source issue |
| 67 | +- **Summary** — What is being built and why (1–2 paragraphs) |
| 68 | +- **Goals** — What this change aims to achieve |
| 69 | +- **Non-goals** — What is explicitly out of scope |
| 70 | +- **Technical approach** — High-level implementation strategy |
| 71 | +- **API design** — Endpoints, request/response shapes, status codes |
| 72 | +- **Data model** — Entities, relationships, migrations |
| 73 | +- **Key flows** — Step-by-step execution paths |
| 74 | +- **Dependencies** — External services, libraries, internal modules |
| 75 | +- **Security considerations** — Auth, validation, data exposure |
| 76 | +- **Open questions** — Unresolved items |
| 77 | + |
| 78 | +Key design decisions include a brief **rationale** explaining why the approach was chosen over alternatives. |
| 79 | + |
| 80 | +**For bug fixes**, the design focuses on different sections: |
| 81 | +- **Summary** — What is broken and what is the user-visible impact |
| 82 | +- **Reproduction** — Steps to reproduce the bug, preconditions, environment details |
| 83 | +- **Root cause analysis** — Why the bug occurs, which component is responsible |
| 84 | +- **Fix approach** — How the bug will be fixed, which files/components change |
| 85 | +- **Regression risk** — What could break as a side effect |
| 86 | + |
| 87 | +Use **Mermaid diagrams** where they help clarify the design — for example sequence diagrams for key flows, entity-relationship diagrams for data models, or component diagrams for architecture. Embed them directly in the Markdown using fenced code blocks: |
| 88 | + |
| 89 | +````markdown |
| 90 | +```mermaid |
| 91 | +sequenceDiagram |
| 92 | + Client->>API: POST /users |
| 93 | + API->>DB: INSERT user |
| 94 | + DB-->>API: user record |
| 95 | + API-->>Client: 201 Created |
| 96 | +``` |
| 97 | +```` |
| 98 | + |
| 99 | +Diagrams are optional — only add them when they communicate structure or flow more clearly than text alone. |
| 100 | + |
| 101 | +### `behaviors.md` — Behavioral Scenarios |
| 102 | + |
| 103 | +Defines the expected behavior using given-when-then scenarios (Behavior-Driven Design). These scenarios serve as the basis for unit and integration tests. |
| 104 | + |
| 105 | +Format: |
| 106 | + |
| 107 | +```markdown |
| 108 | +# Behaviors: <Spec Name> |
| 109 | + |
| 110 | +## <Feature or Area> |
| 111 | + |
| 112 | +### <Scenario Name> |
| 113 | + |
| 114 | +- **Given** <precondition> |
| 115 | +- **When** <action> |
| 116 | +- **Then** <expected outcome> |
| 117 | +``` |
| 118 | + |
| 119 | +Coverage should include: |
| 120 | +- **Happy paths** — Main success scenarios |
| 121 | +- **Edge cases** — Boundary values, empty inputs, concurrent access |
| 122 | +- **Error cases** — Invalid input, missing permissions, downstream failures |
| 123 | +- **State transitions** — Before/after states where relevant |
| 124 | + |
| 125 | +Each scenario should be specific enough to translate directly into a test case. |
| 126 | + |
| 127 | +### Drift Log — Tracking Post-Implementation Divergence |
| 128 | + |
| 129 | +After a spec is implemented and its status is `done`, the original `design.md` and `behaviors.md` must not be modified — they serve as a historical record of the design decisions made at the time. |
| 130 | + |
| 131 | +However, later specs may change shared code, causing the implementation to diverge from the original design or behaviors. When `/spec-review` detects such drift, it is recorded in a **Drift Log** section appended to the end of the affected file (`design.md` or `behaviors.md`). |
| 132 | + |
| 133 | +Format for `design.md`: |
| 134 | + |
| 135 | +```markdown |
| 136 | +--- |
| 137 | + |
| 138 | +## Drift Log |
| 139 | + |
| 140 | +### <Date> — Caused by spec `<ID-spec-folder-name>` |
| 141 | + |
| 142 | +- **Affected element:** <design element that drifted> |
| 143 | +- **Original design:** <what was specified> |
| 144 | +- **Current state:** <what the code does now> |
| 145 | +- **Reason:** <brief explanation of why the other spec changed this> |
| 146 | +``` |
| 147 | + |
| 148 | +Format for `behaviors.md`: |
| 149 | + |
| 150 | +```markdown |
| 151 | +--- |
| 152 | + |
| 153 | +## Drift Log |
| 154 | + |
| 155 | +### <Date> — Caused by spec `<ID-spec-folder-name>` |
| 156 | + |
| 157 | +- **Affected scenario:** <scenario name> |
| 158 | +- **Original behavior:** <what was specified> |
| 159 | +- **Current behavior:** <what the code does now> |
| 160 | +- **Reason:** <brief explanation of why the other spec changed this> |
| 161 | +``` |
| 162 | + |
| 163 | +Rules: |
| 164 | +- The Drift Log is always the last section in the file, separated by a horizontal rule (`---`). |
| 165 | +- Each entry identifies the causing spec so the chain of changes is traceable. |
| 166 | +- Only `/spec-review` writes Drift Log entries — they are not added during normal implementation. |
| 167 | +- If drift is detected but no causing spec can be identified, use `unknown` as the spec reference. |
| 168 | + |
| 169 | +### `steps.md` — Implementation Steps (optional) |
| 170 | + |
| 171 | +An ordered, actionable checklist for implementing the spec. Uses GitHub-flavored Markdown checkboxes for tracking progress: |
| 172 | + |
| 173 | +```markdown |
| 174 | +# Implementation Steps: <Spec Name> |
| 175 | + |
| 176 | +## Step 1: <Title> |
| 177 | + |
| 178 | +- [ ] Create `src/models/user.ts` with fields: id, email, name, createdAt |
| 179 | +- [ ] Create migration `migrations/001_create_users.sql` |
| 180 | + |
| 181 | +**Acceptance criteria:** |
| 182 | +- [ ] Migration runs successfully |
| 183 | +- [ ] Entity can be instantiated in a test |
| 184 | +- [ ] Unit tests for new code exist and pass |
| 185 | +- [ ] Project builds successfully |
| 186 | + |
| 187 | +**Related behaviors:** User creation happy path |
| 188 | + |
| 189 | +--- |
| 190 | + |
| 191 | +## Step 2: <Title> |
| 192 | +... |
| 193 | +``` |
| 194 | + |
| 195 | +Each step is: |
| 196 | +- **Atomic** — One focused change |
| 197 | +- **Independently verifiable** — Can be confirmed after completion |
| 198 | +- **Sequenced by dependency** — Earlier steps are foundations for later ones |
| 199 | + |
| 200 | +## TODO Backlog |
| 201 | + |
| 202 | +Not every idea is ready to become a spec. `docs/TODO.md` is a lightweight backlog for half-formed ideas, deferred sub-tasks, and follow-ups that surface during planning, grilling, reviewing, or general work — things worth keeping but not yet clear enough to design. |
| 203 | + |
| 204 | +Each entry records the idea, the context it surfaced in (and why it was deferred), and any prerequisites: |
| 205 | + |
| 206 | +```markdown |
| 207 | +# TODO |
| 208 | + |
| 209 | +## <Short title> |
| 210 | + |
| 211 | +<One short paragraph: what the idea is and why it matters.> |
| 212 | + |
| 213 | +**Context:** <Where this surfaced and why it was deferred — reference the spec, issue, grill session, or review.> |
| 214 | + |
| 215 | +**Prerequisite:** <Dependent spec(s) that must land first — omit if none.> |
| 216 | +``` |
| 217 | + |
| 218 | +The backlog is a **living list of open items**, not an archive: |
| 219 | + |
| 220 | +- The `/todo-capture` skill adds entries without interrupting the work in progress. |
| 221 | +- When an item matures, it graduates into the spec workflow via `/spec-create` (referencing the TODO) or into a GitHub issue. |
| 222 | +- Once promoted or resolved, the entry is removed — or struck through with a pointer to where it went (e.g. `~~Old item~~ — implemented via spec 012`) — so `docs/TODO.md` only ever lists what is still open. |
| 223 | + |
| 224 | +## Roadmap Integration |
| 225 | + |
| 226 | +Projects may include a `docs/roadmap.md` that defines high-level milestones as a checklist: |
| 227 | + |
| 228 | +```markdown |
| 229 | +# Roadmap V1 |
| 230 | + |
| 231 | +- [ ] User authentication with JWT (login, registration, password reset) |
| 232 | +- [ ] Dashboard page showing key metrics |
| 233 | +- [ ] CSV export for reports |
| 234 | +- [x] Project setup (already done) |
| 235 | +``` |
| 236 | + |
| 237 | +Each top-level checkbox represents one step that maps to a spec. Steps marked `[x]` are completed. The roadmap provides the **what** at a high level — specs provide the **how** in detail. |
| 238 | + |
| 239 | +When a `docs/roadmap.md` exists, the `/roadmap-execute` skill can autonomously process all unchecked steps end-to-end: creating specs, implementing them, reviewing, and committing — using a fresh sub-agent for each step to avoid context bloat. |
| 240 | + |
| 241 | +The roadmap is optional. Projects can also create specs directly from GitHub issues using `/spec-create`. |
| 242 | + |
| 243 | +## Workflow |
| 244 | + |
| 245 | +The spec-driven workflow uses three skills: |
| 246 | + |
| 247 | +| Skill | Purpose | |
| 248 | +|-------|---------| |
| 249 | +| `/spec-create` | Create `design.md` and `behaviors.md` through interactive discussion | |
| 250 | +| `/spec-implement` | Generate `steps.md` from a completed spec | |
| 251 | +| `/spec-review` | Verify implementation completeness against design and behaviors | |
| 252 | +| `/spec-flow` | End-to-end GitHub flow: issue → branch → implement → review → PR | |
| 253 | +| `/roadmap-execute` | Autonomously process all unchecked steps in `docs/roadmap.md` end-to-end using sub-agents | |
| 254 | +| `/todo-capture` | Park a half-formed idea or follow-up in `docs/TODO.md` when it is not yet ready for a spec | |
| 255 | + |
| 256 | +A typical flow: |
| 257 | +1. Start with a GitHub issue (or create one first) |
| 258 | +2. `/spec-create` — Plan the change collaboratively |
| 259 | +3. `/spec-implement` — Break it down into steps (optional) |
| 260 | +4. Implement (manually, guided, or automated) |
| 261 | +5. `/spec-review` — Verify completeness |
| 262 | + |
| 263 | +Alternative flow with spec-flow (recommended for a complete GitHub workflow): |
| 264 | +1. Start with a GitHub issue (or create one first) |
| 265 | +2. `/spec-create` — Plan the change collaboratively |
| 266 | +3. `/spec-flow` — Implements, reviews iteratively, and opens a PR |
| 267 | + |
| 268 | +Alternative flow with roadmap: |
| 269 | +1. Write a `docs/roadmap.md` with high-level steps |
| 270 | +2. `/roadmap-execute` — Processes all steps autonomously (creates specs, implements, reviews, commits) |
| 271 | + |
| 272 | +## Principles |
| 273 | + |
| 274 | +- **English only** — All spec documents (`design.md`, `behaviors.md`, `steps.md`) must be written in English, regardless of what language the user communicates in. This ensures specs are accessible to all contributors and consistent across projects. |
| 275 | +- **Issue first** — Every PR should have a corresponding GitHub issue |
| 276 | +- **Discuss before writing** — Specs are created through dialogue, not generated silently |
| 277 | +- **Right-size the spec** — A bug fix needs less documentation than a new feature. Skip sections that are not relevant. |
| 278 | +- **Living documents during implementation** — Specs can be updated during implementation if decisions change. Once a spec reaches `done` status, the original design and behaviors are frozen. Post-implementation divergence is tracked in the Drift Log. |
| 279 | +- **Specs are not throwaway** — They remain in the repository as documentation of design decisions and expected behavior |
| 280 | +- **Commits and PRs are human work** — Developers create commits and pull requests themselves. The spec folder and its design decisions should be referenced in the PR description, but the PR itself is authored by the developer, not generated by AI. |
0 commit comments