claude-code-templates 1.0.0

package/templates/javascript-typescript/CLAUDE.md

@@ -0,0 +1,185 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Project Overview
+
+This is a JavaScript/TypeScript project optimized for modern web development. The project uses industry-standard tools and follows best practices for scalable application development.
+
+## Development Commands
+
+### Package Management
+- `npm install` or `yarn install` - Install dependencies
+- `npm ci` or `yarn install --frozen-lockfile` - Install dependencies for CI/CD
+- `npm update` or `yarn upgrade` - Update dependencies
+
+### Build Commands
+- `npm run build` - Build the project for production
+- `npm run dev` or `npm start` - Start development server
+- `npm run preview` - Preview production build locally
+
+### Testing Commands
+- `npm test` or `npm run test` - Run all tests
+- `npm run test:watch` - Run tests in watch mode
+- `npm run test:coverage` - Run tests with coverage report
+- `npm run test:unit` - Run unit tests only
+- `npm run test:integration` - Run integration tests only
+- `npm run test:e2e` - Run end-to-end tests
+
+### Code Quality Commands
+- `npm run lint` - Run ESLint for code linting
+- `npm run lint:fix` - Run ESLint with auto-fix
+- `npm run format` - Format code with Prettier
+- `npm run format:check` - Check code formatting
+- `npm run typecheck` - Run TypeScript type checking
+
+### Development Tools
+- `npm run storybook` - Start Storybook (if available)
+- `npm run analyze` - Analyze bundle size
+- `npm run clean` - Clean build artifacts
+
+## Technology Stack
+
+### Core Technologies
+- **JavaScript/TypeScript** - Primary programming languages
+- **Node.js** - Runtime environment
+- **npm/yarn** - Package management
+
+### Common Frameworks
+- **React** - UI library with hooks and functional components
+- **Vue.js** - Progressive framework for building user interfaces
+- **Angular** - Full-featured framework for web applications
+- **Express.js** - Web application framework for Node.js
+- **Next.js** - React framework with SSR/SSG capabilities
+
+### Build Tools
+- **Vite** - Fast build tool and development server
+- **Webpack** - Module bundler
+- **Rollup** - Module bundler for libraries
+- **esbuild** - Extremely fast JavaScript bundler
+
+### Testing Framework
+- **Jest** - JavaScript testing framework
+- **Vitest** - Fast unit test framework
+- **Testing Library** - Simple and complete testing utilities
+- **Cypress** - End-to-end testing framework
+- **Playwright** - Cross-browser testing
+
+### Code Quality Tools
+- **ESLint** - JavaScript/TypeScript linter
+- **Prettier** - Code formatter
+- **TypeScript** - Static type checking
+- **Husky** - Git hooks
+
+## Project Structure Guidelines
+
+### File Organization
+```
+src/
+├── components/     # Reusable UI components
+├── pages/         # Page components or routes
+├── hooks/         # Custom React hooks
+├── utils/         # Utility functions
+├── services/      # API calls and external services
+├── types/         # TypeScript type definitions
+├── constants/     # Application constants
+├── styles/        # Global styles and themes
+└── tests/         # Test files
+```
+
+### Naming Conventions
+- **Files**: Use kebab-case for file names (`user-profile.component.ts`)
+- **Components**: Use PascalCase for component names (`UserProfile`)
+- **Functions**: Use camelCase for function names (`getUserData`)
+- **Constants**: Use UPPER_SNAKE_CASE for constants (`API_BASE_URL`)
+- **Types/Interfaces**: Use PascalCase with descriptive names (`UserData`, `ApiResponse`)
+
+## TypeScript Guidelines
+
+### Type Safety
+- Enable strict mode in `tsconfig.json`
+- Use explicit types for function parameters and return values
+- Prefer interfaces over types for object shapes
+- Use union types for multiple possible values
+- Avoid `any` type - use `unknown` when type is truly unknown
+
+### Best Practices
+- Use type guards for runtime type checking
+- Leverage utility types (`Partial`, `Pick`, `Omit`, etc.)
+- Create custom types for domain-specific data
+- Use enums for finite sets of values
+- Document complex types with JSDoc comments
+
+## Code Quality Standards
+
+### ESLint Configuration
+- Use recommended ESLint rules for JavaScript/TypeScript
+- Enable React-specific rules if using React
+- Configure import/export rules for consistent module usage
+- Set up accessibility rules for inclusive development
+
+### Prettier Configuration
+- Use consistent indentation (2 spaces recommended)
+- Set maximum line length (80-100 characters)
+- Use single quotes for strings
+- Add trailing commas for better git diffs
+
+### Testing Standards
+- Aim for 80%+ test coverage
+- Write unit tests for utilities and business logic
+- Use integration tests for component interactions
+- Implement e2e tests for critical user flows
+- Follow AAA pattern (Arrange, Act, Assert)
+
+## Performance Optimization
+
+### Bundle Optimization
+- Use code splitting for large applications
+- Implement lazy loading for routes and components
+- Optimize images and assets
+- Use tree shaking to eliminate dead code
+- Analyze bundle size regularly
+
+### Runtime Performance
+- Implement proper memoization (React.memo, useMemo, useCallback)
+- Use virtualization for large lists
+- Optimize re-renders in React applications
+- Implement proper error boundaries
+- Use web workers for heavy computations
+
+## Security Guidelines
+
+### Dependencies
+- Regularly audit dependencies with `npm audit`
+- Keep dependencies updated
+- Use lock files (`package-lock.json`, `yarn.lock`)
+- Avoid dependencies with known vulnerabilities
+
+### Code Security
+- Sanitize user inputs
+- Use HTTPS for API calls
+- Implement proper authentication and authorization
+- Store sensitive data securely (environment variables)
+- Use Content Security Policy (CSP) headers
+
+## Development Workflow
+
+### Before Starting
+1. Check Node.js version compatibility
+2. Install dependencies with `npm install`
+3. Copy environment variables from `.env.example`
+4. Run type checking with `npm run typecheck`
+
+### During Development
+1. Use TypeScript for type safety
+2. Run linter frequently to catch issues early
+3. Write tests for new features
+4. Use meaningful commit messages
+5. Review code changes before committing
+
+### Before Committing
+1. Run full test suite: `npm test`
+2. Check linting: `npm run lint`
+3. Verify formatting: `npm run format:check`
+4. Run type checking: `npm run typecheck`
+5. Test production build: `npm run build`

