Repolode
Submit
statelyai

statelyai/xstate

A zero-dependency JavaScript/TypeScript library for state machines, statecharts, and actors to manage complex app and workflow logic.

Open-source alternative to:ReduxZustand

View on GitHubWebsite
Stars
30,422
Forks
1,413
Open issues
123
Last commit
8 hours ago

What is it?

XState is a state management and orchestration library for JavaScript and TypeScript, usable in both frontend and backend code. It models application logic as state machines, statecharts, and actors, so transitions, side effects, and allowed events are declared explicitly rather than scattered across conditionals.

The core package, xstate, provides machine definitions, actors that run machine logic and expose snapshots to subscribers, and support for hierarchical, parallel, and history states. Stately Studio, a visual editor, can be used to design machines and export them to XState v5. Companion packages add bindings for React, Vue, Svelte, and Solid.

For simpler cases, the separate @xstate/store package offers a small event-based store with reactive atoms and strong TypeScript inference, and it works with or without the core library.

Key features

  • 01Define state machines and statecharts with hierarchical, parallel, and history states.
  • 02Run logic as actors that expose state snapshots to subscribers.
  • 03Zero runtime dependencies.
  • 04Visual design and export through Stately Studio.
  • 05Framework bindings for React, Vue, Svelte, and Solid.
  • 06Separate lightweight @xstate/store for event-based state management.

Use cases

  • Managing multi-step UI flows such as forms, wizards, or checkout processes.
  • Orchestrating long-running backend workflows and background jobs.
  • Making complex component state transitions explicit and testable.
  • Using a small event-driven store as an alternative to Redux or Zustand.

Quick start

  1. 1

    Install the xstate package with npm

    npm install xstate

In collections

Frontend frameworks & UI components

Topics

#state-machine#statecharts#state-management#actor-model#typescript#workflow#orchestration#frontend#background-jobs#finite-state-machine

FAQ

What is xstate?
A zero-dependency JavaScript/TypeScript library for state machines, statecharts, and actors to manage complex app and workflow logic. XState is a state management and orchestration library for JavaScript and TypeScript, usable in both frontend and backend code. It models application logic as state machines, statecharts, and actors, so transitions, side effects, and allowed events are declared explicitly rather than scattered across conditionals.
Is xstate free to use? What license does it have?
xstate is open source under the MIT license. Check the license terms before using it in commercial products.
Is xstate still maintained?
Actively maintained. The last commit to xstate was on Nov 7, 2026.
What can I use xstate for?
Managing multi-step UI flows such as forms, wizards, or checkout processes. Orchestrating long-running backend workflows and background jobs. Making complex component state transitions explicit and testable. Using a small event-driven store as an alternative to Redux or Zustand.
How do I install xstate?
Install the xstate package with npm: npm install xstate
Where can I get xstate?
The source code and installation instructions are on GitHub: https://github.com/statelyai/xstate

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects