Deploy VueJS app on DigitalOcean

So you want to deploy a VueJS app on your digital ocean ubuntu server?

Let’s get started.

Firstly, if your local application not added to github create a a new github project by visiting github.com and follow the on screen screenshot to push the code on github.

Now, create and login to your digital ocean server and create a new droplet as per your need. If you added ssh key to your digital ocean you can ssh to the server without the password using root@ipv4 address of the server otherwise you need to check your email and use the password.

After ssh from the local machine you need to run this 3 commands

Update the server

Install Nginx

Install Nodejs

Install npm

 

Generate ssh key to access the github project

We need to generate a new ssh key. For that type the below command and press enter for 3 times

Copy the ssh key output by running the below command

Copy the key and go to project settings of github and add new deploy key by pasting the copied key.

Now go cd to /var/www/html by typing

 

Fetch the project from git

Now clone the ssh link of the project from github and clone the project

Now cd to that project

Now run this command

Configure nginx

Now we need to configure nginx to point out this site as default

For that we need to go

then type

Change the line

with

Then press Ctrl+x => type “yes” => press enter

To restart nginx run this command

 

Then we need to type

To check if everything is okay

If the output of this command is

Then everything is okay.

Now if we visit the ip4 address then we will find that the VueJS site is deployed on the server successfully.