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
Habilidades relacionadas
chatbot-widget-creator
OtroEsta 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.
chatbot-widget-creator
OtroEsta 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.
gemini-frontend-assistant
OtroEsta 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.
typescript-docs
OtroEsta habilidad genera documentación exhaustiva en TypeScript utilizando JSDoc y TypeDoc para referencias de API, registros de decisiones arquitectónicas (ADRs) y ejemplos específicos de frameworks. Úsala para documentar módulos automáticamente, crear documentación multicapa para diferentes audiencias o configurar documentación para proyectos que utilicen NestJS, Express, React, Angular o Vue.