Configuring XState in the Funbook app
Let’s see what it takes to use XState in a real app. If you would like to follow along on your own, you can copy the example-app-full
folder and use it as a starting point. If you prefer to look at the code related to this chapter, please look in the chapter-7
folder: https://github.com/PacktPublishing/Simplifying-State-Management-in-React-Native/tree/main/chapter-7.
First things first—we need to add XState to the project. You can do so by running one of the two following commands:
npm install xstate@latest --save // or yarn add xstate@latest --save
XState itself is an unopinionated library, much like MobX. This means it is not ready out-of-the-box to work with React. The XState documentation has a section called Recipes where you can read more on the implementation with React or other UI libraries, such as Vue or Svelte. As for us, we need to add the React-related dependency, xstate-react
. Let’s do this by running...