前端开发 Skill技能列表
前端设计技能Skill frontend-design
这个技能用于创建独特、生产级别的前端界面,注重高设计质量,避免通用AI美学,适用于构建Web组件、页面或应用程序。关键词包括前端开发、UI设计、代码实现、创意美学、生产级代码。
网页排版Skill web-typography
这个技能用于优化网页排版的设计与实现,提升内容的可读性和用户体验。它包括字体选择、评估、配对、排版测量设置、响应式设计、类型层次构建和字体加载性能优化。关键词:网页排版、字体设计、CSS排版、响应式设计、Web性能、用户体验。
构件构建器Skill artifacts-builder
该技能用于构建交互式、自包含的HTML/JavaScript构件,包括数据可视化、计算器、迷你应用和工具,支持嵌入到网站或作为独立应用使用。适用于创建交互式演示、原型、教育内容及任务特定工具。关键词:HTML, JavaScript, 交互式构件, 数据可视化, 前端开发, Claude.ai, 迷你应用构建, Web开发工具, SEO优化, 交互设计。
无障碍与WCAG合规专家Skill accessibility-wcag
这个技能专注于网页无障碍性和WCAG 2.2合规性,确保界面对所有用户可访问,包括键盘导航、屏幕阅读器优化、颜色对比要求等。它适用于前端开发、用户体验优化和网站审计,关键词:无障碍、WCAG、前端开发、用户体验、屏幕阅读器、键盘导航。
React最佳实践技能Skill react-best-practices
这个技能提供了React开发的最佳实践指南,涵盖hooks使用、组件设计模式、状态管理策略和性能优化技巧。适用于前端开发者、React学习者和代码审查场景,帮助提升开发效率和代码质量。关键词:React、TypeScript、Next.js、hooks、组件模式、状态管理、性能优化、前端开发、代码审查。
JavaScript/TypeScript开发Skill javascript-typescript
该技能用于使用JavaScript和TypeScript进行Web开发,涵盖前端开发(如React)、后端开发(如Node.js)以及全栈项目构建。关键词包括JavaScript、TypeScript、前端开发、后端开发、ES6+、Node.js、React、Web框架。
算法艺术Skill algorithmic-art
这个技能用于创建算法艺术,通过p5.js库实现种子随机性和交互式参数探索,生成独特的生成式艺术作品。关键词:算法艺术、生成式艺术、p5.js、交互式参数、前端开发、艺术生成、计算美学、Web技术、创意编程、数字艺术
FigmaMCP集成Skill figma
Figma MCP 是一个技能,用于通过 Figma MCP 服务器将 Figma 设计自动化转换为生产代码。它允许用户根据 Figma URL 或节点 ID 获取设计上下文、截图和资产,然后按照项目规范(如 React 和 Tailwind)实现代码,确保视觉和行为与设计一致。关键词:Figma, MCP, 设计到代码, 前端开发, React, Tailwind, 自动化集成。
Makepad基础技能Skill makepad-basics
这个技能是关于使用Rust的makepad-widgets库进行跨平台UI开发的入门指南。它帮助开发者快速上手Makepad,学习如何编写实时设计的UI代码,处理事件,并构建适用于多个平台的应用。关键词:Rust, Makepad, UI开发, 跨平台, 实时设计, 前端开发, 入门教程。
现代Web应用架构技能Skill modern-web-app-architecture
本技能提供现代Web应用架构的全面指导,涵盖SPA、SSR、SSG、RSC等渲染策略,专注于架构权衡、状态管理、性能优化、测试和团队扩展。关键词:Web应用、架构设计、前端开发、性能优化、SEO、状态管理、测试策略。
状态管理顾问Skill state-management-advisor
这个技能专注于React应用中的状态管理,帮助开发者选择和实施合适的解决方案,包括Context、Zustand、Redux Toolkit、TanStack Query和Jotai,用于处理本地状态、全局状态和服务器状态。关键词:React状态管理,全局状态管理,服务器状态管理,前端开发。
React组件模式Skill component-patterns
这个技能涵盖React中各种组件模式,如组合模式、自定义钩子、渲染属性、高阶组件和复合组件,用于构建高效、可维护的前端UI组件。关键词:React组件、组合、自定义钩子、渲染属性、高阶组件、复合组件、性能优化、前端开发、代码分割、虚拟滚动。