View of Web Based Sports Center Information System Application Design Using the Laravel Framework

(1)

Jurnal Teknik Informatika dan Sistem Informasi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E- ISSN 2503-2933 51

Perancangan Aplikasi Sistem Informasi Gelanggang Olahraga Berbasis Web Menggunakan Framework

Laravel

David Setia Darmawan¹, Eko Sediyono²

1,2Universitas Kristen Satya Wacana; Jl. Diponegoro No.52-60, Salatiga, Kec. Sidorejo, Kota Salatiga, Jawa Tengah 50711, (0298) 321212

3Program Studi Teknik Informatika, FTI UKSW, Salatiga e-mail: ¹672018075@student.uksw.edu, ²eko@uksw.edu

Abstrak

Dinas Kepemudaan dan Olahraga Kota Salatiga adalah mempunyai tugas membantu memiliki tugas dan tanggung jawab sebagai pembinaan & pengembangan dan koordinasi bidang kelembagaan & industri olahraga, training & penyelenggaraan dan koordinasi bidang pemberdayaan & pengembangan kepemimpinan kepemudaan, & training & penyelenggaraan administrasi ketatausahaan. Dinas Kepemudaan dan Olahraga Kota Salatiga memiliki gelanggang olahraga yang dapat digunakan oleh masyarakat terkhusus masyarakat Kota Salatiga. Namun, Dinas Kepemudaan dan Olahraga Kota Salatiga masih belum memiliki sebuah aplikasi untuk melakukan pemesanan gelanggang olahraga secara online. Penelitian ini bertujuan untuk perancangan serta implementasi dari aplikasi sistem informasi gelanggang olahraga berbasis web dengan penggunaan framework laravel. Oleh karena itu, dibuatlah aplikasi sistem informasi gelanggang olahraga berbasis website menggunakan metode prototype. Hasil dari penelitian perancangan aplikasi ini adalah sebuah website sistem informasi yang dapat memudahkan masyarakat khususnya Kota Salatiga untuk melakukan pemesanan gelanggang olahraga secara daring tanpa harus keluar rumah terlebih dahulu.

Kata kunci – Kota Salatiga, Laravel, Metode Prototype, Website, Olahraga.

Abstract

The Salatiga city sports service and youth service have the duty of assisting the mayor to carry out the government affairs that are the local areas of youth and sports and the assigned duties of formation. The salatypical service and sports city of Salatiga had a sports arena that could be used by the most specialized people in Salatiga. However, Salatiga city sports and youth services still do not have an application to make online bookings for sports venues. The research aims to design and implementation of web-based sports arena information systems applications with the framework laravel. Therefore, the website-based sports arena information system applications are based on prototype methods. Application Design Research is a website for an information system that allows people, especially in the city of Salatiga, to book sports venues online without leaving their homes.

Keywords – Salatiga City, Laravel, Prototype Method, Website, Sport

(2)

52 Jatisi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E-ISSN 2503-2933

