## Jurnal Manajemen Informatika Jayakarta
Volume 4, Nomor 1, Februari 2024: halaman 51- 60
DOI: https://doi.org/10.52362/jmijayakarta.v4i1.1303
This work is licensed under a Creative Commons Attribution 4.0 International License . http://journal.stmikjayakarta.ac.id/index.php/JMIJayakarta

## PERANCANGAN ABSENSI QR CODE MAHASISWA BERBASIS WEBSITE PADA STIKOM TUNAS BANGSA PEMATANG SIANTAR MENGGUNAKAN METODE AGILE
1 Muhammad Rafai*, 2 Solikhun, 3 M. Safii
1,2,3 Teknik Informatika, STIKOM Tunas Bangsa, Pematang Siantar, Indonesia Jln. Sudirman Blok A No. 1, 2, dan 3 Pematangsiantar, Sumatera Utara, Indonesia
*e-mail: 1* rafaimhd123@gmail.com , 2 solikhun@amiktunasbangsa.ac.id ,
3 m.safii@amiktunasbangsa.ac.id

## Abstrak
Penelitian ini membahas implementasi sistem absensi berbasis web yang memanfaatkan teknologi QR scanner  untuk  mencatat  kehadiran  individu,  khususnya  dalam  lingkungan  pendidikan.  Laporan  ini juga  menyoroti  manfaat  utama  dari  pendekatan  ini,  seperti  efisiensi  proses,  akurasi  data,  dan kemudahan  akses  informasi  yang  real-time.  Sistem  absensi  berbasis  web  menggunakan  QR  scanner bukan hanya meningkatkan efektivitas administratif, tetapi juga memberikan pengalaman yang lebih modern dan interaktif bagi individu yang harus diabsen. Ini  membantu mengurangi risiko kesalahan dalam pencatatan absensi manual dan memberikan akses data kehadiran yang lebih cepat dan akurat. Dalam penelitian ini, penulis meggunakan beberapa metode untuk mengumpulkan data yaitu dengan observasi  dan  studi  literatur.  Penulis  menggunakan  berbagai  sumber  dokumentasi  online  sebagai sumber  data  yang  di  butuhkan  oleh  laporan  ini.  Adapun  dokumen  yang  penulis  gunakan  adalah beberapa  jurnal  terindeks  scopus,  e-book,  dan  beberapa  laman  berita  digital  dalam  kurun  waktu  5 tahun  terakhir.Untuk  metode  pengembangan  website ini,  penulis  menggunakan  metode  Agile.  Agile merupakan  salah  satu  model  pengembangan  Software  Development  Life  Cycle  (SDLC).  Hasil penelitian ini menggabungkan QR code dan akses web, sistem absensi ini menjadi solusi yang relevan dan inovatif dalam manajemen kehadiran yang efisien.
Kata kunci: Absensi, Agile , Website , QR Code , Manajemen Kehadiran, Efisiensi.

## Abstract
This  research  discusses  the  implementation  of  a  web-based  attendance  system  that  utilizes  QR scanner  technology  to  record  individual  attendance,  especially  in  an  educational  environment.  The report  also  highlights  the  primary  benefits  of  this  approach,  such  as  process  efficiency,  data accuracy,  and  real-time  information  access.  The  web-based  attendance  system  using  QR  scanner technology  not  only  enhances  administrative  effectiveness  but  also  provides  a  more  modern  and interactive  experience  for  individuals  who  need  to  be  accounted  for.  This  helps  reduce  the  risk  of errors in manual attendance recording and provides faster and more accurate access to attendance data. In this research, the author used various methods to collect data, including observation and a literature review. The author relied on various online documentation sources as data references for this report. The documents used by the author included several Scopus-indexed journals, e-books, and various  digital  news  pages  from  the  past  5  years.  For  the  development  method  of  this  website,  the author employed the Agile methodology. Agile is one of the models of the Software Development Life

## Jurnal Manajemen Informatika Jayakarta
Volume 4, Nomor 1, Februari 2024: halaman 51- 60
DOI: https://doi.org/10.52362/jmijayakarta.v4i1.1303
Cycle  (SDLC).  The  results  of  this  research,  which  combine  QR  codes  and  web  access,  make  this attendance system a relevant and innovative solution for efficient attendance management.
Keywords: Attendance, Agile, Website, QR Code, Attendance Management, Efficiency.

