Learn React Hooks

Setting up the MobX store

After installing MobX, it is time to set up our MobX store. The store will store all state, and the related computed values and actions. It is usually defined with a class.

Let's define the MobX store now:

1. Create a new src/store.js file.
2. Import the observable, action, and computed decorators, as well as the decorate function from MobX. These will be used to tag various functions and values in our store:

import { observable, action, computed, decorate } from 'mobx'

3. Also import the fetchAPITodos and generateID functions from our API code:

import { fetchAPITodos, generateID } from './api'

4. Now, we define the store by using a class:

export default class TodoStore {

5. In this store, we store a todos array, and the ...