{"id":4063,"date":"2014-11-23T05:32:20","date_gmt":"2014-11-23T05:32:20","guid":{"rendered":"http:\/\/www.jitendrazaa.com\/blog\/?p=4063"},"modified":"2014-11-23T05:32:20","modified_gmt":"2014-11-23T05:32:20","slug":"why-to-use-bower-for-your-web-developement","status":"publish","type":"post","link":"https:\/\/www.jitendrazaa.com\/blog\/webtech\/why-to-use-bower-for-your-web-developement\/","title":{"rendered":"Why to use Bower for your web developement"},"content":{"rendered":"

What is Bower<\/strong>
\nIt is client side package Manager and Great tool to manage all you web dependencies like JavaScript libraries and other assets.<\/p>\n

\"Bower\"<\/a>
Bower<\/figcaption><\/figure>\n

What can be done from Bower<\/strong>
\nWeb sites are made of lots of things \u2014 frameworks, libraries, assets, utilities, and rainbows. Bower manages all these things for you.<\/p>\n

# registered package
\n$ bower install jquery<\/p>\n

# GitHub shorthand \u2013 download repository SOQLBuilder from user Jitendra on Git
\n$ bower install JitendraZaa\/SOQLBuilder<\/p>\n

# Git endpoint
\n$ bower install git:\/\/github.com\/user\/package.git<\/p>\n

# URL
\n$ bower install http:\/\/somewebsiteURL.com\/script.js<\/p><\/blockquote>\n

<\/p>\n

How to Install it<\/strong>
\nI am taking an example of Node to install in bower globally. Below command will install bower and can be used from anywhere
\n$ npm install \u2013g bower<\/em><\/p>\n

Current problem<\/strong>
\nLet\u2019s say you want to use some library like “polymer” or “Jquery”. You will need to search latest version of polymer \/ JQuery either from main site or from some CDN, then Download zip file, extract and save in your folder. If that library has dependency on some other library then download that library also manually and perform same steps. After some day, your locally saved library may be out of date.<\/p>\n

Benefit of Bower<\/strong>
\nWith Bower Simply run this commands in your folder and all dependencies will be automatically fetched and stored in “bower_components” folder
\n$ bower install –save Polymer\/polymer<\/em> \u00a0\/*This will download latest version*\/<\/p>\n

Basic Bower Commands<\/strong>
\nBelow are some basic bower commands:<\/p>\n

$ bower list<\/em>
\nIt will check for latest versions of all components installed by bower in current folder<\/p>\n

$ bower list –path<\/em>
\nIt will show path to be used in your web page for all components installed by bower<\/p>\n

$ bower uninstall<\/em>
\nIf you want to uninstall any previously downloaded library then use this command
\nExample : $ bower uninstall jquery<\/em> \/*It will remove JQuery*\/<\/p>\n

$ bower install\u00a0<libName>#<version><\/em>
\nInstall specific version of library.\u00a0If you want to use older version of library, say 1.11.0 of Jquery, then use below command
\n$ bower install jquery#1.11.0<\/em><\/p>\n

Creating and distributing package with Bower<\/strong>
\nIf you have completed development of your application and want to distribute it, lets say on Github. Then use below command<\/p>\n

$ bower init<\/em><\/p>\n

This command will ask some questions and will generate bower.json file. While pushing files on Git, do not push bower folder, push only bower.json. Users can install all dependency of your package by running command<\/p>\n

$ bower install<\/em><\/p>\n

Note :<\/span><\/em>
\nIf you add new dependency after bower.json is generated, it will not be added automatically in JSON file, you need to use “-s” at end of install command.<\/p>\n

$ bower install jquery -s<\/em>\u00a0 \/*Install Jquery and update bower.json*\/<\/p>\n