Una pequeña biblioteca de gestión de estado para React basada en hooks, sin necesidad de providers.
- Estrellas
- 30,422
- Forks
- 1,413
- Issues abiertos
- 123
- Último commit
- hace 6 horas
¿Qué es?
XState es una biblioteca de gestión de estado y orquestación para JavaScript y TypeScript, que se puede usar tanto en código de frontend como de backend. Modela la lógica de las aplicaciones como máquinas de estados, statecharts y actores, para que las transiciones, los efectos secundarios y los eventos permitidos se declaren explícitamente, en lugar de quedar dispersos en condicionales.
El paquete principal, xstate, proporciona definiciones de máquinas, actores que ejecutan la lógica de las máquinas y exponen snapshots a quienes se suscriben, además de soporte para estados jerárquicos, paralelos e históricos. Stately Studio, un editor visual, permite diseñar máquinas y exportarlas a XState v5. Los paquetes complementarios añaden integraciones para React, Vue, Svelte y Solid.
Para casos más sencillos, el paquete independiente @xstate/store ofrece un pequeño store basado en eventos, con átomos reactivos y una inferencia de tipos sólida en TypeScript. Funciona con o sin la biblioteca principal.
Funciones clave
- 01Definir máquinas de estados y statecharts con estados jerárquicos, paralelos e históricos.
- 02Ejecutar lógica como actores que exponen snapshots del estado a quienes se suscriben.
- 03Sin dependencias en tiempo de ejecución.
- 04Diseñar y exportar visualmente mediante Stately Studio.
- 05Integraciones con React, Vue, Svelte y Solid.
- 06Paquete independiente y ligero @xstate/store para gestionar el estado mediante eventos.
Casos de uso
- Gestionar flujos de interfaz de varios pasos, como formularios, asistentes o procesos de compra.
- Orquestar flujos de trabajo de backend de larga duración y tareas en segundo plano.
- Hacer que las transiciones de estado complejas de los componentes sean explícitas y comprobables.
- Usar un pequeño store basado en eventos como alternativa a Redux o Zustand.
Inicio rápido
- 1
Instala el paquete xstate con npm
npm install xstate
En colecciones
Temas
Preguntas frecuentes
- ¿Qué es xstate?
- Biblioteca de JavaScript/TypeScript sin dependencias para máquinas de estados, statecharts y actores que gestionan la lógica compleja de aplicaciones y flujos de trabajo. XState es una biblioteca de gestión de estado y orquestación para JavaScript y TypeScript, que se puede usar tanto en código de frontend como de backend. Modela la lógica de las aplicaciones como máquinas de estados, statecharts y actores, para que las transiciones, los efectos secundarios y los eventos permitidos se declaren explícitamente, en lugar de quedar dispersos en condicionales.
- ¿xstate es gratuito? ¿Qué licencia tiene?
- xstate es open source bajo la licencia MIT. Revisa los términos de la licencia antes de usarlo en productos comerciales.
- ¿xstate sigue mantenido?
- Mantenimiento activo. El último commit de xstate fue el 7 nov 2026.
- ¿Para qué puedo usar xstate?
- Gestionar flujos de interfaz de varios pasos, como formularios, asistentes o procesos de compra. Orquestar flujos de trabajo de backend de larga duración y tareas en segundo plano. Hacer que las transiciones de estado complejas de los componentes sean explícitas y comprobables. Usar un pequeño store basado en eventos como alternativa a Redux o Zustand.
- ¿Cómo se instala xstate?
- Instala el paquete xstate con npm: npm install xstate
- ¿Dónde consigo xstate?
- El código fuente y las instrucciones de instalación están en GitHub: https://github.com/statelyai/xstate
Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.
Proyectos relacionados
Una biblioteca de JavaScript para gestionar el estado global de forma predecible y mantenible, compatible con React y otras bibliotecas de vistas.
Gestión de estado sencilla y escalable para aplicaciones JavaScript y TypeScript, con seguimiento automático de dependencias y renderizado optimizado.
Bindings oficiales de React para Redux que conectan stores de Redux con componentes de React mediante hooks y un Provider.
Un flujo de ingeniería condicionado por evidencias que aplica las cinco fases de SPARC mediante una máquina de estados en TypeScript, una CLI y un servidor MCP.
Biblioteca de Python para crear aplicaciones de toma de decisiones, como chatbots y agentes, mediante máquinas de estados, con una interfaz integrada para rastrear y supervisar la ejecución.