# 🚀 Deploy Next.js di VPS Menggunakan PM2 (Lengkap & Praktis)

## Pendahuluan

Saat membangun aplikasi **Next.js**, menjalankannya di local dengan `npm run dev` memang mudah.  
Tapi ketika masuk ke **server / VPS**, kita butuh cara yang **stabil**, **aman**, dan **otomatis hidup kembali saat server restart**.

Di artikel ini, aku akan membahas **cara deploy Next.js di VPS menggunakan PM2**, lengkap dari build hingga troubleshooting umum.

---

## Kenapa Tidak `npm run dev` di Server?

Mode `dev`:

* ❌ Tidak untuk production
    
* ❌ Boros resource
    
* ❌ Mati saat terminal ditutup
    

Solusinya adalah **production build + PM2**.

---

## Persiapan

Pastikan di VPS kamu sudah terinstall:

* Node.js **v20+**
    
* npm
    
* Project Next.js siap jalan
    

Cek versi Node:

```plaintext
node -v
```

---

## 1\. Build Project Next.js

Sebelum dijalankan di production, **WAJIB build dulu**:

```plaintext
npm run build
```

Jika sukses, akan muncul:

```plaintext
Compiled successfully
```

---

## 2\. Install PM2

PM2 adalah process manager untuk Node.js.

```plaintext
npm install -g pm2
```

Cek:

```plaintext
pm2 -v
```

---

## 3\. Jalankan Next.js dengan PM2

Gunakan `next start`, **bukan dev**.

Contoh menjalankan di port **8080**:

```plaintext
pm2 start npm --name "next-portfolio" -- start -- -H 0.0.0.0 -p 8080
```

Cek status:

```plaintext
pm2 list
```

---

## 4\. Auto Start Saat Server Reboot

Agar aplikasi otomatis hidup kembali:

```plaintext
pm2 save
pm2 startup
```

Jalankan command yang muncul di terminal.

---

## 5\. Konfigurasi Environment Variable

Next.js **tidak membaca** `.env.example`.  
Gunakan `.env.local`.

```plaintext
cp .env.example .env.local
```

Contoh env penting:

```plaintext
NEXT_PUBLIC_SITE_URL=http://localhost:8080
BETTER_AUTH_URL=http://localhost:8080
```

⚠️ Setiap ubah ENV → **build ulang wajib dilakukan**.

---

## 6\. Restart Setelah Update

```plaintext
npm run build
pm2 restart next-portfolio
```

---

## Troubleshooting Umum

### ❌ Website Tidak Bisa Diakses

* Pastikan port terbuka (`ufw allow 8080`)
    
* Pastikan app listen ke `0.0.0.0`
    

### ❌ Data Kosong / Failed to Fetch

* `.env.local` belum diisi
    
* ENV berubah tapi tidak build ulang
    
* URL API masih [`localhost:3000`](http://localhost:3000)
    

### ❌ PM2 Online Tapi Web Mati

Cek log:

```plaintext
pm2 logs next-portfolio
```

---

## Penutup

Dengan **PM2**, aplikasi Next.js jadi:

* ✅ Stabil
    
* ✅ Auto-restart
    
* ✅ Siap production
    

Kalau kamu serius deploy Next.js ke server, **PM2 adalah pilihan wajib**.

---

✨ Semoga bermanfaat dan selamat ngoding!
