330 lines
8.8 KiB
Markdown
330 lines
8.8 KiB
Markdown
---
|
|
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
|
|
```
|