Vercel React Best Practices
官方 已认证Vercel 官方 React 最佳实践技能，涵盖组件设计、状态管理、性能优化、Next.js App Router 等前端工程规范。
Vercel React Best Practices是开发方向的 Agent 技能。Vercel 官方 React 最佳实践技能，涵盖组件设计、状态管理、性能优化、Next.js App Router 等前端工程规范。相关标签：React · Next.js · 最佳实践 · best-practices · 前端 · frontend。
Vercel React Best Practices是什么
Vercel React Best Practices把开发相关工作流打包给 Agent 复用。Vercel 官方 React 最佳实践技能，涵盖组件设计、状态管理、性能优化、Next.js App Router 等前端工程规范。
如何在 Cursor / Claude / Codex 中安装 Vercel React Best Practices
Claude Code 按本页命令安装，或将技能放到 ~/.claude/skills 或项目 .claude/skills，Claude 会识别 Vercel React Best Practices。
Cursor 用本页安装命令写入技能目录后，在 Cursor Agent 中按技能名调用 Vercel React Best Practices。
Codex 安装到 Codex 技能目录后按名称调用。若本页只有通用命令，先在本机执行，再确认 Codex 能读到该技能。
一键安装
在终端运行以下命令安装技能到你的 AI Agent：
npx skillsadd vercel-labs/agent-skills如何使用
Claude Code： 将技能放入 ~/.claude/skills（个人）或项目 .claude/skills 目录，Claude 会自动识别。
Cursor / Windsurf： 通过 npx skillsadd 安装后，技能目录会被放入配置路径。
Codex CLI： 安装后在技能目录中自动加载，通过名称调用。
标签
同类推荐
Web Artifacts Builder
Anthropic 官方技能，将自然语言描述转化为完整的可交互 Web 应用，生成 HTML、CSS、JavaScript 单文件制品，适合快速原型与演示。
Systematic Debugging
系统化调试方法论技能，引导 Agent 按复现、定位、假设、验证、修复的闭环流程排查 Bug，避免盲目改代码。
Test-Driven Development
测试驱动开发（TDD）工作流技能，遵循红-绿-重构循环，先写失败测试再实现功能，保障代码质量与可维护性。
Code Review Workflow
结构化代码审查工作流，从命名、架构、安全、性能、可读性等维度逐项检查，并输出规范的评审意见与改进建议。
MCP Builder
Model Context Protocol 服务器构建技能，指导 Agent 快速搭建符合 MCP 规范的服务器，定义工具、资源与提示词。
Skill Creator
技能创建器，帮助开发者按规范编写 SKILL.md 元文件、组织参考脚本与资源，快速发布可被 Agent 加载的技能包。
常见问题
Vercel React Best Practices做什么用？
Vercel React Best Practices属于开发技能。Vercel 官方 React 最佳实践技能，涵盖组件设计、状态管理、性能优化、Next.js App Router 等前端工程规范。
Claude、Cursor、Codex 都能用 Vercel React Best Practices 吗？
只要客户端支持 Agent Skills 格式并加载了该技能目录，就可以调用 Vercel React Best Practices。以项目主页的兼容说明为准。
还有哪些同类技能？
相关推荐来自同一开发分类，便于挑选更贴近你工作流的技能。