Peningkatan Efektivitas Pengelolaan State Menggunakan Pola Prop Drilling Vuejs Pada Fitur Finansial Jala Tech

Abstract

Jala Tech merupakan perusahaan teknologi yang membantu petambak udang dalam meningkatkan kualitas tambak dengan memanfaatkan aplikasi berbasis web. Satu di antara fitur yang terdapat pada aplikasi Jala adalah fitur finansial. Pengelolaan state pada kode frontend fitur tersebut menggunakan pola event bus. Namun, terdapat permasalahan pada penerapan event bus yaitu ketidakmampuan Vue Devtools dalam melakukan debugging pada state. Ketidakmampuan tersebut mengakibatkan sulitnya pengembang dalam melacak alur perubahan state pada tampilan aplikasi. Selain itu, penempatan state yang tidak terpusat menyebabkan terjadinya redundansi state pada komponen-komponen yang memanfaatkan state yang sama. Berdasarkan hal tersebut, perlu dilakukan penulisan ulang kode pada fitur finansial untuk mengubah pengelolaan state dari menggunakan pola event bus menjadi pola prop drilling. Hasil dari penelitian ini adalah peningkatan efektivitas pengelolaan state pada fitur finansial yang telah menerapkan prop drilling pada kode frontend. Dengan menggunakan prop drilling, dapat dilakukan debugging pada state menggunakan Vue Devtools. Selain itu, penempatan state menjadi terpusat pada komponen induk utama fitur finansial aplikasi web Jala. Dengan demikian, pengembang mampu melacak perubahan state serta lebih mudah mengenali state yang dipakai pada fitur finansial aplikasi web Jala.