## 1 Pendahuluan (or Introduction)
Dalam  lingkungan  pendidikan,  manajemen  absensi  merupakan  aspek  krusial  yang mempengaruhi  kehadiran  dan  keterlibatan  mahasiswa  dalam  proses  pembelajaran.  Tradisionalnya, absensi  sering  dicatat  secara  manual  oleh  dosen  atau  staf  administrasi,  yang  dapat  memakan  waktu dan  rentan  terhadap  kesalahan.  Namun,  dengan  kemajuan  teknologi,  terutama  dengan  pemanfaatan QR scanner berbasis web, proses absensi dapat ditingkatkan secara signifikan[1].
Absensi  menggunakan  QR  scanner  berbasis  web  adalah  solusi  modern  yang  memanfaatkan teknologi  QR  code  untuk  mencatat  kehadiran  mahasiswa  dengan  lebih  efisien  dan  akurat.  QR  code adalah  pola  kotak-kotak  hitam  dan  putih  yang  dapat  dengan  mudah  diakses  dan  di-scan  oleh perangkat elektronik, seperti kamera smartphone. Dengan mengadopsi teknologi ini, universitas atau institusi  pendidikan  dapat  meningkatkan  efektivitas  dan  efisiensi  dalam  manajemen  absensi mahasiswa yang jumlahnya banyak[2], [3].
Melalui  pendekatan  ini,  kita  dapat  mengatasi  beberapa  tantangan  dalam  manajemen  absensi mahasiswa, seperti waktu yang terbuang, risiko kesalahan, dan kurangnya data yang akurat. Dengan menerapkan solusi QR scanner berbasis web, universitas dapat menciptakan lingkungan pembelajaran yang lebih canggih, berinteraksi, dan adaptif sesuai dengan kebutuhan  mahasiswa dan perkembangan teknologi.

## 2 Tinjauan Literatur (or Literature Review)
Penelitian  ini  membahas  implementasi  metode  agile  dalam  pengembangan  sistem  absensi menggunakan  QR  Code  Berbasis  website.  Metode  Agile  merupakan  pendekatan  pengembangan perangkat  lunak  yang  menjalankan  fleksibilitas,  adaptabilitas,  dan  kolaborasi  dalam  setiap  tahap pengembangan.  Prinsip-prinsip  Agile  dirancang  untuk  mengatasi  tantangan  dalam  pengembangan yang  berubah-ubah  dan  kompleks,  serta  untuk  memungkinkan  tim  untuk  memberikan  nilai  secara iterative  kepada  pengguna  [4].  User  stories  adalah  Deskripsi  pendek  tentang  fungsionalitas  yang  di inginkan  oleh  pengguna  dalam  sistem.  Proses  identifikasi  user  stories  melibatkan  pemahaman  yang mendalam tentang kebutuhan pengguna dan pemangku kepentingan [6]. Website dikenal juga sebagai situs,  situs  web,  atau  portal.  Ini  merupakan  koleksi  halaman  web  yang  saling  terhubung  satu  sama lain. Halaman pertama dari sebuah website disebut halaman utama ( home page ), sedangkan halaman- halaman  lainnya  disebut  halaman  web  ( web  page )  secara  individu  [8].  Menurut  [9]  website  dibagi menjadi dua, yaitu Website Statis dan Website Dinamis. QR code ( Quick Response code ) adalah jenis kode matriks dua dimensi yang dapat menyimpan informasi dalam bentuk simbol kotak-hitam-putih pada latar belakang putih atau sebaliknya. QR code dapat menyimpan berbagai jenis data, seperti teks, URL, nomor telepon, alamat email, informasi kontak, dan banyak lagi [1].
Penelitian  ini  menghasilkan  sebuah  website  absensi  dengan  QR  Code  yang  dikembangkan dengan metode agile. Website ini diharapkan menjadi solusi dari tantangan dalam manajemen absensi mahasiswa, seperti waktu yang terbuang, resiko kesalahan, dan keakuratan data absensi.

## 3 Metode Penelitian
Penulis  menggunakan  berbagai  sumber  dokumentasi  online  sebagai  sumber  data  yang  di  butuhkan oleh laporan ini. Adapun dokumen yang penulis gunakan adalah beberapa jurnal terindeks scopus, e- book,  dan  beberapa  laman  berita  digital  dalam  kurun  waktu  5  tahun  terakhir.Untuk  metode pengembangan website ini, penulis menggunakan metode Agile.
3.1 Implementasi Metode Agile Dalam Pengembangan Sistem Absensi
3.1.1. Metode Agile

