Aplikasi Manajemen Biodata Mahasiswa Berbasis Web Menggunakan HTML, CSS, Javascript, Dan LocalStorage

Yusni Yusni; Muh. Arfah  Wahlil Pratama; Adelia Asmarani; Listi Aulia; Annisa Annisa; Kharismatul Khomsiah; Serli Serli

doi:10.64476/jtbc.v2i2.44

Penulis

Yusni Yusni Universitas Muhamammadiyah Kolaka Utara
Muh. Arfah Wahlil Pratama Universitas Muhammadiyah Kolaka Utara
Adelia Asmarani Universitas Muhammadiyah Kolaka Utara
Listi Aulia Universitas Muhammadiyah Kolaka Utara
Annisa Annisa Universitas Muhammadiyah Kolaka Utara
Kharismatul Khomsiah Universitas Muhammadiyah Kolaka Utara
Serli Serli Universitas Muhammadiyah Kolaka Utara

DOI:

https://doi.org/10.64476/jtbc.v2i2.44

Kata Kunci:

Aplikasi Web, Biodata Mahasiswa, CRUD, JavaScript, LocalStroge

Abstrak

Penelitian ini bertujuan untuk merancang dan mengimplementasikan aplikasi manajemen biodata mahasiswa berbasis web yang dilengkapi dengan sistem login dan fitur CRUD (Create, Read, Update, Delete). Pengelolaan biodata mahasiswa secara manual masih memiliki beberapa keterbatasan, seperti proses pencatatan yang kurang efisien, risiko kehilangan data, dan kesulitan dalam pembaruan informasi. Oleh karena itu, aplikasi berbasis web dikembangkan sebagai solusi sederhana untuk meningkatkan efektivitas pengelolaan data mahasiswa. Aplikasi ini dibuat menggunakan HTML untuk membentuk struktur halaman, CSS untuk mengatur tampilan antarmuka menyerupai layar laptop, serta JavaScript untuk mengolah logika aplikasi. Penyimpanan data dilakukan menggunakan LocalStorage pada browser, sehingga aplikasi dapat berjalan tanpa server maupun basis data eksternal. Sistem login diterapkan sebagai mekanisme pembatas akses sebelum pengguna masuk ke halaman utama pengelolaan biodata. Hasil pengujian menunjukkan bahwa aplikasi dapat menjalankan fungsi login, menambahkan biodata mahasiswa, menyimpan data, menampilkan data dalam tabel, serta melakukan pengeditan dan penghapusan data dengan baik. Data yang tersimpan melalui LocalStorage tetap tersedia meskipun halaman dimuat ulang atau browser ditutup. Selain itu, antarmuka yang sederhana dan terstruktur memudahkan pengguna dalam mengoperasikan aplikasi. Berdasarkan hasil tersebut, aplikasi manajemen biodata mahasiswa berbasis web ini dapat digunakan sebagai solusi sederhana dalam pengelolaan data mahasiswa serta sebagai media pembelajaran untuk memahami konsep dasar pengembangan aplikasi web, khususnya integrasi antara antarmuka pengguna, logika pemrograman, dan penyimpanan data di sisi klien.

Unduhan

Data unduhan belum tersedia.

Referensi

Afrianto, I. (2018). Perancangan User Interface dan User Experience Aplikasi Berbasis Mobile. Jurnal Unibi (Universitas Informatika dan Bisnis Indonesia), 2(1).

Ardhana, Y. M. K. (2017). Implementasi AJAX pada Sistem Informasi Akademik Berbasis Web. Jurnal Teknologi Informasi, 8(24).

Ariyanto, Y. (2016). Perancangan Sistem Informasi Penjualan Online pada Toko Sepatuku. Jurnal Informatika Polinema, 2(4), 162-168.

Astuti, R., & Baidawi, T. (2018). Pemanfaatan HTML5 Web Storage untuk Aplikasi Web Offline. Jurnal Teknik Komputer AMIK BSI, 4(1), 101-107.

