Cara deploy node.js app di xampp vps server

A. nodejs app

Preparation

1.Pastikan node.js telah terinstall

• cek di command prompt : node -v

2.Install dependencies

• hapi
  • npm i @hapi/hapi
  • menyediakan environment yang lengkap untuk mengembangkan web server yang kompleks
• pm2
  • npm install pm2 -g
  • PM2 (Process Manager 2) adalah sebuah framework manajemen proses untuk aplikasi Node.js yang dirancang untuk digunakan dalam lingkungan produksi. PM2 membantu dalam mengelola aplikasi Node.js yang berjalan secara terus-menerus dengan menyediakan fitur-fitur seperti monitoring, manajemen proses, load balancing, dan clustering.
  • fungsinya sama dengan nodemon

3.buat folder project

• folder Desktop/wa-api

4.Buat file main.js pada folder project dan masukkan kode berikut pada file tersebut

const runServer = require('./src/server')

runServer()

5. selanjutnya buat folder src dan sub direktori serta file seperti struktur berikut:

• src
  • router
    • index.js
  • server.js

file router/index.js masukkan kode berikut:

const routes = [
    {
      method: 'GET',
      path: '/',
      handler: () => {
          return "ini adalah halaman home"
      },
    }, 
  ];
  
  module.exports = routes;

pada file server.js masukkan kode berikut:

const Hapi = require('@hapi/hapi')

const routes = require('./router');

const init = async () => {
  const server = Hapi.server({
    port: 5000,
    host: 'localhost',
    routes: {
      cors: {
        origin: ['*'],
      },
    },
  });

  server.route(routes);

  await server.start();
  console.log(`Server berjalan pada ${server.info.uri}`);
};

module.exports = init

Konfigurasi

1.Selanjutnya, buka command prompt dan pindah ke folder project tersebut dengan perintah berikut:

• cd Desktop/wa-api

2.inisialisasi project node, ketikan kode berikut pada command prompt

npm init --y

• tujuan dari kode menginisialisasi atau membuat file package.json dalam proyek Node.js. File package.json adalah file konfigurasi yang digunakan untuk mengelola proyek Node.js, dan berisi informasi tentang proyek, dependensi, skrip, versi, dan konfigurasi lainnya.

hasilnya akan terbuat file package.json

tambakan script start, sehingga nantinya kita tinggal menjalankan aplikasi dengan perintah npm start

{
  "name": "wa-api",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "node main.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@hapi/hapi": "^21.3.2"
  }
}

3.Konfigurasi pm2

• masukkan kode dibawah untuk test jika pm2 berhasil terinstall

pm2 list

• jika muncul gambar seperti dibawah, maka instalasi sukses

• jalankan kode dibawah untuk menset pm2 agar merestart aplikasi jika server crash atau server restart

pm2 startup

• selanjutnya kita akan mendaftarkan aplikasi kita ke pm2 dengan kode berikut

##pm2 start <entryPointApps> --name <labelApps>
pm2 start main.js --name wa-api

• jika seperti gambar dibawah maka aplikasi sudah berhasil dijalankan

• anda dapat mengecek aplikasi di browser local komputer melalui url : localhost:5000
• seperti yang terlihat pada gambar diatas pada kolom watching masih disabled artinya fitur monitoring masih belum aktif

Konfigurasi pm2 monitoring files

1.matikan dulu port yang berjalan di pm2 karena sebelumnya kita telah menjalankan salah satu aplikasi kita di port 5000 kemudian cek list pm2.

2.buat file pm2 configurasi pada file project dengan perintah berikut

• pm2 init simple

akan terbuat file ecosystem.config.js

3. ubah isi file tersebut menjadi seperti berikut

module.exports = {
  apps : [
    {
      name   : "wa-api", //label aplikasi yg tampil di pm2 list
      script : "npm",   //perintah npm
      args   : "start", //script start pada package.json
      watch  : ["src"] //folder src, everything inside that folder will watch
    }
  ]
}

4.run pm2 config

• pm2 start ecosystem.config.js

5. cek log

• pm2 log <id_app>
• pm2 log 0

• coba lakukan perubahan pada file dalam folder src
• setiap kali perubahan file disimpan, pm2 akan merestart aplikasi
• jika aplikasi tidak terestart otomatis silahkan coba jalankan ulang kode berikut
  • pm2 start ecosystem.config.js

B. konfigurasi virtual host

selanjutnya kita akan membuat aplikasi kita bisa diakses secara publik melalui internet

• pada case ini kita akan telah memiliki domain utama
• kita akan membuat subdomain untuk mengakses aplikasi node

1.pastikan konfigurasi virtual host pada xampp server telah aktif

2. konfigurasi subdomain atau domain pada dns manager pada penyedia server anda.

• host name : <subdDomain>.<domainName>.com
  • contoh : wa-api.championspamasuka.com
• TTL : 3600
• Address/Value:  <domainName>
  • contoh : championspamasuka.com

3.Daftarkan subdomain tersebut pada host server anda dengan cara buka file hosts

• lokasi di windows : C:\Windows\System32\drivers\etc
• lokasi di linux : /root/etc

selanjutnya buka file hosts dan masukkan subdomain yang telah didaftarkan sebelumnya pada dns manager

...

127.0.0.1 championspamasuka.com
127.0.0.1 wa-api.championspamasuka.com

4. kemudian buka virtual host xampp : httpd-vhosts.conf

• lokasi di windows : C:\Programs\xampp1\apache\conf\extra
  • catatan : sesuaikan dengan lokasi installer xampp anda
• lokasi di linux : /opt/lampp/etc/extra

buka file httpd-vhosts.conf dan masukkan kode berikut

<VirtualHost *:80>   
    ServerName wa-api.championspamasuka.com
    ServerAlias www.wa-api.championspamasuka.com

    ProxyRequests off

    <Proxy *>
        Order deny,allow
        Allow from all
    </Proxy>

    <Location />
        ProxyPass http://localhost:5000/
        ProxyPassReverse http://localhost:5000/
    </Location>
</VirtualHost>

5. simpan document tersebut kemudian restart apache web server

6. selanjutnya coba akses pada browser url berikut : http://wa-api.championspamasuka.com

C. koneksi aplikasi ke dashboard pm2

1.bukan link berikut https://app.pm2.io/

2. buat bucket

3.copy link koneksi pm2 to pm2.io

4.delete proses yang sedang berjalan

• pm2 delete 0

5.paste link yang sebelumnya sudah dicopy

6.berhasil terhubung