vercel-react-best-practices
Acerca de
Esta habilidad proporciona las pautas de optimización de rendimiento de Vercel para React y Next.js con 57 reglas priorizadas en 8 categorías. Úsala al escribir, revisar o refactorizar código para abordar problemas de rendimiento como re-renderizados, tamaño del paquete y patrones de obtención de datos. Cubre áreas clave de optimización incluyendo componentes de servidor/cliente, Suspense y hooks de React.
Instalación rápida
Claude Code
Recomendadonpx skills add TechNickAI/ai-coding-config -a claude-code/plugin add https://github.com/TechNickAI/ai-coding-configgit clone https://github.com/TechNickAI/ai-coding-config.git ~/.claude/skills/vercel-react-best-practicesCopia y pega este comando en Claude Code para instalar esta habilidad
Repositorio GitHub
Frequently asked questions
What is the vercel-react-best-practices skill?
vercel-react-best-practices is a Claude Skill by TechNickAI. Skills package instructions and resources that Claude loads on demand, so Claude can perform vercel-react-best-practices-related tasks without extra prompting.
How do I install vercel-react-best-practices?
Use the install commands on this page: add vercel-react-best-practices to Claude Code as a plugin, or clone its repository into your skills directory, then restart Claude so it picks up the skill.
What category does vercel-react-best-practices belong to?
vercel-react-best-practices is in the frontend category, tagged react and data.
Is vercel-react-best-practices free to use?
Yes. vercel-react-best-practices is listed on AIMCP and free to install. It runs inside Claude, so no separate service account is required to use the skill itself.
Habilidades relacionadas
Esta habilidad crea un widget de chatbot estilo ChatGPT listo para producción, diseñado para integración frontend. Incluye características críticas como protección contra re-renderizados infinitos, funcionalidad de "Preguntar a la IA" en selecciones de texto, e integración preparada con backends RAG y transmisión SSE. Úselo para implementar rápidamente una interfaz de chat probada en combate y monitoreada.
Esta habilidad genera un widget de chatbot estilo ChatGPT listo para producción, con soluciones integradas para problemas comunes del frontend. Ofrece protección contra renderizados infinitos, funcionalidad de "Preguntar a la IA" en selecciones de texto, y soporte integrado para backends de transmisión SSE y RAG. Úsala para implementar rápidamente una interfaz de chat monitoreada y de alto rendimiento en tu aplicación web.
Esta habilidad utiliza la CLI de Gemini para generar código de interfaz de usuario frontend a partir de descripciones de texto o imágenes. Se especializa en crear componentes de React con Tailwind CSS, lo que la hace ideal para convertir capturas de pantalla o conceptos de diseño en código funcional. Los desarrolladores deben usarla para prototipado rápido, asistencia en estilos y tareas de refactorización de código.
Esta habilidad genera documentación integral de TypeScript utilizando JSDoc y TypeDoc para múltiples audiencias. Crea documentación de API, registros de decisiones arquitectónicas (ADRs) y ejemplos específicos para frameworks como NestJS, Express, React, Angular y Vue. Úsala para documentar módulos, generar documentación de API o establecer patrones de documentación por capas.
