nux
v2.1.1
Published
A push-based functional reactive web application framework
Downloads
65
Maintainers
Readme
####A Push-Based Functional Reactive Web Application Framework
Nux combines redux, virtual-dom, and immutable-js into a framework that enables the creation of applications whose entire state, UI included, lives in one large immutable object which can only be modified by creating a new state from provided reducer functions. Nux is not just another framework for binding application data to UI templates - it cuts out the middle man by treating UI and application data as one, single object, thus guaranteeing perfect agreement on state throughout an application's lifecycle. Nux can run on the client, on the server, or even in web workers to provide blazing fast rendering.
####Try the simple example todo app
####Try the example TodoMVC app
###Example
import init from 'nux';
import {selector} from 'nux/utils';
init(
// first argument is your reducer - the only concern that modifies your app's state
(state, action) => {
switch (action.type) {
case 'SUBMIT_STATEMENT':
const inputVal = selector('div#hw input props value');
return state.setIn(selector('div#hw h5 $text'), state.getIn(inputVal))
.setIn(inputVal, '');
}
return state;
},
// second argument is your initial app UI state represented as a Nux vDom object
{
'div#hw': {
children: {
'h5': {
},
'input': {
props: {
placeholder: 'type and hit enter..',
events: {
'ev-keyup-13': {
dispatch: {
type: 'SUBMIT_STATEMENT'
}
}
}
}
}
}
}
},
// third argument is your options where you can enable action and state logging
{logActions: true},
// fourth argument is the dom element you want your Nux app to render inside of
document.querySelector('#hello-world-container')
); // That's all she wrote!