## Jurnal Manajemen Informatika Jayakarta
Volume 4, Nomor 1, Februari 2024: halaman 51- 60
DOI: https://doi.org/10.52362/jmijayakarta.v4i1.1303
This work is licensed under a Creative Commons Attribution 4.0 International License . http://journal.stmikjayakarta.ac.id/index.php/JMIJayakarta
Dalam  implementasi  system  absensi  QR  Code  berbasis  website.  Menurut  [5]  penggunaan metode Agile membawa sejumlah manfaat signifikan seperti :
a. Fleksibilitas Terhadap Perubahan Kebutuhan.
Metode  Agile  memungkinkan  tim  untuk  dengan  cepat  menyesuaikan  perubahan  kebutuhan yang  mungkin  timbul  selama  pengembangan.  Dalam  proyek  absensi  QR  Code,  kebutuhan pengguna  dan  pemangku  kepentingan  dapat  berubah  seiring  waktu.  Dengan  pendekatan Agile, tim dapat dengan mudah mengakomodasi perubahan ini tanpa menghambat kemajuan proyek.
b. Pengiriman Iteratif dan Berkelanjutan.
Agile  memungkinkan  pengiriman  produk  dalam  iterasi  pendek  yang  disebut  sprint.  Setiap sprint menghasilkan bagian yang berfungsi dari sistem. Dalam konteks absensi QR Code, ini berarti  fitur-fitur  penting  dapat  diuji  dan  digunakan  oleh  pengguna  dalam  waktu  yang  lebih singkat. Hal ini meningkatkan kemampuan untuk memberikan nilai kepada pengguna secara berkala.
c. Transparasi Dan Kolaborasi.
Metode Agile mendorong transparansi dalam semua aspek proyek. Kolaborasi antara anggota tim  dan  pemangku  kepentingan  diaktifkan,  memungkinkan  berbagi  pengetahuan  dan  solusi yang lebih baik.

## Gambar 1  Metode Agile

## 3.1.2 Penentuan User Stories
Dalam perancangan sistem absensi QR Code berbasis website, berikut adalah user stories yang di identifikasi:
a. Sebagai  mahasiswa,  saya  ingin  mendaftarkan  diri  dengan  menyediakan  informasi  seperti nama dan NIM.
b. Sebagai  administrator,  saya  ingin  memiliki  halaman  dashboard  untuk  melihat  statistik kehadiran mahasiswa dalam mata kuliah dan kelas tertentu.
c. Sebagai dosen, saya ingin memiliki opsi untuk memberi izin khusus kepada mahasiswa yang memerlukan pencatatan manual kehadiran.

## 3.1.2 Pembagian Dalam Sprint
Setelah  mengidentifikasi  user  strory,  Langkah  selanjutnya  adalah  mengelompokkan  dan mengatur  mereka  ke  dalam  sprint-sprint.  Sprint  adalah  periode  waktu  singkat  dimana  pengembang fokus pada pengembangan fitur-fitur tertentu [7]. Pengelompokan ini membantu dalam merencanakan dan  mengatur  alur  kerja  pengembangan.  Hasil  sprint  dari  identifikasi User  Stories di  atas  adalah sebagai berikut :
a. Sprint 1 : Pendaftaran dan Basis Data
b. Sprint 2 : Membuat Antarmuka Pengguna dan Pencatatan Kehadiran
c. Sprint 3 : Mengimplementasikan Library untuk Pembuatan dan Pembaca QR Code
d. Sprint 4 : Membuat Manajemen Absensi
e. Sprint 5 : Peningkatan Fungsionalitas dan Pengujian
3.2 Perancangan Sistem Absensi QR Code Berbasis Website
3.2.1 Front-End

## Jurnal Manajemen Informatika Jayakarta
Volume 4, Nomor 1, Februari 2024: halaman 51- 60
DOI: https://doi.org/10.52362/jmijayakarta.v4i1.1303
This work is licensed under a Creative Commons Attribution 4.0 International License . http://journal.stmikjayakarta.ac.id/index.php/JMIJayakarta
Front-end adalah  bagian  dari  sistem  yang  bertugas  menyajikan  tampilan  kepada  pengguna. Tugas utamanya adalah mengembangkan komponen-komponen visual dalam sistem dan bertanggung jawab atas antarmuka pengguna [10]. Menurut [11] skill fundamental yang harus di kuasai oleh front- end developer yaitu HTML, CSS, dan Javascript.

