How to setup Laravel and Vue .js project in single Digital Ocean droplet

shafiqruslan — Sun, 09 Jul 2023 15:55:41 +0000

I write this simple tutorial for beginner who having a hardtime to setup Laravel and Vue.js project in single droplet. This tutorial is suitable if you just want to playing around Digital Ocean and want to use it as a staging. I will not explain detail so i will just drop the link of tutorial below for every step i done.

Setup web services for Laravel and Vue.js. For me i use LEMP(linux-nginx-mysql-php)as a web services.
Link: https://www.digitalocean.com/community/tutorials/how-to-install-linux-nginx-mysql-php-lemp-stack-on-ubuntu-20-04 to
In my case i need to buy domain for both Laravel and Vue.js project. I buy domain from GodDaddy. After that i need to change nameserver in GoDaddy admin to Digital Ocean nameserver.
Link: https://docs.digitalocean.com/tutorials/dns-registrars/
After you change the namespace, you now have an access from your droplet to connect your domain with any apps in DigitalOcean.
Link:https://docs.digitalocean.com/products/networking/dns/how-to/add-domains/#add-a-domain-using-the-control-panel
Then you need to clone both Laravel and Vue.js project in /var/www/. Then run composer install for laravel and run npm install for vue.js project. If your droplet doesnt have composer and npm yet you can follow tutorial below.
Link: https://www.digitalocean.com/community/tutorials/how-to-install-node-js-on-ubuntu-22-04
https://www.digitalocean.com/community/tutorials/how-to-install-and-use-composer-on-ubuntu-20-04
You need to setup Nginx sites-available config for both Laravel and Vue.js project so the projects can connected with the domain that you buy.
Link: https://www.digitalocean.com/community/tutorials/how-to-install-and-configure-laravel-with-lemp-on-ubuntu-18-04
https://www.digitalocean.com/community/tutorials/how-to-publish-a-vuetify-app-with-nginx-on-ubuntu-20-04

And finally now you can run both Laravel and Vue.js project in single droplet. If you having any question you guys can drop the comment below. I will try to answer it.

DEV Community: shafiqruslan

How to setup Laravel and Vue .js project in single Digital Ocean droplet