State Management with MobX State Tree

Introduction to MobX State Tree

To see a completed React Native example using MobX State Tree and our example BookStore, check out the repo here.

If you would like to give MobX State Tree a spin, you will also need to install a babel plugin so we can use ES7 decorators:

npm i babel-plugin-transform-decorators-legacy --save-dev

And also update the .babelrc file to configure the babel plugin:

{
 'presets': ['react-native'],
 'plugins': ['transform-decorators-legacy']
}

Working with the community as well as companies that are using React & React Native over the past year or so, I get this question a lot: should I use Redux or MobX?

Well, the answer I give to that question varies depending on the client, person, or project I’m working with, but in general I am not biased towards either as they both competently accomplish the goal of state management and do so with elegance and fairly robust communities / documentation.

Now with MobX State Tree, we have another first class contender that should be thrown into the mix. While it is not completely its own separate state management solution (it is very similar to MobX), it is different enough to not categorize it as just “MobX”.