DeLorean.js

Coverage

DeLorean is a tiny Flux pattern implementation.

Unidirectional data flow, it makes your app logic simpler than MVC,
Automatically listens data changes and keeps your data updated,
Makes data more consistent in your whole application,
It's framework agnostic, completely. There's no view framework dependency.
Too small, just 4K gzipped.
Built-in React.js integration, easy to use with Flight.js and Ractive.js and probably all others.

Tutorial

You can learn Flux and DeLorean.js in minutes. Read the tutorial

Using with Frameworks

Install

You can install DeLorean with Bower:

bower install delorean

You can also install by NPM to use with Browserify (recommended)

npm install delorean.js

Usage

Hipster way:

var Flux = require('delorean.js').Flux;
// ...

Old-skool way:

<script src="//rawgit.com/f/delorean/master/dist/delorean.min.js"></script>
<script>
var Flux = DeLorean.Flux;
// ...
</script>

Overview

/*
 * Stores are simple data buckets which manages data.
 */
var Store = Flux.createStore({
  data: null,
  setData: function (data) {
    this.data = data;
    this.emit('change');
  },
  actions: {
    'incoming-data': 'setData'
  }
});
var store = new Store();

/*
 * Dispatcher are simple action dispatchers for stores.
 * Stores handle the related action.
 */
var Dispatcher = Flux.createDispatcher({
  setData: function (data) {
    this.dispatch('incoming-data', data);
  },
  getStores: function () {
    return {increment: store};
  }
});

/*
 * Action Creators are simple controllers. They are simple functions.
 *  They talk to dispatchers. They are not required.
 */
var Actions = {
  setData: function (data) {
    Dispatcher.setData(data);
  }
};

// The data cycle.
store.onChange(function () {
  // End of data cycle.
  document.getElementById('result').innerText = store.store.data;
});

document.getElementById('dataChanger').onclick = function () {
  // Start data cycle:
  Actions.setData(Math.random());
};

Run this example on JSFiddle

Docs

You can read the tutorial to learn how to start using DeLorean.js with your favorite framework.

Basic Concepts

Or you can visit documents page.

License

MIT License