前端开发 Skill技能列表
前端组件生成器Skill frontend-component
自动化生成React/Vue组件,包括TypeScript定义、测试和样式,遵循最佳实践,提高开发效率。
ReactFlow基础Skill reactflow-fundamentals
React Flow 基础技能是一个用于前端开发的 React 库,专注于构建可自定义的节点图编辑器、流程图、工作流界面和交互图表。涵盖核心概念、安装设置、节点和边配置、事件处理及插件组件,适用于数据可视化、无代码工具和 UI 设计。关键词:React Flow, 节点图表, 流程图, 交互界面, 前端开发, 数据可视化, 工作流编辑器
ReduxToolkit技能Skill redux-toolkit
Redux Toolkit 技能提供在 React 应用中实现现代化状态管理的专家级指导。它专注于 Redux Toolkit 库的核心模式,包括创建类型安全的切片(slice)、使用 createAsyncThunk 处理异步逻辑、配置 RTK Query 进行高效的数据获取与缓存、利用 createEntityAdapter 进行状态规范化,以及集成 Redux DevTools 进行调试。适用于从零搭建 Redux 项目、迁移旧版 Redux 或优化现有状态管理架构。关键词:Redux Toolkit,React 状态管理,RTK Query,异步操作,TypeScript,前端开发,状态规范化。
Storybook组件开发助手Skill storybook
Storybook组件开发助手是一款专注于前端组件开发与文档化的专家工具。它提供Storybook配置、组件故事编写、交互测试、插件集成和自动化文档生成等核心功能,帮助开发者高效构建可复用、可测试、文档完善的UI组件库和设计系统。适用于React、Vue、Angular等主流前端框架,是提升团队协作效率和代码质量的关键工具。关键词:Storybook配置、组件故事、交互测试、UI文档、设计系统、前端组件库、React组件、Vue组件、自动化文档。
样式化组件Skill styled-components
这是一个关于 styled-components CSS-in-JS 库的技能,提供主题化、组件变体、服务端渲染支持等功能的专家级实现指导。关键词:styled-components, CSS-in-JS, React 样式, 前端主题, 组件库开发, SSR 支持。
前端开发模式Skill frontend-patterns
本文介绍了React、Next.js框架下,用于状态管理、性能优化和UI最佳实践的现代前端开发模式。包括组件模式、自定义钩子模式、状态管理模式、性能优化、表单处理模式、错误边界模式、动画模式和可访问性模式。
前端开发前指南阅读Skill before-frontend-dev
该技能用于在开始前端开发任务前,系统阅读和理解相关开发指南,以确保代码质量、一致性并遵循最佳实践,关键词包括前端开发、指南阅读、编码标准、代码规范、SEO优化。
用户反馈与通知系统Skill providing-feedback
此技能实现了全面的用户反馈和通知系统,用于在软件应用中提供一致的系统状态通信、消息显示和用户确认处理,包括toast通知、模态对话框、进度指示器等。关键词:反馈系统、通知、用户界面、前端开发、React、可访问性。
React最佳实践Skill react-best-practices
提供React模式,包括hooks、effects、refs和组件设计的最佳实践。涵盖逃生口、反模式和正确的效果使用。在阅读或编写React组件(带有React导入的.tsx、.jsx文件)时必须使用。
ChatKitWidget集成技能Skill chatkit-widget
在Next.js/React应用中安全配置和自定义OpenAI/ChatKit聊天小部件的专家集成。
实现命令面板Skill implementing-command-palettes
React命令面板开发指南,涵盖Cmd+K快捷键面板的键盘导航、滚动定位、过滤搜索和性能优化。关键词:React命令面板、键盘导航、scrollIntoView、快捷键匹配、防止重新渲染、前端开发、用户体验优化、React性能优化
GSAPHUD动画开发技能Skill gsap
本技能提供GSAP(GreenSock动画平台)专业知识,用于在JARVIS AI助手HUD中创建平滑、专业的动画。主要应用包括HUD面板入场/出场动画、状态指示器过渡、数据可视化动画、滚动触发效果和复杂时间线序列。强调测试驱动开发、性能优化、内存管理、可访问性和高质量代码实践,适用于前端开发场景。关键词:GSAP, 动画, JARVIS, HUD, 前端开发, Vue.js, 性能优化, TDD, 可访问性。