Penerapan React JS Untuk Pengembangan Frontend Pada Aplikasi Jasa Layanan Perbaikan Barang Elektronik

Tatas Buana; Yeremia Alfa Susetyo

doi:10.36080/idealis.v9i2.3837

Authors

Tatas Buana Teknik Informatika, Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana, Salatiga, Indonesia
Yeremia Alfa Susetyo Teknik Informatika, Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana, Salatiga, Indonesia

DOI:

https://doi.org/10.36080/idealis.v9i2.3837

Keywords:

React JS, Waterfall Method, Development of web based, Electronic Device Repair Service, Repair Service Booking System, Single Page Application, Waterfall, Layanan Perbaikan Perangkat Elektronik, Sistem Pemesanan Layanan Perbaikan

Abstract

Electronic device repair services still commonly use manual booking processes, such as visiting the service location directly or communicating through WhatsApp. Based on the observation results, the service process is still carried out manually, and system testing was simulated using 5 service types, 10 user accounts, and 20 dummy order data. This condition causes ineffective communication, customer queues, and limited information regarding repair status and cost estimates. Based on these problems, this study aims to implement React JS in the frontend development of an electronic device repair service application. The system development used the Waterfall method, which includes requirement, system design, implementation, testing, and maintenance. The application was developed using React JS with the support of React Router DOM, React Hooks, Fetch API, Tailwind CSS, and PostgreSQL as the database. The system produces 10 user features and 8 admin features. Functional testing using Black Box Testing on 15 scenarios showed that all system functions worked according to the specified requirements with a success rate of 100%, while User Acceptance Testing (UAT) obtained a user acceptance rate of 86.40%. The main contribution of this study is the implementation of React JS to build a component-based frontend interface that supports navigation management, Single Page Application (SPA), state management, and structured user interaction in the repair service system.

Downloads

Download data is not yet available.

References

[1] H. H. Anggara, M. Y. H. Utomo, M. B. B. Sutigar, and A. S. Fitri, “Perancangan aplikasi layanan jasa reparasi alat elektronik dengan metode Object Oriented Analysis Design (OOAD) berbasis web,” JATI (Jurnal Mahasiswa Teknik Informatika), vol. 8, no. 3, pp. 3118–3123, 2024, doi: 10.36040/jati.v8i3.9590.

[2] A. F. Hudzaifah, M. F. Latief, “Perancangan dan Implementasi Sistem Reservasi Klinik Berbasis Web dengan Framework React JS: Studi Kasus Klinik Pratama Agha Depok,” DBESTI: Journal of Digital Business and Technology Innovation, vol. 3, no. 1, pp. 134–141, 2026, doi: 10.54914/dbesti.v3i1.2246.

[3] M. Abdilah, V. Yasin, A. B. Yulianto, “Rancang Bangun Aplikasi Manajemen Sistem Pelayanan Penyediaan Jasa Berbasis Online,” Jurnal Manajamen Informatika Jayakarta, vol. 2, no. 1, pp. 103–114, 2022 doi: 10.52362/jmijayakarta.v2i1.722

[4] R. Ferdinan and M. Fachrie, “Pengembangan Aplikasi Jasa Service Peralatan Elektronik Berbasis Android Menggunakan Payment Gateways,” Jurnal Indonesia : Manajemen Informatika dan Komunikasi, vol. 5, no. 1, pp. 954–963, 2024, doi: 10.35870/JIMIK.V5I1.563.

[5] M. D. Dermawan, H. Suroyo, A. Wijaya, and Jemakmun, “Pengembangan Web Admin Aplikasi Pulsa Dengan React JS Menggunakan Metode Rapid Application Development (RAD),” Jurnal Teknologi dan Sistem Informasi Bisnis, vol. 6, no. 2, pp. 300–309, 2024, doi: 10.47233/jteksis.v6i2.1337.

[6] M. Effendy and A. Habib, “Rancang Bangun Sistem Informasi Pemesanan Jasa Perbaikan Elektronik Berbasis Website Dengan Penerapan Metode Eksponent Smoothing Pada CV OTW Computer Gusaha Surabaya,” JATI (Jurnal Mahasiswa Teknik Informatika), vol. 9, no. 5, pp. 8263–8270, Jul. 2025, doi: 10.36040/JATI.V9I5.14937.