## 3.2.3 Flowchart
Flowchart adalah representasi grafis dari alur  atau urutan langkah-langkah dalam suatu proses atau  program.  Flowchart  digunakan  untuk  menggambarkan  secara  visual  bagaimana  informasi  atau data mengalir melalui berbagai tahap atau keputusan dalam suatu sistem atau aktivitas [12].
Dalam  flowchart,  setiap  langkah  atau  tindakan  direpresentasikan  dengan  simbol-simbol tertentu  yang  menggambarkan  jenis  aktivitas  yang  dilakukan.  berikut  adalah  representasi  Flowchart untuk proses absensi menggunakan QR Code berbasis website :

## Gambar 2  Flowchart Absensi QR Code

## 3.3 Perancangan Sistem Absensi QR Code Berbasis Website
3.3.1 React JS
React  JS adalah  sebuah  Pustaka  ( library )  JavaScript open-source yang  popular  untuk membangun  antarmuka  pengguna  pada  aplikasi  web.  Dikembangkan  oleh Facebook , ReactJS memungkinkan pengembang untuk membuat komponen-komponen tampilan yang dinamis dan dapat di atur ulang ( reusable ). React JS menggunakan pendekatan komponen, di mana antarmuka pengguna dibangun dari berbagai komponen kecil yang dapat berinteraksi satu sama lain[13].

## 3.3.2 MongoDB
MongoDB adalah  sebuah  sistem  manajemen  basis  data  ( DBMS )  yang  berbasis  dokumen  dan non-relasional.  Secara  ilmiah, MongoDB adalah  sebuah  perangkat  lunak  yang  digunakan  untuk menyimpan dan mengelola data dalam bentuk dokumen yang fleksibel [14].
Dalam  MongoDB,  data  diatur  dalam  koleksi  (collections)  yang  setara  dengan  tabel  dalam sistem  basis  data  relasional.  Namun,  perbedaannya  terletak  pada  struktur  data  yang  disimpan  dalam masing-masing  koleksi.  Koleksi  dalam  MongoDB  tidak  memiliki  skema  yang  tetap  seperti  tabel

## Jurnal Manajemen Informatika Jayakarta
Volume 4, Nomor 1, Februari 2024: halaman 51- 60
DOI: https://doi.org/10.52362/jmijayakarta.v4i1.1303
dalam  basis  data  relasional.  Setiap  dokumen  dalam  koleksi  dapat  memiliki  struktur  yang  berbeda, sehingga MongoDB cocok untuk menyimpan data yang beragam dan dinamis[15].
Berdasarkan penjelasan MongoDB di atas, kita dapat merancang koleksi-koleksi yang sesuai untuk mengelola data dalam system basis data MongoDB. Untuk kasus ini, kita dapat membuat tiga koleksi:  “Admins”  untuk  data  administrator,  “Students”  untuk  data  mahasiswa,  dan “AttencanceRecords” untuk data absensi yang tersimpan.
a. Admins Collection
Koleksi  ini  akan  berisi  data  mengenai  administrator  sistem.  Setiap  dokumen  dalam  koleksi  ini mungkin  mencakup  informasi  seperti  nama,  alamat  email,  dan  kata  sandi.  Contoh  dokumen  dalam koleksi ini dapat tampak seperti ini:

## Gambar 3  Admins Collection
b. Students Collection
Koleksi  ini  akan  menyimpan  data  terkait  dengan  mahasiswa.  Setiap  dokumen  dalam  koleksi  ini mungkin  berisi  informasi  seperti  nama,  NIM,  dan  kelas.  Contoh  dokumen  dalam  koleksi  ini  dapat terlihat seperti ini:

## Gambar 4  Students Collection
c. AttendanceRecords Collection
Koleksi ini akan digunakan untuk  menyimpan data absensi. Setiap dokumen dalam  koleksi ini akan mencatat  informasi  seperti  tanggal  absensi,  ID  mahasiswa,  dan  status  kehadiran.  Contoh  dokumen dalam koleksi ini bisa terlihat seperti ini:

