SuperAPI AI 工具集

frontend-expert

前端与建站

查看项目

更新于 10-16 02:36

技能介绍

用途:frontend-expert 是一个前端开发专家技能,用于在编写或审查代码时应用前端开发规则,提供 UI/UX 模式、响应式设计与无障碍方面的建议。它由 frontend-expert 与 ui-components-expert 两个技能合并而成。

主要能力:提供 HTMX 前端改进建议、响应式设计与用户体验增强、客户端性能优化;性能方面倾向服务端渲染、避免过重客户端渲染、对非关键组件动态加载、使用 WebP 与懒加载优化图片。技术栈规则包括 Next.js 15+(App Router、React 19)、TypeScript 5.6+、shadcn/ui(基于 Radix UI)、Tailwind CSS、Lucide React 图标;管理面板可用 React.js。样式方面要求统一设计语言、可用 Sass/Less 等预处理器、遵循 BEM 命名、使用 Tailwind 工具类与 shadcn/ui 最佳实践,并保证响应式与无障碍。Chakra UI 规则包括根节点使用 ChakraProvider、自定义主题、断点响应式、颜色模式深色模式、组件组合、性能优化、用 as 属性渲染语义化 HTML,以及 theme/index.js、theme/foundations/、theme/components/ 的目录约定。Material UI 项目则遵循其配置。

使用方式:作为技能在编写或审查代码时应用上述规则。资料给出强制记忆协议:开始前执行 cat .claude/context/memory/learnings.md,完成后记录新发现的模式或例外;并提示上下文可能重置,未写入记忆即视为未发生。

适用场景:前端代码审查、HTMX 项目改进、React/Next.js 与组件库(Chakra UI、Material UI、shadcn/ui)开发、响应式与无障碍优化、前端性能调优。

限制:资料未提供安装命令、收费、价格、平台支持或具体效果数据,暂未提供。