10 Standout GitHub Profile READMEs
Tags: codeland, github, actions, readme
Published: 2020-07-23 16:18:54

---
title: 
published: true
description: 
tags: 
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/229f2mqmazoh7e6p9ctg.png
---

My good friend and colleague [@bdougieyo](https://dev.to/bdougieyo) is at [Codeland](https://codelandconf.com/) today and is giving away early access to [Codespaces](https://github.com/features/codespaces/) to three lucky people who create a profile README (a new feature we quietly launched a few weeks ago).

If you're looking for some inspiration, or information on how to actually enable this on your profile, here are a few READMEs that have jumped out at me over the last few weeks. Everything from purely cosmetic and informational, to truly hacktacular, computationally ~~expensive~~ impressive, and entertaining works of art 👌🏻

## 1 Hello, world!

Set yourself apart from everyone else with a brief biography, colorful header image, and links to find you elsewhere on the web - just like [@M0nica][profile-M0nica]:

[![][image-M0nica]][readme-M0nica]

**Fun fact:** [@M0nica][profile-M0nica] just published a [blog post about how to create a GitHub profile README](https://www.aboutmonica.com/blog/how-to-create-a-github-profile-readme). That's a great starting point if you're thinking about adding one yourself.



## 2 Show off your stats  💪🏻

I may have [talked about this before elsewhere](https://github.blog/2020-04-09-github-protips-tips-tricks-hacks-and-secrets-from-lee-reilly/#9-a-numbers-game), but if you're using GitHub as a resume / portfolio, this nifty little tool from [@anuraghazra][profile-anuraghazra] can show off your stats in a nice way. Enabling it on your repository is pretty easy with [github-readme-stats](https://github.com/anuraghazra/github-readme-stats).

[![][image-anuraghazra]][readme-anuraghazra]


## 3 Don’t forget to sign the guestbook on your way out

My good friend [@JasonEtco][profile-jasonetco] is always pushing GitHub, Actions. and just about everything else web-related to it's limits. He built a guestbook on his profile using GitHub Actions. I'm just waiting on the support for hit counters, webrings, dancing babies, etc. and we'll have come full circle!

[![][image-jasonetco]][readme-jasonetco]

**Please help me:** Consider dropping by Jason's profile page, and sharing a fun joke, or perhaps a completely random fun fact on his guestbook. He doesn't know about this post, so he'll hopefully have no idea where the comments are all coming from<sup>*</sup> 😂

<sup>* <strong>Note to self:</strong> remember to remove Jason's access to the server logs tomorrow...</sup>


## 4 Hit counter :one: :three: :three: :seven:

Speaking of numbers, display your profile’s visitor count with this nifty little SVG solution. If you're as ~~old~~ experienced as me, you'll remember when _every_ web page used to have one of these. Thanks [@sagar-viradiya][profile-sagar-viradiya]!

[![][image-sagar-viradiya]][readme-sagar-viradiya]


## 5 Shall we play a game?

It was only a matter of time until someone added a game to their profile README. This community-powered Connect4 game does exactly what you imagine. Very impressive, [@jonathangin52][profile-jonathangin52] :blue_heart: :heart:


[![][image-jonathangin52]][readme-jonathangin52]

## 6 Wouldn’t you prefer a good game of chess? ♞ ♖

I could really get on BOARD with more games on profiles. I'd definitely CHECK them all out...

You guessed it! You can also play chess thanks to this little gem from [@timburgan][profile-timburgan]. Simply click a link to create an issue with your move command, and a GitHub Actions Workflow will take it from there.

[![][image-timburgan]][readme-timburgan]

## 7 Speaking of games…

[@ethomson][profile-ethomson]'s _contribution_ to the world of profile READMEs is a Game of Life simulation with a familiar look and feel :green_heart:

[![][image-ethomson]][readme-ethomson]

Behind the scenes it uses libraries called [contributions](https://www.npmjs.com/package/contributions) (creating a data structure with a GitHub contribution graph) and [dat-life](https://www.npmjs.com/package/dat-life) (supporting a Conway's Game of Life implementation). Read more about it [here](https://github.com/ethomson#how-does-it-work).

## 8 Now playing in a README near you ♩ ♪ ♫ ♬

An SVG dynamically rendered with a Vercel serverless function, and integrated with the Spotify API? BOOM! You have yourself an image displaying what you're listening to. Bravo, [@natemoo-re][profile-natemoo-re]. Bravo :clap:

[![][image-natemoo-re]][readme-natemoo-re]

I can't wait to get this spun up on my profile! :metal:


## 9 Self-updating README

[@simonw][profile-simonw]'s profile literally updates itself–with latest releases, blog posts, and things learned–using GitHub Actions. Simon goes into it in more detail in [this blog post](https://simonwillison.net/2020/Jul/10/self-updating-profile-readme/) if you're curious how it works under the hood.

[![][image-simonw]][readme-simonw]



## 10 Jump to it!

Last, but not least. It might _just_ be a GIF, but by golly, I've been watching it for _hours_. This familiar-looking animation captured by [@saadeghi][profile-saadeghi] shows that even the addition of a simple image can add a bit of character to your profile, and make it really _jump_ out.

[![][image-saadeghi]][readme-saadeghi]

Hopefully these examples have given you some fresh ideas to add your own profile README. Enabling it is easy. Simply follow these [instructions](https://www.aboutmonica.com/blog/how-to-create-a-github-profile-readme#how-do-i-create-a-profile-readme). I'd love to see yours - be sure to leave a link in the comments below :)



<!-- BEGIN LINKS -->

<!-- #Notes -->
[profile-TEMPLATE]:       https://github.com/TEMPLATE                       "GitHub user @TEMPLATE's profile"
[readme-TEMPLATE]:        https://github.com/TEMPLATE/TEMPLATE              "The README file powering @TEMPLATE's profile"
[image-TEMPLATE]:         template.gif                                      "ALT"

<!-- #MySpace -->
[profile-bdougie]:        https://github.com/bdougie                        "GitHub user @TEMPLATE's profile"
[readme-bdougie]:         https://github.com/bdougie/bdougie                "The README file powering @TEMPLATE's profile"

<!-- #Statorama -->
[profile-anuraghazra]:    https://github.com/anuraghazra                    "GitHub user @TEMPLATE's profile"
[readme-anuraghazra]:     https://github.com/anuraghazra/anuraghazra        "The README file powering @TEMPLATE's profile"
[image-anuraghazra]:      https://dev-to-uploads.s3.amazonaws.com/i/57l037f9nmbkhi56947p.png                                   "ALT"

<!-- #GameOfLife -->
[profile-ethomson]:       https://github.com/ethomson                       "GitHub user @TEMPLATE's profile"
[readme-ethomson]:        https://github.com/ethomson/ethomson              "The README file powering @TEMPLATE's profile"
[image-ethomson]:         https://dev-to-uploads.s3.amazonaws.com/i/xffpqxdsofxjsefdm2lu.gif                               "ALT"

<!-- #Guestbook -->
[profile-jasonetco]:      https://github.com/jasonetco                      "GitHub user @TEMPLATE's profile"
[readme-jasonetco]:       https://github.com/jasonetco/jasonetco            "The README file powering @TEMPLATE's profile"
[image-jasonetco]:        https://dev-to-uploads.s3.amazonaws.com/i/tsw5ab0f4jhua3ayrnlw.png                                    "ALT"

<!-- #Connect4 -->
[profile-jonathangin52]:  https://github.com/jonathangin52                  "GitHub user @TEMPLATE's profile"
[readme-jonathangin52]:   https://github.com/jonathangin52/jonathangin52    "The README file powering @TEMPLATE's profile"
[image-jonathangin52]:    https://dev-to-uploads.s3.amazonaws.com/i/ijegz9a4qrqh3tpxz95j.png                                 "ALT"

<!-- #Tetris -->
[profile-leereilly]:      https://github.com/leereilly                      "GitHub user @TEMPLATE's profile"
[readme-leereilly]:       https://github.com/M0nica/leereilly               "The README file powering @TEMPLATE's profile"

<!-- #Cosmetic -->
[profile-M0nica]:         https://github.com/M0nica                         "GitHub user @TEMPLATE's profile"
[readme-M0nica]:          https://github.com/M0nica/M0nica                  "The README file powering @TEMPLATE's profile"
[image-M0nica]:           https://dev-to-uploads.s3.amazonaws.com/i/3xva5zi6re24fr2w2sg3.png                                    "ALT"

<!-- Playlist -->
[profile-natemoo-re]:     https://github.com/natemoo-re                     "GitHub user @TEMPLATE's profile"
[readme-natemoo-re]:      https://github.com/natemoo-re/natemoo-re          "The README file powering @TEMPLATE's profile"
[image-natemoo-re]:       https://dev-to-uploads.s3.amazonaws.com/i/3jus0054efao954wtpi2.gif                                "ALT"

<!-- #DinoRun -->
[profile-saadeghi]:       https://github.com/saadeghi                       "GitHub user @TEMPLATE's profile"
[readme-saadeghi]:        https://github.com/saadeghi/saadeghi              "The README file powering @TEMPLATE's profile"
[image-saadeghi]:         https://dev-to-uploads.s3.amazonaws.com/i/9mtznxfpdeuq48ed1el8.gif                               "ALT"

<!-- Hit counter -->
[profile-sagar-viradiya]: https://github.com/sagar-viradiya                 "GitHub user @TEMPLATE's profile"
[readme-sagar-viradiya]:  https://github.com/sagar-viradiya/sagar-viradiya  "The README file powering @TEMPLATE's profile"
[image-sagar-viradiya]:   https://dev-to-uploads.s3.amazonaws.com/i/zm0ukck1i8yyakr9gsnw.png           "ALT"

<!-- #SelfUpdatingReadme -->
[profile-simonw]:           https://github.com/simonw                       "GitHub user @TEMPLATE's profile"
[readme-simonw]:            https://github.com/simonw                  "The README file powering @TEMPLATE's profile"
[image-simonw]:             https://dev-to-uploads.s3.amazonaws.com/i/iblyzpxs79q4xvnb4ows.png                                       "ALT"

<!-- #Chess -->
[profile-timburgan]:      https://github.com/timburgan                      "GitHub user @TEMPLATE's profile"
[readme-timburgan]:       https://github.com/timburgan/timburgan            "The README file powering @TEMPLATE's profile"
[image-timburgan]:        https://dev-to-uploads.s3.amazonaws.com/i/rssaaazzw63t5mjj9363.png                                    "ALT"

<!-- END links -->