javascript - Fetch initial page data with ReactJS + Redux + Cloud Endpoints -

i use reactjs + redux + google cloud endpoints. now, initial page load have fetch , display data via cloud enpoints. how accomplished? full code examples appreciated!

you mount app blank slate, overlays, or loading spinners, , fetch data inside componentdidmount(). the react docs.

load initial data via ajax

fetch data in componentdidmount. when response arrives, store data in state, triggering render update ui.

when fetching data asynchronously, use componentwillunmount cancel outstanding requests before component unmounted.

this example fetches desired github user's latest gist:

var usergist = react.createclass({   getinitialstate: function() {     return {       username: '',       lastgisturl: ''     };   },    componentdidmount: function() {     this.serverrequest = $.get(this.props.source, function (result) {       var lastgist = result[0];       this.setstate({         username: lastgist.owner.login,         lastgisturl: lastgist.html_url       });     }.bind(this));   },    componentwillunmount: function() {     this.serverrequest.abort();   },    render: function() {     return (       <div>         {this.state.username}'s last gist         <a href={this.state.lastgisturl}>here</a>.       </div>     );   } });  reactdom.render(   <usergist source="https://api.github.com/users/octocat/gists" />,   mountnode );