Migrate this Ruby/Sinatra app to an HTML/JS app 🎃

I built this little web app 6 years ago to experiment with Heroku, Sinatra and the GitHub API. I think it'd be cool to see it reimplemented as a simple HTML + JS app hosted on GitHub Pages. If any Hactoberfesters would be interested in tackling this, I'd welcome your help 🎃

How to use it

Visit http://gitscore.herokuapp.com, and enter in any public GitHub repository into the textfield. You'll see a high score table similar to the following:

How it works

The app basically takes the repository that the user enters and hits the GitHub API for a list of contributors (see the Repository › List Contributors endpoint). E.g. For the leereilly/games repository, it'd make a call to the following:

https://api.github.com/repos/leereilly/games/contributors ^{TRY IT}

Which would return a JSON object like this:

[
  {
    "login": "leereilly",
    "id": 121322,
    "avatar_url": "https://avatars.githubusercontent.com/u/121322?v=3",
    "gravatar_id": "",
    "url": "https://api.github.com/users/leereilly",
    "html_url": "https://github.com/leereilly",
    "followers_url": "https://api.github.com/users/leereilly/followers",
    "following_url": "https://api.github.com/users/leereilly/following{/other_user}",
    "gists_url": "https://api.github.com/users/leereilly/gists{/gist_id}",
    "starred_url": "https://api.github.com/users/leereilly/starred{/owner}{/repo}",
    "subscriptions_url": "https://api.github.com/users/leereilly/subscriptions",
    "organizations_url": "https://api.github.com/users/leereilly/orgs",
    "repos_url": "https://api.github.com/users/leereilly/repos",
    "events_url": "https://api.github.com/users/leereilly/events{/privacy}",
    "received_events_url": "https://api.github.com/users/leereilly/received_events",
    "type": "User",
    "site_admin": true,
    "contributions": 189
  },
  {
    "login": "jhgrng",
    "id": 4649289,
    "avatar_url": "https://avatars.githubusercontent.com/u/4649289?v=3",
    "gravatar_id": "",
    "url": "https://api.github.com/users/jhgrng",
    "html_url": "https://github.com/jhgrng",
    "followers_url": "https://api.github.com/users/jhgrng/followers",
    "following_url": "https://api.github.com/users/jhgrng/following{/other_user}",
    "gists_url": "https://api.github.com/users/jhgrng/gists{/gist_id}",
    "starred_url": "https://api.github.com/users/jhgrng/starred{/owner}{/repo}",
    "subscriptions_url": "https://api.github.com/users/jhgrng/subscriptions",
    "organizations_url": "https://api.github.com/users/jhgrng/orgs",
    "repos_url": "https://api.github.com/users/jhgrng/repos",
    "events_url": "https://api.github.com/users/jhgrng/events{/privacy}",
    "received_events_url": "https://api.github.com/users/jhgrng/received_events",
    "type": "User",
    "site_admin": false,
    "contributions": 84
  }
]

Then it just takes that first list of users (already ordered by number of contributions), and throws 'em in a table. To calculate the high score, it just multiplies the contributions value by 10.

Once we have an MVP, I may have some additional feature requests. Comments and questions most welcome! 😉

Cheers,
Lee 🍻

Start by reviewing the linked github-high-scores app and its current Heroku behavior, then read the GitHub Repository › List Contributors API endpoint described in the issue. Recreate the repository lookup, contributor table, and contribution-based score as a simple HTML and JavaScript app hosted on GitHub Pages; done means the MVP accepts a public repository and displays equivalent results.