Initial commit

2025-11-30 09:03:24 +08:00
commit c431765352
13 changed files with 1442 additions and 0 deletions
--- a/commands/create-tech-stack.md
+++ b/commands/create-tech-stack.md
@@ -0,0 +1,329 @@
+---
+allowed-tools: Read, Glob, Grep, Write, MultiEdit, TodoWrite, Bash
+description: Generate comprehensive technical stack documentation from codebase analysis
+---
+
+# Generate Tech Stack Documentation
+
+**User Request:** $ARGUMENTS
+
+## Context
+
+- Project root: !`pwd`
+- Package.json: @package.json
+- Node version: !`node --version 2>/dev/null || echo "Node.js not found"`
+- TypeScript config: @tsconfig.json
+- Database schema: !`ls -la prisma/schema.prisma 2>/dev/null || echo "No Prisma schema found"`
+- Existing docs: !`ls -la .claude/rules/*.md 2>/dev/null || echo "No docs yet"`
+
+## Goal
+
+Create comprehensive Tech Stack Documentation based on deep codebase analysis. Document all technologies, frameworks, libraries, development tools, deployment strategies, and implementation patterns with specific versions and configurations.
+
+## Process
+
+### 1. Automated Technical Discovery
+
+- Parse package.json for all dependencies
+- Analyze configuration files (tsconfig, vite.config, next.config, etc.)
+- Detect database setup (Prisma, Drizzle, TypeORM, etc.)
+- Identify testing frameworks and tools
+- Scan for CI/CD configurations
+- Check deployment configurations
+
+### 2. Deep Code Analysis
+
+Examine codebase for:
+
+- **Architecture Patterns:** Monorepo structure, module organization
+- **Framework Usage:** Next.js app router vs pages, API routes
+- **State Management:** Zustand, Redux, Context API patterns
+- **Styling Approach:** Tailwind, CSS modules, styled-components
+- **Type Safety:** TypeScript strictness, validation libraries
+- **API Design:** REST, GraphQL, tRPC implementation
+- **Authentication:** Auth libraries and session management
+- **Testing Strategy:** Unit, integration, E2E test patterns
+
+### 3. Interactive Technical Q&A
+
+Ask 4-6 deployment and infrastructure questions:
+
+- Use numbered/lettered options
+- Focus on non-discoverable information
+- Gather hosting, monitoring, and workflow details
+
+### 4. Generate Comprehensive Documentation
+
+Create detailed tech stack document with:
+
+- Specific version numbers
+- Configuration examples
+- Command references
+- Architecture diagrams (when applicable)
+
+### 5. Save and Organize
+
+- Create `.claude/rules/` if needed
+- Save as `2-tech-stack.mdc`
+
+## Technical Questions Template
+
+### 🚀 Deployment & Infrastructure
+
+**1. Where is your application currently deployed?**
+
+a) **Vercel** - Next.js optimized hosting  
+ b) **AWS** - EC2, Lambda, or containerized  
+ c) **Railway/Render** - Modern PaaS providers  
+ d) **Self-hosted** - VPS or on-premise  
+ e) **Other** - Please specify  
+ f) **Not deployed yet** - Still in development
+
+**2. How is your database hosted?**
+
+a) **Managed service** (Supabase, PlanetScale, Neon, etc.)  
+ b) **Cloud provider** (AWS RDS, Google Cloud SQL, etc.)  
+ c) **Self-hosted** (Docker, VPS, etc.)  
+ d) **Local only** - No production database yet
+
+### 📊 Monitoring & Operations
+
+**3. What observability tools do you use?**
+
+a) **Error tracking:** Sentry, Rollbar, Bugsnag  
+ b) **Analytics:** Vercel Analytics, Google Analytics, Plausible  
+ c) **Monitoring:** Datadog, New Relic, custom solution  
+ d) **Logging:** CloudWatch, LogTail, custom logs  
+ e) **None yet** - Planning to add later
+
+### 👥 Development Workflow
+
+**4. What's your Git workflow?**
+
+a) **Feature branches** with PR reviews  
+ b) **Trunk-based** development  
+ c) **GitFlow** with release branches  
+ d) **Direct to main** (solo project)
+
+**5. How do you manage environments?**
+
+a) **Multiple deployments** (dev, staging, prod)  
+ b) **Preview deployments** for PRs  
+ c) **Single production** environment  
+ d) **Local development** only
+
+### 🔐 Additional Services
+
+**6. Which external services do you integrate with?**
+
+- [ ] Payment processing (Stripe, PayPal)
+- [ ] Email service (SendGrid, Resend, AWS SES)
+- [ ] File storage (S3, Cloudinary, UploadThing)
+- [ ] Authentication (Auth0, Clerk, Supabase Auth)
+- [ ] Search (Algolia, Elasticsearch)
+- [ ] Other APIs (please specify)
+
+## Document Structure
+
+The generated document must follow this technical structure:
+
+### **Overview**
+
+- Brief description of the application's technical nature
+- Technology stack summary
+- Architecture approach (monolith, microservices, etc.)
+
+### **Programming Language & Runtime**
+
+- Primary programming language and version
+- Runtime environment and version
+- Type system and language features used
+
+### **Frontend**
+
+- UI Framework/Library and version
+- Styling approach and frameworks
+- Component libraries and design systems
+- State management solutions
+- Build tools and bundlers
+- Browser support and compatibility
+
+### **Backend**
+
+- Backend framework and architecture
+- API design (REST, GraphQL, tRPC, etc.)
+- Authentication and authorization
+- Middleware and security
+- File handling and uploads
+
+### **Database & Storage**
+
+- Database type and version
+- ORM/Query builder
+- Schema management and migrations
+- Caching solutions
+- File storage solutions
+- Data backup and recovery
+
+### **Development Tools & Workflow**
+
+- Package manager
+- Code formatting and linting
+- Type checking and compilation
+- Testing frameworks and strategies
+- Development server and hot reload
+- Version control workflow
+
+### **Deployment & Infrastructure**
+
+- Hosting platform and services
+- Build and deployment pipeline
+- Environment configuration
+- Domain and DNS management
+- SSL/TLS and security
+- Monitoring and logging
+
+### **External Integrations**
+
+- Third-party APIs and services
+- Payment processing
+- Email services
+- Analytics and tracking
+- Error monitoring
+- Performance monitoring
+
+### **Quality Assurance & Testing**
+
+- Testing strategy and frameworks
+- Code coverage tools
+- End-to-end testing
+- Performance testing
+- Security testing
+- Code review process
+
+### **Schemas & Data Models**
+
+- Database schema (if applicable)
+- API schemas and validation
+- Type definitions and interfaces
+- Data relationships and constraints
+
+## Target Audience
+
+The document should serve:
+
+- **Developers** joining the project who need technical onboarding
+- **DevOps engineers** setting up infrastructure and deployment
+- **Technical architects** evaluating or improving the tech stack
+- **Security teams** understanding the technical landscape
+- **Future maintainers** who need to understand technical decisions
+
+The language should be technical, precise, and include specific version numbers and configuration details.
+
+## Documentation Principles
+
+### DO Include:
+
+- **Exact Versions:** Lock file versions, not just ranges
+- **Configuration Examples:** Actual config snippets from the project
+- **Command Reference:** All npm scripts and their purposes
+- **Setup Instructions:** Step-by-step for new developers
+- **Architecture Decisions:** Why specific technologies were chosen
+- **Integration Details:** How services connect and communicate
+
+### DON'T Include:
+
+- **Generic Descriptions:** Avoid Wikipedia-style explanations
+- **Outdated Information:** Only document what's actually used
+- **Wishful Thinking:** Document current state, not future plans
+- **Sensitive Data:** No API keys, secrets, or credentials
+- **Redundant Info:** Link to official docs instead of copying
+
+## Output
+
+- **Format:** Markdown (`.mdc`)
+- **Location:** `.claude/rules/`
+- **Filename:** `2-tech-stack.mdc`
+
+## Execution Steps
+
+### 1. Automated Analysis Phase
+
+```bash
+# Extract key technical information
+- Read package.json and lock files
+- Scan for configuration files
+- Detect framework patterns
+- Identify database setup
+- Find test configurations
+```
+
+### 2. Manual Discovery Phase
+
+- Read key source files to understand architecture
+- Check for API route patterns
+- Analyze authentication implementation
+- Review deployment configurations
+
+### 3. Interactive Q&A
+
+- Present deployment and infrastructure questions
+- Use checkboxes for multi-select options
+- Wait for user responses
+
+### 4. Document Generation
+
+- Start with discovered information
+- Incorporate user responses
+- Add specific configuration examples
+- Include all npm scripts with descriptions
+
+### 5. Save and Update
+
+```bash
+# Create directory and save
+mkdir -p .claude/docs
+# Save to .claude/rules/2-tech-stack.mdc
+```
+
+### 6. Next Steps
+
+- Recommend: "Should I create an app design document to complement this technical documentation?"
+
+## Example Usage
+
+```bash
+# Basic usage
+/project:create-tech-stack
+
+# With specific focus
+/project:create-tech-stack Focus on deployment and CI/CD setup
+```
+
+## Sample Output Structure
+
+```markdown
+# Tech Stack Documentation
+
+## Overview
+
+- **Framework:** Next.js 14.2.5 (App Router)
+- **Language:** TypeScript 5.5.3
+- **Database:** PostgreSQL with Prisma ORM
+- **Deployment:** Vercel with preview deployments
+
+## Commands Reference
+
+### Development
+
+- `pnpm dev` - Start Next.js dev server on port 3000
+- `pnpm build` - Build production bundle
+- `pnpm typecheck` - Run tsc --noEmit
+
+### Database
+
+- `pnpm db:generate` - Generate Prisma client
+- `pnpm db:push` - Push schema changes to database
+
+# ... continue with full documentation
+```