Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 1,000,000+ packages pre-installed, including fluxter with all npm packages installed. Try it out:

var fluxter = require("fluxter")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

fluxter v1.1.4

Simple container of unidirectional data flow.

view on npm npm module downloads Build Status Coverage Status Dependency Status Join the chat at https://gitter.im/fluxter

Fluxter is a simple container of unidirectional data flow.

Fluxter data flow

Install

$ npm install --save fluxter

Classes

Fluxter

Functions

addReducer(stateKey, reducer)

Add reducer to store

addMiddleware(middleware)

Add middleware to store

addAction(actionName, action)

Add action to store

dispatch(actionName, ...args)

Dispatch action to store

subscribe(handler)

Add handler

next(actionData)

Call next middleware or done

Fluxter

Kind: global class
Access: public

new Fluxter()

Class Fluxter

Example

let store = new Fluxter({
    user: {
        logged: false,
        name: null,
        token: null
    }
});

addReducer(stateKey, reducer)

Add reducer to store

Kind: global function

ParamTypeDescription
stateKeyStringA state field
reducerfunctionA pure function

Example

store.addReducer('user', (state = {}, actionName, actionData) => {
    if (actionName === 'login') {
        return {
            ...state,
            logged: actionData.logged,
            name: actionData.name,
            token: actionData.token
        };
    }
    return state;
});

addMiddleware(middleware)

Add middleware to store

Kind: global function

ParamTypeDescription
middlewarefunctionA middleware function

Example

store.addMiddleware('user', (store, actionName, actionData, next) => {
    if (actionName === 'login') {
        SomeRepository.check(actionData).then(data => next({
            ...data,
            ...actionData
        }));
    } else {
        next(actionData);
    }
});

addAction(actionName, action)

Add action to store

Kind: global function

ParamTypeDescription
actionNameStringAn action name
actionfunctionAn action creator function

Example

store.addAction('login', (name, password) => ({
    name,
    password
}));

dispatch(actionName, ...args)

Dispatch action to store

Kind: global function

ParamTypeDescription
actionNameStringAn action name
...args*Arguments that take action

Example

store.dispatch('login', 'example-name', 'example-password');

subscribe(handler)

Add handler

Kind: global function

ParamTypeDescription
handlerfunctionChange state handler

Example

store.subscribe(store => view.setState(store.state));

next(actionData)

Call next middleware or done

Kind: global function

ParamTypeDescription
actionData*An action data

Example

Online game SeaWars. Example of using Fluxter.

:boom: Try it out :boom:

Note on Patches/Pull Requests

  1. Fork the project.
  2. Make your feature addition or bug fix.
  3. Send me a pull request.

© 2017 Vasily Shilov

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free