## Gambar 5  AttendanceRecords Collection 3.3.3 QR Code
QR  code  diciptakan  oleh  perusahaan  Jepang  bernama Denso  Wave pada  tahun  1994  sebagai solusi untuk melacak mobil di jalur produksi. Sejak itu, QR code telah menjadi populer dan banyak digunakan  di  berbagai  bidang,  termasuk  pemasaran,  logistik,  periklanan,  teknologi,  dan  banyak  lagi [16].
Keunggulan QR Code Meliputi :
a. Kapasitas Penyimpanan Tinggi

## Jurnal Manajemen Informatika Jayakarta
Volume 4, Nomor 1, Februari 2024: halaman 51- 60
DOI: https://doi.org/10.52362/jmijayakarta.v4i1.1303
Qr  Code  Dapat  menyimpan  lebih  banyak  informasi  dibandingkan  dengan  kode  batang tradisional. Karena informasi disimpan dalam dua dimensi, yaitu horizontal dan vertical.
b. Kecepatan Pembacaan Yang Tinggi
QR  code  dapat  dengan  cepat  dibaca  dan  diuraikan  oleh  perangkat  lunak  pemindai, membuatnya efisien untuk mendapatkan informasi.

## 3.3.4 Penggunaan Library React QR Code Scanner dan Generator
Library  React  QR  Code  Scanner adalah  seperangkat  komponen  dan  utilitas  yang  dirancang untuk  memudahkan  integrasi  pemindaian QR  code ke  dalam  aplikasi  web  yang  dibangun  dengan React . Library ini menyediakan komponen React yang dapat dengan mudah diintegrasikan ke dalam komponen kita, sehingga pengguna dapat menggunakan kamera perangkat untuk memindai QR code . Dalam Penggunaan nya kita harus melakukan Langkah-langkah berikut :
a. Instalasi
Kita  perlu  menginstall library React  QR  Code  Scanner  menggunakan  manajer paket  seperti NPM atau Yarn.
b. Integrasi Komponen Kita dapat mengimport dan menggunakan komponen QR Code Scanner yang di sediakan oleh library dalam komponen React kita. Komponen ini akan menampilkan antarmuka kamera dan mendeteksi QR Code yang di arahkan ke kamera.
c. Pemindaian QR Code Ketika  pengguna  mengarahkan  kamera  ke  QR  Code,  komponen  akan  mendeteksi  kode tersebut dan memberikan hasilnya kepada kita melalui prop atau callback.
Library  React  QR  Code  Generator adalah  seperangkat  komponen  dan  fungsi  yang  digunakan untuk menghasilkan QR Code secara dinamis dalam aplikasi React . Dengan menggunakan library ini, anda dapat dengan mudah membuat QR Code dengan berbagai jenis data, seperti teks, URL, nomor telepon, dan lainnya Langkah-langkah untuk menggunakan library React QR Code Generator adalah :
a. Instalasi
Kita perlu menginstall library React QR Code Generator menggunakan manajer paket seperti NPM atau Yarn.
b. Integrasi Komponen
Kita  dapat  mengimpor  komponen  QR  Code  Generator  atau  fungsi-fungsi  yang  disediakan oleh library ke dalam komponen Kita. Kita akan memberikan data yang ingin di ubah menjadi QR code.
c. Membuat QR Code
Komponen atau fungsi akan menghasilkan tampilan QR code berdasarkan data yang kita berikan. Kita dapat menampilkan QR code ini dalam komponen yang kita inginkan.

## 4 Hasil dan Pembahasan
Berdasarkan  penjelasan  mengenai  alur  dan  penggunaan  teknologi  sebelumnya,  kita  dapat mengamati hasil implementasinya seperti yang tertera di bawah ini:
a. Tampilan Landing Page
Tampilan  landing  page  adalah  halaman  pertama  yang  dilihat  oleh  pengunjung  ketika  mereka mengakses sebuah website. Halaman ini bertuliskan “Selamat Datang Di Absensi STIKOM. Absensi berbasis  website  yang  memanfaatkan  fitur  kamera  pada  perangkat  untuk  membaca  QR  Code”,  dan sebuah  CTA  (Call  To  Action)  button  yang  bertuliskan  “Scan  Sekarang!”  seperti  pada  gambar  6 berikut :

## Jurnal Manajemen Informatika Jayakarta
Volume 4, Nomor 1, Februari 2024: halaman 51- 60
DOI: https://doi.org/10.52362/jmijayakarta.v4i1.1303
This work is licensed under a Creative Commons Attribution 4.0 International License . http://journal.stmikjayakarta.ac.id/index.php/JMIJayakarta

