Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

redux-fetch-dispatch

KaleoSoftware22MIT0.0.6

Simple fetch-then-dispatch function for redux.

redux, tape

readme

redux-fetch-dispatch

Connect your redux app to your api without using redux-thunk

npm install --save redux-fetch-dispatch
fetchDispatch('api.example.com', receiveAction)(store.dispatch)

Motivation

The Redux docs recommend using redux-thunk for getting data from an API and then dispatching an action when it comes back.

This ends up creating a lot of unnecessary action creators with hard-coded URLs, spread out over many files. It's also difficult to test these action creators without mocking a server connection.

AND, if your API returns urls for use, you're kinda SOL.

Thus, redux-fetch-dispatch ;)

Composition

/src/constants/URLs.js

const BASE_URL = "https://api.my-company.com"

export const POST = (id) => BASE_URL+'/posts/'+id

to make a call to the api (say on route change):

store = createStore(...)

let matches = window.location.pathname.match(/^\/posts\/([0-9]+)$/)

fetchDispatch(URLs.POST(matches[1]), receivePost)(store.dispatch)

/src/actions/posts.js

export function receivePost(post) {
    return {
        type: 'RECEIVE_POST,
        payload: post
    }
}

Thanks!! :)

License

MIT