Home

Awesome

redux-gen

Codeship Status for weo-edu/redux-gen js-standard-style

Generator middleware for redux. Allows you to write action creators that return generators, enabling apps to push all side effects into a small set of effects middleware.

Installation

$ npm install redux-gen

Usage

Push side effects to edges by putting all io in middleware.

import { createStore, applyMiddleware } from 'redux'
import gen from 'redux-gen'
import rootReducer from './reducers/index'
import fetch from 'isomorphic-fetch'

// create a store that has redux-thunk middleware enabled
const createStoreWithMiddleware = applyMiddleware(
  gen()
  fetch
)(createStore);

const store = createStoreWithMiddleware(rootReducer);

// returns [
//  {username: "josh", id: 1},
//  {username: "tio", id: 2},
//  {username: "shasta", id: 3}
// ]
store.dispatch(getUsers())

// Side Effects Middleware

function fetch ({dispatch, getState}) {
  return next => action =>
    action.type === 'FETCH'
      ? fetch(action.payload.url, action.payload.params).then(res => res.json())
      : next(action)
}

// Actions

function getUsers * () {
  let userIds = yield {url: '/users', method: 'GET', type: 'FETCH'}
  return yield userIds.map(userId => ({url: '/user/' + userId, method: 'GET', type: 'FETCH'}))
}

License

MIT