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

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.

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