CODEWITHSUNDEEP
arraysreactjsapigithubgithub-api
jsnoobie
jsnoobie

Reputation: 115

Read public gists from Github and storing values in Reactapp

I am creating a webapp on react where when you search for a user you can view that users public gists, files and people who have forked their projects.

I was previously able to get values from https://api.github.com/users?since=1234 by looping through the values:

<div>
    {
      users.map((user, i) => {
        return <Usercard
          key={users[i].id}
          //Virtual DOM needs key prop to keep track of cards
          username={users[i].login}
          avatar={users[i].avatar_url}
          profile={users[i].html_url}
          />
      })
    }
</div>

However when I use https://api.github.com/gists/public I am a bit lost with the function to read the data from these group of arrays such as files, forks_url, owner properties and so on as I am unable to get the values.

I am calling the data like so:

componentDidMount() {
  fetch('https://api.github.com/users')
  .then(response => response.json())
  .then(users => this.setState({users: users}));
}

Upvotes: 0

Views: 288

Answers (1)

Johnson Samuel
Johnson Samuel

Reputation: 2076

In gist URL https://api.github.com/gists/public

The user info is under owner object, if thats what you are looking for.

Pseudo code for rendering gists info in a table:

 const renderUserInfo = data.map((value, key) => {
        return <tr key={key}>
            <td>
                {value.owner.login}
            </td>
            <td>
                {value.owner.url}
            </td>
        </tr>
    });

Hope this helps. Let me know if you are still having trouble :D

Upvotes: 1

Related Questions