David, et., al [Perancangan Aplikasi Sistem Informasi Gelanggang Olahraga Berbasis Web Menggunakan

1. PENDAHULUAN

Sistem Informasi Gelanggang Olahraga merupakan suatu sistem pendayagunaan bersama atas gelanggang olahraga, terpadu dan berkesinambungan serta merupakan sarana pemberian pelayanan informasi gelanggang olahraga secara mudah, cepat dan akurat. Sistem Informasi Gelanggang Olahraga berfungsi untuk mewadahi gelanggang olahraga yang nantinya dapat dipinjam oleh masyarakat dalam maupun luar kota Salatiga. Informasi yang disajikan dalam website merupakan berbagai jenis gelanggang olahraga seperti lapangan bola, lapangan basket, arena lari, serta gelanggang olahraga lainnya [1]. Dinas Kepemudaan dan Olahraga adalah sebuah dinas yang memiliki program kerja dalam kepengurusan serta fungsi fasilitas dari gelanggang olahraga. Penerapan daripada program kerja tersbut adalah menyediakan informasi dan sistem peminjaman gelanggang olahraga untuk di akses oleh masyarakat secara luas. Dalam menjalankan tugas tersebut, diperlukan media publikasi yang dapat digunakan untuk menyebarluaskan informasi dan dapat diakses oleh siapapun untuk menjalankan program tersebut. Barang Milik Daerah merupakan bagian dari aset Pemerintah Daerah yang digunakan dan dimanfaatkan guna menunjang berjalannya tugas dan fungsi tersebut. Peraturan Pemerintah Nomor 27 Tahun 2014 tentang Pengelolaan Barang Milik Daerah mengatur setiap intansi pemerintah untuk dapat melaksanakan Pengelolaan Barang Milik Daerah sesuai dengan peraturan yang berlaku. Adanya otonomisasi daerah yang memberikan kesempatan kepada daerah untuk lebih memberdayakan dan memandirikan masyarakat dalam hal ini generasi muda sebagai harapan bangsa sebagai tulang punggung masa depan yang ada tentunya mengharapkan peningkatan kesejahteraan lewat pemberdayaan yang ada [2]. Maka dari itu pemerintah daerah berusaha sekuat mungkin untuk menggerakan dan membimbing bangsa Indonesia mewujutkan cita-citanya melalui pembangunan.

Salatiga adalah sebuah kota dengan kepadatan penduduk yang tinggi dengan jumlah penduduk sekitar seratus delapan puluh enam ribu jiwa pada tahun 2016 silam [3]. Dengan adanya peninjauan kepada jumlah masyarakat Kota Salatiga, Dinas Kepemudaan dan Olahraga menyediakan sebuah wadah untuk melakukan peminjaman gelanggang olahraga untuk masyarakat khususnya Kota Salatiga. Hal ini agar dapat memudahkan masyarakat dalam mendapatkan informasi maupun memudahkan peminjaman gelanggang olahraga. Namun Dinas Kepemudaan dan Olahraga kota Salatiga masih belum memiliki media untuk menyebarluaskan informasi gelanggang olahraga kepada masyarakat. Mengingat pentingnya pembangunan dari sector Dinas Kepemudaan dan Olahraga untuk memberdayakan dan memandirikan masyarakat.

Laravel merupakan sebuah struktur yang bersifat open source sehingga sangat baik untuk dimanfaatkan secara gratis [4]. Selain itu, Laravel juga menggunakan desain MVC yang membuat struktur kode lebih rapi di mana memisahkan logika dan view [5]. Sistem Laravel juga memiliki gerakan termasuk yang memudahkan untuk menangani kumpulan data dengan menyusun kode PHP [6]. Laravel juga memiliki fitur Authentication untuk melakukan login ke aplikasi Sistem Informasi Gelanggang Olahraga, selain itu Laravel juga memiliki fitur routing yang dapat membantu dalam menentukan arah pada aplikasi Sistem Informasi Gelanggang Olahraga. Maka dari itu, pembuatan aplikasi Sistem Informasi Gelanggang Olahraga Kota Salatiga memanfaatkan Laravel sebagai PHP framework. Berdasarkan latar belakang yang ada, maka dilakukan penelitian yang bertujuan untuk merancang aplikasi sistem informasi gelanggan olahraga kota Salatiga berbasis web dengan menggunakan framework Laravel.

Dalam penelitian berjudul perancangan sistem peminjaman barang berupa aset tetap berbasis web pada lembaga permasyarakatan kelas ii a banceuy Bandung, dengan memanfaatkan metode waterfall. Proses pengumpulan informasi dilakukan dengan menggunakan wawancara dan observasi lapangan. Proses selanjutnya adalah merencanakan basis data dan UI, kemudian melakukan pengkodean dengan menggunakan bahasa pemrograman PHP dan MySQL untuk membuat basis data. Sistem berita peminjaman barang

(3)

Jatisi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E- ISSN 2503-2933 53

berupa asset permanen diciptakan menggunakan fitur untuk melihat data persediaan barang yang ada, peginputan barang masuk, penginputan barang keluar [7].

Pada penelitian yang berjudul Sistem Informasi Penggajian Karyawan Berbasis Web Pada PT. Evershine Menggunakan Framewok Laravel, membahas tentang perancangan website untuk membantu PT. Evershine dalam proses pencatatan dan penggajian karyawan. Penulis menggunakan framework laravel untuk membuat aplikasi web tersebut. Dari penelitian ini, dapat disimpulkan bahwa Laravel dapat memudahkan dalam pembuatan aplikasi web. Selain dapat memudahkan penyusunan laporan, dengan adanya aplikasi ini proses penggajian dan pencatatan dapat menjadi lebih cepat dan efisien [8].

Pada penelitian yang berjudul Implementasi Framework Laravel Pada Sistem Informasi Rumah Kamera Semarang, membahas tentang perancangan aplikasi persewaan kamera online pada rumah kamera Semarang dengan menggunakan framework laravel. Aplikasi ini dibuat tidak hanya untuk memudahkan pemesanan kamera, tetapi juga untuk memudahkan petugas dalam mengelola data. Aplikasi ini menggunakan model pengembangan sistem waterfall.

Dengan adanya sistem ini, memudahkan pelanggan dalam pemesanan kamera serta petugas dalam mengelola data [9].

Dalam penelitian yang berjudul Perancangan Aplikasi Cari Kerja Berbasis Website Menggunakan Laravel, membahas tentang aplikasi pencarian kerja menggunakan sistem Laravel. Dengan memanfaatkan aplikasi ini banyak sekali keuntungannya, misalnya mudah untuk mendapatkan data tentang perusahaan yang membuka peluang, mempermudah pencari kerja tanpa harus membawa banyak berkas, pencari kerja bisa langsung melamar ke perusahaan, tanpa mengatur jadwal dengan pengelola perusahaan, kandidat juga dapat direkrut langsung oleh perusahaan jika mereka tertarik, segi keamanan pengiriman pesan dilengkapi dengan enkripsi. Web pencarian juga telah diuji menggunakan 2 metode, antara lain black box dan teknik UAT (User Acceptance Test) dimana hasil dari kedua strategi tersebut cukup baik [10].

Berdasarkan beberapa penelitian terdahulu, maka dapat disimpulkan bahwa framework Laravel adalah framework yang umumnya digunakan untuk membuat website karena bersifat open source dan gratis. Maka dari itu, framework Laravel digunakan untuk pengerjaan project Sistem Informasi Gelanggang Olahraga Kota Salatiga. Selain bersifat open source dan gratis, Laravel juga memiliki banyak fitur bawaan seperti fitur Authentication yang dapat digunakan untuk login dan logout, hal ini dapat mempermudah dalam merancang aplikasi Sistem Informasi Gelanggang olahraga Kota Salatiga (SIGORA). Aplikasi SIGORA Kota Salatiga dirancang dengan tujuan agar user dapat meminjam gelanggang olahraga Kota secara online, sedangkan admin dapat menambah, mengubah, atau menghapus data gelanggang olahraga yang ada.

2. METODE PENELITIAN

Metode penelitian yang digunakan pada penelitian ini dilakukan dengan beberapa langkah ataupun tahapan antara lain, tahap awal dari penelitian ini adalah dengan melakukan perancangan aplikasi SIGORA. Pada tahapan ini adalah dengan melakukan pengumpulan data yang diperlukan, hingga analisis kebutuhan sistem yang nantinya akan diimplementasikan, kemudian pada tahapan kedua dengan merancang rancangan dasar dari aplikasi SIGORA yang memenuhi dengan kebutuhan yang sudah dianalisis, dan dibutuhkan.

Pada tahapan ketiga dengan melakukan implementasi sistem, dan tahap terakhir dengan pengujian aplikasi. Pada tahapan keempat ini akan digunakan pengujian blackbox testing.

Metode Penelitian perancangan aplikasi Sistem Informasi Gelanggang Olahraga Kota Salatiga dapat dilihat pada Gambar 1.

(4)

54 Jatisi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E-ISSN 2503-2933

Gambar 1. Tahapan Penelitian Metode penelitian dapat dijelaskan sebagai berikut:

1. Tahapan pengumpulan data dan analisis kebutuhan merupakan tahapan pencarian informasi yang diperlukan untuk memenuhi kebutuhan data dan informasi untuk perancangan SIGORA Salatiga.

2. Tahap perancangan aplikasi adalah tahap perancangan sistem yang meliputi perancangan aplikasi fungsional, perancangan antarmuka, perancangan basis data, perancangan struktur aplikasi dan perancangan infrastruktur sistem.

3. Tahap ketiga adalah pengembangan dan implementasi aplikasi, antara lain, tahap pengkodean aplikasi menggunakan framework Laravel dan database Mysql.

4. Tahap terakhir adalah tahap pengujian aplikasi, antara lain, tahap pengujian aplikasi menggunakan pengujian black box dan pengujian pengguna.

3. HASIL DAN PEMBAHASAN 3.1. Usecase Diagram

Use Case adalah sebuah diagram yang memiliki fungsi untuk menggambarkan relasi antar pengguna dengan sistem, sehingga dapat mempermudah dalam menentukan aktor dan hubungan yang terjadi dalam sistem [11].

Gambar 2. Usecase Diagram Admin

(5)

Jatisi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E- ISSN 2503-2933 55

Gambar 3. Usecase Diagram User

Pada aplikasi Sistem Informasi Gelanggang Olahraga, terdapat 2 jenis pengguna yaitu, pengguna (masyarakat) dan admin. Admin memiliki hak untuk mengakses seluruh menu yang ada didalam Sistem Informasi Gelanggang Olahraga Kota Salatiga. Masyarakat hanya memiliki akses untuk melihat dan meminjam gelanggang olahraga yang ada didalam Sistem Informasi Gelanggang Olahraga Kota Salatiga.

3.2. Activity Diagram

Activity diagram peminjaman gelanggang olahraga adalah sebuah alur mengenai peminjaman gelanggang olahraga yang diperuntukan kepada pengguna. Activity Diagram adalah sebuag diagram yang menunjukan rancangan aliran aktivitas atau aliran kerja dalam sebuah sistem yang akan dijalankan [12]. Activity Diagram juga dapat menjelaskan mengenai definisi dan pengelompokan aluran tampilan dari SIGORA. Alur aktivitas aplikasi SIstem Informasi Gelanggang Olahraga Kota Salatiga digambarkan dari pengguna masuk ke aplikasi hingga pengguna dapat meminjam gelanggang olahraga.

(6)

56 Jatisi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E-ISSN 2503-2933

Gambar 4. Activity Diagram dari SIGORA

(7)

Jatisi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E- ISSN 2503-2933 57

3.3. Implementasi

Gambar 5. Tampilan Menu Dashboard SIGORA

Pada Gambar 5 terdapat dashboard admin pada Aplikasi Sistem Informasi Gelanggang Olahraga Kota Salatiga. Struktur menu pada tampilan admin terbagi menjadi 3 bagian antara lain, menu User, gelanggang olahraga, dan request arena. Pada Gambar 6 merupakan dashboard pengguna dimana terbagi menjadi 2 bagian menu antara lain, beranda, dan peminjaman.

Dashboard admin hanya dapat diakses oleh Admin saja agar data Gor dan data peminjaman gelanggang olahraga lebih aman. Pada dashboard seluruh data ditampilkan di halaman.

Gambar 6. Tampilan Menu SIGORA

(8)

58 Jatisi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E-ISSN 2503-2933

Gambar 7. Tampilan dari Daftar GOR Admin

Pada Tampilan daftar GOR, admin dapat melihat informasi terkait gelanggang olahraga yang ada dalam database termasuk nama gor, fungsi gedung, foto gedung. Admin melakukan pemantauan hingga perubahan informasi terkait gelanggang olahraga di Kota Salatiga.

Gambar 8. Tamplan List Arena dari SIGORA

(9)

Jatisi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E- ISSN 2503-2933 59

Gambar 9. Tampilan List User dari Admin SIGORA

Pada Gambar 8 hingga Gambar 9 adalah tampilan yang berada didalam menu dari akun admin. Dalam hal ini, menu ini dapat diakses oleh admin. Hal ini dlakukan untuk menjaga keamanan data dari informasi terkait gelanggang olahraga maupun data dari user. Admin dapat melihat informasi terkait arena dari suatu gelanggang olahraga dan user yang ada dalam database.

Halaman ini digunakan untuk melaukan perubahan data maupun informasi pengguna.

Dalam hal ini, pengguna dapat melihat serta mengubah informasi terkait dirinya sendiri yang ada dalam database termasuk nama, email, hingga password dari pengguna itu sendiri.

Gambar 10. Tampilan Edit Profile di Admin SIGORA

(10)

60 Jatisi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E-ISSN 2503-2933

3.4. Pengujian Sistem

Tabel pengujian blackbox adalah sebagai berikut:

No Komponen

Sistem Butir Uji Skenario Pengujian Hasil yang diharapkan

Hasil Pengujian 1 Halaman

Login

User menginput Username dan password, kemudian klik sign-up

Masuk ke halaman home page

User meng-input Username dan password, kemudian klik sign-up

Berhasil

2 Halaman Gelanggang Olahraga

User klik tombol Tambah

Gelanggang Olahraga

Masuk ke halaman Tambah Gelanggang Olahraga yang berisikan tabel Gelanggang Olahraga

User klik tombol Tambah

Gelanggang Olahraga

Berhasil

3 Halaman Tambah Gelanggang Olahraga

User menginput data-data

Gelanggang Olahraga pada text field yang sudah disediakan

Jika data telah diinput secara lengkap maka data-data tersebut akan tersimpan dan kembali ke halaman Gelanggang Olahraga

User mengklik nama kategori aset

Berhasil

4 Halaman User

Admin klik tombol tambah user

Masuk ke halaman Tambah User yang berisikan tabel User

Admin klik tombol tambah user

Berhasil

5 Halaman Tambah User

Admin

menginput data- data user yang akan

ditambahkan pada text field yang sudah disediakan

Jika data telah diinput secara lengkap maka data-data tersebut akan tersimpan dan kembali ke halaman user

Admin

menginput data- data user yang akan

ditambahkan pada text field yang sudah disediakan

Berhasil

6 Halaman Edit Arena

Admin mengisi data-data Arena yang akan diubah

Jika data telah diinput lengkap maka akan tersimpan dalam basis data, dan kembali ke Halaman Gelanggang Olahraga

Admin mengisi data-data Arena yang akan diubah

Berhasil

7 Halaman Edit User

Admin mengisi data-data User yang akan diubah

Jika data telah diinput lengkap maka akan tersimpan dalam basis data, dan kembali ke Halaman User

Admin mengisi data-data User yang akan diubah

Berhasil

8 Halaman Profile

User masuk ke menu Profile mengisi data- data diri yang akan diubah

Jika data telah diinput lengkap maka akan tersimpan dalam basis data, dan kembali ke Halaman Home Page

User masuk ke menu Profile mengisi data-data diri yang akan diubah

Berhasil

(11)

Jatisi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E- ISSN 2503-2933 61

4. KESIMPULAN

Dapat disimpulkan bahwa Sistem Informasi Gelanggang Olahraga Kota Salatiga dapat digunakan sebagai media dalam jaringan untuk menyebarluaskan informasi dan peminjaman seputar gelanggang olahraga Kota Salatiga. Sistem Informasi Gelanggang Olahraga Kota Salatiga ini dapat membantu penggunanya dalam melihat gelanggang olahraga yang tersedia.

Sedangkan untuk admin dapat dimudahkan dengan adanya berbagai macam fitur yang dapat digunakan sebagai media pembantu dalam manajemen sistem informasi.

5. SARAN

Saran yang dapat disampaikan untuk pengembangan aplikasi Sistem Informasi Gelanggang Olahraga Kota Salatiga adalah dengan diadakannya penelitian lebih lanjut mengenai analisis kebutuhan sistem yang lebih mendalam, keamanan data, hingga keamanan informasi yang tersedia

DAFTAR PUSTAKA

[1] Lahmita, K. Dedek, and A. Imam, Kebijakan Dinas Pemuda dan Olahraga Dalam Pembinaan Atlet. 2021.

[2] A. Fauzi, “Otonomi Daerah Dalam Kerangka Mewujudkan Penyelenggaraan Pemerintahan Daerah yang Baik,” Spektrum Huk., Vol. 16, No. 1, p. 119, 2019, doi:

10.35973/sh.v16i1.1130.

[3] B. A. Septiani, D. M. Arianie, V. F. A. A. Risman, W. Handayani, and I. S. S. Kawuryan,

“Pengelolaan Sampah Plastik di Salatiga: Praktik, dan Tantangan,” J. Ilmu Lingkung., Vol. 17, No. 1, p. 90, 2019, doi: 10.14710/jil.17.1.90-99.

[4] P. H. Pangestu, R. Tulloh, and R. Adiati, “Perancangan dan Implementasi Aplikasi Pelayanan Kesehatan Puskesmas Berbasis Web Menggunakan Framework Laravel (Studi Kasus Puskesmas Mulyaharja) Design and Implementation of Web Based Publlic Health Center Application Using Laravel Framework (Case Study),” e-Proceeding Appl. Sci., Vol. 7, No. 5, pp. 1818–1835, 2021.

[5] I. K. Aditya, H. Putra, D. Pramana, N. Luh, and P. Srinadi, “Sistem Manajemen Arsip Menggunakan Framework Laravel dan Vue . Js ( Studi Kasus : BPKAD Provinsi Bali ),”

Sist. dan Inform., Vol. 13, No. 2, pp. 97–104, 2019.

[6] A. Mubarak, “Rancang Bangun Aplikasi Web Sekolah Menggunakan UML (Unified Modeling Language) dan Bahasa Pemrograman Php (Php Hypertext Preprocessor) Berorientasi Objek,” JIKO (Jurnal Inform. dan Komputer), Vol. 2, No. 1, pp. 19–25, 2019, doi: 10.33387/jiko.v2i1.1052.

[7] G. S. Priambodo and C. M. Sufyana, “Berbasis Web pada Lembaga Permasyarakatan Kelas II a,” Vol. 9, No. 2, pp. 190–195, 2021.

(12)

62 Jatisi ISSN 2407-4322 Vol. 10, No. 1, Maret 2023, Hal. 51-62 E-ISSN 2503-2933

[8] R. Gustina and H. Leidiyana, “Sistem Informasi Penggajian Karyawan Berbasis Web Menggunakan Framework Laravel,” JSiI (Jurnal Sist. Informasi), Vol. 7, No. 1, p. 34, 2020, doi: 10.30656/jsii.v7i1.1726.

[9] D. Purnama Sari and R. Wijanarko, “Implementasi Framework Laravel pada Sistem Informasi Penyewaan Kamera (Studi Kasus di Rumah Kamera Semarang),” J. Inform.

dan Rekayasa Perangkat Lunak, Vol. 2, No. 1, p. 32, 2020, doi:

10.36499/jinrpl.v2i1.3190.

[10] B. Y. Faqih, “Perancangan Perancangan Aplikasi Cari Kerja Berbasis Website Menggunakan Laravel,” JATISI (Jurnal Tek. Inform. dan Sist. Informasi), Vol. 9, No. 1, pp. 566–581, 2022, doi: 10.35957/jatisi.v9i1.1537.

[11] M. Syarif and W. Nugraha, “Pemodelan Diagram UML Sistem Pembayaran Tunai Pada Transaksi E-Commerce,” J. Tek. Inform. Kaputama, Vol. 4, No. 1, p. 70 halaman, 2020, [Online]. Available: http://jurnal.kaputama.ac.id/index.php/JTIK/article/view/240.

[12] M. D. Kartika and Y. Priyadi, “Pengembangan Sistem Penjualan Menggunakan UML dan Proses Bisnis E-Commerce pada TB.Purnama Banjarnegara,” JATISI (Jurnal Tek.

Inform. dan Sist. Informasi), Vol. 7, No. 3, pp. 480–497, 2020, doi:

10.35957/jatisi.v7i3.416.