How Frontend Developers Can Easily Deploy a Project on VPS (Beginner Friendly)

By Rakibul IslamJuly 29, 202613 views

How Frontend Developers Can Easily Deploy a Project on VPS using PM2 Node.js and GitHubHow Frontend Developers Can Easily Deploy a Project on VPS using PM2 Node.js and GitHub Many frontend developers think VPS deployment is difficult and only for backend or DevOps engineers.
But the truth is - Frontend developers can easily deploy their own projects on a VPS.

In this article, I’ll show you a simple step-by-step guide to deploy a frontend project (React / Next.js) on a VPS using PM2, Node.js, and GitHub - no advanced backend knowledge required.

We’ll cover both npm and pnpm.

Who Is This Guide For?

  • Frontend Developers
  • React / Next.js Developers
  • Beginners who want to deploy without DevOps complexity

Not required: Docker, Nginx, CI/CD

Requirements

Before starting, make sure you have:

  • A VPS (A2 Hosting, DigitalOcean, AWS, etc.)
  • VPS IP Address
  • Username & Password
  • A frontend project on GitHub
  • Node.js installed on VPS
  • npm or pnpm installed
  • PM2 installed globally

Install PM2:

Using npm:
npm install -g pm2

Using pnpm:
pnpm add -g pm2

Step 1: Login to VPS Using Termius

Open Termius (or any terminal) and login to your VPS using:

  • IP Address
  • Username
  • Password

After successful login, you will get terminal access.

Step 2: Go to Project Directory

cd /var/www

/var/www is the standard location for web projects on most VPS.

Step 3: Check Existing Files

ls

This will show you the current files and folders.

Step 4: Clone Project from GitHub (Using SSH)

git clone git@github.com:YourUsername/YourProject.git

Important Notes:

  • Your GitHub repository must have SSH key set up
  • VPS SSH key should also be configured

Step 5: Verify Project Folder

ls

You should now see your project folder ( for example: my-project).

Step 6: Enter Project Directory

cd my-project

Step 7: Install Dependencies

Using npm:
npm install

Using pnpm:
pnpm install

Step 8: Build the Project

Using npm:
npm run build

Using pnpm:
pnpm build

Step 9: Open Port in VPS Firewall

sudo ufw allow 3001

Step 10: Reload Firewall

sudo ufw reload

Step 11: Start Project Using PM2

Using npm:
pm2 start npm --name "my-project" -- start -- --port 3001

Using pnpm:
pm2 start pnpm --name "my-project" -- start -- --port 3001

Explanation:

  • my-project → Process name
  • 3001 → Port number (you can change it)

Step 12: Check PM2 Process List

pm2 ls

Step 13: Restart Project (Safe Practice)

pm2 restart my-project

Step 14: Access Live Project in Browser

Open your browser and visit:

http://YOUR_VPS_IP:3001

Congratulations!
Your frontend project is now live on the VPS.

Final Tips

  • Always use PM2 so that your project keeps running even if you close the terminal.
  • You can change the port number according to your need.
  • For custom domain, you can later add Nginx (optional).
  • Prefer pnpm if you want faster installs and less disk space usage.

Article Info

CategoryWeb Dev
PublishedJuly 29, 2026
Views13 views
About The Author

I am Rakibul Islam, a Next.js and React.js Developer based in Dhaka, Bangladesh. I specialize in building fast, modern web applications using Next.js, React.js, TypeScript, Tailwind CSS and the MERN Stack. With 12+ months of experience and 25+ clients, I help businesses create high-performance websites. Available for freelance projects in Dhaka and worldwide.