前端开发 Skill技能列表
JSON-UI报告渲染器Skill json-ui
JSON-UI 是一个强大的 JSON 到 HTML 报告渲染器,支持 React 组件和双语国际化。它允许开发者通过定义 JSON 结构快速生成美观、交互式的学术或数据报告网页。核心功能包括组件化架构、Zod 模式验证、静态 HTML 输出、React 组件库以及无缝的中英文语言切换。适用于学术论文展示、数据分析报告、自动化文档生成等场景。关键词:JSON渲染,HTML报告,React组件,双语国际化,i18n,学术报告,数据可视化,前端开发工具。
TypeScript最佳实践Skill typescript-best-practices
本技能提供一套完整的 TypeScript 开发最佳实践指南,专注于类型优先开发、编译时安全、运行时验证和健壮代码编写。核心内容包括:使用类型系统使非法状态无法表示,通过判别联合、标记类型和常量断言提升代码安全性;采用模块化、函数式编程模式;结合 Zod 库进行运行时数据验证与配置管理。适用于所有 TypeScript/JavaScript 项目,旨在帮助开发者编写更可靠、易维护且错误更少的代码。关键词:TypeScript 最佳实践,类型优先开发,Zod 验证,编译时安全,代码健壮性,前端开发,JavaScript 类型安全。
React19性能优化Skill react
这个技能提供React 19应用程序的性能优化指南,涵盖并发渲染、服务器组件、表单操作、数据获取、状态管理、记忆化和组件模式等关键主题,帮助前端开发者提升应用性能、减少重新渲染和优化开发效率,关键词包括React 19、性能优化、并发渲染、服务器组件、表单操作、数据获取、状态管理。
Mermaid流程图Skill mermaid-flowchart
Mermaid流程图是一种基于文本的图表工具,它允许用户使用文本和代码来创建和维护流程图。它支持多种节点形状、链接样式、方向配置以及交互功能,非常适合软件开发和数据可视化领域。
算法艺术Skill algorithmic-art
这个技能用于创建算法艺术,通过p5.js库实现种子随机性和交互式参数探索,生成独特的生成式艺术作品。关键词:算法艺术、生成式艺术、p5.js、交互式参数、前端开发、艺术生成、计算美学、Web技术、创意编程、数字艺术
shadcn/ui前端组件库开发技能Skill shadcn
这个技能提供了shadcn/ui组件库的全面最佳实践指南,覆盖项目设置、组件架构、可访问性、样式主题、表单模式、数据展示、布局导航、组件组合、性能优化和状态管理,适用于前端开发者使用React、Tailwind CSS、Radix UI等技术进行高效、可访问和性能优化的Web开发。关键词:shadcn/ui, 前端开发, React, Tailwind CSS, 可访问性, 性能优化, 组件库。
积分处理器Skill credits-handler
这是一个关于如何构建和管理SaaS平台积分系统的完整指南。它详细介绍了积分系统的后端配置(添加积分类型、定价策略、套餐分配)、前端UI实现(购买积分组件、余额显示组件)以及核心后端操作(积分分配、扣减、余额检查)。关键词包括:积分系统、SaaS平台、前端开发、后端开发、用户余额管理、定价策略、React钩子、TypeScript。
TailwindCSS响应式设计Skill tailwind-responsive-design
Tailwind CSS响应式设计技能用于通过Tailwind CSS框架构建自适应布局和移动优先的网页设计,涵盖断点、容器查询和响应式工具的使用。适用于前端开发人员创建跨设备兼容的网站。关键词:Tailwind CSS, 响应式设计, 移动优先, 断点, 前端开发, 网页布局。
前端组件生成器Skill frontend-component
自动化生成React/Vue组件,包括TypeScript定义、测试和样式,遵循最佳实践,提高开发效率。
VueRouterv4路由管理技能Skill vue-router-v4
Vue Router v4 是一个用于 Vue 3 应用程序的前端路由管理库,提供路由配置、导航守卫、动态路由匹配、懒加载和代码分割等功能。适用于构建单页应用,支持 TypeScript 类型化路由和组合式 API。关键词:Vue Router v4, 前端开发, 路由管理, Vue 3, 导航守卫, 动态路由, 懒加载, TypeScript, SEO 搜索。
规划指南Skill planning-guidelines
Portfolio Buddy 2 开发规划指南,提供代码保留、移动/桌面端优化、需求澄清等核心原则。适用于软件开发、量化金融、前端开发、代码重构、项目管理、敏捷开发、React TypeScript、投资组合分析、金融科技应用开发。
Web性能优化Skill perf-web-optimization
这个技能专注于优化网站性能,通过改进Core Web Vitals指标(如LCP、CLS、INP)、减少JavaScript包大小、优化图片和缓存策略,提升页面加载速度和用户体验。适用于前端开发、SEO优化和网站维护,关键词包括:web性能优化、前端开发、SEO、Lighthouse、bundle优化、Core Web Vitals、LCP、CLS、INP、缓存策略。