Bower is a package manager for the web. It is a handy command line utility for managing external component dependencies containing HTML, JavaScript, CSS, font, image and other types of files. When used in a project, Bower takes care of fetching and installing the required packages, along with their dependencies, behind the scenes, which makes it ideal for front-end projects.

In this article we describe how you can use Bower to install the Shield UI Lite library, an open-sourced lightweight version of the Shield UI for JavaScript framework.

In order to use Bower, it must be installed on your computer. As mentioned in the instructions, NodeJS, NPM and Git should also be installed as they are required.

Next, create a new folder, navigate to it in the command line and execute:

bower install shieldui-lite

This should install the shieldui-lite package, which contains all the JavaScript and CSS files included in the Shield UI Lite library. Since the package depends on two other libraries - jQuery and Globalize, Bower installed them too. The install process resulted in creating the following directories, each one containing the different component assets:
bower_components/globalize/...
bower_components/jquery/...
bower_components/shieldui-lite/...

You can start using the Shield UI Lite library immediately, as illustrated with the following file, located in your main project directory:

If you open the above example in your web browser, you should see the Shield UI DatePicker widget in action.

From this moment on, you can use any component included in the Shield UI Lite framework in your own project.