Coding Challenge #62 - Git Contributions Visualisation Tool

This challenge is to build your own version of the GitHub contributions visualisation.

Hi this is John with this week’s Coding Challenge.

🙏 Thank you for being one of the 55,217 software developers who have subscribed, I’m honoured to have you as a reader. 🎉

If there is a Coding Challenge you’d like to see, please let me know by replying to this email📧

Coding Challenge #62 - Build Your Own Git Contributions Visualisation Tool

This challenge is to build your own version of the GitHub contributions graph:

Contribution graphs like this are a great way gamify a task or process. Gamification is a way to motivate an activity by introducing elements of game design into a task. Typically it means things like:

• Awarding points for carrying out tasks.

• Giving badges to mark specific achievements.

• Creating leaderboards that highlight the most frequent contributors.

• Celebrating streaks to reward repeated consistent behaviour.

The approach can be great at helping us keep ourselves motivated to complete ongoing tasks like learning something or sticking to a diet.

I’ve going to use Git contributions for this Coding Challenge because it gives you an easy way to maximise your learning by first completing the build your own git client coding challenge to extract the data from a git repository.

If You Enjoy Coding Challenges Here Are Three Ways You Can Help Support It

1. Refer a friend or colleague to the newsletter. 🙏

2. Sign up for a paid subscription - think of it as buying me a coffee ☕️ twice a month, with the bonus that you also get 20% off any of my courses.

3. Buy one of my courses that walk you through a Coding Challenge.

The Challenge - Building A Contributions Visualisation Tool

In this coding challenge you will be building a tool to create a graphical visualisation of the commits made by a user.

Step Zero

Set up your IDE / editor and programming language of choice. You could take this in a few different directions building it as a CLI tool, desktop tool or even as a local analyser that pushes the data to a remote server for rendering on the web. The choice is yours.

Step 1

In this step your goal is to find the git repositories within a directory structure on your local machine. In other words if you have a folder structure like this:

.
|- ccwc
|   |- .git
|- ccsh
|   |- .git
|- ccredis
|   |- .git
|- docs

You should find that the folders ccwc, ccsh and ccredis contain a Git repository but docs does not.

Step 2

In this step your goal is to analyse a repository and determine how many commits there have been in the previous 30 days by the current user.

If you’re a new developer you can probably find a library for your tech stack that can parse a Git Repository and extract the details. If you are more experienced check out the coding challenge that has you building you own Git client and build your own module to parse the repository. It will be a huge additional learning opportunity.

Step 3

In this step your goal is to allow the user to specify a starting location for the search - i.e . to define what the root folder to begin looking for Git repositories is and to allow the user to specify a number of days to go back when generating the visualisation.

Step 4

In this step your goal is to calculate all the stats for each of the repositories. I’d suggest creating a test suite for this step so you can check the logic and ensure that you code correctly gathers the stats for a repo and correctly identifies the contributor

Step 5

In this step your goal is to render the contribution graph for the time period specified. I would suggest making it similar to the GitHub contribution graph, but if you’re feeling creative experiment and see if you can create an interesting alternative.

Going Further

Congratulations for getting this far. If you want to take it further here are some suggestions:

• Allow a per repository graph.

• Generate stats for each contributor.

• Cache the results, so you only need to recalculate for a repo since the last date. Handle edge cases.

2 Other Ways I Can Help You:

1. I write another FREE newsletter Developing Skills that helps you level up the other skills you need to be a great software developer.

2. I have some courses available:

   1. Build Your Own Redis Server (Python Edition) which guides you through solving the Redis Coding Challenge in Python.

   2. Build Your Own Shell (Go Edition) which guides you through solving the Shell Coding Challenge in Go.

Share Your Solutions!

If you think your solution is an example other developers can learn from please share it, put it on GitHub, GitLab or elsewhere. Then let me know via Twitter or LinkedIn or just post about it there and tag me.

Request for Feedback

I’m writing these challenges to help you develop your skills as a software engineer based on how I’ve approached my own personal learning and development. What works for me, might not be the best way for you - so if you have suggestions for how I can make these challenges more useful to you and others, please get in touch and let me know. All feedback greatly appreciated.

You can reach me on Twitter, LinkedIn or through SubStack

Thanks and happy coding!

John