fluxible

Fluxible

Pluggable, singleton-free container for isomorphic Flux applications.

$ npm install --save fluxible

Docs

• Quick Start
• API

Features

• Singleton-free for server rendering
• Server dehydration for client bootstrapping
• Stateless async actions
• React mixin and component for easy integration
• Enforcement of Flux flow - restricted access to the Flux context from within components
• Pluggable - add your own interfaces to the Flux context
• Updated for React 0.13

Extras

• Yeoman generator
• Example Applications
• Fluxible Routing
• Isomorphic Data Services

Usage

var Fluxible = require('fluxible');
var React = require('react');

// Action
var action = function (context, payload, done) {
    context.dispatch('FOO_ACTION', payload);
    done();
};

// Store
var createStore = require('fluxible/addons').createStore;
var Store = createStore({
    storeName: 'FooStore',
    handlers: {
        'FOO_ACTION': 'fooHandler'
    },
    initialize: function () { // Set the initial state
        this.foo = null;
    },
    fooHandler: function (payload) { 
        this.foo = payload;
    },
    getState: function () {
        return {
            foo: this.foo
        }
    }
});

// Component
var App = React.createClass({
    mixins: [Fluxible.FluxibleMixin], // Calls onChange when storeListeners emit change
    statics: {
        storeListeners: [Store]
    },
    getInitialState: function () {
        return this.getStore(Store).getState();
    },
    onChange: function () {
        this.setState(this.getStore(Store).getState());
    },
    render: function () {
        return <span>{this.state.foo}</span>
    }
});

// App
var fluxibleApp = new Fluxible({
    component: App
});
fluxibleApp.registerStore(Store);

// Bootstrap
var context = fluxibleApp.createContext();
context.executeAction(action, 'bar', function () {
    console.log(React.renderToString(context.createElement()));
});

License

This software is free to use under the Yahoo Inc. BSD license. See the LICENSE file for license text and copyright information.