# Code Generation

> Framework-agnostic code generation templates for 20+ frameworks. Use when generating code for any detected framework or stack.

- Skill: `vanman2024/code-generation` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add vanman2024/code-generation`
- Raw SKILL.md: https://api.skillmd.com/api/skills/vanman2024/code-generation/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: vanman2024 (https://skillmd.com/u/vanman2024)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/vanman2024/code-generation

---


# Code Generation Skill

## Instructions

1. **Detect Project Framework**:
   - Read `.claude/project.json` to identify framework and stack
   - Check package.json, requirements.txt, go.mod, Cargo.toml, etc.
   - Identify language version and dependencies

2. **Select Appropriate Template**:
   - Match detected framework to template library
   - Choose template based on code type (component, API, model, etc.)
   - Adapt template to project conventions

3. **Generate Code**:
   - Load template from templates/ directory
   - Replace placeholders with actual values
   - Apply project-specific conventions (naming, structure)
   - Include proper imports and dependencies
   - Add type annotations if using TypeScript/typed languages

4. **Validate Generated Code**:
   - Check syntax correctness
   - Verify imports are valid
   - Ensure follows project patterns
   - Add linting fixes if needed

## Supported Frameworks

### Frontend
- React (JS/TS) - JSX components, hooks, context
- Vue (2/3) - SFC templates, composition API
- Svelte - Svelte components, stores
- Angular - Components, services, modules
- Solid.js - JSX components, signals
- Qwik - Qwik components, resumability

### Backend
- Node.js (Express, Fastify, Koa, NestJS)
- Python (Django, Flask, FastAPI, Pyramid)
- Go (Gin, Echo, Chi, Fiber)
- Rust (Actix, Rocket, Axum)
- Ruby (Rails, Sinatra)
- PHP (Laravel, Symfony)
- Java (Spring Boot)
- C# (.NET, ASP.NET Core)

### Databases/ORMs
- Prisma, TypeORM, Sequelize (Node.js)
- SQLAlchemy, Django ORM, Tortoise (Python)
- GORM (Go)
- Diesel (Rust)
- ActiveRecord (Ruby)
- Eloquent (PHP)

## Examples

**Example 1: React Component Generation**
```
Framework: React + TypeScript
Template: templates/react-ts-component.template
Output: Button.tsx with props, TypeScript types, and styles
```

**Example 2: FastAPI Endpoint**
```
Framework: Python + FastAPI
Template: templates/fastapi-endpoint.template
Output: router with Pydantic models and async handlers
```

**Example 3: Go API Handler**
```
Framework: Go + Gin
Template: templates/go-gin-handler.template
Output: handler function with request/response structs
```

## Template Variables

All templates support these variables:
- `{{NAME}}` - Component/function/class name
- `{{DESCRIPTION}}` - Purpose description
- `{{PROPS}}` - Properties/parameters
- `{{IMPORTS}}` - Required imports
- `{{TYPES}}` - Type definitions
- `{{METHODS}}` - Methods/functions
- `{{TESTS}}` - Test cases

## Best Practices

- **Never hardcode frameworks** - Always detect from project.json
- **Match existing patterns** - Analyze similar files in project
- **Use project conventions** - Follow naming, structure, imports
- **Include types** - Add TypeScript/type hints when applicable
- **Generate tests** - Include test file alongside implementation
- **Add documentation** - Include JSDoc/docstrings

## Template Locations

- Frontend components: `templates/frontend/`
- Backend APIs: `templates/backend/`
- Database models: `templates/database/`
- Tests: `templates/tests/`
- Configuration: `templates/config/`

---

**Purpose**: Universal code generation for any framework
**Used by**: feature-builder, frontend-generator, backend-generator agents