rxdl-js (reactive data layer)

Keeping data consistent and in sync in the front-end can be painful, even when using robust frameworks, this is an experimental solution, based on RxJS, to simplify the consumption of typical REST data APIs in front-end applications. Ideally this library could be plugged into any javascript app, and adapted to a wide range of back- and front-end stacks.

The library is developed in typescript so it can be compiled to use in any javascript application.

The initial ideas behind it (subject to change) are the following:

• Structure apps around CRUD models/resources (a la Rails).
• Keep an in memory DataStore to avoid remote requests when possible.
• Instead of returning POJOs or other forms of data when queried by -say- components, the DataStore returns RxJS subjects, so that the components (observers) can be notified of changes.
• Have a separate (and optional) DataSource adapter, to customize the connection to the server API (make requests, serialize and deserialize data, etc).
• The back-end need only implement a typical REST style API

Roadmap

• Create a sample DataStore implementation for basic CRUD
• Create a sample DataSource implementation for basic CRUD
• Add paging and filtering
• Create TypeDoc documentation
• Create a sample application
• Put tests on continuous delivery
• Publish on npm
• Add support for relationships
• Add concurrency restrictions for deletion and editing
• Create a generic DataNotifier (independent from Rails)

Usage [IDEA, NOT YET IMPLEMENTED]

1. Install package: npm install --save rxdl-js

2. Initialize the data store in your app: ```javascript // On app startup let RxDL = require('rxdl');

   // Initialize the objects let dataSource = new RDL.DataSource(); let dataCtrl = new RDL.DataController();

   // Set up the data store dataCtrl.source = dataSource;

   // Define a resource in the store dataCtrl.defineResource('users'); ```

3. Subscribe to a resource somewhere in your app ```javascript // Initialize a bound object let user = { id: '', type: '', name: '', email: '' };

   // Subscribe to the resource (an RxJS BehaviorSubject) dataStore.find('user', '123') .subscribe((result) => user.apply(result)); ```

4. Publish changes to your model from somewhere else ```javascript // Create an object with -say- a web form let user = { id: '123', type: 'user', name: 'New Name', email: '[email protected]' };

   // Publish the change dataStore.update(user); ```

5. When the edit component changes the user's attrs, the database and show component will also be updated.