## Gambar 6 Halaman Landing Page
b. Tampilan Halaman Register
Halaman  registrasi  (atau  halaman  pendaftaran)  adalah  halaman  dalam  sebuah  website  yang dirancang  khusus  untuk  memungkinkan  pengguna  untuk  membuat  akun.  Untuk  registrasi  dapat  di lakukan  dengan  cukup  mudah,  hanya  dengan  mengisi  nama,  email,  dan  password  admin.  Untuk halaman registrasi dapat di lihat pada gambar 7 berikut :

## Gambar 7 Halaman Registrasi
c. Tampilan Halaman Login
Halaman  login  adalah  halaman  yang  digunakan  untuk  masuk  ke  dalam  website  ini  dan  agar dapat  mengakses  fitur  fitur  di  dalam  website  ini.  Untuk  melakukan  login,  pengguna  hanya  cukup memasukkan  email  dan  password  yang  sudah  terdaftar.  Untuk  halaman  Login  dapat  di  lihat  pada gambar 8 berikut :

## Gambar 8 Halaman Login
d. Tampilan Halaman Daftar Mahasiswa
Halaman  daftar  mahasiswa  dapat  di  akses  dengan  mudah  melalui  navbar.  Pada  halaman  ini, admin  dapat  melihat  siapa  saja  mahasiswa  yang  sudah  terdaftar.  Untuk  tampilan  halaman  daftar Mahasiswa, dapat di lihat pada gambar 9 berikut :

## Gambar 9 Tampilan halaman daftar mahasiswa yang sudah di tambahkan
Untuk  menambah  mahasiswa,  pengguna  dapat  pindah  ke  halaman  tambah  mahasiswa  dengan melakukan  klik  pada  tombol  “Tambah  Mahasiswa”.  Pada  halaman  Tambah  Mahasiswa,  pengguna

## Jurnal Manajemen Informatika Jayakarta
Volume 4, Nomor 1, Februari 2024: halaman 51- 60
DOI: https://doi.org/10.52362/jmijayakarta.v4i1.1303
hanya  perlu  mengisi  data  nama,  NIM,  dan  Kelas  untuk  mahasiswa  yang  ingin  di  tambahkan.  Untuk tampilan halaman Tambah Mahasiswa, dapat di lihat pada gambar 10 berikut :

## Gambar 10 Tampilan halaman tambah mahasiswa
e. Tampilan Cetak QR Code
Halaman cetak QR Code adalah sebuah halaman yang berfungsi untuk mencetak atau membuat QR  Code  untuk  absensi.  Halaman  ini  dapat  di  akses  dengan  mudah  melalui  halaman  Daftar Mahasiswa,  lalu  klik  pada  tombol  “Cetak  QR”  untuk  mahasiswa  yang  di  inginkan.  Satu  QR  Code hanya untuk satu mahasiswa. Untuk Tampilan halaman cetak QR Code dapat di lihat pada gambar 11 berikut ini :

## Gambar 11 Tampilan halaman pembuatan QR Code
f. Tampilan Halaman Scan
Untuk  dapat  melakukan  absensi  scan  QR  Code,  pengguna/admin  harus  melakukan  login terlebih  dahulu.    Jika  user  sudah  melakukan  login,  maka  user  akan  di  tunjukkan  halaman  Room. Room  ini  berfungsi  untuk  mengelompokkan  setiap  pertemuan  dan  mata  kuliah  untuk  setiap  kelas. Tampilan room dapat di lihat pada gambar 12.

## Gambar 12 Halaman room untuk scan absensi setiap matakuliah yang sudah di buat
Pengguna juga dapat menambah Room mata kuliah baru dengan klik tombol “Buat Ruangan”. User  dapat  membuat  room  baru  dengan  mengisi  nama  ruangan,  kelas,  dan  jam  masuk  untuk  mata kuliah yang di inginkan. Untuk tampilan halaman buat ruangan, dapat di lihat pada gambar 13 berikut ini :

## Gambar 13 Halaman buat ruangan

