/ Tools

Introducing embadge.io

If you’ve not read about Ember Community Versions, they’re a way of denoting the versions of Ember that an article is applicable to.

This is really useful, as the Ember framework moves forward it’s hard to know if practices you read about on the internet are still relevant.

The original implementation required you to submit a pull request to the ember-community-versions repository which, once merged, would provide you with a unique URL for your badge. This is a slow process and requires you to hold off on publishing your article until the pull request is merged.

Writing EmberUp we often try to cover recent developments in Ember.js or other Ember.js related projects. Indicating which versions an article is applicable to is therefore incredibly important to not confuse readers when showcasing code that may currently only be available in beta or canary versions.

Providing Ember Badges as a service

We strongly believe that adding version information to your posts will help readers better identify resources relevant to what they are looking for. This is why we built embadge.io - a simple badge generating service for Ember version badges.

Note: As correctly mentioned in the comments, this currently lacks the community aspect of Ember Community Badges by Matthew Beale.


Using embadge.io is easy. You can either generate the badge URL yourself or use the script provided.

To globally add support for embadge.io on your website you can include the following line at the end of the body:

<script src="//embadge.io/v1/badge.js" type="text/javascript"></script>

The script will search for elements with the embadge class and use data attributes to generate and insert the image URL into your website.

Valid parameters include start, end to denote the start and end versions your content covers (with end being optional). Alternatively you can provide a range parameter to denote a range of versions. In case you are not writing about Ember.js directly and want to use embadge for a different project you can provide a label parameter which will change the label displayed on the badge.

https://embadge.io/v1/badge.svg?start=1.13.0 will generate a badge with the default label ember-versions and a version string 1.13.0+ indicating that your content is applicable to versions 1.13.0 and later.

It is also possible to define ranges using the range parameter: https://embadge.io/v1/badge.svg?range=^1.13.0 will output a versions string >= 1.13.0 <2.0.0 indicating that your content is valid for versions 1.13.0 up to, but not including, 2.0.0. This is useful e.g. when writing about things that got deprecated and are removed in a later version. To read more about ranges have a look at the node-semver README

In case your content touches on other Ember.js related projects like ember-data you may also want to change the label on the badge: https://embadge.io/v1/badge.svg?label=ember-data&range=^1.13.0


You can already see the badges in use in some of our articles: References API in Ember 2.4 or Dynamic Component Rendering

Do you write articles about Ember? Maybe include embadge in your next post. Let us know if you are using embadge on your blog!

Introducing embadge.io
Share this