statelyai/xstate

어떤 프로젝트인가요?

핵심 기능

• 01계층형·병렬·히스토리 상태를 포함한 상태 머신과 상태 차트를 정의합니다.
• 02구독자에게 상태 스냅샷을 제공하는 액터로 로직을 실행합니다.
• 03런타임 의존성이 없습니다.
• 04Stately Studio에서 시각적으로 설계하고 내보낼 수 있습니다.
• 05React, Vue, Svelte, Solid용 바인딩을 제공합니다.
• 06이벤트 기반 상태 관리를 위한 별도의 경량 패키지 @xstate/store를 제공합니다.

활용 사례

• 폼, 마법사, 결제 과정과 같은 여러 단계의 UI 흐름을 관리합니다.
• 오래 실행되는 백엔드 워크플로와 백그라운드 작업을 오케스트레이션합니다.
• 복잡한 컴포넌트 상태 전이를 명시적으로 표현하고 테스트할 수 있게 합니다.
• Redux 또는 Zustand의 대안으로 소규모 이벤트 기반 스토어를 사용합니다.

빠른 시작

1. 1

   npm으로 xstate 패키지를 설치합니다

   npm install xstate

포함된 컬렉션

토픽

자주 묻는 질문

xstate은(는) 무엇인가요?

복잡한 앱과 워크플로 로직을 관리하는 상태 머신, 상태 차트, 액터용 무의존성 JavaScript/TypeScript 라이브러리입니다. XState는 프론트엔드와 백엔드 코드 모두에서 사용할 수 있는 JavaScript 및 TypeScript용 상태 관리·오케스트레이션 라이브러리입니다. 애플리케이션 로직을 상태 머신, 상태 차트, 액터로 모델링하므로 조건문 곳곳에 흩어 놓는 대신 전이, 부수 효과, 허용 이벤트를 명시적으로 선언할 수 있습니다.

xstate은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?

xstate은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.

xstate은(는) 아직 유지보수되고 있나요?

활발히 유지보수 중. xstate의 마지막 커밋은 2026년 11월 6일입니다.

xstate은(는) 어디에 사용할 수 있나요?

폼, 마법사, 결제 과정과 같은 여러 단계의 UI 흐름을 관리합니다. 오래 실행되는 백엔드 워크플로와 백그라운드 작업을 오케스트레이션합니다. 복잡한 컴포넌트 상태 전이를 명시적으로 표현하고 테스트할 수 있게 합니다. Redux 또는 Zustand의 대안으로 소규모 이벤트 기반 스토어를 사용합니다.

xstate는 어떻게 설치하나요?

npm으로 xstate 패키지를 설치합니다: npm install xstate

xstate은(는) 어디서 받을 수 있나요?

소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/statelyai/xstate