package/templates/javascript-typescript/README.md

@@ -0,0 +1,233 @@
+# JavaScript/TypeScript Claude Code Templates
+
+This template provides optimized Claude Code configurations for JavaScript and TypeScript development, including modern frameworks like React, Vue, Node.js, and more.
+
+## Quick Start
+
+### Installation
+Copy the template files to your JavaScript/TypeScript project:
+
+```bash
+# Copy all template files
+cp -r claude-code-templates/javascript-typescript/* your-project/
+
+# Or copy specific files
+cp claude-code-templates/javascript-typescript/CLAUDE.md your-project/
+cp -r claude-code-templates/javascript-typescript/.claude/ your-project/
+```
+
+### Usage
+Navigate to your project and start Claude Code:
+
+```bash
+cd your-project
+claude
+```
+
+Use the included custom commands:
+```bash
+# Run tests
+/test
+
+# Run linting
+/lint
+
+# Create React component
+/react-component
+
+# Debug application
+/debug
+```
+
+## What's Included
+
+### Core Configuration
+- **`CLAUDE.md`** - Comprehensive guidance for JavaScript/TypeScript development
+- **`.claude/settings.json`** - Optimized settings for JS/TS projects
+- **Custom Commands** - Pre-configured commands for common development tasks
+
+### Development Hooks
+- **`format-on-save.json`** - Automatically format code with Prettier
+- **`lint-on-save.json`** - Run ESLint on file changes
+- **`typescript-check.json`** - Verify TypeScript types on save
+
+### Custom Commands
+- **`test.md`** - Execute tests with Jest, Vitest, or other frameworks
+- **`lint.md`** - Run ESLint with customizable rules
+- **`debug.md`** - Debug Node.js applications and browser code
+- **`refactor.md`** - Refactor code with AI assistance
+- **`typescript-migrate.md`** - Migrate JavaScript files to TypeScript
+- **`npm-scripts.md`** - Manage and execute npm scripts
+- **`react-component.md`** - Generate React components with best practices
+- **`api-endpoint.md`** - Create API endpoints for Node.js applications
+
+### Project Examples
+- **React App** - Configuration for React applications
+- **Node.js API** - Configuration for backend API development
+
+## Framework-Specific Setup
+
+### React Projects
+```bash
+# Copy React-specific configuration
+cp -r claude-code-templates/javascript-typescript/examples/react-app/.claude/ your-react-app/
+```
+
+Additional commands for React:
+- `/component` - Create React components
+- `/hooks` - Generate custom React hooks
+
+### Node.js API Projects
+```bash
+# Copy Node.js-specific configuration
+cp -r claude-code-templates/javascript-typescript/examples/node-api/.claude/ your-api-project/
+```
+
+Additional commands for Node.js:
+- `/route` - Create API routes
+- `/middleware` - Generate middleware functions
+
+## Supported Tools and Frameworks
+
+### Package Managers
+- **npm** - Node Package Manager
+- **yarn** - Fast, reliable package manager
+- **pnpm** - Efficient package manager
+
+### Build Tools
+- **Vite** - Next generation frontend tooling
+- **Webpack** - Module bundler
+- **Rollup** - Module bundler for libraries
+- **esbuild** - Extremely fast JavaScript bundler
+
+### Testing Frameworks
+- **Jest** - JavaScript testing framework
+- **Vitest** - Fast unit test framework
+- **Testing Library** - Testing utilities
+- **Cypress** - End-to-end testing
+- **Playwright** - Cross-browser testing
+
+### Code Quality
+- **ESLint** - JavaScript/TypeScript linter
+- **Prettier** - Code formatter
+- **TypeScript** - Static type checking
+- **Husky** - Git hooks
+
+### Frontend Frameworks
+- **React** - UI library
+- **Vue.js** - Progressive framework
+- **Angular** - Full-featured framework
+- **Svelte** - Compile-time framework
+
+### Backend Frameworks
+- **Express.js** - Web framework for Node.js
+- **Fastify** - Fast and low overhead web framework
+- **Koa** - Lightweight web framework
+- **NestJS** - Progressive Node.js framework
+
+## Common Development Workflows
+
+### Setting Up a New Project
+1. Initialize project: `npm init` or `yarn init`
+2. Install dependencies: `npm install` or `yarn install`
+3. Copy Claude Code templates
+4. Configure ESLint and Prettier
+5. Set up testing framework
+6. Configure build tools
+
+### Daily Development
+1. Start development server: `npm run dev`
+2. Use Claude Code commands for common tasks
+3. Run tests: `/test`
+4. Format and lint code: `/lint`
+5. Debug issues: `/debug`
+
+### Code Quality Checks
+1. Type checking: `npm run typecheck`
+2. Linting: `npm run lint`
+3. Testing: `npm run test`
+4. Build verification: `npm run build`
+
+## Customization
+
+### Modifying Commands
+Edit files in `.claude/commands/` to customize commands for your workflow:
+
+```bash
+# Edit test command
+vim .claude/commands/test.md
+
+# Add new custom command
+echo "# My Custom Command" > .claude/commands/my-command.md
+```
+
+### Adjusting Settings
+Modify `.claude/settings.json` to match your project preferences:
+
+```json
+{
+  "language": "typescript",
+  "framework": "react",
+  "testFramework": "jest",
+  "packageManager": "npm"
+}
+```
+
+### Adding Hooks
+Create custom hooks in `.claude/hooks/` for automated tasks:
+
+```json
+{
+  "trigger": "on_file_save",
+  "pattern": "*.ts,*.tsx",
+  "command": "npm run typecheck"
+}
+```
+
+## Best Practices
+
+### Project Structure
+- Use clear, descriptive folder names
+- Separate concerns (components, utils, services)
+- Follow framework conventions
+- Keep configuration files in project root
+
+### Code Quality
+- Enable TypeScript strict mode
+- Use ESLint with recommended rules
+- Format code consistently with Prettier
+- Write comprehensive tests
+
+### Performance
+- Implement code splitting for large applications
+- Use lazy loading for routes and components
+- Optimize bundle size regularly
+- Monitor runtime performance
+
+## Troubleshooting
+
+### Common Issues
+- **TypeScript errors**: Run `npm run typecheck` to identify issues
+- **Linting failures**: Use `npm run lint:fix` to auto-fix issues
+- **Test failures**: Run tests in watch mode with `npm run test:watch`
+- **Build errors**: Check dependencies and configuration files
+
+### Getting Help
+- Check the main repository documentation
+- Review framework-specific guides
+- Use Claude Code's built-in help: `/help`
+- Consult community resources and documentation
+
+## Contributing
+
+Found ways to improve these templates? We welcome contributions:
+
+1. Fork the repository
+2. Create a feature branch
+3. Add your improvements
+4. Test with real projects
+5. Submit a pull request
+
+## License
+
+This template is part of the Claude Code Templates project and is licensed under the MIT License.

