Tap Flux
Tap Flux makes writing React apps with Flux architecture really simple. We designed Tap Flux for reusable modules from the ground up.
Install
npm i tap-flux -S
Getting Started
var tapFlux = ;var TodoList = tapFlux; TodoList ;
How it works
Module methods can be chained (above) or they can also be split into separate files:
var TodoList = ; TodoList;
Nothing is exported because all parts of a module are accessed through the module:
createActionTypes
Attaches constants to TodoList.actionTypes
.
Recursively Mirrors the key-value pairs so that
the object's values can be whatever you want.
The above example would produce:
TodoListactionTypesADD_ITEM //=> 'ADD_ITEM'TodoListactionTypesREMOVE_ITEM //=> 'REMOVE_ITEM'
createActions
Attaches actions to TodoList.actions
.
The above example would produce:
TodoListactionsaddItem //=> FunctionTodoListactionsremoveItem //=> Function
createStore
Attaches a store to TodoList.stores
.
Methods that have the onDoThing
syntax
are linked to actionTypes, so onDoThing
is ran everytime DO_THING
is emitted.
A warning will be sent to your console
if you have unlinked actionTypes or
setter functions.
The above example would produce:
TodoListstoresitemStore //=> Store
Overview
Our mission is abstract away all the flux boilerplate and provide a basic modular structure for scalable applications.
One Tap Flux
You have one Tap Flux instance per application consisting of:
- Flux Dispatcher
Modules
A Tap Flux module is a self contained reusable feature consisting of:
- Constants
- Actions
- Stores
- Preregistered with the dispatcher.
waitFor([])
is supported inline anywhere in an action handler.alwaysWaitFor = []
allows thisStore's all action handlers to always wait for thatStore to finish updating.
Examples
We've rewritten the Facebook's Flux Chat Example in /examples/tap-flux-chat
.
Development
Setup
npm start
- Installs dependencies and starts gulp.
Hacking
gulp
- Build, watch for changes, and serve doc site.- Hack on
/src
. Builds are automatically created, but not published to npm. - Commit and push changes.
Testing
npm test
- Run unit tests.npm run test-watch
- Run unit tests, watch for changes and rerun.
Documentation
gulp doc
- Generates documentation.
Publish
After merging a PR:.
- Checkout and pull master
npm adduser
- add your npm user, this is only needed once.gulp deploy -v <major|minor|patch|premajor|preminor|prepatch|prerelease> [-m <commit message>]
This will update /dist
, /docs
, and publish a new version of the npm package.