A state machine models a system as a finite set of states with explicit rules for moving between them in response to events. Statecharts extend the idea with hierarchy, parallel states, and guards, which makes them practical for real application logic rather than just textbook examples. Modelling logic this way makes impossible states unreachable by construction and gives a clear picture of every transition.

Tools

  • XState — open-source JavaScript/TypeScript library for state machines and statecharts
  • Stately — visual editor for designing and deploying XState machines, with bidirectional sync between diagram and code, simulation, and code generation; used by Netflix, Microsoft, and others