Easily use Github Avatars

tldr: You can use avatars from Github by adding .png to the end of a profile url. For instance this will show you my Github Avatar: https://github.com/coreyja.png

On stream on Sunday I was working on adding a Leaderboard for some coding 'games' that I'm going to be adding to the site soon! It's all based on Github usernames, and thats what I am displaying on the Leaderboard. And I wanted to also include a Users github avatar!

I had assumed I was going to need to hit the API to get an avatar for the user, and probably cache that somewhere on my side to avoid needing to make an API call for each page view.

But it turns out there is an easier way!

Github makes it really easy to grab a Users avatar, no API calls needed! You can just append .png to a users profile URL to get their avatar. This worked great in an img HTML tag!

Here is an HTML img tag that will display my Github Profile avatar!

<img src="https://github.com/coreyja.png">