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标准的可访问组件。
需要实现Web无障碍功能
审查前端代码的无障碍合规性
npx skills add Amery2010/open-builder --skill accessibility -g -y
对代码变更集进行审查,评估正确性、安全性、性能和可维护性。基于项目证据发现潜在问题并报告,默认不修改文件,除非用户明确要求修复。
用户请求审查代码差异或提交
需要检查代码的安全性和性能隐患
npx skills add Amery2010/open-builder --skill code-review -g -y
专注于在不改变行为的前提下简化代码,提升可读性与可维护性。严格遵循项目约定,仅处理指定代码,避免过度重构或范围蔓延。
用户要求简化或清理特定代码片段
新修改的代码需要符合清晰性和一致性标准
npx skills add Amery2010/open-builder --skill code-simplifier -g -y
提供系统化的Web应用调试工作流,涵盖复现、定位、假设验证、修复及回归预防,适用于控制台报错、白屏等运行时故障。
运行时错误
白屏现象
布局崩溃
数据异常
npx skills add Amery2010/open-builder --skill debugging -g -y
面向落地页、作品集及高设计感重写的反套路前端技能,强调先解读需求再执行视觉构建,严格遵循现有约束与工具限制。
需要为SaaS或消费级产品创建营销落地页
开发个人设计师或开发者作品集网站
进行具有高度视觉导向的前端页面重写
npx skills add Amery2010/open-builder --skill design-taste-frontend -g -y
专注于创建生产级前端界面与组件,强调层级、可访问性及视觉一致性。适用于仪表盘、表单及通用前端样式开发,指导基于现有架构进行上下文敏感的设计决策。
需要创建或优化产品UI界面
设计仪表盘、设置页、表单等通用前端组件
涉及前端样式重构或视觉方向调整
npx skills add Amery2010/open-builder --skill frontend-design -g -y
提供 React 19 组件开发最佳实践,涵盖结构、状态管理、副作用、性能优化及组合模式。指导编写可维护的前端代码,规范 Hooks 使用与 API 设计。
编写或重构 React 组件
选择 Hooks 或设计组件 API
处理前端状态管理
npx skills add Amery2010/open-builder --skill react-patterns -g -y
提供生产级 Tailwind CSS 开发规范,涵盖响应式断点、暗色模式语义化配色、间距尺度及 shadcn/ui 组件集成最佳实践,指导前端 UI 样式编写。
需要构建响应式布局
实现深色模式适配
使用 shadcn/ui 组件
设计界面间距与排版
npx skills add Amery2010/open-builder --skill tailwind-helpers -g -y
提供 TypeScript 安全与可维护编码规范,涵盖类型收窄、判别联合、unknown 使用及类型守卫等模式,旨在通过类型系统捕获真实 bug。
询问 TypeScript 最佳实践
代码审查中的类型检查建议
重构时的类型安全优化
npx skills add Amery2010/open-builder --skill typescript-patterns -g -y


