Repolode
alpinejs

alpinejs/alpine

Un framework de JavaScript robusto y minimalista para añadir comportamiento reactivo directamente en el marcado HTML.

Estrellas
31,984
Forks
1,396
Issues abiertos
25
Último commit
hace 4 días

¿Qué es?

Alpine.js es un framework de JavaScript minimalista para crear interacciones dentro de HTML. Los desarrolladores añaden estado y controladores de eventos a los elementos mediante atributos, de modo que pequeñas interacciones —como menús desplegables, modales, pestañas o lógica de formularios— pueden estar junto al marcado que afectan, sin necesidad de una estructura de aplicación independiente y compleja de compilar.

El proyecto se distribuye como un script CDN que se puede incluir con una sola etiqueta script, o como un módulo npm para proyectos con bundler. El núcleo se complementa con plugins oficiales para contraer elementos con animaciones, gestionar el foco, vincular el estado a cadenas de consulta, activar acciones según la intersección, enmascarar entradas, modificar el DOM y conservar el estado entre cargas de página.

El repositorio es un monorepo gestionado con npm workspaces que contiene el paquete principal, cada plugin, una compilación compatible con CSP y el sitio de documentación. Los colaboradores pueden compilar todos los paquetes con un solo comando y ejecutar pruebas de integración con Cypress y pruebas unitarias con Vitest.

Funciones clave

  • 01Gestión declarativa del estado y de eventos directamente mediante atributos HTML.
  • 02Disponible como etiqueta de script CDN o como módulo npm.
  • 03Plugins oficiales para animaciones de contracción, gestión del foco, máscaras, persistencia y modificación del DOM.
  • 04Variante de compilación compatible con CSP para entornos con políticas de seguridad de contenido estrictas.
  • 05Monorepo con suites de pruebas de Cypress y Vitest.

Casos de uso

  • Añadir menús desplegables, modales o pestañas a una página renderizada en el servidor, sin recurrir a un framework SPA completo.
  • Conservar el estado de la interfaz, como paneles abiertos o valores de formularios, entre cargas de página.
  • Crear formularios interactivos con máscaras de entrada y gestión del foco.
  • Trabajar en entornos que requieren una compilación de JavaScript compatible con CSP.

Inicio rápido

  1. 1

    Clona el repositorio en tu equipo

  2. 2

    Instala las dependencias

    npm install
  3. 3

    Compila todos los paquetes

    npm run build
  4. 4

    Incluye el archivo cdn.js compilado en una etiqueta script de tu página

Antes de usarlo

  • Este repositorio está destinado a las contribuciones; la mayor parte de la documentación sobre el uso está en el sitio externo de documentación de Alpine.

Temas

Preguntas frecuentes

¿Qué es alpine?
Un framework de JavaScript robusto y minimalista para añadir comportamiento reactivo directamente en el marcado HTML. Alpine.js es un framework de JavaScript minimalista para crear interacciones dentro de HTML. Los desarrolladores añaden estado y controladores de eventos a los elementos mediante atributos, de modo que pequeñas interacciones —como menús desplegables, modales, pestañas o lógica de formularios— pueden estar junto al marcado que afectan, sin necesidad de una estructura de aplicación independiente y compleja de compilar.
¿alpine es gratuito? ¿Qué licencia tiene?
alpine es open source bajo la licencia MIT. Revisa los términos de la licencia antes de usarlo en productos comerciales.
¿alpine sigue mantenido?
Mantenimiento activo. El último commit de alpine fue el 16 oct 2026.
¿Para qué puedo usar alpine?
Añadir menús desplegables, modales o pestañas a una página renderizada en el servidor, sin recurrir a un framework SPA completo. Conservar el estado de la interfaz, como paneles abiertos o valores de formularios, entre cargas de página. Crear formularios interactivos con máscaras de entrada y gestión del foco. Trabajar en entornos que requieren una compilación de JavaScript compatible con CSP.
¿Cómo se instala alpine?
Clona el repositorio en tu equipo Instala las dependencias: npm install Compila todos los paquetes: npm run build Incluye el archivo cdn.js compilado en una etiqueta script de tu página
¿Dónde consigo alpine?
El código fuente y las instrucciones de instalación están en GitHub: https://github.com/alpinejs/alpine

Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.

Proyectos relacionados