Vol.
No.
RANCANG BANGUN DIGITAL QR MENU BERBASIS TEKNOLOGI MERN STACK PADA
RESTORAN BONETA
Program Studi Teknik Informatika Universitas Kristen Indonesia Paulus (UKI-Paulu.
Makassar Yusrin Prameswari.
Chris Batara.
Hermin Arrang .
Program Studi Teknik Informatika Fakultas Informatika dan Komputer Universitas Kristen Indonesia Paulus Makassar email: yusrinprameswari446@gmail.
, cristbatara@ukipaulus.
hermin@ukipaulus.
ABSTRACT
BONETA Restaurant, located in Makassar, has faced challenges with its manual ordering system, particularly regarding service efficiency.
With the advancement of technology, the restaurant plans to transition from physical menus to a digital QR Code- based menu.
QR Code technology enables consumers to access the menu quickly and easily through their mobile devices.
This research aims to design and develop a Digital QR Menu system using the MERN Stack technology, which consists of MongoDB.
Express.
React, and Node.
js, to enhance information accessibility and the consumer experience at BONETA Restaurant.
The system was tested using the black box method to ensure its functionality, and the results showed that 15 critical pages in the system, such as login, payment, order reports, and operational pages, worked as specified.
Thus, this system successfully provides an efficient, interactive, and user-friendly digital solution, ready to be implemented to improve customer service and convenience at BONETA Restaurant.
Keywords: Restaurant.
QR Code.
Digital Menu.
MERN Stack.
Information Access.
Black Box
ABSTRAK
Restoran BONETA merupakan restoran di Makassar yang menghadapi tantangan dalam sistem pemesanan manual, terutama terkait efisiensi pelayanan.
Dengan berkembangnya teknologi, restoran ini berencana untuk beralih dari menu fisik ke menu digital berbasis QR Code.
Teknologi QR Code memungkinkan konsumen mengakses menu secara mudah dan cepat melalui perangkat seluler mereka.
Penelitian ini bertujuan untuk merancang dan membangun sistem Digital QR Menu menggunakan teknologi MERN Stack, yang terdiri dari MongoDB.
Express.
React, dan Node.
js, guna meningkatkan kemudahan akses informasi dan pengalaman konsumen di Restoran BONETA.
Sistem ini diuji menggunakan metode black box untuk memastikan fungsionalitasnya, dan hasil pengujian menunjukkan bahwa 15 halaman penting dalam sistem, seperti login, pembayaran, laporan pesanan, dan halaman operasional restoran, berjalan sesuai Dengan demikian, sistem ini berhasil memberikan solusi digital yang efisien, interaktif, dan mudah digunakan, serta siap diimplementasikan untuk meningkatkan pelayanan dan kenyamanan konsumen di Restoran BONETA.
Kata Kunci: Restoran.
QR Code.
Digital Menu.
MERN Stack.
Akses Informasi.
Black Box
PENDAHULUAN
Latar Belakang Paulus Informatics Journal Restoran merupakan suatu tempat atau bangunan yang diorganisasi secara komersial.
Vol.
No.
yang menyelenggarakan pelayanan dengan baik kepada semua tamunya baik berupa makanan maupun minuman, baik berskala besar maupun kecil (Ardiani, 2.
Seperti Restoran BONETA merupakan salah satu restoran yang berlokasi di Makassar yang telah dikenal dalam industri kuliner Dengan konsep yang unik dan menu yang beragam, menarik perhatian masyarakat sejak Restoran BONETA didirikan pada tahun 2019 dengan fokus pada pengalaman yang istimewa bagi para Dengan suasana yang nyaman dan pelayanan yang ramah.
Selama bertahun-tahun, restoran BONETA telah mempertahankan tradisi penyajian menu secara manual menggunakan daftar menu fisik yang dicetak.
Berdasarkan hasil yang telah dilakukan Fazri Muhamad Kurnia dalam mengungkapkan bahwa pelayan terkadang kesulitan dalam mengantarkan pesanan karena tidak mengetahui tempat duduk konsumen dan seringkali konsumen tidak merespons Ketika nama mereka dipanggil oleh pelayan dikarenakan sedang bercakapcakap (Kurnia, 2.
Namun, dengan perubahan dinamika industri makanan yang semakin berkembang, restoran ini merasa perlunya transformasi ke dalam era digital guna meningkatkan pengalaman konsumen.
Dengan perkembangan teknologi dan kebutuhan akan kemudahan akses informasi, restoran BONETA merasa perlunya beralih dari penggunaan menu fisik konvensional menjadi menu digital yang dapat diakses dengan mudah oleh konsumen.
QR-Code merupakan jenis kode matriks yang memungkinkan kontennya diterjemahkan dengan kecepatan QR-Code memiliki kemampuan menyimpan data di dalamnya yang dapat diakses informasinya dengan respons cepat.
Metode QR-Code memiliki tampilan yang lebih kecil daripada Paulus Informatics Journal barcode dan diakses melalui perangkat seluler yang terhubung ke database yang merekam data (Kurnia, 2.
Beberapa penelitian terkait yang sebelumnya yaitu (Suharianto et al.
menyatakan dari hasil pengujiaanya system yang dikembangkan memungkinkan pihak resto Memberikan pelayanan pemesanan menu yang efisien dan praktis menggunakan fitur kode QR namun hanya sebatas pelanayan Dari hasil penelitian tersebut diperlukan Upaya pengembangan lebih lanjut terkait system pemesanan menu makanan berbasis qr code untuk membuat pemesanan lebih efisien lagi dengan adanya system delivery, selain memesan makanan melalui qr code sistem juga bisa memungkinkan pengguna dapat memesan makanan dari rumah dan mendapatkan pesanan mereka dari rumah.
Dengan menggunakan menu digital berbasis QR code yang diletakan di meja konsumen, konsumen dapat mengakses pilihan menu melalui smartphone mereka masing-masing.
Hal ini memungkinkan konsumen untuk dengan mudah melakukan proses pemesanan dan mengakses beragam menu tanpa perlu menyentuh menu fisik.
Adopsi QR menu digital diharapkan dapat memberikan kepraktisan dan keamanan bagi konsumen dalam mengakses informasi tentang menu dan promosi restoran (Kurnia 2.
Pada penelitian sebelumnya (Noor Hisyam.
Tri Listyorini and Endang Supriyati, 2.
menggunakan teknologi framework codeigniter dan bahasa pemrograman PHP.
Berdasarkan artikel (Informatika, no dat.
mengungkap kan bahwa PHP seringkali dianggap lambat dan sulit untuk dimaintain dalam pengembangan situs web yang kompleks dan menerima lalu lintas Hal ini menyebabkan beberapa pengembang beralih ke bahasa pemrograman lain seperti Node.
js atau Go yang terkenal karena performanya yang cepat dan skalabilitasnya yang lebih baik.
MERN adalah singkatan dari Mongo DB.
Express.
React, dan Node.
js, yang merupakan empat komponen utama dalam stack MERN Stack memiliki arsitektur tiga lapis Vol.
No.
yang terdiri dari lapisan front-end, lapisan tengah, dan lapisan backend.
Lapisan frontend dikelola oleh React.
js, yang digunakan untuk membangun aplikasi web yang Lapisan tengah dikelola oleh Express, mengembangkan framework web dengan Node.
Lapisan backend dikelola oleh Mongo DB, yang digunakan sebagai basis data untuk menyimpan dan mengelola data.
Dengan menggunakan teknologi yang kuat dan terintegrasi.
MERN Stack membangun aplikasi web yang skalabel dan efisien (Bawane 2.
Dengan solusi tersebut, untuk mewujudkan pelayanan yang lebih baik untuk setiap konsumen maka dibuatlah Tugas Akhir ini dengan Judul AuRancang Bangun Digital Qr Menu Berbasis Teknologi Mern Stack Pada Restoran BonetaAy.
II.
TINJAUAN PUSTAKA
1 Restoran Menurut (Marsum, 2.
restoran adalah suatu tempat atau bangunan yang diorganisir secara komersil, yang menyelenggarakan pelayanan dengan baik kepada semua konsumennya baik berupa makanan maupun Tujuan operasional restoran adalah untuk mencari keuntungan sebagaimana tercantum dalam definisi Prof.
Vanco Christian dari School Hotel Administration di Cornell University.
Selain bertujuan bisnis atau mencari keuntungan, membuat puas para konsumennya pun merupakan tujuan operasional restoran yang utama.
Pengertian restoran atau rumah makan menurut Keputusan Menteri Pariwisata.
Pos dan Telekomunikasi No.
KN.
73/PVVI05/MPPT85 tentang Peraturan usaha Rumah Makan, dalam peraturan ini yang dimaksud dengan pengusaha Jasa Pangan adalah AuSuatu usaha yang menyediakan jasa pelayanan makanan dan minuman yang dikelola 2 Digital QR Code Menu Paulus Informatics Journal Menu kode QR digital adalah teknologi inovatif yang digunakan di restoran untuk memperlancar proses pemesanan (Shahril et al.
QR Code atau Quick Response Code merupakan sebuah gambar yang menyimpan informasi berupa kode atau serial number yang bertujuan untuk memberikan informasi di dalamnya tanpa harus mengetikan atau mencari informasi tersebut.
Fungsinya sama seperti Bar Code, tapi perbedaannya adalah jika Bar Code memiliki satu dimensi pindaian.
QR Code memiliki dua dimensi pindaian.
Hal inilah yang membuat QR Code memiliki kemampuan untuk menampung informasi lebih banyak dari Bar Code.
3 Mern Stack MERN adalah singkatan dari Mongo DB.
Express.
React, dan Node.
js, yang merupakan empat komponen utama dalam stack ini.
MERN
Stack memiliki arsitektur tiga lapis yang terdiri dari lapisan front-end, lapisan tengah, dan lapisan backend.
Lapisan front- end dikelola oleh React.
js, yang digunakan untuk membangun aplikasi web yang dinamis.
Lapisan tengah dikelola oleh Express, yang digunakan untuk mengembangkan framework web dengan Node.
Lapisan backend dikelola oleh Mongo DB, yang digunakan sebagai basis data untuk menyimpan dan mengelola data.
Dengan menggunakan teknologi yang kuat dan terintegrasi.
MERN Stack memungkinkan pengembang untuk membangun aplikasi web yang skalabel dan efisien (Bawane, 2.
4 Aplikasi Web Aplikasi web merupakan suatu aplikasi yang dapat diakses dari browser web melalui Internet atau jaringan intranet.
Perkembangan ini mengakibatkan banyak traffic user yang memengaruhi performa website, sehingga munculnya istilah rendering sisi klien walaupun saat ini menurut beberapa penelitian, masingmasing ada yang lebih cepat dibanding lainnya (Herman and Geovanny, 2.
HASIL DAN PEMBAHASAN
1 Rancangan Use Case Diagram Vol.
No.
Gambar 3.
3 Use Case Diagram Kasir Gambar 3.
1 Use Case Diagram Sistem Berjalan Gambar 3.
4 Use Case Diagram Dapur Gambar 3.
2 Use Case Diagram Admin Paulus Informatics Journal Gambar 3.
5 Use Case Diagram Pimpinan Vol.
No.
2 Rancangan Class Diagram Gambar 3.
6 Use Case Diagram Kurir Gambar 3.
1 Class Diagram 3 Hasil Pengujian Pengujian Sistem yang dilakukan dengan menggunakan metode pengujian berdasarkan teknik Black Box dengan menguji fungsionalitas dari aplikasi, tombol dan kesesuaian hasil aplikasi Gambar 3.
7 Use Case Diagram Pelayan Gambar 3.
1 Tampilan Halaman Login Gambar 3.
8 Use Case Diagram Konsumen Dine Gambar 3.
9 Use Case Diagram Konsumen Delivery Paulus Informatics Journal Gambar 3.
2 Tampilan Halaman Menu Vol.
No.
Gambar 3.
7 Tampilan Halaman Pengguna Gambar 3.
3 Tampilan Halaman Pembayaran Gambar 3.
8 Tampilan Form Menu Gambar 3.
4 Tampilan Halaman Kasir Gambar 3.
9 Tampilan Halaman Lainnya Gambar 3.
5 Tampilan Halaman Dapur Gambar 3.
6 Tampilan Halaman Laporan Pesanan Paulus Informatics Journal Gambar 3.
10 Tampilan Halaman Kurir Vol.
No.
Pesanan Halaman Penggun Halaman Form Menu Halaman Lainnya Halaman Kurir Halaman Pelayan ue ue ue ue ue Gambar 3.
11 Tampilan Halaman Pelayan Berdasarkan pengujian sistem didapatkan hasil pengujian berikut :
Tabel 3.
1 Pengujian Sistem Keterangan Pengujian ue Halaman Login ue Halaman Register Halaman Lupa ue Password Halaman Reset Password Halaman Awal Halaman Metode Pembayaran Halaman Pembayaran Halaman Kasir Halaman Dapur Halaman Laporan Berhasil Tidak ue ue ue ue ue ue ue Paulus Informatics Journal IV.
KESIMPULAN DAN SARAN
1 Kesimpulan Berdasarkan pembuatan, dan pengujian yang telah dilakukan, dapat disimpulkan beberapa poin penting yang menggambarkan keberhasilan dan efektivitas sistem yang Kesimpulan ini diambil dari evaluasi menyeluruh terhadap implementasi teknologi dan pengujian fungsionalitas sistem Digital Qr Menu Berbasis Teknologi Mern Stack Pada Restoran Boneta.
Sehingga dapat disimpulkan bahwa :
Penelitian ini berhasil menghasilkan sebuah sistem Digital QR Menu berbasis teknologi MERN Stack yang dirancang untuk mempermudah akses informasi bagi konsumen di Restoran BONETA.
Dengan sistem ini, konsumen dapat dengan mudah memindai kode QR disediakan untuk mengakses menu secara digital, yang tidak hanya mengurangi ketergantungan pada menu fisik tetapi juga meningkatkan pengalaman konsumen melalui akses informasi yang cepat dan akurat.
Penggunaan MERN Stack, yang Vol.
No.
terdiri dari MongoDB.
Express.
React, dan Node.
js, memberikan fondasi yang kuat bagi pengembangan aplikasi yang interaktif, cepat, dan mudah untuk dikembangkan lebih lanjut sesuai kebutuhan restoran.
Pengujian sistem Digital QR Menu di Restoran BONETA dilakukan dengan metode black box untuk memastikan fungsionalitasnya.
item yang telah diuji menunjukkan bahwa sistem berjalan sesuai diinginkan, di mana setiap fitur utama, seperti pemindaian QR dan akses menu digital, bekerja dengan baik tanpa adanya kendala.
Metode pengujian black box ini efektif memastikan bahwa sistem dapat dioperasikan dengan mudah oleh pengguna akhir, memberikan jaminan bahwa aplikasi siap untuk digunakan dalam lingkungan restoran untuk meningkatkan kemudahan dan kenyamanan 2 Saran Untuk pengembangan lebih lanjut dan peningkatan kualitas sistem Digital QR Menu berbasis teknologi MERN Stack di Restoran BONETA, disarankan untuk menambahkan fitur manajemen keuangan, manajemen Penambahan fitur-fitur ini akan membantu dalam mengoptimalkan meningkatkan efisiensi pengelolaan bisnis secara keseluruhan.
DAFTAR PUSTAKA