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

[leereilly]

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 🍻

[jack-lewin]

I'd love to give this a go! Shall I fork & PR or would you rather keep the two implementations separate?

[leereilly]

Awesome - thanks @jack-lewin! Please feel free to fork this this repo and create a PR 🤘🎃

[jack-lewin]

@leereilly still need to write tests before I create a PR, but here's my effort in the meantime.

Let me know if there are any problems! ✌️

[leereilly]

This is awesome, @jack-lewin - nice to see the avatars show up again also! Can't wait to merge with with master 🤘

I wonder if there's an opportunity to move away from Heroku to do all of it client-side and host it on GitHub Pages? E.g. something like https://github.com/andrew/first-pr?

[jack-lewin]

@leereilly sure thing! I'm pretty busy over the next few days, but will take a look as soon as I get the chance 🙂

[jack-lewin]

Hi @leereilly! Just been looking at getting this to work on GitHub Pages.

My understanding is that it's possible to achieve, but not without breaking old links - see this article for reference.

A possible solution would be to structure URLs as gitscore.herokuapp.com/#user/repo... this would break old links, but work with GitHub Pages.

What do you reckon? 🎃

[leereilly]

Hi @jack-lewin - thanks for looking into it! For this particular app, I don't think we need to be concerned about breaking (uniquer) links aren't indexed / hardcoded in too many places. Your approach good to me!