## Jurnal Manajemen Informatika Jayakarta
Volume 4, Nomor 1, Februari 2024: halaman 51- 60
DOI: https://doi.org/10.52362/jmijayakarta.v4i1.1303
Jika sudah mempunyai room yang di inginkan,  kita masuk ke room tersebut dengan cara klik room tersebut, maka akan di alihkan ke halaman scan room tersebut.  Untuk melakukan scan absensi, mahasiswa  hanya  perlu  menunjukkan  QR  Code  miliknya  ke  arah  kamera,  maka  sistem  absensi  ini akan membaca QR Code tersebut secara otomatis, dan akan menampilkan datanya pada sebelah kanan kamera,  dan  mencatat  kehadiran  pada  daftar  hadir  di  bawah.  Untuk  tampilan  setelah  berhasil  scan kehadiran bisa di lihat pada gambar 14 berikut ini :

## Gambar 14 Halaman room scan saat berhasil scan QR Code mahasiswa
Apabila  mahasiswa  berhalangan  untuk  hadir,  pengguna  dapat  memasukkan  NIM  nahasiswa secara manual melalui form input yang di sediakan, lalu pengguna dapat melakukan klik pada tombol “Sakit” atau “Izin” yang berada di sebelah form input NIM tersebut. Untuk tampilan jika mahasiswa Sakit, dapat di lihat pada gambar 15 di bawah ini :

## Gambar 15 Halaman room scan saat input NIM mahasiswa yang sakit
Pengguna  juga  dapat  melakukan  rekap  data  absensi  dari  tiap  tiap  Room  yang  di  inginkan dengan melakukan klik pada tombol “Download Data” yang ada pada tiap tiap Room.
.

## 5 Kesimpulan (or Conclusion)
Dalam periode Praktek Kerja Lapangan ini, kami berhasil mengimplementasikan solusi absensi berbasis  QR  Code  dengan  menggunakan  pendekatan  metode  Agile.  Melalui  penerapan  Agile,  kami mampu mengatasi tantangan kompleks dalam pengembangan sistem, sambil tetap responsif terhadap perubahan kebutuhan dan umpan balik pengguna.
Dalam  penerapan  teknologi,  kami  memilih  menggunakan  React  JS  sebagai  framework  front- end dan MongoDB sebagai basis data. Kombinasi ini memberikan tampilan antarmuka yang responsif dan fungsionalitas penyimpanan data yang efisien. Kami juga memanfaatkan library QR scanner dan generator untuk mendukung fitur pencatatan kehadiran berbasis QR Code.
Dalam  keseluruhan,  penggunaan  metode  Agile  telah  membantu  kami  merancang  dan mengembangkan  sistem  absensi  berbasis  QR  Code  dengan  lebih  efektif  dan  responsif.  Proses  ini mengajarkan  kami  pentingnya  kolaborasi  tim,  adaptabilitas  terhadap  perubahan,  dan  pengiriman iteratif  untuk  mencapai  solusi  yang  berkualitas  tinggi.  Kami  berharap  bahwa  kontribusi  kami  dapat memberikan manfaat nyata bagi pengguna dan memberikan inspirasi untuk pengembangan teknologi yang lebih baik di masa depan.
Pada penulisan laporan ini, tentu saja masih banyak kekurangan. Oleh karena itu ada beberapa hal yang perlu di perhatikan dalam pengembangan sistem ini kedepannya, antara lain :
a. Peningkatan keamanan

## Jurnal Manajemen Informatika Jayakarta
Volume 4, Nomor 1, Februari 2024: halaman 51- 60
DOI: https://doi.org/10.52362/jmijayakarta.v4i1.1303
Meneliti  dan  menerapkan  metode  keamanan  tambahin  pada  sistem,  seperti  otentikasi  ganda atau enkripsi data, untuk memastikan integritas dan privasi informasi..
b. Pengembangan aplikasi mobile
Mengembangkan aplikasi mobile yang terintegrasi dengan sistem absensi berbasis QR Code, sehingga pengguna dapat dengan mudah mengaksesnya melalui ponsel mereka.

