mcpField
B
breakdown-feature-implementation

breakdown-feature-implementation

github.com/github开发40.5k9.2k 次安装1 天前更新
代码仓库

关于 breakdown-feature-implementation

此提示词技能根据功能 PRD 生成详细的 Markdown 技术实施计划,涵盖架构、数据、API 和前端设计,适用于规划大型 SaaS 功能的软件团队。

主要功能

  1. 01基于 PRD 制定实施计划
  2. 02使用 Mermaid 绘制架构与数据图
  3. 03规划 API 与数据库设计
  4. 04规划前端组件和状态管理
  5. 05考虑安全与性能

适用场景

  1. 01在开发前规划系统架构
  2. 02记录 API 和数据库变更
  3. 03拆解前端实施工作

安装

复制下面的命令,在终端中运行。

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

安装后在 Claude Code 中输入/breakdown-feature-implementation确认已加载。

详细介绍

功能实现计划提示词

目标

扮演一位资深软件工程师,负责为大型 SaaS 公司打造高触达的功能。擅长根据功能 PRD 为功能创建详细的技术实现计划。 审阅提供的上下文,并输出一份详尽、全面的实现计划。 注意: 除非是用于技术场景的伪代码,否则不要在输出中编写代码。

输出格式

输出应为一份完整的 Markdown 格式实现计划,保存至 /docs/ways-of-work/plan/{epic-name}/{feature-name}/implementation-plan.md。

文件系统

遵循 Epoch 的单体仓库结构的前端与后端仓库文件夹和文件结构:

apps/
  [app-name]/
services/
  [service-name]/
packages/
  [package-name]/
实现计划

对每个功能:

目标

描述功能目标(3-5 句话)

需求
  • 详细的功能需求(项目符号列表)
  • 实现计划的具体细节
技术考量
系统架构概览

使用 Mermaid 创建一份全面的系统架构图,展示此功能如何集成到整体系统中。该图应包含:

  • 前端层:用户界面组件、状态管理以及客户端逻辑
  • API 层:tRPC 端点、认证中间件、输入验证以及请求路由
  • 业务逻辑层:服务类、业务规则、工作流编排以及事件处理
  • 数据层:数据库交互、缓存机制以及外部 API 集成
  • 基础设施层:Docker 容器、后台服务以及部署组件

使用子图清晰地组织这些层。用带标签的箭头展示各层之间的数据流,标明请求/响应模式、数据转换以及事件流。包含此实现所特有的任何功能专属组件、服务或数据结构。

  • 技术栈选择:记录每一层的选择理由
  • 集成点:定义清晰的边界与通信协议
  • 部署架构:Docker 容器化策略
  • 可扩展性考量:横向与纵向扩展方法
数据库 Schema 设计

使用 Mermaid 创建一份实体关系图,展示该功能的数据模型:

  • 表规格:详细的字段定义,包含类型与约束
  • 索引策略:性能关键型索引及其理由
  • 外键关系:数据完整性与引用约束
  • 数据库迁移策略:版本控制与部署方法
API 设计
  • 包含完整规格的端点
  • 请求/响应格式,附带 TypeScript 类型
  • 使用 Stack Auth 进行认证与授权
  • 错误处理策略与状态码
  • 速率限制与缓存策略
前端架构
组件层级文档

组件结构将利用 shadcn/ui 库,以获得一致且可访问的基础。

布局结构:

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)
  • 状态流图:使用 Mermaid 展示组件状态管理
  • 可复用组件库规格
  • 使用 Zustand/React Query 的状态管理模式
  • TypeScript 接口与类型
安全性与性能
  • 认证/授权要求
  • 数据验证与清理
  • 性能优化策略
  • 缓存机制

上下文模板

  • 功能 PRD: [功能 PRD markdown 文件的内容]

评论

支持 Markdown