Remove /generate-app: app shell is now milestone 01 of the plan
The initial app is no longer generated by a separate command. /plan-milestones now always makes milestone 01 'App Shell Generation' (target platform asked in the single question round): theme from design tokens, one screen per blueprint entry, routes, reusable components — no feature logic — plus Playwright setup and the e2e/app-shell.spec.ts smoke spec. It is executed like any other milestone via /execute-milestones (which loads platform-ui-generation for it) or /add-feature. Milestone 02 becomes the MVP core. All workflow diagrams, skills, docs READMEs, CLAUDE.md, and README updated; docs/design README also gains the screen-inventory.md entry. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
27
README.md
27
README.md
@ -13,7 +13,7 @@ https://github.com/GenerativeAgents/claude-code-book
|
||||
How a project goes from idea to working code with this boilerplate:
|
||||
|
||||
```
|
||||
Idea → /setup-project → /define-design → refine design → /generate-app → /plan-milestones → /execute-milestones (phase by phase)
|
||||
Idea → /setup-project → /define-design → refine design → /plan-milestones → /execute-milestones (phase by phase; milestone 01 generates the app)
|
||||
```
|
||||
|
||||
### Step 1 — Write down your idea
|
||||
@ -41,18 +41,17 @@ This is the key design-decision gate: iterate on the design while it is still ch
|
||||
- Re-run `/define-design` — change the overall direction
|
||||
- Repeat until you approve the design (especially `ui-blueprint.json`)
|
||||
|
||||
### Step 5 — Generate the initial app: `/generate-app web | flutter | winui3`
|
||||
Scaffolds the app shell from the approved design: theme (from tokens), routes, screens, and
|
||||
reusable components. No feature logic yet.
|
||||
|
||||
### Step 6 — Plan milestones: `/plan-milestones`
|
||||
### Step 5 — Plan milestones: `/plan-milestones`
|
||||
Breaks the product into **phases** and milestones, and generates `docs/milestones/`:
|
||||
a `roadmap.md` overview plus **one file per phase** (`phase1-milestones.md`,
|
||||
`phase2-milestones.md`, …). Each phase file lists its milestones and **the features they
|
||||
contain** — each feature sized for exactly one `/add-feature` run, with acceptance criteria and a
|
||||
ready-to-run command. Phase 1 delivers the MVP; later phases build on it by priority and dependency.
|
||||
ready-to-run command. **Milestone 01 is always "App Shell Generation"**: it scaffolds the initial
|
||||
app from the approved design (theme from tokens, one screen per blueprint entry, routes, reusable
|
||||
components — no feature logic) plus the Playwright smoke spec; there is no separate generate-app
|
||||
step. Phase 1 delivers the MVP; later phases build on it by priority and dependency.
|
||||
|
||||
### Step 7 — Implement the milestones
|
||||
### Step 6 — Implement the milestones
|
||||
|
||||
Two ways to work through the plan:
|
||||
|
||||
@ -74,7 +73,7 @@ A fully autonomous loop, one feature per run. Each run:
|
||||
5. Writes Playwright E2E tests for the feature's acceptance criteria, then runs `npm test`, `npm run lint`, `npm run typecheck`, and `npm run test:e2e` until green
|
||||
6. Records a retrospective, reconciles all six `docs/` documents, and checks the feature off in its phase file
|
||||
|
||||
### Step 8 — Repeat and maintain
|
||||
### Step 7 — Repeat and maintain
|
||||
- Remaining phases → `/execute-milestones <next phase file>`, or feature by feature with `/add-feature <feature>`
|
||||
- UI changes → `/update-design <change>` first, then `/add-feature`
|
||||
- Re-planning → re-run `/plan-milestones` or edit `docs/milestones/` in conversation
|
||||
@ -87,7 +86,7 @@ in sync with the code.
|
||||
## E2E Testing (Playwright)
|
||||
|
||||
Every verification step in this boilerplate includes end-to-end tests. The standard verification
|
||||
sequence — used by `/add-feature`, `/execute-milestones`, and `/generate-app` — is:
|
||||
sequence — used by `/add-feature` and `/execute-milestones` — is:
|
||||
|
||||
```bash
|
||||
npm test # unit tests
|
||||
@ -103,7 +102,7 @@ How it works (defined in the `e2e-testing` skill):
|
||||
failure), and adds the `test:e2e` script.
|
||||
- **Tests are derived from acceptance criteria**: each feature gets `e2e/[feature].spec.ts` with
|
||||
one test per acceptance criterion, written before verification runs.
|
||||
- **The app shell has a smoke spec**: `/generate-app` creates `e2e/app-shell.spec.ts`, which
|
||||
- **The app shell has a smoke spec**: the App Shell milestone (milestone 01) creates `e2e/app-shell.spec.ts`, which
|
||||
checks that the shell renders and every route in `ui-blueprint.json` navigates.
|
||||
- **Blueprint-driven locators**: tests navigate by the blueprint's routes and use semantic
|
||||
locators (`getByRole`, `getByLabel`) — no CSS/XPath tied to implementation details, no fixed waits.
|
||||
@ -150,8 +149,7 @@ claude
|
||||
> /setup-project
|
||||
> /define-design
|
||||
> /update-design [refinement] # repeat until the design is approved
|
||||
> /generate-app web # or flutter | winui3
|
||||
> /plan-milestones
|
||||
> /plan-milestones # milestone 01 = app shell generation
|
||||
> /execute-milestones phase1-milestones.md # one phase at a time, or:
|
||||
> /add-feature [feature name] # one feature at a time
|
||||
```
|
||||
@ -165,8 +163,7 @@ See [Development Workflow (Step by Step)](#development-workflow-step-by-step) ab
|
||||
| `/setup-project` | Create the six persistent documents automatically | `/setup-project` |
|
||||
| `/define-design` | Create the UI/UX design spec under `docs/design/` | `/define-design` |
|
||||
| `/update-design` | Refine the design before generation, or update it when a feature changes the UI | `/update-design add a profile screen` |
|
||||
| `/generate-app` | Scaffold the initial app for a target platform | `/generate-app web` |
|
||||
| `/plan-milestones` | Plan phases and milestones; generates one `phase[N]-milestones.md` per phase | `/plan-milestones 2 phases, MVP first` |
|
||||
| `/plan-milestones` | Plan phases and milestones; generates one `phase[N]-milestones.md` per phase (milestone 01 = App Shell Generation) | `/plan-milestones 2 phases, MVP first` |
|
||||
| `/execute-milestones` | Execute one phase file: its milestones one by one, with separate steering documents per milestone (file argument required) | `/execute-milestones phase1-milestones.md` |
|
||||
| `/add-feature` | Implement a feature end-to-end (autonomous) | `/add-feature User profile editing` |
|
||||
| `/review-docs` | Detailed document review via subagent | `/review-docs docs/architecture.md` |
|
||||
|
||||
Reference in New Issue
Block a user