[7] L. Apriyanti, M. Ismu Rahayu, A. Winarni, and F. Riki Setiadi, “PMB Pembaruan Aplikasi Pendaftaran Mahasiswa Baru Stmik Bandung Menggunakan Siklus SPA (Single Page Application),” Jurnal Bangkit Indonesia, vol. 14, no. 2, pp. 73–78, 2025, doi: 10.52771/BANGKITINDONESIA.V14I2.460.

[8] N. Raptama and Riki, “Analysis and Design of Information Systems for Make-Up Using the Waterfall Methodology,” bit-Tech, vol. 5, no. 2, pp. 54–66, 2022, doi: 10.32877/BT.V5I2.553.

[9] A. Maulana, I. Purnamasari, I. Maulana, U. S. Karawang, J. H. Ronggo Waluyo, and T. Timur, “Rancang Bangun Website Layanan Jasa Reparasi Alat Elektronik Rumah Tangga Menggunakan Framework Laravel (Studi Kasus: Cv. Xyz),” Jurnal Informatika dan Teknik Elektro Terapan, vol. 12, no. 3, pp. 2830–7062, 2024, doi: 10.23960/jitet.v12i3.4859.

[10] S. Rahmadhani, M. Dyvani, W. Wildana, H. W. Arumdanie, and L. Hakim, “Penerapan React JS dan Axios untuk Pengembangan Front-end Aplikasi iCare,” SESSION (Software Development, Digital Business Intelligence, and Computer Engineering), vol. 2, no. 2, pp. 40–46, 2024, doi: 10.57203/session.v2i02.2024.40-46.

[11] R. Febriansyah, “Perancangan Sistem Informasi Layanan Servis Elektronik Rumah Tangga Berbasis Web,” HUMANITIS: Jurnal Humaniora, Sosial dan Bisnis, vol. 2, no. 11, pp. 21–32, 2025. [Online]. Available: https://ecosemica.net/index.php/HUMANITIS/article/view/735. Accessed: Jul. 10, 2026.

[12] Y. Nurfauzi, P. Sokibi, and M. Hatta, “Rancang Bangun Aplikasi Layanan Jasa Teknisi Kendaraan Menggunakan Metode Web Engineer,” JATI (Jurnal Mahasiswa Teknik Informatika), vol. 8, no. 6, pp. 12655–12663, 2024, doi: 10.36040/JATI.V8I6.11954.

[13] R. D. Ritonga, I. D. Lesmana, and M. A. Kesuma, “Perancangan Sistem Informasi Layanan Jasa Rumah Tangga Berbasis Mobile Menggunakan Metode Waterfall,” REMIK: Riset dan E-Jurnal Manajemen Informatika Komputer, vol. 10, no. 1, pp. 249–260, 2026, doi: 10.33395/REMIK.V10I1.15754.

[14] G. D. Pamungkas, Y. Parwati, and B. D. Putranto, “Pengembangan Aplikasi Pendaftaran Siswa Baru Berbasis Web Dengan React.Js dan Tailwind CSS,” Jurnal Algoritma, vol. 22, no. 1, pp. 37–48, 2025, doi: 10.33364/ALGORITMA/V.22-1.2135.

[15] A. Musyaffa, M. Zulfa, and M. S. Alim, “Rancang bangun PureCompute platform e-commerce untuk belanja laptop berbasis website,” Jurnal SINTA: Sistem Informasi dan Teknologi Komputasi, vol. 1, no. 1, pp. 21–29, 2024, doi: 10.61124/sinta.v1i1.9.

[16] M. Huzaifa, R. Elisa Nalawati, N. Marcheta, and M. Fadhilah, “Penerapan React. Js dalam Perancangan Sistem Coffee Shop Berbasis Web,” Journal of Social Science Research, vol. 4, no. 3, pp. 17918–17928, 2024, doi: 10.31004/innovative.v4i3.12673

[17] S. D. Pratama, L. Lasimin, and M. N. Dadaprawira, “Pengujian Black Box Testing Pada Aplikasi Edu Digital Berbasis Website Menggunakan Metode Equivalence Dan Boundary Value,” Jurnal Teknologi Sistem Informasi dan Sistem Komputer TGD, vol. 6, no. 2, pp. 560–569, 2023, doi: 10.53513/JSK.V6I2.8166.

[18] A. Aliyah, N. Hartono, A. Azhari Muin, “Penggunaan User Acceptance Testing (UAT) Pada Pengujian Sistem Informasi Pengelolaan Keuangan Dan Inventaris Barang,” Switch: Jurnal Sains dan Teknologi Informasi, vol. 3, no. 2, pp. 42–58, 2025, doi: 10.62951/SWITCH.V3I1.330.