Upload project Next.js 13 dari local ke production server

Next.js Nov 9, 2022
Upload project Next.js 13 dari local ke production server

Pada artikel sebelumnya kita sudah berhasil membuat project next.js 13 dan juga sudah berhasil menginstall node.js pada sever.
Untuk meng-upload project Next.js ke production server pertama-tama kamu harus mempersiakan :

  1. ftp server terlebih dahulu ( filezila / winscp ) yang sudah terkonek ke server kamu.
  2. File project next js
  3. Putty / terminal

FTP SERVER

  • Buka ftp server kamu kemudian buatlah folder pada /var/www/nama_folder
  • Upload file project kamu yang berada di local ke dalam server kamu.
  • Masuk ke folder project kamu dengan menggunakan putty kemudian ketikan npm run build
npm run build
Upload project Next.js 13 dari local ke production server

Sesuaikan Pengaturan Firewall

Sebelum kita dapat menjalankan project Next.js pada di server, kita perlu mengkonfigurasi ulang firewall kita untuk memungkinkan port dari Next.js dapat di akses pada browser. Perlu diketahui Next.js berjalan pada port : 3000, maka dari itu kita harus meng allow port:3000 pada server kita.

Sudo ufw allow 3000/tcp
Upload project Next.js 13 dari local ke production server

Instal & Gunakan PM2 Untuk Menjalankan Aplikasi

Kamu sekarang siap untuk menginstal dan mengonfigurasi PM2, yang merupakan manajer proses untuk aplikasi Node.js. Ini akan memungkinkan kamu untuk menjaga aplikasi Node.js kamau selalu tetap hidup selamanya, memuat ulang tanpa downtime dan membantu memfasilitasi tugas-tugas administrasi sistem secara umum.

Instal paket PM2 NPM secara global pada server DigitalOcean kamu dengan perintah ini :

sudo npm install -g pm2
Upload project Next.js 13 dari local ke production server

Opsi -g memberitahu NPM untuk menginstal paket secara global. Sekarang akan tersedia di seluruh sistem server kamu.

Menjalankan aplikasi Next.js menggunakan PM2

Pertama, pastikan kamu telah mengarakan terminal kamu ke direktori proyek /website:

cd nama_folder
Upload project Next.js 13 dari local ke production server

Kemudian, gunakan perintah ini untuk menjalankan aplikasi dengan PM2:

pm2 start --name=website npm -- start
Upload project Next.js 13 dari local ke production server

PM2 secara otomatis menambahkan Nama Aplikasi dan id PM2 ke aplikasi kamu, bersama dengan informasi lain seperti PID proses, statusnya saat ini, dan penggunaan memori.

Aplikasi PM2 akan restart secara otomatis jika aplikasi crash atau mati. Tetapi langkah-langkah tambahan perlu diambil untuk aplikasi untuk memulai pada sistem startup (reboot atau boot). PM2 menyediakan cara mudah untuk melakukan ini dengan perintah startup-nya.

Jalankan dengan perintah berikut:

pm2 startup systemd
Upload project Next.js 13 dari local ke production server

Pada baris terakhir dari output yang dihasilkan, akan ada perintah yang harus Anda jalankan dengan hak superuser :

sudo env PATH=$PATH:/usr/bin /usr/lib/node_modules/pm2/bin/pm2 startup systemd -u bob --hp /var/www/ next-tutorial
Upload project Next.js 13 dari local ke production server

Ini akan membuat unit systemd yang akan menjalankan PM2 untuk pengguna Anda saat boot. Instans PM2 ini, pada gilirannya, akan menjalankan semua aplikasi yang dikonfigurasi untuk dijalankan menggunakan PM2. Untuk memeriksa status unit systemd baru, gunakan perintah berikut:

systemctl status pm2-bob

Aplikasi situs web Next.js kamu sekarang aktif dan berjalan pada port 3000 dan akan berjalan selamanya, atau sampai Anda memberi tahu PM2 untuk berhenti.

Upload project Next.js 13 dari local ke production server

Selesai.