About this skill
The `/code` skill is designed for comprehensive feature implementation within a codebase. It instructs an AI agent to adopt a 'senior-developer' persona to ensure high-quality, production-grade code. The process is thorough, starting with understanding the task and analyzing the existing codebase to ensure seamless integration. It then guides the agent through building the feature incrementally, from file skeleton and type definitions to the data layer, UI screens (handling all states), navigation, and edge cases. This skill ensures a complete, end-to-end implementation, including self-review for common issues like re-renders, error handling, accessibility, and type safety. It's particularly useful for development teams looking to automate significant portions of feature development while maintaining high standards and adhering to project conventions. By encapsulating a structured development process, `/code` allows developers to delegate the grunt work of feature creation, freeing them to focus on architecture, design, and complex problem-solving. It's a powerful tool for accelerating development cycles and ensuring consistency across projects by leveraging a predefined, high-quality development workflow.
Best use case
The primary use case for the `/code` skill is to delegate the end-to-end implementation of new features within an existing codebase. Developers, particularly those working on complex applications, benefit most by offloading the detailed coding, integration, and testing steps to an AI agent, ensuring adherence to best practices and project standards.
Implement features using the senior-developer agent
A fully implemented, production-grade feature with corresponding file paths, type definitions, and integration notes, ready for review and deployment.
Practical example
Example input
/code Implement the user profile screen, including API integration for fetching user data, local state management for edits, and navigation to settings. Reference the Figma design linked in the `design_spec.md`.
Example output
The `/code` skill has successfully implemented the user profile screen. Files created/modified: - `src/screens/ProfileScreen.tsx` - `src/api/userApi.ts` (added `fetchUserProfile`, `updateUserProfile`) - `src/store/profileStore.ts` - `src/navigation/AppNavigator.tsx` (added `Profile` route) Integration notes: Ensure `AuthToken` is passed to `userApi` calls. Loading, error, and empty states are handled. Deep link to `/profile` is configured.
When to use this skill
- Implementing a feature from an architect plan or detailed specification
- Building screens, hooks, API integration, and state management for a new feature
- Executing end-to-end feature work that touches multiple files and layers of the application
- Ensuring production-grade code implementation following best practices
When not to use this skill
- When the task is a single isolated unit, such as one screen or one hook, where `/feature` might be more appropriate
- For minor bug fixes or small refactorings that don't involve full feature implementation
- When a quick, minimal viable product (MVP) is needed without extensive error handling or edge case coverage
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/code/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How code Compares
| Feature / Agent | code | Standard Approach |
|---|---|---|
| Platform Support | Claude | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | easy | N/A |
Frequently Asked Questions
What does this skill do?
Implement features using the senior-developer agent
Which AI agents support this skill?
This skill is designed for Claude.
How difficult is it to install?
The installation complexity is rated as easy. You can find the installation instructions above.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
Related Guides
AI Agents for Coding
Browse AI agent skills for coding, debugging, testing, refactoring, code review, and developer workflows across Claude, Cursor, and Codex.
Best AI Skills for Claude
Explore the best AI skills for Claude and Claude Code across coding, research, workflow automation, documentation, and agent operations.
ChatGPT vs Claude for Agent Skills
Compare ChatGPT and Claude for AI agent skills across coding, writing, research, and reusable workflow execution.
SKILL.md Source
# /code — Feature Implementation You are executing the `/code` command. Use the **senior-developer** agent to implement production-grade feature code. ## Process 1. **Understand the task** — Read any existing architecture plan or feature description. If none exists, ask for scope and requirements. 2. **Analyze existing codebase** — Read relevant files, understand current patterns, state management, and navigation structure 3. **Implement end-to-end** — Using the senior-developer agent's process: - Set up the file skeleton and type definitions - Implement data layer first (API client, queries/mutations, stores) - Build screens with all states handled (loading, error, empty, success) - Wire navigation (route params, transitions, deep links) - Handle edge cases (offline, token expiry, race conditions) 4. **Self-review** — Check for re-renders, missing error handling, accessibility, type safety 5. **Deliver** — Complete implementation with file paths, type definitions, and integration notes ## When to Use - Implementing a feature from an architect plan - Building screens, hooks, API integration, and state management - End-to-end feature work that touches multiple files ## Notes - Reference the active platform rules layer for conventions - Follow the project's import ordering: react -> react-native -> expo -> external -> internal -> types - If the task is a single isolated unit (one screen, one hook), consider `/feature` instead
Related Skills
erne-perf
ERNE — Performance profiling and optimization using the performance-profiler agent
erne-code
ERNE — Implement features using the senior-developer agent
plan
This skill guides an AI agent to design detailed feature architectures for React Native and Expo applications, leveraging an `architect` agent for core design tasks.
laravel-expert
Senior Laravel Engineer role for production-grade, maintainable, and idiomatic Laravel solutions. Focuses on clean architecture, security, performance, and modern standards (Laravel 10/11+).
webmcp
This skill guides AI agents in implementing WebMCP within web projects, enabling browser-native structured tools for AI interaction using JavaScript or HTML APIs.
Prompt Coach
Analyze your Claude Code session logs to improve prompt quality, optimize tool usage, and enhance your skills as an AI-native engineer.
react
This AI agent skill guides the generation of modern React components, incorporating best practices such as destructured props, leveraging compiler optimizations, and proper use of React Effects. It also ensures compatibility and utilizes Tailwind CSS v4 syntax.
nextjs
Provides comprehensive Next.js routing capabilities, including typed routes, helpers for `PageProps` and `LayoutProps`, and `nuqs` for managing URL state.
just
Use `just` to save and run project-specific commands. Use when the user mentions `justfile`, `recipe`, or needs a simple alternative to `make` for task automation.
chrome-debug
This skill empowers AI agents to debug web applications and inspect browser behavior using the Chrome DevTools Protocol (CDP), offering both collaborative (headful) and automated (headless) modes.
worktree-manager
Create, manage, and cleanup git worktrees with Claude Code agents across all projects. USE THIS SKILL when user says "create worktree", "spin up worktrees", "new worktree for X", "worktree status", "cleanup worktrees", "sync worktrees", or wants parallel development branches. Also use when creating PRs from a worktree branch (to update registry with PR number). Handles worktree creation, dependency installation, validation, agent launching in Ghostty, and global registry management.
clearshot
Structured screenshot analysis for UI implementation and critique. Analyzes every UI screenshot with a 5×5 spatial grid, full element inventory, and design system extraction — facts and taste together, every time. Escalates to full implementation blueprint when building. Trigger on any digital interface image file (png, jpg, gif, webp — websites, apps, dashboards, mockups, wireframes) or commands like 'analyse this screenshot,' 'rebuild this,' 'match this design,' 'clone this.' Skip for non-UI images (photos, memes, charts) unless the user explicitly wants to build a UI from them. Does NOT trigger on HTML source code, CSS, SVGs, or any code pasted as text.