Cara Deploy Express.js di Ubuntu 24.04 LTS

Express.js adalah framework Node.js minimalis dan unopinionated, paling umum dipakai untuk membangun REST API dan backend service, bukan aplikasi frontend penuh seperti Next.js atau Nuxt.js. Panduan ini menjelaskan langkah deploy aplikasi Express.js di Ubuntu 24.04 LTS, menggunakan paket qVM-2, dengan PM2 sebagai process manager dan Nginx sebagai reverse proxy. Pembahasan mencakup instalasi environment server, membangun landing page sekaligus REST API sederhana sebagai studi kasus, konfigurasi PM2 agar aplikasi berjalan persisten, konfigurasi Nginx, hingga pemasangan SSL gratis menggunakan Let's Encrypt.

Pengenalan

Express.js berbeda dari Next.js maupun Nuxt.js: tidak punya struktur project baku, CLI resmi untuk scaffolding, maupun konsep routing berbasis file. Express hanyalah library HTTP server di atas Node.js — developer menentukan sendiri route, middleware, dan struktur foldernya. Karena sifatnya yang minimalis ini, Express paling sering dipakai untuk REST API atau backend service yang dikonsumsi aplikasi lain (mobile app, SPA terpisah, dan sebagainya), bukan untuk merender halaman penuh dengan SSR.

Meski lebih sederhana, arsitektur deployment-nya tetap sama seperti Next.js dan Nuxt.js: aplikasi Express berjalan sebagai proses Node.js yang harus tetap hidup di server, sehingga tetap membutuhkan PM2 untuk menjaganya tetap berjalan, dan Nginx sebagai reverse proxy yang meneruskan request dari domain publik ke proses tersebut.

Ubuntu 24.04 LTS dipilih sebagai basis OS karena mendapat dukungan resmi (security update dan bug fix) hingga April 2029, sehingga sesuai digunakan untuk server aplikasi yang membutuhkan masa pakai jangka panjang. Panduan ini ditujukan untuk VPS atau qVM yang baru saja di-deploy (fresh install) dan belum memiliki konfigurasi tambahan apa pun.

Persyaratan

Sebelum memulai deploy, pastikan hal-hal berikut sudah terpenuhi:

Software

• Ubuntu 24.04 LTS, kondisi fresh install (belum ada web server/service lain yang bentrok port)
• Akses root atau user dengan hak sudo
• Koneksi internet untuk mengunduh paket dari repository Ubuntu, dependensi npm, dan sertifikat SSL
• SSH client pada sisi lokal untuk remote ke qVM
• Project Express.js yang akan di-deploy (project baru maupun repository Git yang sudah ada)

Hardware / Spesifikasi VPS qVM

Panduan ini menggunakan paket qVM-2, dengan spesifikasi:

• vCPU: 1 core
• RAM: 2 GiB
• Storage: 50 GiB
• Domain yang sudah diarahkan (A record) ke IP Publik qVM — digunakan untuk konfigurasi reverse proxy dan penerbitan sertifikat SSL

Dibanding Next.js atau Nuxt.js, aplikasi Express.js umumnya jauh lebih ringan karena tidak melakukan proses build SSR maupun bundling frontend, sehingga spesifikasi qVM-2 lebih dari cukup untuk kebanyakan REST API skala kecil hingga menengah.

Tahapan

1. Update dan Upgrade OS Ubuntu 24.04 LTS

Lakukan update dan upgrade pada sistem operasi Ubuntu 24.04 LTS terlebih dahulu, sebelum memulai instalasi service lainnya.

apt update && sudo apt upgrade -y

2. Instalasi Nginx

apt install nginx -y

Aktifkan agar berjalan otomatis saat qVM di-reboot, lalu periksa statusnya:

systemctl enable nginx
systemctl status nginx

Apabila status menunjukkan active (running), Nginx sudah dapat digunakan. Akses http://<IP-qVM> melalui browser untuk memastikan halaman default "Welcome to nginx!" tampil dengan benar.

3. Instalasi Node.js dengan NVM

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.6/install.sh | bash

Muat ulang shell agar perintah nvm dapat langsung digunakan:

source ~/.bashrc

Instal Node.js versi Active LTS terbaru (saat ini Node.js 24.x) dan jadikan sebagai versi default:

