Rancang Bangun E-Commerce Berbasis Single Page Application (SPA) Menggunakan ReactJS
DOI:
https://doi.org/10.31980/petik.v8i2.1256Keywords:
Single Page Application, ReactJs, E-CommerceAbstract
Abstrak— Kemajuan teknologi informasi telah memberikan pengaruh yang cukup signifikan pada semua sektor, termasuk perubahan pada sektor bisnis. Electronic commerce atau yang lebih sering disebut dengan e-commerce merupakan salah satu contoh dalam pemanfaatan teknologi informasi di sektor bisnis. Toko Ozchic terletak di kota Solo berfokus menjual kebutuhan fashion namun belum memiliki e-commerce sehingga belum memenuhi kebutuhan pengguna dalam berbelanja. Pada pengembangan aplikasi website, arsitektur tradisional memiliki kelemahan pada penggunaan bandwidth yang boros pada saat melakukan request dari web server sehingga arsitektur Single Page Application (SPA) dengan menggunakan ReactJs digunakan pada pengembangan website ini dengan pengelolaan data yang efisien dari web server yang bekerja cepat dan interaktif. SPA menggunakan Asynchronous JavaScript and XML (AJAX) untuk memperbaharui halaman secara dinamis. Pada website yang telah dibuat, aplikasi hanya melakukan request ke server hanya jika pengguna membutuhkannya, sehingga aplikasi lebih cepat dimuat pada pertama kali dibanding tanpa menggunakan SPA. Jika pengguna sebelumnya sudah mengunjungi halaman website, maka website tidak perlu melakukan request kembali jika sebelumnya sudah melakukan request. Dalam melakukan pengembangan menggunakan library ReactJs, source code dapat dipisahkan menjadi sebuah komponen sehingga pengembangan menjadi efisien. Pada pengujian fungsionalitas aplikasi website e-commerce Ozchic menggunakan blackbox testing, hasil pengujian fungsionalitas pada aplikasi berjalan dengan baik. Lalu pengujian menggunakan pengujian Usability dengan 30 responden yang mengisi 16 pertanyaan kuesioner menghasilkan skor 76,91% dimana menurut standar usability memiliki grade yang baik. Dari hasil pengujian menggunakan metode pada aplikasi, maka dapat disimpulkan aplikasi web Ozchic dapat dijalankan dengan baik
Kata Kunci — Single Page Application, ReactJs, E-Commerce
Abstract — Advances in information technology currently have a significant influence on all sectors, including changes in the business sector. Electronic commerce or more often referred to as e-commerce is one approach to the use of information technology in business. The Ozchic store is located in the city of Solo, focusing on selling fashion needs but does not yet have e-commerce so that it does not meet the needs of users in shopping. In the development of website applications, traditional architecture has a weakness in the use of wasteful bandwidth when making requests from the web server so that the Single Page Application (SPA) architecture using ReactJs is used in developing this website with efficient data management from a fast and interactive web server. SPA uses AJAX (Asynchronous JavaScript and XML) to dynamically update pages. On the website that has been created, the application only makes requests to the server only if the user needs it, so the application loads faster the first time than without using SPA. If the user has previously visited the website page, then the website does not need to make a request again if it has previously made a request. In developing using the ReactJs library, the source code can be separated into a component so that development becomes efficient. In testing the functionality of the Ozchic e-commerce website application using Blackbox testing, the results of testing the functionality of the application run well. Then testing using usability testing with 30 respondents who filled out 16 questionnaire questions resulted in a score of 76.91% which according to usability standards had a good grade. From the results of testing using the method on the application, it can be concluded that the Ozchic web application can run well.
Keywords— Single Page Application, ReactJs, E-Commerce
References
Melisa Setiawan Hotana, “Industri E-Commerce Dalam Menciptakan Pasar Yang Kompetitif Berdasarkan Hukum Persaingan Usaha,” J. Huk. Bisnis Bonum Commune, vol. 1, no. 1, pp. 28–38, 2018, [Online]. Available: http://jurnal.untag-sby.ac.id/index.php/bonumcommune/article/view/1754
A. Waworuntu, “Rancang Bangun Aplikasi e-Commerce Dropship Berbasis Web,” Ultim. J. Tek. Inform., vol. 12, no. 2, pp. 118–124, 2020, doi: 10.31937/ti.v12i2.1823.
A. Sulaiman, “Pengembangan Sistem Informasi Public E-Marketplace pada PT XYZ,” J. Ultim. InfoSys, vol. 6, no. 2, pp. 92–101, 2016, doi: 10.31937/si.v6i2.225.
S. Ayu and A. Lahmi, “Peran e-commerce terhadap perekonomian Indonesia selama pandemi Covid-19,” J. Kaji. Manaj. Bisnis, vol. 9, no. 2, p. 114, 2020, doi: 10.24036/jkmb.10994100.
E. Sorongan, D. R. Sari, and P. Apriliza, “Sistem Pendukung Keputusan Pemilihan Gudang Menggunakan Metode Single Page Application Dan Simple Additive Weighting,” J. Teknol. Inf. dan Ilmu Komput., vol. 8, no. 3, p. 485, 2021, doi: 10.25126/jtiik.0813257.
Nasution and L. Iswari, “Penerapan React JS Pada Pengembangan FrontEnd Aplikasi Startup Ubaform,” Automata, vol. 2, no. 2, 2021.
F. Nurpandi and D. M. R. Liki, “Perancangan dan Pembangunan Aplikasi Electronic Menu Restoran,” Media J. Inform., vol. 13, no. 1, p. 1, 2021, doi: 10.35194/mji.v13i1.1270.
J. Panjaitan and A. F. Pakpahan, “Perancangan Sistem E-Reporting Menggunakan ReactJS dan Firebase,” J. Tek. Inform. dan Sist. Inf., vol. 7, no. 1, pp. 20–34, 2021, doi: 10.28932/jutisi.v7i1.3098.
A. Luqman and Azhari, “Analisis Penerapan Single Page Application Menggunakan Teknologi AJAX dan REST API (Studi Kasus : Sistem Informasi Reservasi Wisma Tamu UKSW),” J. Tek. Inform. dan Sist. Inf., vol. 3, no. 1, pp. 116–126, 2017.
B. Huda and B. Priyatna, “Penggunaan Aplikasi Content Management System (CMS) Untuk Pengembangan Bisnis Berbasis E-commerce,” SYSTEMATICS, vol. 1, no. 2, p. 81, Dec. 2019, doi: 10.35706/sys.v1i2.2076.
D. Tanudjaja and R. Tanone, “Analisis Penerapan Code Splitting Library React pada Aplikasi Penjualan Mebel Berbasis Website,” J. Tek. Inform. dan Sist. Inf., vol. 7, no. 2, pp. 344–356, 2021, doi: 10.28932/jutisi.v7i2.3493.
M. F. Santoso, “Teknik Single Page Application (Spa) Layout Web Dengan Menggunakan React Js Dan Bootstrap,” vol. 9, no. 2, p. 6, 2021.
Basri, “Pendekatan Kriptografi Hybrid pada Keamanan Dokumen Elektronik dan HypertextTransfer Protocol Secure (HTTPS) (Analisis Potensi Implementasi Pada Sistem Keamanan Informasi),” J. Ilmu Komput., vol. 1, no. 2, pp. 32–37, 2015.
L. Rusdiana, “Extreme programming untuk rancang bangun aplikasi pengelolaan surat keterangan kependudukan,” Regist. J. Ilm. Teknol. Sist. Inf., vol. 4, no. 1, pp. 49–55, 2018, doi: 10.26594/register.v4i1.1191.
M. A. Gustalika, D. P. Rakhmadani, and A. J. T. Segara, “Penerapan Metode Simple Additive Weighting (SAW) pada Sistem Informasi Pemilihan Asisten Praktikum,” J. Media Inform. Budidarma, vol. 5, no. 3, p. 813, 2021, doi: 10.30865/mib.v5i3.3065.