Hendini, A. (2016). Pemodelan UML Sistem Informasi Monitoring Penjualan dan Stok Barang (Studi Kasus: Distro Zhezha Pontianak). Jurnal Khatulistiwa Informatika, 4(2), 107-116.

Hidayat, R., & Stiawan, D. (2019). Pengembangan Aplikasi Web Real-time Menggunakan Node.js dan Socket.io. Jurnal Sistem Informasi (JSI), 11(2), 145-154.

Kurniawan, H., Sitanggang, A. S., & Rosnelly, R. (2018). Implementasi Framework Bootstrap pada Sistem Informasi Berbasis Web. Jurnal Teknologi dan Sistem Informasi, 4(1), 11-20.

Maliki, I., & Solichin, A. (2020). Implementasi Sistem Informasi Perpustakaan Berbasis Web dengan Framework CodeIgniter. Jurnal Informatika, 7(1), 58-65.

Mariko, S. (2019). Aplikasi Website Berbasis HTML dan JavaScript untuk Menyelesaikan Fungsi Integral pada Mata Kuliah Kalkulus. Jurnal Inovasi Teknologi Pendidikan, 6(1), 80-91. https://doi.org/10.21831/jitp.v6i1.22280

Nugraheny, D., & Pranoto, Y. M. (2017). Perancangan Sistem Informasi Pemesanan Tiket Bus Antar Kota. Jurnal SCRIPT, 5(1), 10-18.

Nurnaningsih, D., & Solikin, I. (2018). Perancangan Sistem Informasi Penjualan Berbasis Web (Studi Kasus Toko Buku Gramedia Bintaro). Jurnal Sistem Informasi, 5(1), 30-40.

Pujiarto, B., Novianto, D., & Wahyuni, S. (2018). Rancang Bangun Sistem Informasi Keuangan Daerah Berbasis Web. Jurnal Informatika dan Sistem Informasi (JISI), 3(2), 120-130.

Rahmatika, A. K., Pradana, F., & Bachtiar, F. A. R. (2020). Pengembangan Sistem Pembelajaran HTML dan CSS dengan Konsep Gamification berbasis Web. Jurnal Pengembangan Teknologi Informasi dan Ilmu Komputer, 4(8), 2655-2663.

Riyanto, A. D., Winardi, S., & Rachmawanto, E. H. (2019). Sistem Informasi Geografis Pemetaan Lahan Pertanian Menggunakan Web Mobile. Jurnal Sains dan Informatika, 5(2), 112-120.

Santoso, M. F. (2019). Teknik Responsive Web Design Bootstrap 4 Serta Penerapannya dalam Rancang Bangun Layout Web. Jurnal Pilar Nusa Mandiri, 15(1), 61-68. https://doi.org/10.33480/pilar.v15i1.101

Sari, I. P., Jannah, A., Meuraxa, A. M., Syahfitri, A., & Omar, R. (2022). Perancangan Sistem Informasi Penginputan Database Mahasiswa Berbasis Web. Hello World Jurnal Ilmu Komputer, 1(2), 106-110. https://doi.org/10.56211/helloworld.v1i2.57

Suendri. (2018). Implementasi Diagram UML (Unified Modelling Language) pada Perancangan Sistem Informasi Remunerasi Dosen dengan Database Oracle. ALGORITMA: Jurnal Ilmu Komputer dan Informatika, 3(1), 1-9.

Tempola, F., Arif, M., & Iqbal, M. (2020). Pembangunan Aplikasi Single Page Application (SPA) Menggunakan Framework Vue.js. Jurnal Informatika dan Komputer (JIKO), 5(1), 25-32.

Wijaya, D. R., & Alfita, R. (2017). Perancangan Website Company Profile dengan HTML5 dan CSS3. Jurnal Teknik Elektro (JTE), 6(2), 85-92.

Winarno, A., Darwis, D., & Sundari, S. (2019). Perancangan Aplikasi Manajemen Proyek Berbasis Web Menggunakan Framework Laravel. Jurnal Teknoinfo, 13(2), 113-120.