coryhouse / react-slingshot

React + Redux starter kit / boilerplate with Babel, hot reloading, testing, linting and a working example app built in
MIT License
9.74k stars 2.94k forks source link

add ajax structure support #96

Closed dc-me closed 7 years ago

dc-me commented 8 years ago

this boilerpate doesn't have ajax build in , it would be nice to add this .

coryhouse commented 8 years ago

Can you be more specific? Are you suggesting adding Redux thunk?

dc-me commented 8 years ago

yeah, I think every project needs ajax to get data.

kwelch commented 8 years ago

Are wanting to see a promise library included?

dc-me commented 8 years ago

ah, I was thinking Redux thunk + normalizr .

coryhouse commented 8 years ago

I have considered adding Redux thunk, but there are other popular alternatives like Sagas and redux-promise. All three are easy to wire up, so I'm not sold it's worth having an opinion on this.

darcnite3000 commented 8 years ago

I'd recommend adding the fetch polyfill though this assumes promises exist on the browser you use thus also recommend the es6-promise polyfill This is added to the plugins in webpack and gets it running quite nicely which i pulled from https://gist.github.com/Couto/b29676dd1ab8714a818f and http://mts.io/2015/04/08/webpack-shims-polyfills/

new webpack.ProvidePlugin({
      'Promise': 'es6-promise',
      'fetch': 'imports?this=>global!exports?global.fetch!whatwg-fetch'
    })
j5v commented 8 years ago

I've had good results from isomorphic-fetch, using a technique similar to the redux 'reddit' example, with action creators like this (noting that this could be abstracted into a wrapper for multiple API methods):

function fetchProducts(locationID) { // private
    return dispatch => {
        dispatch(requestProducts());
        return fetch(
            api.rootPath + api.catalogue + locationID,
            {
                method: 'GET',
                headers: {
                    'Accept': 'application/json'
                }
            }
        )
        .then(response => response.json())
        .then(json => dispatch(receiveProducts(json)));
    };
}
kwelch commented 7 years ago

Redux-thunk has been added and taking on any other async support at this point. Closing.