Starter Project

Starter Project Generator

Tip: For a full app launch workflow with staged build plans and agent team assignments, use /launch-app instead. This skill is for quick scaffolding without detailed planning.

Instructions

IMPORTANT: Execute immediately. If the user provided a category argument, start building. If not, ask the user to choose a template using AskUserQuestion - do NOT print a menu and wait.

Parse arguments:

• $1 = category: saas, api, components, cli, ecommerce, game
• $2 = project name (if not provided, ask the user)

If no category was provided, use AskUserQuestion to ask which template they want:

• SaaS Web App - Full-stack Next.js with auth and dashboard
• API Service - Node.js REST API with testing
• Component Library - React components with Storybook
• CLI Tool - Command-line application
• E-Commerce Store - Next.js store with Stripe integration
• Browser Game - Canvas/Phaser game

Once you have category and name, proceed immediately to Step 1.

Step 1: Set Up Template Configuration

Based on the category, determine tech stack and which agents to copy:

Step 2: Select CLAUDE.md Template

Map category to template file:

• saas/ecommerce → templates/claude-md/nextjs-app.md
• api → templates/claude-md/api-service.md
• components → templates/claude-md/node-library.md
• cli → templates/claude-md/cli-tool.md
• game → templates/claude-md/game-browser.md

Step 3: Create Project Directory

PROJECT_NAME=$(echo "$PROJECT_NAME" | tr '[:upper:]' '[:lower:]' | tr '_' '-' | tr ' ' '-')
TARGET_DIR="../$PROJECT_NAME"

if [ -d "$TARGET_DIR" ]; then
  echo "❌ Directory already exists: $TARGET_DIR"
  exit 1
fi

mkdir -p "$TARGET_DIR"
cd "$TARGET_DIR" || exit 1
git init -q
echo "✓ Created project directory and initialized git"

Step 4: Copy Agents and Skills

Copy agents from ~/.claude/agents/ to .claude/agents/ based on the agent list for this category (from Step 1).

Copy these workflow skills from ~/.claude/skills/ to .claude/skills/:

• Core: ship, verify-work, organize-commits, track-progress
• Development: create-plan, plan-status, generate-tests, performance-check
• Git: worktree-create, worktree-sync, worktree-cleanup

Step 5: Phase 1 - Setup & Planning

1. Create plans/active directory

2. Invoke /create-plan using the Skill tool with name "getting-started" and template "guide"

3. Use the Task tool to invoke architecture-planner agent: "Design a [TEMPLATE_NAME] project called [PROJECT_NAME] with tech stack: [TECH_STACK]. Include: project structure, data models (if applicable), API endpoints, component hierarchy"

Step 6: Phase 2 - Design

Invoke both agents in parallel using the Task tool in a single message:

1. ui-ux-designer - "Create a design system for [PROJECT_NAME] ([TEMPLATE_NAME]) with: professional color palette (not AI-generic), typography scale, spacing system, component designs for Button/Input/Card, layout structure appropriate for [TEMPLATE_NAME]"

2. feature-planner - "Plan the initial features for [PROJECT_NAME] ([TEMPLATE_NAME]). Break down into small tasks for the getting-started plan. Map each task to the appropriate agent"

Step 7: Phase 3 - Implementation

1. Generate base configuration files (package.json, tsconfig.json, etc.) based on the category

2. Create CLAUDE.md from the template selected in Step 2:

   • Copy template, replace placeholders ([Project Name], etc.) with actual values
   • Fill in tech stack, update project structure, add category-specific patterns
   • Follow quality standards from docs/best-practices/claude-md-authoring.md

3. Use the Task tool to invoke api-developer agent: "Create initial API endpoints for [PROJECT_NAME]: health check at /api/health, auth endpoints (if applicable), one CRUD resource, include Zod validation and error handling"

4. Use the Task tool to invoke component-builder agent: "Build UI components for [PROJECT_NAME]: apply the design system, include TypeScript props, add accessibility features, create loading/error states, build Button/Input/Card and layout components"

Step 8: Phase 4 - Testing & Quality

1. Use the Task tool to invoke test-writer agent: "Create comprehensive tests for [PROJECT_NAME]: API endpoint tests, UI component tests, utility tests"

2. Invoke /generate-tests using the Skill tool to fill any remaining coverage gaps

3. Invoke both in parallel using the Skill tool in a single message:

   • /verify-work - validate code quality and security
   • /performance-check - identify performance issues

Fix any blocking issues found.

Step 9: Phase 5 - Verification

Invoke three agents in parallel using the Task tool in a single message:

1. codebase-explorer - verify project structure matches the architecture design
2. dependency-analyzer - validate all dependencies are correct
3. pattern-finder - ensure code patterns are consistent

Step 10: Phase 6 - Ship

1. Invoke /organize-commits using the Skill tool to create logical commit history:

   • chore: initial project setup
   • feat(db): add database schema (if applicable)
   • feat(api): add API endpoints
   • feat(ui): add design system and components
   • test: add comprehensive test coverage
   • docs: add CLAUDE.md and README

2. Invoke /track-progress using the Skill tool to record the generation

Step 11: Display Results

echo "================================================================"
echo "✅ Successfully created [TEMPLATE_NAME]: [PROJECT_NAME]"
echo "================================================================"
echo ""
echo "📁 Location: $TARGET_DIR"
echo "📋 Getting-started plan: plans/active/getting-started/plan.md"
echo ""
echo "🎯 Agents used: architecture-planner, ui-ux-designer, api-developer,"
echo "   component-builder, test-writer, codebase-explorer, dependency-analyzer,"
echo "   pattern-finder, feature-planner"
echo ""
echo "Next steps:"
echo "  1. cd ../$PROJECT_NAME"
echo "  2. npm install"
echo "  3. npm run dev"
echo ""
echo "💡 Commands:"
echo "   /plan-status    - View your getting-started plan"
echo "   /worktree-create - Parallel feature development"
echo "   /ship           - End-of-session workflow"

Template Reference

What Gets Created

All projects include:

• CLAUDE.md - Generated from template following best practices
• .claude/agents/ - Relevant agents for the project type
• .claude/skills/ - Development workflow skills
• plans/active/getting-started/ - Initial development plan
• README.md - Setup and development instructions
• Git repository - Initialized with logical commit history

Tips

• Choose the right template: Match your project type to get relevant agents
• Review the plan: Each template includes suggested first features
• Explore the agents: Check .claude/agents/ to see what's available
• Use the skills: Workflow skills help maintain code quality
• Customize freely: The generated project is yours to modify