Flux
Flux is the application architecture Facebook uses to build JavaScript applications. It’s based on a unidirectional data flow
Dispatcher
Singleton
Callbacks into Stores
No intelligence
Distributes Actions to Stores
Almost like pub-sub, with some differences:
Callbacks are not subscribed to particular events. Every payload is dispatched to every registered callback.
Callbacks can be deferred in whole or part until other callbacks have been executed.
Stores
Application state and logic
Similar to Model in MVC, but manages state of all objects.
Registers itself to the dispatcher
Manages a particular domain within the application
Collection of models and a singleton model of logical domain
Callback receives actions as parameter
Broadcast event when state changes
Views handle the events
Views and Controller-Views
Receive event
Gets data from store
Calls setState() or forceUpdate()
Actions
Dispatcher exposes a methods called DoAction
Code
Dispatcher
Register(callback)
Registers a callback to be invoked with every dispatched payload. Returns a token that can be used with waitFor()
Unregister(id)
Removes a callback based on its token
WaitFor(id[])
Waits for the callbacks specified to be invoked before continuing execution of the current callback. This method should only be used by a callback in response to a dispatched payload.
Dispatch(payload)
Dispatches a payload to all registered callbacks.
isDispatching()
Is this Dispatcher currently dispatching.
Resources
https://github.com/facebook/flux/
https://github.com/facebook/flux/tree/master/examples/flux-concepts
https://facebook.github.io/flux/docs/in-depth-overview.html#content
https://github.com/facebook/flux/tree/master/examples/flux-todomvc/
https://reactjs.org/blog/2014/07/30/flux-actions-and-the-dispatcher.html