To quickly explain bower to a Python developer I can say that it's "the Distutils of the JavaScript world".
I'm not a front-end developer because I think that "knowing how to do some JavaScript" doesn't mean being a front-end guy, however I like the direction where JavaScript is going. But note: take the rest of this article like it is: a "Bower for dummies" note!
In my last article I quickly introduced the jQuery Plugin site way of keeping update it's database: a simple JSON file. Bower is doing the same for populating its component registry site.
So an "official" jQuery plugin can be also a bower component.
Step by step
First of all you need to install the node package manager (npn), and for a MacOS user is really simple (same for Linux guys):$ sudo port install npm
After that you can install bower.
$ npm install -g bower
No we'll go back to our jQuery plugin.
First of all you need the bower.json file, but instead of writing it manually, let's simply type...
$ bower init
... and answer to the questions. After that you can go inside the file and add some other missing stuff by looking and the available syntax.
This is a possible result:
{
"name": "waria-checkbox",
"version": "0.2.2",
"homepage": "http://plugins.jquery.com/waria-checkbox/",
"description": "jQuery WAI ARIA Compatible Checkbox Plugin",
"main": "jquery.waria-checkbox.js",
"keywords": [
"wai-aria",
"accessibility",
"js"
],
"authors": [
"Luca Fabbri <luca@keul.it>"
],
"license": "MIT",
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests",
"CHANGES.rst",
"README.rst",
"demo.html",
"LICENCE.rst",
"README.rst",
"waria-checkbox.jquery.json"
],
"dependencies": {
"jquery": ">=1.7"
}
}
The bower.json file is really similar to the file needed by the jQuery plugin site, but it's not the same (a boring task: you must keep updated both files).
As we are focused on jQuery plugin, note that jQuery (that can be installed using bower) is defined in the "dependencies" section.
Finally you need to create a new git tag:
$ git commit -am "Now is possible to install the plugin by using bower"
$ git tag -a 0.2.2 -m "Tagging version 0.2.2"
$ git push --all
$ git push --tags
Last step: register the plugin onto the bower registry:
$ bower register waria-checkbox https://github.com/keul/jquery-waria-checkbox.git
Installation
$ bower install waria-checkbox
bower cached git://github.com/keul/jquery-waria-checkbox.git#0.2.2
bower validate 0.2.2 against git://github.com/keul/jquery-waria-checkbox.git
bower cached git://github.com/components/jquery.git#2.0.3
bower validate 2.0.3 against git://github.com/components/jquery.git#>=1.7
bower install waria-checkbox#0.2.2
bower install jquery#2.0.3
waria-checkbox#0.2.2 bower_components/waria-checkbox
└── jquery#2.0.3
jquery#2.0.3 bower_components/jquery
Now inside the bower_components folder we have both the plugin and jQuery.
