Step-by-step guide to deploy your Ionic frontend and Node.js backend on DigitalOcean using PM2 and Nginx. Secure your app with HTTPS and optimize for production.

 How to Deploy Ionic & Node.js Projects on DigitalOcean with PM2 and Nginx

Deploying full-stack apps can seem intimidating, especially if you're managing both a frontend (Ionic) and a backend (Node.js). In this tutorial, I’ll walk you through deploying an Ionic + Node.js project on DigitalOcean, using PM2 to manage the backend and Nginx to serve the frontend and handle reverse proxying.

What You'll Need

• A DigitalOcean Droplet (Ubuntu 20.04 or 22.04)
• A working Ionic project (frontend) and Node.js API (backend)
• A domain name (optional but recommended)
• Basic knowledge of SSH, Linux commands, and server setup

Step 1: Set Up Your DigitalOcean Droplet

1. Go to DigitalOcean.com and create a new Droplet with Ubuntu.

2. Choose a plan (even the $4/month plan works for small apps).

3. Set up SSH access or use a secure password.

4. Connect via terminal:

ssh root@your_server_ip

Step 2: Install Dependencies

Update your system:

sudo apt update && sudo apt upgrade -y 

Install Node.js, npm, git, and PM2:

sudo apt install nodejs npm git -y

sudo npm install -g pm2

Check Versions

node -v

npm -v

pm2 -v

Step 3: Deploy Your Node.js Backend

Clone your API repo or upload it:

git clone https://github.com/your-username/your-node-backend.git

cd your-node-backend

npm install

Configure environment variables (e.g., using .env), then start the app:

pm2 start index.js --name backend pm2 save

Step 4: Build & Upload Ionic Frontend

On your local machine:

ionic build --prod

The compiled output will be in the www/ folder.

Transfer it to your server: 

scp -r www/* root@your_server_ip:/var/www/ionic-app

Create the directory on the server if needed:

mkdir -p /var/www/ionic-app

Step 5: Install and Configure Nginx

Install Nginx:

 sudo apt install nginx -y

Create a new site config:

sudo nano /etc/nginx/sites-available/ionicappj

Paste the following configuration (replace with your domain or IP):

server { listen 80; server_name yourdomain.com; root /var/www/ionic-app; index index.html; location /api/ { proxy_pass http://localhost:3000/; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection 'upgrade'; proxy_set_header Host $host; proxy_cache_bypass $http_upgrade; } location / { try_files $uri $uri/ /index.html; } }

Enable the config:

sudo ln -s /etc/nginx/sites-available/ionicapp /etc/nginx/sites-enabled/ sudo nginx -t sudo systemctl reload nginx

Step 6: Secure with HTTPS (Optional but Recommended)

Install Certbot:

sudo apt install certbot python3-certbot-nginx -y 

Run Certbot to obtain and apply an SSL certificate:

sudo certbot --nginx -d yourdomain.com

Step 7: Make PM2 Start on Boot

To ensure your backend runs after a reboot:

pm2 startup

pm2 save

Final Output

• Your Ionic frontend is served from /var/www/ionic-app
• Your Node.js backend runs behind /api/
• PM2 keeps your backend alive and restarts it if the server goes down
• Nginx routes traffic and handles HTTPS with Let’s Encrypt