Fluxxor for React

Alex R. Young





facebook reactive

Fluxxor for React

Posted by Alex R. Young on .

facebook reactive

Fluxxor for React

Posted by Alex R. Young on .

Fluxxor (GitHub: BinaryMuse / fluxxor, License: MIT, Bower: fluxxor) by Brandon Tilley is a library designed to work with Facebook's React. It provides an application architecture that's based around a dispatcher, stores, and views.

Instantiating a Flux application looks like this:

var flux = new Fluxxor.Flux(stores, actions);  

The stores object contains classes that are created with Fluxxor.createStore, and the actions object is a set of methods that invoke that dispatcher:

var actions = {  
  addTodo: function(text) {
    this.dispatch("ADD_TODO", {text: text});

  toggleTodo: function(todo) {
    this.dispatch("TOGGLE_TODO", {todo: todo});

  clearTodos: function() {

These examples were taken from the Fluxxor quick start guide, which explains how to write a to-do list with Flux.

Fluxxor provides more tools as well. Fluxxor.FluxMixin can be used to make Flux instances available to React components, and Fluxxor.StoreWatchMixin allows you to watch for change events on Flux stores.

You can use Fluxxor outside of React, and it's installable with Bower as fluxxor. Brandon, the author of the library, pointed out that Fluxxor is his personal implementation of the Flux pattern which was created by Jing Chen at Facebook.