Skip to main content

Demo Walkthrough

A step-by-step tour of ./scripts/demo.sh with screenshots.

Screenshots are captured by scripts/capture-screenshots.ts and committed under docs/static/img/screenshots/. Refresh with npm -w apps/frontend-web run capture-screenshots.

Step 1 — Reset the demo repo​

The script closes any leftover issues on olafkfreund/aifactory-demo and seeds three fresh ones.

Screenshot: screenshots/11-github-issues-sync.png — Phase D will capture this against the running portal.

Step 2 — Register the repo​

curl -X POST http://localhost:3101/api/projects \
  -H "Authorization: Bearer $TOKEN" \
  -H "Content-Type: application/json" \
  -d '{"path": "/tmp/aifactory-demo", "name": "aifactory-demo"}'

The portal returns a UUID project-id and renders the project on the Welcome screen.

Screenshot: screenshots/01-welcome.png

Step 3 — Import issues → backlog tasks​

curl -X POST "http://localhost:3101/api/projects/$PROJECT_ID/github/import" \
  -H "Authorization: Bearer $TOKEN" \
  -d '{"issueNumbers": [1, 2, 3]}'

The web-server creates three spec directories under .aifactory/specs/. Each task appears in the Kanban backlog column with the issue title.

Screenshot: screenshots/03-kanban.png

Step 4 — Drive Claude Code from the terminal​

In a new terminal, with the demo project as CWD:

claude

Ask Claude:

"Refine the plan for the /healthz endpoint task. Edit .aifactory/specs/001-*/spec.md and implementation_plan.json to be more specific about the response shape."

Claude reads, edits, and saves. The portal's task-detail view reflects the changes in real time via the 3-second worktree sync.

Screenshot: screenshots/06-task-detail-plan.png

Step 5 — Kick off an autonomous build​

Either click Start in the Kanban card, or:

curl -X POST "http://localhost:3101/api/tasks/$TASK_ID/recover" \
  -H "Authorization: Bearer $TOKEN" \
  -d '{"targetStatus": "backlog", "autoRestart": true}'

The agent runs. Open the Live Console tab on the task to watch.

Screenshot: screenshots/09-live-agent-console.png

Step 6 — Review and merge​

When the QA reviewer approves, click Merge in the task detail panel. The portal runs git checkout main && git merge --no-ff auto-claude/<spec-id> against your local clone.

Done. Three GitHub issues → three commits on your branch. The agent did the work, you reviewed.

Screenshot: screenshots/08-task-detail-files.png (showing the final diff)