Bower leading frontend dependencies

Bower will take care of all of our frontend dependencies. Of course, it is simpler to just add the CSS and image files directly in the public folder, but we need a scalable application, right? There is nothing better than using Bower to manage frontend dependencies. To install the dependencies, we will perform the following steps:

  1. Go to the root folder and create a new file named bower.json.
  2. Create another file named .bowerrc with the following code:
    {
  "directory": "public/bower_components"
}

    The behavior of bower.json is very similar to package.json and both use the init command to create the package file. We skip this step, and add our dependencies directly into the file.

  3. Place the following code in the bower.json file:
    {
  "name": "conference-api",
  "version": "0.0.1",
  "dependencies": {
    "purecss": "~0.5.0"
  }
}
  4. Open your terminal and type the following command:
    bower install

As we can see, we will be using the Pure CSS framework to handle our frontend code inside our templates.

  1. If you open the public folder, inside the application root, you can see the bower_components folder created with our Pure CSS package. You can name the directory as you like. For this example, the name bower_components is very appropriate, as shown in the following screenshot:
    Bower leading frontend dependencies
  2. Now, we'll install the Responsive Boilerplate grid system. Open your terminal and type the following command:
    bower install responsiveboilerplate#2.3.2 --save

Note that command will install a specific version of the framework and then save the dependency in our bower.json file.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.144.17.137