How to install Vue.JS on Ubuntu 22.04?

Hello, friends. In this post, you will learn how to install Vue.JS on Ubuntu 22.04.

What is Vue?

Vue.js is an open-source progressive JavaScript framework for creating user interfaces (UI) and single page applications. In this post, we will refer to it as Vue.

As you can imagine, Vue is a framework for the front-end. In this, it has a strong commitment to HTML and CSS, unlike others like React where JavaScript is the one that has all the protagonism.

Some of its features are;

• Quite low learning curve. In fact, it is by far the fastest to learn.
• Open Source, which allows you to use it in almost any project.
• It is very friendly and respectful with frontend technologies and standards.
• Lightweight. It is quite light compared to others.

It is also very well documented and thanks to its Model-Views-Controller architecture you will feel familiar if you come from other frameworks.

Let’s get started.

Installing Vue.js on Ubuntu 22.04

The first thing we have to do is to completely update the system. To achieve this, run in a terminal.

sudo apt update
sudo apt upgrade

Then, install NodeJS and NPM with the following command:

sudo apt install nodejs npm

Now check the versions of the packages we have installed:

node --version
v12.22.9
npm --version
8.5.1

Update NPM to avoid any problems:

sudo npm install npm@latest -g

And using NPM, proceed to install Vue.JS

sudo npm install -g @vue/cli

Now check the installed version

vue --version
@vue/cli 5.0.6

Creating a project with Vue.js

The next step is to create a new project to check that everything goes well. First, create it with this command

vue create [project-name]

For example,

vue create unixcop

This will create a new folder with the name of your project. Access it:

cd unixcop

And you can serve the project

vue ui

Now open a web browser and check everything on http://localhost:8088

s

Or you can set a custom host and port.

vue ui -H [host] -p [port]

And you’re done!

Conclusion

In this post, you learned how to install Vue.js, which is an important framework in front-end development. I hope you liked the post.