Installing Vue.js The Quick And Dirty Tips

Photo by Sigmund on Unsplash

Playing around with Vue.js couldn’t be easier. You can jump in on the deep end of the pool by setting up your machine(more on that later). Or you can just play around in their playground. Or you could use JSFiddle too.

But First Node.js

Since having Node.js is required we first must check and see if your machine has it installed.

Checking if Node.js is installed

Run the following command in your terminal: “node -v”. Then you should see if you have a version installed or not. If not go here and download the LTS version to your machine.

Installing Node.js

You can double-click on the download and begin the installation. Once complete you can move on to the next part.

Application

Next, we can create an application from the command line. Run this command, “npm create vue@latest”. Then accept the defaults like I did here.

Setting up Vue.js application

Then you can follow the directions laid out here to move into the vue-project directory. Then install and run the dev environment. You will see the following:

Running your local server

As it points out our server is running on

http://localhost:5173/

. If you go there you will see your Vue.js application running.

Now you are up and running. This was fairly easy. So to recap we have installed Node.js. This is used to run your Vue.js application. Then I created a basic application.

We were given a lot of options as we created this application. As your needs change you may need to look at each one of these. Some help with state management and others allow you to write unit tests for your code too.

You have taken a step into a larger world. Where will you go next?