Loading...
Loading...
Generates comprehensive planning documentation for web application projects, structuring work into context-safe phases with built-in verification criteria. Creates IMPLEMENTATION_PHASES.md, DATABASE_SCHEMA.md, API_ENDPOINTS.md, ARCHITECTURE.md, and other planning docs based on project needs. Optimized for Cloudflare Workers + Vite + React stack. Use when starting new projects, adding major features, or restructuring existing work into manageable phases. Keywords: project planning, planning documentation, IMPLEMENTATION_PHASES.md, DATABASE_SCHEMA.md, API_ENDPOINTS.md, ARCHITECTURE.md, UI_COMPONENTS.md, TESTING.md, AGENTS_CONFIG.md, phased development, context-safe phases, verification criteria, exit criteria, planning docs generator, web app planning, Cloudflare Workers planning, Vite React planning, project structure, project phases, major features planning, new project setup
npx skill4agent add jackspace/claudeskillz project-planningI'll help structure this project. A few questions to optimize the planning:
1. **Authentication**: Do users need accounts, or is this a public tool?
- If accounts: Social auth (Google/GitHub)? Roles/permissions?
2. **Data Model**: You mentioned [entities]. Any relationships I should know about?
- One-to-many? Many-to-many? Hierarchical?
3. **Key Features**: Which of these apply?
- Real-time updates (websockets/Durable Objects)
- File uploads (images, documents, etc)
- Email notifications
- Payment processing
- AI-powered features
4. **Scope**: Is this an MVP or full-featured app?
- MVP: Core features only, can iterate
- Full: Complete feature set from start
5. **Timeline**: Any constraints? (helps with phase sizing)⚠️ Phase 4 "Complete User Management" is too large (12 files, 8-10 hours).
Suggested split:
- Phase 4a: User CRUD API (5 files, 4 hours)
- Phase 4b: User Profile UI (6 files, 5 hours)# Implementation Phases: [Project Name]
**Project Type**: [Web App / Dashboard / API / etc]
**Stack**: Cloudflare Workers + Vite + React + D1
**Estimated Total**: [X hours] (~[Y minutes] human time)
---
## Phase 1: [Name]
**Type**: [Infrastructure/Database/API/UI/Integration/Testing]
**Estimated**: [X hours]
**Files**: [file1.ts, file2.tsx, ...]
**Tasks**:
- [ ] Task 1
- [ ] Task 2
- [ ] Task 3
- [ ] Test basic functionality
**Verification Criteria**:
- [ ] Specific test 1
- [ ] Specific test 2
- [ ] Specific test 3
**Exit Criteria**: [Clear definition of when this phase is complete]
---
## Phase 2: [Name]
[... repeat structure ...]
---
## Notes
**Testing Strategy**: [Inline per-phase / Separate testing phase / Both]
**Deployment Strategy**: [Deploy per phase / Deploy at milestones / Final deploy]
**Context Management**: Phases sized to fit in single session with verification# Database Schema: [Project Name]
**Database**: Cloudflare D1
**Migrations**: Located in `migrations/`
**ORM**: [Drizzle / Raw SQL / None]
---
## Tables
### `users`
**Purpose**: User accounts and authentication
| Column | Type | Constraints | Notes |
|--------|------|-------------|-------|
| id | INTEGER | PRIMARY KEY | Auto-increment |
| email | TEXT | UNIQUE, NOT NULL | Used for login |
| created_at | INTEGER | NOT NULL | Unix timestamp |
**Indexes**:
- `idx_users_email` on `email` (for login lookups)
**Relationships**:
- One-to-many with `tasks`
---
### `tasks`
[... repeat structure ...]
---
## Migrations
### Migration 1: Initial Schema
**File**: `migrations/0001_initial.sql`
**Creates**: users, tasks tables
### Migration 2: Add Tags
**File**: `migrations/0002_tags.sql`
**Creates**: tags, task_tags tables
---
## Seed Data
For development, seed with:
- 3 sample users
- 10 sample tasks across users
- 5 tags# API Endpoints: [Project Name]
**Base URL**: `/api`
**Auth**: Clerk JWT (custom template with email + metadata)
**Framework**: Hono (on Cloudflare Workers)
---
## Authentication
### POST /api/auth/verify
**Purpose**: Verify JWT token
**Auth**: None (public)
**Request**:
```json
{
"token": "string"
}{ "valid": true, "email": "user@example.com" }{ "error": "Invalid token" }{ "id": 1, "email": "user@example.com", "created_at": 1234567890 }{
"error": "Human-readable message",
"code": "ERROR_CODE",
"details": {} // optional
}
### ARCHITECTURE.md Template
```markdown
# Architecture: [Project Name]
**Deployment**: Cloudflare Workers
**Frontend**: Vite + React (served as static assets)
**Backend**: Worker handles API routes
---
## System Overview
---
## Data Flow
### User Authentication
1. User submits login form
2. Frontend sends credentials to Clerk
3. Clerk returns JWT
4. Frontend includes JWT in API requests
5. Worker middleware verifies JWT
6. Protected routes accessible
### Task Creation
1. User submits task form
2. Frontend validates with Zod
3. POST /api/tasks with validated data
4. Worker validates again server-side
5. Insert into D1 database
6. Return created task
7. Frontend updates UI via TanStack Query
[... more flows as needed ...]
---
## Service Boundaries
**Frontend Responsibilities**:
- User interaction
- Client-side validation
- Optimistic updates
- State management (TanStack Query + Zustand)
**Worker Responsibilities**:
- Request routing
- Authentication/authorization
- Server-side validation
- Business logic
- Database operations
- Third-party API calls
**Cloudflare Services**:
- D1: Persistent relational data
- R2: File storage (images, documents)
- KV: Configuration, feature flags, cache
---
## Security
**Authentication**: Clerk JWT with custom claims
**Authorization**: Middleware checks user ownership before mutations
**Input Validation**: Zod schemas on client AND server
**CORS**: Restricted to production domain
**Secrets**: Environment variables in wrangler.jsonc (not committed)### File Map
- `src/routes/tasks.ts` (estimated ~150 lines)
- **Purpose**: CRUD endpoints for tasks
- **Key exports**: GET, POST, PATCH, DELETE handlers
- **Dependencies**: schemas.ts (validation), auth.ts (middleware), D1 binding
- **Used by**: Frontend task components
- `src/lib/schemas.ts` (estimated ~80 lines)
- **Purpose**: Zod validation schemas for request/response
- **Key exports**: taskSchema, createTaskSchema, updateTaskSchema
- **Dependencies**: zod package
- **Used by**: routes/tasks.ts, frontend forms
- `src/middleware/auth.ts` (existing, no changes)
- **Purpose**: JWT verification middleware
- **Used by**: All authenticated routes### Data Flow
\`\`\`mermaid
sequenceDiagram
participant C as Client
participant W as Worker
participant A as Auth Middleware
participant V as Validator
participant D as D1 Database
C->>W: POST /api/tasks
W->>A: authenticateUser()
A->>W: user object
W->>V: validateSchema(createTaskSchema)
V->>W: validated data
W->>D: INSERT INTO tasks
D->>W: task record
W->>C: 201 + task JSON
\`\`\`### Data Flow
\`\`\`mermaid
flowchart TB
A[TaskList Component] --> B{Has Tasks?}
B -->|Yes| C[Render TaskCard]
B -->|No| D[Show Empty State]
C --> E[TaskCard Component]
E -->|Edit Click| F[Open TaskDialog]
E -->|Delete Click| G[Confirm Delete]
F --> H[Update via API]
G --> I[Delete via API]
H --> J[Refetch Tasks]
I --> J
\`\`\`sequenceDiagramflowchart TB/LRgraph TDerDiagram### Critical Dependencies
**Internal** (codebase files):
- Auth middleware (`src/middleware/auth.ts`)
- Zod schemas (`src/lib/schemas.ts`)
- D1 binding (via `env.DB`)
**External** (npm packages):
- `zod` - Schema validation
- `hono` - Web framework
- `@clerk/backend` - JWT verification
**Configuration** (environment variables, config files):
- `CLERK_SECRET_KEY` - JWT verification key (wrangler.jsonc secret)
- None needed for this phase (uses JWT from headers)
**Cloudflare Bindings**:
- `DB` (D1 database) - Must be configured in wrangler.jsonc### Gotchas & Known Issues
**Ownership Verification Required**:
- PATCH/DELETE must check `task.user_id === user.id`
- Failing to check allows users to modify others' tasks (security vulnerability)
- Pattern: Fetch task, verify ownership, then mutate
**Pagination Required for GET**:
- Without pagination, endpoint returns ALL tasks (performance issue for users with 1000+ tasks)
- Max: 50 tasks per page
- Pattern: `SELECT * FROM tasks WHERE user_id = ? LIMIT ? OFFSET ?`
**Soft Delete Pattern**:
- Don't use `DELETE FROM tasks` (hard delete)
- Use `UPDATE tasks SET deleted_at = ? WHERE id = ?` (soft delete)
- Reason: Audit trail, undo capability, data recovery
**Timezone Handling**:
- Store all timestamps as UTC in database (INTEGER unix timestamp)
- Convert to user's timezone in frontend only
- Pattern: `new Date().getTime()` for storage, `new Date(timestamp)` for display## Phase 3: Tasks API
**Type**: API
**Estimated**: 4 hours (~4 minutes human time)
**Files**: `src/routes/tasks.ts`, `src/lib/schemas.ts`, `src/middleware/auth.ts` (modify)
### File Map
- `src/routes/tasks.ts` (estimated ~150 lines)
- **Purpose**: CRUD endpoints for tasks
- **Key exports**: GET, POST, PATCH, DELETE handlers
- **Dependencies**: schemas.ts, auth middleware, D1 binding
- `src/lib/schemas.ts` (add ~40 lines)
- **Purpose**: Task validation schemas
- **Key exports**: taskSchema, createTaskSchema, updateTaskSchema
- **Modifications**: Add to existing schema file
### Data Flow
\`\`\`mermaid
sequenceDiagram
Client->>Worker: POST /api/tasks
Worker->>AuthMiddleware: authenticateUser()
AuthMiddleware->>Worker: user object
Worker->>Validator: validateSchema(createTaskSchema)
Validator->>Worker: validated data
Worker->>D1: INSERT INTO tasks
D1->>Worker: task record
Worker->>Client: 201 + task JSON
\`\`\`
### Critical Dependencies
**Internal**: auth.ts, schemas.ts, D1 binding
**External**: zod, hono, @clerk/backend
**Configuration**: CLERK_SECRET_KEY (wrangler.jsonc)
**Bindings**: DB (D1)
### Gotchas & Known Issues
- **Ownership verification**: PATCH/DELETE must check task.user_id === user.id
- **Pagination required**: GET must limit to 50 tasks per page
- **Soft delete**: Use deleted_at timestamp, not hard DELETE
- **UTC timestamps**: Store as unix timestamp, convert in frontend
### Tasks
- [ ] Create task validation schemas in schemas.ts
- [ ] Implement GET /api/tasks endpoint with pagination
- [ ] Implement POST /api/tasks endpoint with validation
- [ ] Implement PATCH /api/tasks/:id with ownership check
- [ ] Implement DELETE /api/tasks/:id with soft delete
- [ ] Add error handling for invalid IDs
- [ ] Test all endpoints with valid/invalid data
### Verification Criteria
- [ ] GET /api/tasks returns 200 with array of tasks
- [ ] GET /api/tasks?page=2 returns correct offset
- [ ] POST /api/tasks with valid data returns 201 + created task
- [ ] POST /api/tasks with invalid data returns 400 + error details
- [ ] PATCH /api/tasks/:id updates task and returns 200
- [ ] PATCH /api/tasks/:id with wrong user returns 403
- [ ] DELETE /api/tasks/:id soft deletes (sets deleted_at)
- [ ] All endpoints return 401 without valid JWT
### Exit Criteria
All CRUD operations work correctly with proper status codes, validation, authentication, and ownership checks. Pagination prevents performance issues. Soft delete preserves data.### File Map
- src/routes/tasks.ts (CRUD endpoints)
- src/lib/schemas.ts (validation)## Phase 3: Tasks API 🔄
**Progress**:
- [x] GET /api/tasks endpoint (commit: abc123)
- [x] POST /api/tasks endpoint (commit: def456)
- [ ] PATCH /api/tasks/:id ← **CURRENT**
**Next Action**: Implement PATCH /api/tasks/:id in src/routes/tasks.ts:47, handle validation and ownership check
**Key Files** (from IMPLEMENTATION_PHASES.md file map):
- src/routes/tasks.ts
- src/lib/schemas.tsUser: "Add task endpoints"
Claude: [Reads 5-8 files via Glob/Grep to understand structure]
Claude: [Writes code in wrong location]
User: "That should be in routes/tasks.ts, not api/tasks.ts"
Claude: [Reads more files, rewrites code]User: "Add task endpoints"
Claude: [Reads IMPLEMENTATION_PHASES.md file map]
Claude: [Writes code in correct location on first try]create-cloudflare/docsUser: [Describes project]
↓
Skill: "I'll help structure this. A few questions..."
[Ask 3-5 targeted questions]
↓
User: [Answers]
↓
Skill: "Great! I'll generate:
- IMPLEMENTATION_PHASES.md
Should I also create DATABASE_SCHEMA.md? [Y/n]"
↓
User: [Confirms]
↓
Skill: ⚡ [Generates all confirmed docs immediately - this step is key!]
"Planning docs created in /docs:
- IMPLEMENTATION_PHASES.md (8 phases, ~15 hours)
- DATABASE_SCHEMA.md (4 tables)
Review these docs and let me know if any phases need adjustment.
When ready, we'll create SESSION.md and start Phase 1."I've structured your [Project Name] into [N] phases. Here's the planning documentation:
---
## IMPLEMENTATION_PHASES.md
[Full content of IMPLEMENTATION_PHASES.md]
---
## DATABASE_SCHEMA.md
[Full content of DATABASE_SCHEMA.md if generated]
---
[Additional docs if generated]
---
**Summary**:
- **Total Phases**: [N]
- **Estimated Duration**: [X hours] (~[Y minutes] human time)
- **Phases with Testing**: All phases include verification criteria
- **Deployment Strategy**: [When to deploy]
**Next Steps**:
1. Review these planning docs
2. Refine any phases that feel wrong
3. Create SESSION.md to track progress (I can do this using the `project-session-management` skill)
4. Start Phase 1 when ready
⭐ **Recommended**: Create SESSION.md now to track your progress through these phases. This makes it easy to resume work after context clears and ensures you never lose your place.
Would you like me to create SESSION.md from these phases?
Let me know if you'd like me to adjust any phases or add more detail anywhere!project-session-managementproject-session-management