alpinejs
✓Mejores prácticas y patrones de AlpineJS. Úselo al escribir HTML con directivas Alpine.js para evitar errores comunes como largas cadenas de JavaScript en línea.
Instalación
SKILL.md
Never put complex logic in HTML attributes. If your x-data, x-init, or any directive exceeds 50 characters, extract it.
| x-data | Declare reactive component state | x-data="{ open: false }" | | x-init | Run code on component init | x-init="fetchData()" | | x-show | Toggle visibility (CSS display) | x-show="open" | | x-if | Conditional rendering (must wrap ) | | | x-for | Loop (must wrap ) | | | x-bind: / : | Bind attribute to expression | :class="{ active: isActive }" |
| x-on: / @ | Listen to events | @click="open = !open" | | x-model | Two-way bind form inputs | x-model="email" | | x-text | Set text content | x-text="message" | | x-html | Set inner HTML | x-html="htmlContent" | | x-ref | Reference element via $refs | x-ref="input" |
Datos (listos para citar)
Campos y comandos estables para citas de IA/búsqueda.
- Comando de instalación
npx skills add https://github.com/brettatoms/agent-skills --skill alpinejs- Fuente
- brettatoms/agent-skills
- Categoría
- </>Desarrollo
- Verificado
- ✓
- Primera vez visto
- 2026-02-02
- Actualizado
- 2026-02-18
Respuestas rápidas
¿Qué es alpinejs?
Mejores prácticas y patrones de AlpineJS. Úselo al escribir HTML con directivas Alpine.js para evitar errores comunes como largas cadenas de JavaScript en línea. Fuente: brettatoms/agent-skills.
¿Cómo instalo alpinejs?
Abre tu terminal o herramienta de línea de comandos (Terminal, iTerm, Windows Terminal, etc.) Copia y ejecuta este comando: npx skills add https://github.com/brettatoms/agent-skills --skill alpinejs Una vez instalado, el skill se configurará automáticamente en tu entorno de programación con IA y estará listo para usar en Claude Code o Cursor
¿Dónde está el repositorio de origen?
https://github.com/brettatoms/agent-skills
Detalles
- Categoría
- </>Desarrollo
- Fuente
- skills.sh
- Primera vez visto
- 2026-02-02