Agent Skills
› Amery2010/open-builder
Amery2010/open-builder
GitHub提供Web无障碍开发指南,涵盖语义化HTML、键盘导航、ARIA属性使用、焦点管理及色彩对比度规范,确保符合WCAG 2.1 AA标准。
Install All Skills
npx skills add Amery2010/open-builder --all -g -y
Skills in Collection (9)
提供Web无障碍开发指南,涵盖语义化HTML、键盘导航、ARIA属性使用、焦点管理及色彩对比度规范,确保符合WCAG 2.1 AA标准。
构建交互组件前
检查页面无障碍合规性
npx skills add Amery2010/open-builder --skill accessibility -g -y
用于审查代码变更、文件或项目,评估其正确性、安全性、性能和可维护性。基于证据进行质疑式分析,识别回归与潜在风险,仅报告问题,除非用户明确要求修复。
用户要求审查代码差异或文件集
需要评估代码的质量、安全漏洞或性能瓶颈
npx skills add Amery2010/open-builder --skill code-review -g -y
专注于代码简化,提升可读性、一致性和可维护性,同时严格保持行为不变。依据项目规范进行手术式重构,避免过度清理或改变公共API,确保逻辑等价并验证结果。
用户指定需简化的代码段
当前请求中修改的代码
npx skills add Amery2010/open-builder --skill code-simplifier -g -y
提供Web应用运行时错误、白屏及异常行为的系统化调试工作流,涵盖复现、定位、假设、验证、修复及防回归等步骤。
预览崩溃或行为异常
出现控制台错误或白屏
数据展示不正确
npx skills add Amery2010/open-builder --skill debugging -g -y
专注于落地页、作品集及高设计感重写的反平庸前端技能。通过推断简报语境,结合现有约束与品牌资产,提供视觉系统方向与预飞审计,避免通用产品UI设计。
需要为落地页或作品集生成视觉设计方案
进行面向营销或创意展示的前端重构
用户提及Awwwards、极简或特定风格的设计需求
npx skills add Amery2010/open-builder --skill design-taste-frontend -g -y
用于创建生产级前端界面和组件,强调视觉层级、无障碍及一致性。适用于仪表盘、表单等常规产品UI,指导在现有架构下设计可复用组件与多步流程。
需要创建或修改产品内部界面的UI组件
涉及仪表盘、设置页、表单或数据视图的前端开发任务
npx skills add Amery2010/open-builder --skill frontend-design -g -y
提供 React 19 组件开发的最佳实践,涵盖结构、状态管理、副作用处理、性能优化及表单设计,指导编写可维护的函数式组件。
编写或重构 React 组件代码
选择 Hooks 使用策略
设计组件 API 和状态管理方案
npx skills add Amery2010/open-builder --skill react-patterns -g -y
提供生产级 Tailwind CSS 响应式布局、暗色模式、间距规范及 shadcn/ui 集成指南,辅助编写可访问且风格统一的 UI 样式。
需要编写或优化前端 CSS/Tailwind 样式
涉及响应式布局适配
使用 shadcn/ui 组件库
npx skills add Amery2010/open-builder --skill tailwind-helpers -g -y
提供 TypeScript 类型安全与可维护性最佳实践,涵盖类型收窄、判别联合、unknown vs any、satisfies 及类型守卫等模式,旨在通过静态检查减少运行时错误。
需要编写或优化 TypeScript 代码
讨论类型系统设计
解决类型收窄问题
npx skills add Amery2010/open-builder --skill typescript-patterns -g -y


