Project listing using GitHub's API

GitHub provides an API to fetch all kind of information about users and repositories on demand. I used it to create a project listing.

GitHub pages is a feature that allows you to host static sites directly at GitHub. You can create project specific sites per repository in an extra gh-pages branch or user pages in an extra repository named <username>.github.io.

A while ago, I created a GitHub user page which contained a small overview over my side projects hosted at GitHub. Shortly after that, I discovered the user page of Nicolas Gallagher that used the GitHub API and a little bit of JavaScript to fetch information about his repositories dynamically and embed the information into an HTML page.

I think this is really elegant! I copied the idea and wrote some JavaScript myself for my GitHub user page. Today, I copied the code over to the repository of my blogging CMS and created a projects page. It's linked in the main navigation above, next to the "About" link.

To demonstrate how easy it is to use the GitHub API to fetch repository information, look at the jQuery example above which prints the names of all repositories of a user to the console.

var user = 'nsommer'

$.ajax({
  url: 'https://api.github.com/users/' + user + '/repos',
  method: 'GET',
  dataType: 'json'
}).done(function (data) {
  for (var index in data) {
    var repo = data[index]
    console.log(repo.name)
  }
})