mofelee/redux-boot

Modular Redux bootstrap with asynchronous side-effects.

Redux Boot

Modular Redux bootstrap with asynchronous side-effects.

What is Redux Boot?

Minimal Framework using Redux to develop modularized universal (backend and frontend) applications, based on functional programming paradigms and friends such as Map and Reduce, Immutability and Reactive programming.

"Simplicity is the ultimate sophistication." -- Leonardo da Vinci

What Redux Boot provides?

• Module API - Clean organization and reuse patterns for your code.
• Async side-effects - No-brainer async side-effects with redux-actions and redux-promise.

Examples:

• Todo MVC example.
• The bootstrap tests.
• Simple web server App.

Documentation

For more details see the documentation.

Getting started

Install

npm install redux-boot --save

Basic Usage

import boot, {BOOT} from 'redux-boot'

const initialState = {
  foo: 'bar'
}

const testModule = {
  reducer: {  
    [BOOT]: (state, action) => {
      return {
        ...state,
        foo: 'baz'
      }
    }
  }
}

const modules = [
  testModule
]

const app = boot(initialState, modules)

app.then(({action, store}) => {

  // Should print 'baz'.
  console.log(store.getState().foo)
})

Sync middleware (with redux-actions)

import boot, {BOOT} from 'redux-boot'
import {createAction} from 'redux-actions'

const CHANGE_FOO = 'redux-boot/test/CHANGE_FOO'

const changeFoo = createAction(CHANGE_FOO)

const initialState = {
  foo: 'bar'
}

const testModule = {
  reducer: {
    [CHANGE_FOO]: (state, action) => {
      return {
        ...state,
        foo: action.payload
      }
    }
  },

  middleware: {
    [BOOT]: store => next => action => {
      store.dispatch(changeFoo('baz'))
      return next(action)
    }
  }
}

const modules = [
  testModule
]

const app = boot(initialState, modules)

app.then(({action, store}) => {

  // Should print 'baz'.
  console.log(store.getState().foo)
})

Async middleware (with redux-action and redux-promise)

import boot, {BOOT} from 'redux-boot'
import {createAction} from 'redux-actions'

const CHANGE_FOO = 'redux-boot/test/CHANGE_FOO'

const changeFoo = createAction(CHANGE_FOO, async (value) => {

  return new Promise((resolve, reject) => {
    setTimeout(() => resolve(value), 1)
  })
})

const initialState = {
  foo: 'bar'
}

const testModule = {
  reducer: {
    [CHANGE_FOO]: (state, action) => {
      return {
        ...state,
        foo: action.payload
      }
    }
  },

  middleware: {
    [BOOT]: store => next => async action => {
      const result = next(action)
      await store.dispatch(changeFoo('baz'))
      return result
    }
  }
}

const modules = [
  testModule
]

const app = boot(initialState, modules)

app.then(({action, store}) => {

  // Should print 'baz'.
  console.log(store.getState().foo)
})

Development setup:

Install

git clone https://github.com/choko-org/redux-boot.git
npm install

Build

npm run build

Build and Run the tests

npm test

License

MIT