Skill

Official

Review

Audit score 70

breakdown-feature-implementation

github/awesome-copilot

Generate detailed feature implementation plans aligned with Epoch monorepo structure and SaaS best practices.

What is breakdown-feature-implementation?

This skill prompts an AI agent to act as a senior software engineer and create comprehensive technical implementation plans for features based on a Feature PRD. It outputs structured Markdown documents with system architecture, database design, API specifications, and frontend component hierarchies following Epoch's monorepo conventions.

Generates detailed implementation plans in Markdown format with clear goal, requirements, and technical considerations
Creates system architecture diagrams using Mermaid showing frontend, API, business logic, data, and infrastructure layers
Produces entity-relationship diagrams for database schema design with table specifications and indexing strategies
Defines complete API specifications including tRPC endpoints, request/response formats, authentication, and error handling
Documents frontend component hierarchies using shadcn/ui with state management patterns and TypeScript types
Organizes output following Epoch monorepo structure (apps/, services/, packages/) with standardized file paths

How to install breakdown-feature-implementation

npx skills add https://github.com/github/awesome-copilot --skill breakdown-feature-implementation

Prerequisites

A completed Feature PRD (Product Requirements Document) in Markdown format
Familiarity with Epoch monorepo structure and conventions
Understanding of your tech stack (tRPC, Stack Auth, shadcn/ui, Zustand/React Query)

Claude Code

Cursor

Windsurf

Cline

How to use breakdown-feature-implementation

1.Prepare your Feature PRD document with clear goals, requirements, and acceptance criteria
2.Invoke the skill with the Feature PRD content as context
3.Review the generated implementation plan for completeness and accuracy
4.Use the Mermaid diagrams to validate system architecture and data model with your team
5.Extract specific sections (API specs, component hierarchy, database schema) for handoff to respective teams
6.Save the generated plan to /docs/ways-of-work/plan/{epic-name}/{feature-name}/implementation-plan.md

Use cases

Good for

Planning implementation for a new SaaS feature when you have a Feature PRD and need a detailed technical roadmap
Designing database schemas and API contracts before development begins on a large-scale feature
Creating architecture documentation that aligns frontend and backend teams on integration points and data flows
Generating component hierarchies and state management patterns for React applications using shadcn/ui
Establishing deployment and scalability strategies for features in containerized environments

Who it's for

Senior engineers and tech leads planning feature implementations
Teams using Epoch monorepo structure for SaaS applications
Development teams needing architecture documentation before coding begins
Product and engineering teams collaborating on Feature PRDs

breakdown-feature-implementation FAQ

What should I include in the Feature PRD for best results?

Include feature goals (3-5 sentences), detailed requirements as a bulleted list, acceptance criteria, and any specific constraints or integrations needed. The more context provided, the more comprehensive the implementation plan.

Does this skill write production code?

No. The skill generates pseudocode only for technical explanations and focuses on planning, architecture, and specifications. Actual implementation code is left to developers.

Can I customize the output format or monorepo structure?

The skill is designed for Epoch monorepo structure specifically. For different structures, you may need to adapt the output paths and folder conventions to match your organization.

What if my tech stack differs from the documented one (tRPC, shadcn/ui, etc.)?

The skill can be adapted, but it's optimized for the Epoch stack. You may need to provide additional context about your specific technologies for accurate recommendations.

How detailed are the generated diagrams?

Diagrams are comprehensive and include all major layers (frontend, API, business logic, data, infrastructure) with labeled data flows, but you may need to add implementation-specific details based on your actual codebase.

Full instructions (SKILL.md)

Source of truth, from github/awesome-copilot.

name: breakdown-feature-implementation description: 'Prompt for creating detailed feature implementation plans, following Epoch monorepo structure.'

Feature Implementation Plan Prompt

Goal

Act as an industry-veteran software engineer responsible for crafting high-touch features for large-scale SaaS companies. Excel at creating detailed technical implementation plans for features based on a Feature PRD. Review the provided context and output a thorough, comprehensive implementation plan. Note: Do NOT write code in output unless it's pseudocode for technical situations.

Output Format

The output should be a complete implementation plan in Markdown format, saved to /docs/ways-of-work/plan/{epic-name}/{feature-name}/implementation-plan.md.

File System

Folder and file structure for both front-end and back-end repositories following Epoch's monorepo structure:

apps/
  [app-name]/
services/
  [service-name]/
packages/
  [package-name]/

Implementation Plan

For each feature:

Goal

Feature goal described (3-5 sentences)

Requirements

Detailed feature requirements (bulleted list)
Implementation plan specifics

Technical Considerations

System Architecture Overview

Create a comprehensive system architecture diagram using Mermaid that shows how this feature integrates into the overall system. The diagram should include:

Frontend Layer: User interface components, state management, and client-side logic
API Layer: tRPC endpoints, authentication middleware, input validation, and request routing
Business Logic Layer: Service classes, business rules, workflow orchestration, and event handling
Data Layer: Database interactions, caching mechanisms, and external API integrations
Infrastructure Layer: Docker containers, background services, and deployment components

Use subgraphs to organize these layers clearly. Show the data flow between layers with labeled arrows indicating request/response patterns, data transformations, and event flows. Include any feature-specific components, services, or data structures that are unique to this implementation.

Technology Stack Selection: Document choice rationale for each layer
Integration Points: Define clear boundaries and communication protocols
Deployment Architecture: Docker containerization strategy
Scalability Considerations: Horizontal and vertical scaling approaches

Database Schema Design

Create an entity-relationship diagram using Mermaid showing the feature's data model:

Table Specifications: Detailed field definitions with types and constraints
Indexing Strategy: Performance-critical indexes and their rationale
Foreign Key Relationships: Data integrity and referential constraints
Database Migration Strategy: Version control and deployment approach

API Design

Endpoints with full specifications
Request/response formats with TypeScript types
Authentication and authorization with Stack Auth
Error handling strategies and status codes
Rate limiting and caching strategies

Frontend Architecture

Component Hierarchy Documentation

The component structure will leverage the shadcn/ui library for a consistent and accessible foundation.

Layout Structure:

Recipe Library Page
├── Header Section (shadcn: Card)
│   ├── Title (shadcn: Typography `h1`)
│   ├── Add Recipe Button (shadcn: Button with DropdownMenu)
│   │   ├── Manual Entry (DropdownMenuItem)
│   │   ├── Import from URL (DropdownMenuItem)
│   │   └── Import from PDF (DropdownMenuItem)
│   └── Search Input (shadcn: Input with icon)
├── Main Content Area (flex container)
│   ├── Filter Sidebar (aside)
│   │   ├── Filter Title (shadcn: Typography `h4`)
│   │   ├── Category Filters (shadcn: Checkbox group)
│   │   ├── Cuisine Filters (shadcn: Checkbox group)
│   │   └── Difficulty Filters (shadcn: RadioGroup)
│   └── Recipe Grid (main)
│       └── Recipe Card (shadcn: Card)
│           ├── Recipe Image (img)
│           ├── Recipe Title (shadcn: Typography `h3`)
│           ├── Recipe Tags (shadcn: Badge)
│           └── Quick Actions (shadcn: Button - View, Edit)