Managing our state with MobX

MobX is a library which makes state management simple and scalable by transparently applying functional reactive programming. The philosophy behind MobX is very simple: anything that can be derived from the application state, should be derived automatically. This philosophy applies to UI, data serialisation and server communication. 

Lots of documentation and examples of using MobX can be found on its website https://mobx.js.org/, although we will make a small introduction in this section to fully understand our app's code in this chapter.

The store

MobX uses the concept of "observable" properties. We should declare an object containing our general application's state, which will hold and declare those observable properties. When we modify one of these properties, all the subscribed observers will be updated by MobX automatically. This is the basic principle behind MobX, so let's take a look at a sample code:

/*** src/store.js ***/

import {observable} from 'mobx...