前端开发 Skill技能列表
nuqs最佳实践Skill nuqs
本技能提供nuqs在Next.js应用中实现类型安全URL查询状态管理的最佳实践指南,包含42条规则,覆盖8个类别,帮助开发者进行代码生成、重构和代码审查。关键词:nuqs, Next.js, URL状态, 查询参数, 类型安全, 前端开发。
前端样式设计Skill styling
这个技能用于指导如何编写和维护CSS及Tailwind样式代码,包括最小化包装元素以提升代码质量,采用最佳实践来提高开发效率和UI一致性。它涵盖了样式优化、工具类使用、颜色规范和主题管理,适用于前端开发者和UI设计师。关键词:前端开发、CSS、Tailwind、样式设计、代码优化、UI组件。
正则表达式性能优化Skill js-hoist-regexp
这个技能用于优化前端React应用中的正则表达式使用,通过将RegExp创建提升到模块作用域或使用React的useMemo钩子进行记忆化,避免在每次渲染或函数调用时重复创建,从而提高性能并减少内存开销。关键词:React性能优化, 正则表达式提升, useMemo记忆化, 前端开发技巧, JavaScript最佳实践。
UI设计技能(Web)Skill ui-web
这个技能涵盖了Web UI设计的现代趋势和技术,包括玻璃形态效果、Tailwind CSS框架的应用、暗色模式的实现,以及确保可访问性的核心原则。关键词包括:玻璃形态、Tailwind、暗色模式、可访问性。
网页无障碍审计专家Skill AccessibilityAuditor
这个技能用于网页可访问性审计,确保网站符合WCAG 2.1 AA/AAA标准,实现ARIA属性,测试屏幕阅读器兼容性,并提供无障碍设计指导。关键词:网页可访问性、WCAG合规、ARIA实现、无障碍设计、屏幕阅读器测试、ADA合规。
前端可访问性Skill frontend-accessibility
前端可访问性技能涉及使用语义化HTML、ARIA、键盘导航和屏幕阅读器支持来构建符合WCAG标准的可访问Web应用程序,确保所有用户都能获得包容性的体验。
ChatKitWidget集成技能Skill chatkit-widget
在Next.js/React应用中安全配置和自定义OpenAI/ChatKit聊天小部件的专家集成。
网页界面审查技能Skill web-design-guidelines
这个技能用于自动审查用户界面代码,确保其符合网页界面最佳实践,涵盖可访问性、焦点状态、表单、动画、性能、排版等多个方面,帮助前端开发者提升代码质量和用户体验。关键词:UI审查、前端开发、可访问性、性能优化、代码审计、网页设计、用户体验。
Slack动图制作工具Skill slack-gif-creator
Slack动图制作工具是一个专门用于创建和优化Slack平台动画GIF的Python工具包。提供GIF构建器、验证工具、缓动函数和动画概念,帮助开发者高效制作符合Slack尺寸、帧率和文件大小要求的动态表情符号和消息GIF。关键词:Slack GIF制作,动画GIF优化,Python动图生成,表情符号制作,PIL图像处理,GIF文件压缩,动效设计工具。
NuxtUISkill nuxt-ui
Nuxt UI v4是一个用于Vue 3和Nuxt 4+的UI组件库,提供预构建组件如按钮、模态框、表单、表格等,支持Tailwind Variants主题定制,基于Reka UI构建,适用于快速开发风格化用户界面。关键词包括Vue 3、Nuxt 4+、UI组件、Tailwind CSS、Reka UI、前端开发、组件库。
Telegram迷你应用构建专家Skill telegram-mini-app
该技能专门用于构建Telegram迷你应用(TWA),这是一种在Telegram内运行的Web应用,提供类似原生的用户体验。技能涵盖Telegram Web App API、TON区块链集成、支付系统、用户认证、病毒式传播机制等,适用于开发游戏、DeFi应用、工具和社交应用。关键词:Telegram迷你应用、TWA、TON区块链、Web3、前端开发、病毒传播、货币化、Telegram Web App。
前端导入优化技巧Skill bundle-barrel-imports
这个技能用于通过避免使用桶文件导入来优化前端项目的捆绑大小和性能。它能减少不必要的模块加载,提高开发启动速度、构建效率和冷启动性能,适用于使用React等现代前端框架时的库导入优化。关键词:前端优化、捆绑大小、导入优化、性能提升、barrel files。