package/templates/javascript-typescript/examples/node-api/.claude/commands/middleware.md

@@ -0,0 +1 @@
+# Middleware Command

package/templates/javascript-typescript/examples/node-api/.claude/commands/route.md

@@ -0,0 +1 @@
+# API Route Command

package/templates/javascript-typescript/examples/node-api/CLAUDE.md

@@ -0,0 +1 @@
+# Node.js API CLAUDE.md

package/templates/javascript-typescript/examples/react-app/.claude/commands/component.md

@@ -0,0 +1 @@
+# React Component Command

package/templates/javascript-typescript/examples/react-app/.claude/commands/hooks.md

@@ -0,0 +1 @@
+# React Hooks Command

package/templates/javascript-typescript/examples/react-app/CLAUDE.md

@@ -0,0 +1 @@
+# React App CLAUDE.md

package/templates/python/CLAUDE.md

@@ -0,0 +1,276 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Project Overview
+
+This is a Python project optimized for modern Python development. The project uses industry-standard tools and follows best practices for scalable application development.
+
+## Development Commands
+
+### Environment Management
+- `python -m venv venv` - Create virtual environment
+- `source venv/bin/activate` (Linux/Mac) or `venv\Scripts\activate` (Windows) - Activate virtual environment
+- `deactivate` - Deactivate virtual environment
+- `pip install -r requirements.txt` - Install dependencies
+- `pip install -r requirements-dev.txt` - Install development dependencies
+
+### Package Management
+- `pip install <package>` - Install a package
+- `pip install -e .` - Install project in development mode
+- `pip freeze > requirements.txt` - Generate requirements file
+- `pip-tools compile requirements.in` - Compile requirements with pip-tools
+
+### Testing Commands
+- `pytest` - Run all tests
+- `pytest -v` - Run tests with verbose output
+- `pytest --cov` - Run tests with coverage report
+- `pytest --cov-report=html` - Generate HTML coverage report
+- `pytest -x` - Stop on first failure
+- `pytest -k "test_name"` - Run specific test by name
+- `python -m unittest` - Run tests with unittest
+
+### Code Quality Commands
+- `black .` - Format code with Black
+- `black --check .` - Check code formatting without changes
+- `isort .` - Sort imports
+- `isort --check-only .` - Check import sorting
+- `flake8` - Run linting with Flake8
+- `pylint src/` - Run linting with Pylint
+- `mypy src/` - Run type checking with MyPy
+
+### Development Tools
+- `python -m pip install --upgrade pip` - Upgrade pip
+- `python -c "import sys; print(sys.version)"` - Check Python version
+- `python -m site` - Show Python site information
+- `python -m pdb script.py` - Debug with pdb
+
+## Technology Stack
+
+### Core Technologies
+- **Python** - Primary programming language (3.8+)
+- **pip** - Package management
+- **venv** - Virtual environment management
+
+### Common Frameworks
+- **Django** - High-level web framework
+- **Flask** - Micro web framework
+- **FastAPI** - Modern API framework with automatic documentation
+- **SQLAlchemy** - SQL toolkit and ORM
+- **Pydantic** - Data validation using Python type hints
+
+### Data Science & ML
+- **NumPy** - Numerical computing
+- **Pandas** - Data manipulation and analysis
+- **Matplotlib/Seaborn** - Data visualization
+- **Scikit-learn** - Machine learning library
+- **TensorFlow/PyTorch** - Deep learning frameworks
+
+### Testing Frameworks
+- **pytest** - Testing framework
+- **unittest** - Built-in testing framework
+- **pytest-cov** - Coverage plugin for pytest
+- **factory-boy** - Test fixtures
+- **responses** - Mock HTTP requests
+
+### Code Quality Tools
+- **Black** - Code formatter
+- **isort** - Import sorter
+- **flake8** - Style guide enforcement
+- **pylint** - Code analysis
+- **mypy** - Static type checker
+- **pre-commit** - Git hooks framework
+
+## Project Structure Guidelines
+
+### File Organization
+```
+src/
+├── package_name/
+│   ├── __init__.py
+│   ├── main.py          # Application entry point
+│   ├── models/          # Data models
+│   ├── views/           # Web views (Django/Flask)
+│   ├── api/             # API endpoints
+│   ├── services/        # Business logic
+│   ├── utils/           # Utility functions
+│   └── config/          # Configuration files
+tests/
+├── __init__.py
+├── conftest.py          # pytest configuration
+├── test_models.py
+├── test_views.py
+└── test_utils.py
+requirements/
+├── base.txt            # Base requirements
+├── dev.txt             # Development requirements
+└── prod.txt            # Production requirements
+```
+
+### Naming Conventions
+- **Files/Modules**: Use snake_case (`user_profile.py`)
+- **Classes**: Use PascalCase (`UserProfile`)
+- **Functions/Variables**: Use snake_case (`get_user_data`)
+- **Constants**: Use UPPER_SNAKE_CASE (`API_BASE_URL`)
+- **Private methods**: Prefix with underscore (`_private_method`)
+
+## Python Guidelines
+
+### Type Hints
+- Use type hints for function parameters and return values
+- Import types from `typing` module when needed
+- Use `Optional` for nullable values
+- Use `Union` for multiple possible types
+- Document complex types with comments
+
+### Code Style
+- Follow PEP 8 style guide
+- Use meaningful variable and function names
+- Keep functions focused and single-purpose
+- Use docstrings for modules, classes, and functions
+- Limit line length to 88 characters (Black default)
+
+### Best Practices
+- Use list comprehensions for simple transformations
+- Prefer `pathlib` over `os.path` for file operations
+- Use context managers (`with` statements) for resource management
+- Handle exceptions appropriately with try/except blocks
+- Use `logging` module instead of print statements
+
+## Testing Standards
+
+### Test Structure
+- Organize tests to mirror source code structure
+- Use descriptive test names that explain the behavior
+- Follow AAA pattern (Arrange, Act, Assert)
+- Use fixtures for common test data
+- Group related tests in classes
+
+### Coverage Goals
+- Aim for 90%+ test coverage
+- Write unit tests for business logic
+- Use integration tests for external dependencies
+- Mock external services in tests
+- Test error conditions and edge cases
+
+### pytest Configuration
+```python
+# pytest.ini or pyproject.toml
+[tool.pytest.ini_options]
+testpaths = ["tests"]
+python_files = ["test_*.py", "*_test.py"]
+python_classes = ["Test*"]
+python_functions = ["test_*"]
+addopts = "--cov=src --cov-report=term-missing"
+```
+
+## Virtual Environment Setup
+
+### Creation and Activation
+```bash
+# Create virtual environment
+python -m venv venv
+
+# Activate (Linux/Mac)
+source venv/bin/activate
+
+# Activate (Windows)
+venv\Scripts\activate
+
+# Install dependencies
+pip install -r requirements.txt
+pip install -r requirements-dev.txt
+```
+
+### Requirements Management
+- Use `requirements.txt` for production dependencies
+- Use `requirements-dev.txt` for development dependencies
+- Consider using `pip-tools` for dependency resolution
+- Pin versions for reproducible builds
+
+## Django-Specific Guidelines
+
+### Project Structure
+```
+project_name/
+├── manage.py
+├── project_name/
+│   ├── __init__.py
+│   ├── settings/
+│   ├── urls.py
+│   └── wsgi.py
+├── apps/
+│   ├── users/
+│   ├── products/
+│   └── orders/
+└── requirements/
+```
+
+### Common Commands
+- `python manage.py runserver` - Start development server
+- `python manage.py migrate` - Apply database migrations
+- `python manage.py makemigrations` - Create new migrations
+- `python manage.py createsuperuser` - Create admin user
+- `python manage.py collectstatic` - Collect static files
+- `python manage.py test` - Run Django tests
+
+## FastAPI-Specific Guidelines
+
+### Project Structure
+```
+src/
+├── main.py              # FastAPI application
+├── api/
+│   ├── __init__.py
+│   ├── dependencies.py  # Dependency injection
+│   └── v1/
+│       ├── __init__.py
+│       └── endpoints/
+├── core/
+│   ├── __init__.py
+│   ├── config.py       # Settings
+│   └── security.py    # Authentication
+├── models/
+├── schemas/            # Pydantic models
+└── services/
+```
+
+### Common Commands
+- `uvicorn main:app --reload` - Start development server
+- `uvicorn main:app --host 0.0.0.0 --port 8000` - Start production server
+
+## Security Guidelines
+
+### Dependencies
+- Regularly update dependencies with `pip list --outdated`
+- Use `safety` package to check for known vulnerabilities
+- Pin dependency versions in requirements files
+- Use virtual environments to isolate dependencies
+
+### Code Security
+- Validate input data with Pydantic or similar
+- Use environment variables for sensitive configuration
+- Implement proper authentication and authorization
+- Sanitize data before database operations
+- Use HTTPS for production deployments
+
+## Development Workflow
+
+### Before Starting
+1. Check Python version compatibility
+2. Create and activate virtual environment
+3. Install dependencies from requirements files
+4. Run type checking with `mypy`
+
+### During Development
+1. Use type hints for better code documentation
+2. Run tests frequently to catch issues early
+3. Use meaningful commit messages
+4. Format code with Black before committing
+
+### Before Committing
+1. Run full test suite: `pytest`
+2. Check code formatting: `black --check .`
+3. Sort imports: `isort --check-only .`
+4. Run linting: `flake8`
+5. Run type checking: `mypy src/`