src/github-components.js
/**
     * <p>
     * Fetch the Sid's projects(repos) from GitHub. This should be done in the constructor of the component.
     * 
     * <p>
     * Another problem is that this function has an AJAX call inside, so the component needs to update after
     * the AJAX's success is called.
     */

Fetch the Sid's projects(repos) from GitHub. This should be done in the constructor of the component.


Another problem is that this function has an AJAX call inside, so the component needs to update after
the AJAX's success is called.
Fetch the Sid ' s projects ( repos ) from GitHub . This should be done in the constructor of the component . Another problem is that this function has an AJAX call inside so the component needs to update after the AJAX ' s success is called .
_fetchGitHubProjects() {
      let user = this.props.user;
      let component = this;
      jQuery.ajax({
        url: `https://api.github.com/users/${user}/repos?per_page=1000`,
        jsonp: true,
        method: "GET",
        dataType: "json",
        success: function (res) {
          if (typeof res === "object") {
            gitHCards._languages = component._myLanguages(res);
            component.setState(
              {
                projectCards: component._sortByDate(res).map(component._constructProjectCards)
              }
            );
            /////////////
            /////////////
          } else {
            console.log("Not a valid response, please contact Sid :)");
          }
        },
        error: function (e, status) {
          console.log(e, status);
        }
      });
    }
_fetchGitHubProjects ( ) { let user = this . props . user ; let component = this ; jQuery . ajax ( { url : ` ${ user } ` , jsonp : true , method : "GET" , dataType : "json" , success : function ( res ) { if ( typeof res === "object" ) { gitHCards . _languages = component . _myLanguages ( res ) ; component . setState ( { projectCards : component . _sortByDate ( res ) . map ( component . _constructProjectCards ) } ) ; } else { console . log ( "Not a valid response, please contact Sid :)" ) ; } } , error : function ( e , status ) { console . log ( e , status ) ; } } ) ; }
<p>
 Fetch the Sid's projects(repos) from GitHub.
<p > Fetch the Sid ' s projects ( repos ) from GitHub .
///////////////////////////////////// // get the user from Component's props ///////////////////////////////////// // since the `this` inside the callback is not the component anymore, // need to close over it ///////////////////////////////////// // res is an Array of objects // console.log(res); ////////////////////////////////////////////////// // component.forceUpdate(() => console.log("done!")); //////////////////////////////////////////////////