@reststate/mobx

This package is no longer maintained.

@reststate/mobx allows you to access data from a JSON:API web service via MobX objects. Because of JSON:API's strong conventions, in most cases all you should need to do is tell @reststate/mobx the base URL of your web service, and which resources to access, and you should be set. No manual web request juggling!

Synopsis

const store = new ResourceStore({
  name: 'widgets',
  httpClient: axios.create(...),
});

store.loadAll()
  .then(() => {
    const widgets = store.all();
    console.log(widgets);
  });

store.create({
  attributes: {
    title: 'My Widget',
  },
});

Installation

# npm install --save @reststate/mobx

Setup

To create a MobX object corresponding to a resource on the server, create a new ResourceStore():

import { ResourceStore } from '@reststate/mobx';
import api from './api';

const store = new ResourceStore({
  name: 'widgets',
  httpClient: api,
});

The httpClient accepts an object with a signature similar to the popular Axios HTTP client directory. You can either pass in an Axios client configured with your base URL and headers. Note that spec-compliant servers will require a Content-Type header of application/vnd.api+json; you will need to configure your HTTP client to send that.

import axios from 'axios';

const httpClient = axios.create({
  baseURL: 'http://api.example.com/',
  headers: {
    'Content-Type': 'application/vnd.api+json',
    'Authentication': `Bearer ${token}`,
  },
});

const module = new ResourceStore({
  name: 'widgets',
  httpClient,
});

Or else you can pass in an object that exposes the following methods:

const httpClient = {
  get(path) {
    // ...
  },
  post(path, body) {
    // ...
  },
  patch(path, body) {
    // ...
  },
  delete(path, body) {
    // ...
  },
};

That's all you need to do--the JSON:API spec takes care of the rest!

Usage

For more information on usage, see the @reststate/mobx docs.

License

Apache 2.0