nvm install --lts
nvm alias default lts/*

Verifikasi versi Node.js dan npm yang terpasang:

node -v
npm -v

NVM menginstal Node.js pada direktori home milik user yang menjalankan perintah di atas. Pastikan seluruh tahapan berikutnya — instalasi PM2, deploy project, hingga pm2 startup — dilakukan dengan user yang sama.

4. Instalasi PM2

npm install -g pm2

Verifikasi instalasi:

pm2 -v

5. Deploy Project Express.js

Berbeda dari Next.js atau Nuxt.js, Express tidak memiliki CLI scaffolding resmi — project dibuat manual dengan npm init dan menambahkan Express sebagai dependency.

mkdir -p /var/www/express-app
cd /var/www/express-app
npm init -y
npm install express

Apabila project sudah ada di repository Git, gunakan git clone diikuti npm install di dalam direktori project sebagai gantinya.

Atur kepemilikan direktori project:

chown -R $USER:www-data /var/www/express-app

6. Studi Kasus: Landing Page dan REST API Sederhana

Sebagai studi kasus, buat satu file server yang menyajikan dua hal sekaligus: landing page HTML pada route utama, dan satu endpoint REST API yang mengembalikan JSON — mendemonstrasikan penggunaan Express sebagai backend service.

vim /var/www/express-app/server.js

Isi dengan:

const express = require("express");
const app = express();
const port = 3000;

app.get("/", (req, res) => {
  const year = new Date().getFullYear();
  res.send(`<!DOCTYPE html>
<html lang="id">
<head>
  <meta charset="UTF-8" />
  <title>Landing Page - KB Sequel</title>
  <style>
    * { margin: 0; padding: 0; box-sizing: border-box; }
    body { font-family: 'Segoe UI', Arial, sans-serif; background: #0f172a; color: #f1f5f9; line-height: 1.6; }
    .hero { background: linear-gradient(135deg, #4338ca 0%, #6366f1 50%, #22d3ee 100%); padding: 80px 20px; text-align: center; color: #fff; }
    .badge { display: inline-block; background: rgba(255,255,255,0.15); padding: 6px 16px; border-radius: 999px; font-size: 0.85rem; margin-bottom: 20px; letter-spacing: 0.5px; }
    .hero h1 { font-size: 2.5rem; margin-bottom: 16px; }
    .hero p { font-size: 1.1rem; max-width: 560px; margin: 0 auto 32px; opacity: 0.95; }
    .btn { display: inline-block; background: #fff; color: #4338ca; padding: 14px 32px; border-radius: 999px; font-weight: 600; text-decoration: none; }
    section { padding: 60px 20px; max-width: 1000px; margin: 0 auto; }
    h2 { text-align: center; font-size: 1.8rem; margin-bottom: 12px; }
    .subtitle { text-align: center; color: #94a3b8; margin-bottom: 40px; }
    .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; }
    .card { background: #1e293b; padding: 26px; border-radius: 16px; border: 1px solid #334155; }
    .card h3 { margin-bottom: 8px; color: #fff; font-size: 1.05rem; }
    .card p { color: #94a3b8; font-size: 0.9rem; }
    footer { text-align: center; padding: 32px 20px; color: #64748b; font-size: 0.9rem; border-top: 1px solid #1e293b; }
    code { background: #1e293b; padding: 2px 8px; border-radius: 6px; }
  </style>
</head>
<body>
  <section class="hero">
    <span class="badge">KB Sequel &middot; Landing Page Demo</span>
    <h1>Deployment Berhasil</h1>
    <p>Halaman ini adalah contoh landing page Express.js yang berjalan di atas PM2 dan Nginx reverse proxy, pada paket qVM-2.</p>
    <a href="#status" class="btn">Lihat Status &rarr;</a>
  </section>

  <section id="status">
    <h2>Apa yang Sudah Berjalan?</h2>
    <p class="subtitle">Ringkasan komponen yang sudah dikonfigurasi sampai tahap ini</p>
    <div class="grid">
      <div class="card">
        <h3>Node.js Aktif</h3>
        <p>Aplikasi Express.js dijalankan di atas Node.js LTS pada port 3000.</p>
      </div>
      <div class="card">
        <h3>PM2 Terkelola</h3>
        <p>Proses berjalan persisten, auto-restart, dan otomatis aktif kembali setelah reboot.</p>
      </div>
      <div class="card">
        <h3>Nginx Reverse Proxy</h3>
        <p>Permintaan dari domain publik diteruskan Nginx ke aplikasi Express.js.</p>
      </div>
      <div class="card">
        <h3>REST API Siap</h3>
        <p>Coba endpoint <code>/api/status</code> untuk melihat response JSON.</p>
      </div>
    </div>
  </section>

  <footer>
    <p>Landing page ini adalah contoh deploy Express.js dengan PM2 di atas paket qVM-2.</p>
    <p>&copy; ${year} KB Sequel — Semua hak cipta dilindungi.</p>
  </footer>
</body>
</html>`);
});

app.get("/api/status", (req, res) => {
  res.json({
    status: "ok",
    stack: "Express.js",
    server: "qVM-2",
    timestamp: new Date().toISOString(),
  });
});

app.listen(port, () => {
  console.log(`Server berjalan di port ${port}`);
});

Route / mengembalikan landing page dalam bentuk HTML lewat res.send(), sementara route /api/status mengembalikan data JSON lewat res.json() — dua pola respons yang paling sering dipakai saat membangun REST API dengan Express. Kartu "REST API Siap" pada landing page sengaja mengarahkan pengunjung untuk mencoba endpoint tersebut secara langsung.

7. Jalankan Aplikasi dengan PM2

pm2 start server.js --name "express-app"

Periksa status dan log aplikasi:

pm2 status
pm2 logs express-app

8. Konfigurasi PM2 Startup

Agar aplikasi otomatis berjalan kembali setelah qVM reboot, buat PM2 startup script:

pm2 startup systemd

Perintah di atas akan menampilkan satu baris perintah tambahan yang perlu dijalankan sebagai root — salin dan jalankan perintah tersebut sesuai output yang muncul. Setelah itu, simpan daftar proses PM2 yang sedang berjalan:

pm2 save

9. Konfigurasi Nginx sebagai Reverse Proxy

Nginx berperan sebagai reverse proxy, meneruskan request dari domain publik ke aplikasi Express.js yang berjalan pada port 3000.

vim /etc/nginx/sites-available/express.sequel.web.id.conf

Isi dengan konfigurasi berikut:

server {
    listen 80;
    listen [::]:80;
    server_name express.sequel.web.id;

    location / {
        proxy_pass http://127.0.0.1:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_cache_bypass $http_upgrade;
    }

    access_log /var/log/nginx/express-app_access.log;
    error_log /var/log/nginx/express-app_error.log;
}

Aktifkan dengan symlink ke sites-enabled, lalu uji dan reload konfigurasi:

ln -s /etc/nginx/sites-available/express.sequel.web.id.conf /etc/nginx/sites-enabled/
nginx -t
systemctl reload nginx

10. Uji Akses Aplikasi

Pastikan subdomain yang Anda gunakan sudah dipointing ke IP Publik qVM Anda, contohnya seperti gambar di bawah ini.

Akses http://express.sequel.web.id melalui browser — landing page pada tahap 6 akan tampil. Uji juga endpoint API dengan:

curl http://express.sequel.web.id/api/status

Apabila response berupa JSON berisi status: "ok", berarti seluruh stack (Nginx, Node.js, dan PM2) sudah berjalan dengan benar.

11. Konfigurasi SSL dengan Let's Encrypt

apt install certbot python3-certbot-nginx -y

certbot --nginx -d express.sequel.web.id

Certbot akan meminta email untuk notifikasi perpanjangan, konfirmasi persetujuan term of service, kemudian menawarkan opsi redirect otomatis dari HTTP ke HTTPS — pilih opsi redirect agar seluruh trafik diteruskan melalui HTTPS. Plugin ini secara otomatis mengedit server block yang sudah dibuat pada tahap 9 untuk menambahkan blok listen 443 ssl beserta path sertifikat.

Periksa terlebih dahulu apakah mekanisme perpanjangan (renewal) berjalan dengan normal:

certbot renew --dry-run

Setelah tahap ini, https://express.sequel.web.id sudah dapat diakses dengan koneksi terenkripsi SSL, begitu juga endpoint /api/status.

Kesimpulan

Sampai tahap ini, VPS qVM-2 (1 core, 2 GiB RAM, 50 GiB storage) sudah menjalankan aplikasi Express.js yang menyajikan landing page sekaligus REST API sederhana, dikelola PM2 agar berjalan persisten dan otomatis restart apabila terjadi crash atau server reboot, dengan Nginx sebagai reverse proxy di depannya. Aplikasi telah diamankan dengan SSL gratis dari Let's Encrypt beserta redirect otomatis ke HTTPS. Untuk pengembangan lebih lanjut, langkah yang disarankan adalah memecah route ke file terpisah (routing modular), menambahkan middleware untuk validasi input dan rate limiting, menghubungkan API ke database (MySQL/MariaDB atau MongoDB), dan menyiapkan proses deployment otomatis (CI/CD) untuk pembaruan aplikasi berikutnya.