Skip to content

Workflow Diagram: The Full Loop

┌─────────────────────────────────────────────────────────┐
│ IDEA PHASE │
│ "I want to build a habit tracker" │
└─────────────────┬───────────────────────────────────────┘
┌─────────────────┐
│ DECIDE TOOL │
│ Quick? → .ai │
│ Real? → CLI │
└────────┬────────┘
┌────────────────────────────────────────────────────────┐
│ DEVELOPMENT (CLI Example) │
│ │
│ 1. Setup │
│ mkdir habit-tracker && cd habit-tracker │
│ git init │
│ claude │
│ │
│ 2. Build (Iterative) │
│ You: "Create habit tracker with..." │
│ Claude: *generates files* │
│ You: "Add streak counter" │
│ Claude: *modifies code* │
│ You: "Make it prettier" │
│ Claude: *updates styles* │
│ │
│ 3. Test locally │
│ open index.html (or npm run dev) │
│ │
│ 4. Version control │
│ git add . │
│ git commit -m "Working habit tracker" │
└────────────────┬───────────────────────────────────────┘
┌────────────────┐
│ DEPLOY │
│ GitHub Pages │
│ OR Vercel │
│ OR Netlify │
└────────┬───────┘
┌────────────────┐
│ SHARE │
│ yourusername. │
│ github.io/ │
│ habit-tracker │
└────────────────┘
┌──────────┐
│ USE │
│ Test it │
└────┬─────┘
┌───────────────┐
┌────→│ FEEDBACK │←────┐
│ │ "Needs dark │ │
│ │ mode!" │ │
│ └───────┬───────┘ │
│ ↓ │
│ ┌───────────────┐ │
│ │ IMPROVE │ │
│ │ Claude adds │ │
│ │ features │ │
│ └───────┬───────┘ │
│ ↓ │
│ ┌───────────────┐ │
└─────│ DEPLOY │─────┘
│ Push updates │
└───────────────┘