Add some cool badges in your GitHub Repo

Pandiyan Murugan

You might have seen this kind of badges earlier in many GitHub repositories.

Image result for shield badges github

It is cool! Most of the popular frameworks or tools using it in their GitHub repo.

Example:

Angular repository

Why Badges?

It provides a long information short!

It can hold information such as

  • version of npm used
  • status of last build
  • number of downloads happen over period of time
  • license type

How?

Now the question is how can I add it in my GitHub ReadMe file?

It pretty simple. All you have to go https://shields.io/ and create badges right away.

Basically a badge will contains small information of our repo. It can be building process status, or social media handle link.

Shields provides support for various badges like below

Lets say I want to create a follow badge for my twitter handle. It can be done quickly like this.

I can copy as HTML, MarkDown, etc.

For this blog I copied as HTML and pasted below.

Twitter Follow

Quick view

I have published a npm plugin. I have setup the CI/CD for it. So whenever I commit my changes it will automatically deploy my packages to npm registry.

And also I wants to keep a track of how many downloads happening. So I added badges for those metrics in my repo.

You can find my GitHub Repository below

https://github.com/PandiyanCool/angular-clipboard-auto

Happy Designing!

To get latest updates you can follow or subscribe! #peace

Leave a comment