## Referensi (Reference)
[1]  D. Sugiana and D. Muhtadi, “Augmented Reality Type QR Code :,” 2019.
[2]  F.  Lanvino,  A.  Y.  Sukhoco,  W.  Aliman,  and  Suryanto,  “PERANCANGAN  SISTEM INFORMASI  PENCATATAN  KEHADIRAN  MAHASISWA  DENGAN  TEKNOLOGI  QR CODE,” Antivirus  J.  Ilm.  Tek.  Inform. ,  vol.  14,  no.  2,  pp.  135–151,  Nov.  2020,  doi: 10.35457/antivirus.v14i2.1170.
[3]  W.  P.  Rahayu,  “IMPLEMENTASI  SISTEM  ABSENSI  QR  BARCODE  DALAM PENEGAKAN  DISIPLIN  PEGAWAI  PEMERINTAH  KOTA  SEMARANG  PADA  MASA PANDEMI”.
[4]  I. Larasati, A. N. Yusril, and P. A. Zukri, “Systematic Literature Review Analisis Metode Agile Dalam  Pengembangan  Aplikasi  Mobile,” SISTEMASI ,  vol.  10,  no.  2,  p.  369,  May  2021,  doi: 10.32520/stmsi.v10i2.1237.
[5]  S. H. Nova, A. P. Widodo, and B. Warsito, “Analisis Metode Agile pada Pengembangan Sistem Informasi  Berbasis  Website:  Systematic  Literature  Review,” Techno.Com ,  vol.  21,  no.  1,  pp. 139–148, Feb. 2022, doi: 10.33633/tc.v21i1.5659.
[6]  M.  A.  Dewi  and  R.  Irham,  “Penerapan  Agile  Scrum  Pada  Pengembangan  Aplikasi  Bimbingan Daring Skripsi Mahasiswa,” 2021.
[7]  K.  P.  Ergy  Rahmatan  Ramadhan,  “Penerapan  Metode  Agile  Pada  Development  Aplikasi Pengelolaan  Data  Magang  Berbasis  Web  Menggunakan  Framework  Laravel,”  Apr.  2023,  doi: 10.5281/ZENODO.7812416.
[8]  M.  H.  Romadhon  and  Y.  Yudhistira,  “Sistem  Informasi  Rental  Mobil  Berbsasis  Android  Dan Website Menggunakan Framework Codeigniter 3 Studi Kasus : CV Kopja Mandiri,” vol. 2, no. 1, 2021.
[9]  S. J. Kuryanti and M. Kom, “Pembuatan Website Sebagai Sarana Promosi Pariwisata,” vol. 2, 2018.
[10]  “Pengembangan  Front  End  Sistem  Informasi  Akuntansi  Menggunakan  Kerangka  Kerja Vue.Js.pdf.”
[11]  B.  Sisephaputra,  A.  Febrianti,  and  F.  Septiawan,  “Pengembangan  Aplikasi  Penyedia  Layanan Pembelajaran Keahlian Digital Berbasis Website,” vol. 04, no. 02, 2023.
[12]  S. Syamsiah, “Perancangan Flowchart dan Pseudocode Pembelajaran Mengenal Angka dengan Animasi untuk Anak PAUD Rambutan,” STRING Satuan Tulisan Ris. Dan Inov. Teknol. , vol. 4, no. 1, p. 86, Aug. 2019, doi: 10.30998/string.v4i1.3623.
[13]  P.  D.  Arnesia,  N.  A.  Pratama,  and  F.  Sjafrina,  “APLIKASI  ARTIFICIAL  INTELLIGENCE UNTUK  MENDETEKSI  OBJEK  BERBASIS  WEB  MENGGUNAKAN  LIBRARY TENSORFLOW JS, REACT JS DAN COCO DATASET,” JSiI  J.  Sist.  Inf. ,  vol.  9,  no.  1,  pp. 62–69, Mar. 2022, doi: 10.30656/jsii.v9i1.4243.
[14]  A.  Makris,  K.  Tserpes,  G.  Spiliopoulos,  D.  Zissis,  and  D.  Anagnostopoulos,  “MongoDB  Vs PostgreSQL: A comparative study on performance aspects,” GeoInformatica , vol. 25, no. 2, pp. 243–268, Apr. 2021, doi: 10.1007/s10707-020-00407-w.
[15]  A. Chauhan, “A Review on Various Aspects of MongoDb Databases,” Int. J. Eng. Res. , vol. 8, no. 05.
[16]  I.  Muhammad,  M.  Masnur,  and  A.  G.  Syam,  “APLIKASI  QR  CODE  SEBAGAI  SARANA PENYAMPAIAN INFORMASI POHON DIKEBUN RAYA JOMPIE,” J. Sintaks Log. , vol. 1, no. 1, pp. 33–41, Jan. 2021, doi: 10.31850/jsilog.v1i1.694.