PRD To Demo

Use this skill to turn a PRD into a runnable demo project. Optimize for a working vertical slice over a broad but broken scaffold.

Inputs To Confirm

Confirm these only when they are missing from the user request or cannot be inferred:

1. PRD file path.
2. Output directory.
3. Scope: quick, standard, or complete.

Default to:

• PRD: the file named or currently relevant in the workspace.
• Output: <prd-directory>/<product-slug>-demo.
• Scope: standard.

Generation Contract

Read references/codegen-guide.md before generating code. It is the source of truth for:

• Product extraction fields.
• State machine.
• API route contract.
• Frontend/backend file map.
• Validation checklist.

Read templates only when generating the corresponding side:

• Backend: templates/backend-templates.md.
• Frontend: templates/frontend-templates.md.

Workflow

1. Parse the PRD and extract product name, slug, target users, core features, intents, agents, tools, states, UI components, file constraints, error messages, and non-functional requirements.
2. Show a short extraction summary and ask for confirmation before writing code unless the user explicitly asked to proceed directly.
3. Generate the backend first. Keep mock LLM calls local and deterministic. Real file parsing and SQL execution should work.
4. Generate the frontend second. Drive the UI from the same state machine and route contract as the backend.
5. Generate root files: README.md, .gitignore, optional docker-compose.yml for complete scope, and a small sample CSV when useful.
6. Validate before delivery:
   - Python imports compile.
   - FastAPI app starts or at least imports.
   - TypeScript builds when dependencies are present.
   - Frontend API client matches backend routes.
   - State names match across backend, frontend, and documentation.

Required Demo Behavior

The generated demo must support this route-backed flow:

idle
  -> parsing
  -> metric_confirm
  -> sql_generating
  -> sql_review
  -> executing
  -> completed
  -> error

The demo must not skip SQL review. Users need to see, edit, and execute generated SQL.

Scope Rules

• quick: one FastAPI app plus one simple React page; keep fewer files but preserve the route contract.
• standard: full backend modules, frontend components, mock Agent orchestration, schema viewer, metric selector, SQL review, charts, report viewer.
• complete: standard plus Docker Compose, sample data, richer styling, and report download.

Implementation Rules

• Use mock LLM responses by default. Do not require external API keys.
• Parse uploaded CSV/Excel files for real with pandas/openpyxl.
• Execute SQL in a SQLite sandbox loaded from the uploaded file.
• Reject non-read-only SQL before execution.
• Keep route names, state names, and response models identical across backend and frontend.
• Prefer clear, small files over clever abstractions.
• If dependencies cannot be installed in the current environment, still generate code and report that validation was limited.

Delivery

End with:

• Output path.
• Generated file tree summary.
• How to start backend and frontend.
• Validation commands run and any failures.