The process of deploying a web application can be complicated! In this video, I walk through the entire process of deploying a MEVN (MongoDB, Express, Vue, Node.js) application onto a VPS (Virtual Private Server) and connecting it to a custom domain.

The application can be seen @ https://mooncoins.net/

I used Caddy (https://caddyserver.com/) to serve the frontend, and PM2 (https://www.npmjs.com/package/pm2) to manage the backend deployment. I also installed MongoDB from scratch and configured access control to protect the data.

---

Here is a link to the full video on the DesignCourse Channel: https://www.youtube.com/watch?v=ek50iuo5zkE

Join the Community:
💬 Discord: https://discord.gg/asRqkZdv4S
💻 GitHub: https://github.com/sidpalas/devops-directive
🐥 Twitter: https://twitter.com/sidpalas
👨‍💼 LinkedIn: https://www.linkedin.com/in/sid-palas/
🌐 Website: https://devopsdirective.com

---

Timestamps:
00:00 - Intro
00:59 - Process breakdown
01:39 - Clone the repo
02:02 - Replace hardcoded strings with ENV variables
05:20 - Creating DNS Record
06:04 - Add public SSH key to VPS
07:05 - Instal MongoDB
09:15 - Add access control to MongoDB
12:30 - Copy (rsync) application source to VPS
14:31 - Instal Yarn
15:23 - Yarn install dependencies
15:43 - Build frontend (with yarn build)
16:22 - Install Caddy 2
17:51 - Copy frontend files to /var/www/html
18:16 - Configure UFW firewall
19:07 - Modify Caddyfile configuration
21:04 - Test the frontend deployment
21:32 - Install PM2
22:38 - Create non-root node user
23:55 - Configure PM2 and launch backend API
25:52 - Testing the full app!
26:27 - Outro

---

Community size at time of posting:

• Subscribers: 9332
• Channel Views: 218977

#mevn #mongodb #express #node.js #vue