Hask is a framework which implements the Flux-Architecture designed by Facebook. It is implement in ES6 to guarantee you a 100% integration into newer version of node. It is compatible with Node.js (ES5, ES6) but also with the Browser. It helps you writing asynchron applications without breaking your head and giving you a clean strucutre with Dispatchers.

Installation

You can install hask via NPM (Node Package Manager) via your systems command line interface if you'd like to use it as a Node.js dependency. Additionaly hask is avaible on bower since 2016 to enable you a stress-free install as a frontend dependency. The installations is pretty easy, just take a look below!

npm install hask --save
bower install hask --save

Platforms

If you decide to use hask within the browser, it is recommended to install it via bower and include the minified export under /dist. If you're planning to use hask with node and you're using a node environement which fully supports ES6, you can install the package via NPM and use the file /platforms/es6. If you want to use the ES5 version, just simply require('hask').

Custom Build

# Download the latest code from GitHub
git clone https://github.com/janbiasi/hask.git
cd hask

# Install Node.js dependencies
npm install

# Using Gulp to build
gulp

Supported Node.js Versions

• 6.x
• 5.x
• 4.x
• 0.1x
• iojs

Adjusting Build Process

If you want to adjust the whole building process - you can. Please visit the NPM or the GitHub repository of the few tasks in the gulpfile to get more information about them and their usage as well as configuration - thanks!

Usage

Content

| Class | Description | |----------------|-------------------------------| | StateMachine | A Manager for Dispatcher, Store, Constants and Actions | | Dispatcher | Handle payloads and delegate to the right action | | Store | Watchable Object to get notified about changes |

Node.js

If you're using Node.js to work with hask, you can use the default required keyword to render the hask module.

import {
    Store, Dispatcher,
    StateMachine as Machine
} from 'hask/platforms/es6';

const Store = new Store();
const Dispatcher = new Dispatcher();
const Machine = new Machine();

Browser

Using hask in the browser is pretty easy, it's global accessible via the window in your webapplication.

var Dispatcher = new Hask.Dispatcher();
var Machine = new Hask.StateMachine();
var Store = new Hask.Store();

Short Example

const Hask = require('hask');

const Store = new Hask.Store();
const Machine = new Hask.StateMachine({
    ADD: 'this is the add constant',
    REMOVE: 'this  is the remove event'
});

Store.set('value', 0);

Machine.Constants.ADD = 'this content will not be set';
Machine.Constants.ADD // this is the add ...

Machine.receive(payload => {
    switch(payload.target) {
        case Machine.Constants.ADD:
            Store.update('value', Store.get('value') + 1);
            break;
        case Machine.Constants.REMOVE:
            Store.update('vaue', Store.get('value') - 1);
            break;
        /* case ... */
        default: break;
    }
});

$('.btn-up').on('click', function(ev) {
    Machine.send({
        target: Machine.Constants.ADD,
        event: ev
    });
});

/* more listeners ... */
...

View full and complex examples