Agent Skills
› Amery2010/open-builder
Amery2010/open-builder
GitHub提供Web无障碍开发指南，涵盖语义化HTML、键盘导航、ARIA属性及表单设计。以WCAG 2.1 AA为基准，指导构建可访问的交互组件。
安装全部 Skills
npx skills add Amery2010/open-builder --all -g -y
集合内 Skills (9)
提供Web无障碍开发指南，涵盖语义化HTML、键盘导航、ARIA属性及表单设计。以WCAG 2.1 AA为基准，指导构建可访问的交互组件。
前端组件开发
UI重构优化
无障碍合规检查
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应用运行时错误、白屏及异常行为的系统化调试工作流。指导Agent按复现、定位、假设、验证、修复、防回归七步法排查问题，禁止盲目修改，确保精准修复并防止回归。
控制台报错或白屏
页面布局错乱
数据展示异常
功能行为不符合预期
npx skills add Amery2010/open-builder --skill debugging -g -y
针对落地页、作品集及设计导向重构的前端视觉指导技能。通过解读需求简报推断视觉风格，保留现有约束，执行预飞审计，确保高质量前端设计输出。
生成落地页或作品集页面
进行设计导向的前端重构
需要推断视觉系统的营销页面开发
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现代组件开发的最佳实践，涵盖结构、状态管理、副作用、性能优化及组合模式，指导编写可维护的前端代码。
编写或重构React组件
选择Hooks设计模式
设计组件API
npx skills add Amery2010/open-builder --skill react-patterns -g -y
提供生产级 Tailwind CSS 响应式布局、深色模式、间距规范及 shadcn/ui 集成最佳实践，辅助快速构建可访问且风格统一的 UI。
需要编写或优化 Tailwind CSS 样式代码
涉及响应式布局适配或深色模式实现
使用 shadcn/ui 组件并需自定义样式
npx skills add Amery2010/open-builder --skill tailwind-helpers -g -y
提供TypeScript类型安全与可维护性最佳实践，涵盖类型收窄、联合类型、unknown替代any、satisfies及类型守卫等模式，旨在通过精准类型检查减少运行时错误。
询问TypeScript类型安全技巧
需要重构代码以增强类型约束
讨论类型收窄或泛型使用规范
npx skills add Amery2010/open-builder --skill typescript-patterns -g -y
