Menerapkan Plugin dan Routing Pada Aplikasi Hapi JS
Pada artikel sebelumnya, Membuat Web Service Menggunakan Framework Hapi JS, kita telah berhasil membuat web service sederhana. Pada artikel ini, kita akan membahas penggunaan plugin pada Hapi JS dan bagaimana menerapkannya pada routing.
Menerapkan modularisasi dalam aplikasi
Semakin kompleks aplikasi yang dikembangkan, maka semakin kompleks kode yang kita buat. Oleh karena itu, dibutuhkan teknik modularisasi. Modularisasi adalah suatu konsep dalam pemrograman yang memecah sebuah program besar menjadi modul-modul kecil yang lebih terorganisir dan mudah dikelola. Dalam pengembangan web, modularisasi dapat dilakukan dengan memisahkan definisi routing, middleware, model, dan controller menjadi file-file terpisah yang masing-masing berisi fungsionalitas tertentu.
Silakan buka repositori Github untuk melihat kode sebelumnya.
Untuk melakukan modularisasi pada aplikasi Hapi, langkah-langkahnya adalah sebagai berikut:
- Buatlah folder dengan nama
src
pada direktori utama aplikasi. - Pindahkan file
server.js
ke dalam foldersrc
. - Buatlah folder di dalam
src
dengan namaroutes
. - Buatlah file baru dengan nama
route.js
di dalam folderroutes
.
Berikut adalah struktur folder setelah melakukan modularisasi:
- src
- server.js
- routes
- route.js
Membuat plugin dan menerapkan routing
Hapi memiliki fitur sistem plugin yang dapat memudahkan kita dalam memecah aplikasi menjadi bagian-bagian yang terisolasi, termasuk business logic dan utility yang dapat digunakan kembali. Kita dapat menggunakan plugin yang telah tersedia atau membuatnya sendiri sesuai dengan kebutuhan aplikasi yang sedang kita bangun.
Pada dasarnya, plugin pada Hapi adalah sebuah objek yang memiliki properti register
. Selain itu, objek plugin juga harus memiliki properti name
yang merupakan nama dari plugin tersebut, serta beberapa properti opsional seperti version
dan lain-lain tergantung pada kebutuhan.
- Properti
register
adalah sebuah fungsi yang menerima parameterserver
danoptions
. - Parameter
server
berisi instance server Hapi yang sedang berjalan. - Sedangkan parameter
options
berisi konfigurasi atau opsi tambahan yang dibutuhkan oleh plugin. Informasi lebih detail mengenai Plugin Hapi dapat ditemukan pada dokumentasi resmi Hapi.
Langsung saja kita buat plugin hapi!
Buka route.js
dan ketikkan kode berikut:
const routes = [
];
module.exports = {
name: "routes",
version: '1.0.0',
register: async (server, options) => {
server.route(routes);
},
};
Terdapat variabel routes
yang berisi array kosong. Nantinya variabel routes
akan menampung setiap endpoint pada aplikasi. Selanjutnya, kita mengekspor sebuah objek dengan properti name
, version
, dan register
. Pada fungsi callback, kita memanggil fungsi server.route
dan memasukkan variabel routes
sebagai parameter. Hal ini akan mendaftarkan rute-rute pada aplikasi yang sudah didefinisikan di dalam variabel routes
. Dengan begitu, ketika plugin ini di-register pada server Hapi, maka rute-rute pada aplikasi akan otomatis terdaftar pada server Hapi.
Selanjutnya kita akan pindahkan route pada server.js
ke dalam route.js
, buka file server.js
dan lakukan cut (ctrl + x) untuk route berikut:
server.route({
method: "GET",
path: "/",
handler: (request, h) => {
return "Hello World !";
},
});
Paste code (ctrl +v) pada array routes
di file route.js
, dan hapus baris kode server.route()
. Kemudian sisakan hanya objek-objek route saja, seperti contoh berikut:
const routes = [
{
method: "GET",
path: "/",
handler: (request, h) => {
return "Hello World !";
},
}
];
module.exports = {
name: "routes",
version: '1.0.0',
register: async (server, options) => {
server.route(routes);
},
};
Menginstall nodemon
Dalam Node JS, kita sering memulai ulang proses untuk menerapkan perubahan. Nodemon dapat membantu kita untuk memulai ulang proses secara otomatis. Buka terminal lalu jalankan perintah berikut:
npm install -D nodemon
Flag -D
adalah shortcut dari — save-dev
, hal ini membuat package akan muncul di devDependencies.
Buka package.json
, kemudian hapus baris kode yang berisikan test
, dan tambahkan kode berikut:
"start" : "nodemon src/server.js"
Untuk menjalankan aplikasi jalankan perintah berikut pada terminal:
npm start
Menambahkan path parameter dalam routing
Pada Hapi, path yang memiliki parameter ditandai dengan { }
. Contohnya, /users/{user}
. Untuk mendapatkan nilai dari parameter path tersebut, kita dapat menggunakan request.params
, dengan menggunakan nama parameter sebagai key, contohnya request.params.user
.
Ketikkan kode berikut tepat setelah object dengan path /
:
{
method: "GET",
path: "/users/{user}",
handler: (request, h) => {
return `Hello ${request.params.user}`;
},
},
Jangan lupa untuk menyimpan (ctrl + s) file yang telah dibuat. Kemudian buka browser dan masukkan contoh url berikut : http://localhost:3000/users/johndoe
Jika kita mengosongkan parameter dari path maka akan muncul error seperti berikut:
Hal tersebut terjadi karena dalam route.js
kita telah memasukkan path: “/users/{user}”
yang membuat parameter user wajib untuk dimasukkan. Namun, untuk mengatasi hal tersebut kita bisa menambahkan ?
pada akhiran path untuk membuatnya menjadi opsional, berikut contohnya:
{
method: "GET",
path: "/users/{user?}",
handler: (request, h) => {
return `Hello ${request.params.user}`;
},
},
Dengan rute “/users/{user?}”
nilai request.params.users
akan disetel menjadi string kosong. Berikut adalah contohnya:
Menambahkan wildcard dalam path parameter
Pada Hapi routes dipanggil dalam urutan tertentu, sehingga kita tidak akan mengalami masalah di mana dua rute saling bertentangan. Routes dipanggil dari yang paling spesifik hingga ke yang paling tidak spesifik. Contohnya: route dengan path “/home”
akan dipanggil sebelum “/{any*}”
.
Tambahkan route baru dengan mengetikkan kode berikut:
{
method: "GET",
path: "/{any*}",
handler: (request, h) => {
return "Oops! You must be lost!";
},
},
Path parameter “/{any*}”
menandakan parameter dapat berisi karakter apa pun dan memiliki panjang berapa pun. Hal ini membuat path tersebut akan menangkap dan mengarahkan permintaan ke semua rute yang tidak sesuai dengan path yang ditentukan di route lainnya. Dalam kasus ini, kita menggunakan path “/{any*}”
untuk menangani permintaan ke halaman 404 atau halaman kesalahan umum lainnya.
Perlu diketahui bahwa kita tidak harus menggunakan
{any*}
dalam path, kita bisa menerapkan yang lainnya seperti{persons*}
,{books*}
, dan lain-lain. Namun pada umumnya menggunakan{any*}
.
Sekarang, masukkan url berikut : http://localhost:3000/persons . Path persons tidak kita definisikan dalam route, dan seharusnya mengembalikan 404 Not found. Namun karena kita telah menerapkan wildcard {any*}
, maka hasilnya sebagai berikut:
Selamat !!! kamu telah berhasil membuat plugin dan menerapkan routing pada aplikasi Hapi JS kamu!
Sumber :
https://hapi.dev/tutorials/plugins/?lang=en_US
https://hapi.dev/tutorials/routing/?lang=en_US
https://developer.android.com/topic/modularization?hl=id
https://nodemon.io/
Silakan kunjungi repositori Github untuk melihat seluruh kode yang telah dibahas dalam artikel ini.
Ingin mengetahui lebih banyak? Jangan lewatkan artikel selanjutnya yang akan membahas topik Menarik tentang Mengimplementasikan Operasi CRUD dengan Hapi JS dan PostgreSQL.