datx-jsonapi

datx-jsonapi

DatX is an opinionated data store for use with the MobX state management library. It features support for simple observable property definition, references to other models and first-class TypeScript support.

datx-jsonapi is a datx mixin that adds JSON API support.

---

Basic usage

import { Collection, Model, prop } from 'datx';
import { jsonapi } from 'datx-jsonapi';
import { computed } from 'mobx';

class Person extends jsonapi(Model) {
  public static type = 'person'; // Unique name of the model class

  @prop name: string; // A normal observable property without a default value
  @prop surname: string;
  @prop.toOne(Person) spouse?: Person; // A reference to a Person model

  @computed get fullName() { // Standard MobX computed props
    return `${this.name} ${this.surname}`;
  }
}

class AppData extends jsonapi(Collection) {
  public static types = [Person]; // A list of models available in the collection
}

const store = new AppData();
const john = store.add(new Person({name: 'John', surname: 'Smith'})); // Add a model instance to the store
const jane = store.add({name: 'Jane', surname: 'Smith', spouse: john}, Person); // Add a model to the store

await john.save(); // POST to the server
const people = await store.fetchAll(Person); // Get all people from the server

Getting started

Note: datx-jsonapi has a peer dependency to mobx@^4.2.0 or mobx@^5.5.0, so don't forget to install the latest MobX version:

npm install --save datx-jsonapi mobx

• Basic configuration
• Network configuration
• Network usage
• Spec compliance

Polyfilling

The lib makes use of the following features that are not yet available everywhere. Based on your browser support, you might want to polyfill them:

• Symbol.for
• Object.assign
• Array.prototype.find
• Promise
• Fetch API

How to add the polyfills. Note: Fetch API is not included in the polyfills mentioned in the Troubleshooting page. Instead, you need to add it as a separate library. If you don't have any special requirements (like server-side rendering), you can use the window.fetch polyfill.

API reference

• Model
• Collection
• View
• Response
• Config
• Utils
• TypeScript Interfaces

Troubleshooting

Having issues with the library? Check out the troubleshooting page or open an issue.

---

License

The MIT License

Credits

datx-jsonapi is maintained and sponsored by Infinum.