How to install Bower in Ubuntu 22.04

Hello, friends. In this post, you will learn how to install Bower in Ubuntu 22.04 This special dependency manager for web development is a marvel that many developers use.

What is Bower?

Bower is a dependency manager, especially for web design. In short, it is a simple program that serves to keep up to date the dependencies of a project for the web, in terms of frontend development, with JavaScript or even CSS.

This is the most important thing about Bower, which is focused on the Frontend and not the Backend. According to the Bower website:

Bower can manage components that contain HTML, CSS, JavaScript, fonts or even image files. Bower doesn’t concatenate or minify code or do anything else – it just installs the right versions of the packages you need and their dependencies.

So let’s install it.

Install Bower on Ubuntu 22.04

Bower is built with NodeJS, so this is a dependency we have to comply with.

Install NodeJS on Ubuntu 22.04

The first step is to install NodeJS. This can be done by several methods, but we will use the latest stable version.

First, update the whole system

sudo apt update
sudo apt upgrade

Now, add the NodeJS repository.

curl -sL https://deb.nodesource.com/setup_18.x | sudo -E bash

Then, you can install NodeJS

sudo apt-get install nodejs

Now, check the versions of NodeJS and NPM.

node --version
v18.4.0
npm --version
8.12.1

Install Bower on Ubuntu 22.04

Now you can install Bower with the following command

sudo npm install -g bower

This will start downloading and installing each of the necessary packages.

The bower.json file

The handling of the dependencies is in the bower.json file. To generate it, just run the following command.

bower init

This will start the wizard to ask for project configurations.

In this file, you can incorporate the dependencies. You can also install the dependencies and have them saved in the file.

bower install --save [library]

This will make it so that if you want to restore all dependencies, you only have to run

bower install

This will read the contents of the file and install them all.

For more information, you can consult the official documentation.

Conclusion

In this post, you learned how to install Bower. This frontend dependency manager is a marvel that many developers use in their projects.