Vol. 12 No. 2, pISSN: 2303-0577 eISSN: 2830-7062                http://dx.doi.org/10.23960/jitet.v12i2.4275

## RANCANG
DAN

## BANGUN SISTEM
INFORMASI

## BERBASIS WEBSITE PADA PERPUSTAKAAN SEKOLAH SMA NEGERI 1 JASINGA
Dimas Alip Faturrohim 1* , Apriade Voutama 2 1,2 Universitas Singaperbangsa Karawang; alamat; Jl. HS.Ronggo Waluyo, Puseurjaya, Telukjambe Timur, Karawang, Jawa Barat 41361 telp/Fax (0267) 641177
Riwayat artikel:
Received: 27  Maret  2024 Accepted: 30 Maret 2024 Published: 2 April  2024

## Keywords:
Perpustakaan; Sistem Informasi; Metode Waterfall.
Corespondent Email: jasinga1933@gmail.com
Apriade.voutama@staff.unsik a.ac.id
Abstrak :  Perpustakaan  sekolah  memiliki  peran  vital  dalam  meningkatkan pengetahuan  siswa  di  era  digital.  Website  perpustakaan  sekolah  menjadi penting dalam mendukung pendidikan di Indonesia. Di SMA Negeri 1 Jasinga, pengelolaan  perpustakaan  masih  manual,  menyebabkan  kendala  dalam pengontrolan buku dan pembuatan laporan. Penelitian ini menerapkan metode Waterfall  dalam  pengembangan  sistem  informasi  perpustakaan  sekolah. Tahapan  meliputi  analisis,  desain,  pengkodean,  dan  pengujian.  Hasil penelitian  menunjukkan  bahwa  sistem  informasi  perpustakaan  berbasis website mempermudah manajemen koleksi, peminjaman, dan pengembalian buku. Instansi sekolah seperti SMA Negeri 1 Jasinga membutuhkan website perpustakaan  untuk  mendukung  proses  otomatisasi  pengelolaan  dan peminjaman  buku.  Kesimpulannya,  implementasi  sistem  informasi perpustakaan dapat meningkatkan efisiensi dan efektivitas dalam pengelolaan perpustakaan  sekolah,  memudahkan  akses  informasi,  serta  meningkatkan minat baca siswa.
Abstract. School libraries have a vital role in increasing students' knowledge in  the  digital  era.  School  library  websites  are  important  in  supporting education in Indonesia. At SMA Negeri 1 Jasinga, library management is still manual,  causing  problems  in  controlling  books  and  making  reports.  This research  applies  the  Waterfall  method  in  developing  a  school  library information system. Stages include analysis, design, coding, and testing. The research results show that a website-based library information system makes collection  management,  borrowing  and  returning  books  easier.  School institutions such as SMA Negeri 1 Jasinga need a library website to support the automated process of managing and borrowing books. In conclusion, the implementation  of  a  library  information  system  can  increase  efficiency  and effectiveness in school library management, facilitate access to information, and increase students' interest in reading.

## 1. PENDAHULUAN
Di era digital ini, perpustakaan mempunyai peranan  penting  dalam  menambah  wawasan dan  ilmu  pengetahuan  untuk  para  siswa-siswi. Oleh  karena  itu  akan  dengan  mudah  dalam mencari informasi pembelajaran mengenai ilmu pengetahuan di suatu perpustakaan.
Website perpustakaan sekolah sangat penting untuk mendukung proses pendidikan di Indonesia.  Seiring  dengan  berjalannya  waktu, perkembangan  teknologi  informasi  pada  era digital  ini,  kebutuhan  akan  sistem  informasi dalam mengelola perpustakaan sekolah menjadi semakin hal yang dibutuhkan. Perancangan dan bangun sistem informasi perpustakaan sekolah
merupakan  tujuan  strategis  untuk  memastikan secara efisien dan efektivitas dalam mengelola sumber  daya  informasi  yang  terdapat  pada perpustakaan sekolah.
Perpustakaan  sekolah  di  SMA  Negeri  1 Jasinga menyediakan berbagai jenis buku, yaitu buku  pelajaran,  buku  cerita  dan  masih  banyak lagi. Pada dasarnya siswa-siswi diberikan untuk membaca buku di perpustakaan dan meminjam buku  dengan  melakukan  peminjaman  kepada petugas perpustakaan [1]. Selain itu permasalahan  pada  perpustakaan  di  SMA Negeri  1  Jasinga  masih  menggunakan  cara manual  dengan  melakukan  pencatatan  pada kartu  pinjam.  Cara  dalam  mengelola  masih manual itu dapat menyebabkan kesulitan dalam mengontrol  buku  yang  dipinjam,  daftar pengembalian buku dan pembuatan laporan [2].
Penerapan  sistem  informasi  perpustakaan tidak  hanya  memudahkan  pengelolaan  koleksi buku,  akan  tetapi  juga  mendukung  berbagai aspek  lainnya  seperti  pengelolaan  anggota, peminjaman buku, serta pengelolaan informasi yang  lebih  baik  bagi  para  pengguna.  Dengan pemeliharaan  teknologi  yang  tepat,  sistem  ini dapat meningkatkan kualitas layanan perpustakaan  sekolah  dan  juga  membantu meningkatkan  minat  untuk  membaca  serta pemahaman bagi para pembacanya.

## 2. TINJAUAN PUSTAKA
2.1 Rancang Bangun
Perancangan  adalah  hal  yang  penting dalam  pembuatan  suatu  program.  Sehingga tujuan  dari  perancangan  merupakan  untuk memberi  gambaran  yang  jelas  serta  lengkap terhadap programer dan ahli teknik yang terkait. Perancangan  harus  bermanfaat  dan  mudah dipahami  sehingga  bisa  dengan  mudah digunakan. Perancangan atau rancang merupakan serangkaian prosedur untuk menterjemahkan  hasil  analisa  dan  sebuah sistem  ke  dalam  bahasa  pemrograman  untuk mendeskripsikan  dengan  detail  bagaimana komponen-komponen  sistem  tersebut  dapat  di implementasikan [3].
2.2 Sistem Informasi
sistem yang menghubungkan
kebutuhan        pengolahan        proses  transaksi hariandalam        suatu        organisasi        yang digunakan  untuk  mendukung  fungsi  operasi dengan  kegiatan    strategi    yang    menyediakan
laporan    yang  akan  digunakan  kepada  pihak tertentu[4] .

## 2.3 Tailwind CSS
Tailwind  CSS  adalah  Pustaka  kerangka kerja  CSS  yang  digunakan  oleh  pengembang web untuk membuat tata letak situs web dengan cepat, mengedit gaya kelas dengan mudah, dan membuat  layer  situs  web  yang  responsive dengan mudah[5].

## 2.4 Web
World  Wide  Web (WWW),  disebut juga dengan web atau website ,  adalah  suatu  sistem yang menyediakan informasi kepada pengguna di  dunia  internet,  biasanya  berupa audio , gambar,  atau  teks.  Data  disimpan  di  tempat yang disebut web server [6].

## 2.5 MySQL
MySQL  merupakan  salah  satu  sistem manajemen database relasional (RDBMS) yang berbasis  query  yang  bersifat  open  source dengan  model  client  server.  MySql  walaupun merupakan  suatu  aplikasi  DBMS  yang  open source tetapi memiliki performance yang cepat, reliable dan mudah digunakan. Saat ini dengan adanya  keunggulan  yang  cukup  banyak digunakan  oleh  pengembang  software  untuk membuat  proyek  suatu  aplikasi[2].  Suatu perangkat lunak yang dipakai dalam pengelolaan database secara cepat dengan data juga  berjumlah  besar  serta  setiap  user  bisa mengaksesnya.  Dengan  MySQL  pengguna dapat  mengelola  data  yang  berada  dalam database[7].

## 2.6 React JS
Menurut  situs  resmi  dari  reactjs.org, merupakan library bahasa pemograman javascript yang diciptakan oleh facebook untuk membangun  user  interface  sebuah web application yang  bersifat  open  source,  dimana kita  dapat  membuat  beberapa  komponen  user interface  pada  aplikasi  yang  akan  kita kembangkan secara kompleks[8].
2.7 Perancangan Unified Modelling Language (UML) Perancangan Unified Modelling
Language  (UML)  merupakan  bagian  dari perancangan  sistem  berorientasi  objek.  Dalam penelitian ini, penggunaan perancangan sistem
UML digunakan untuk memudahkan pengguna aplikasi dalam memahami sistem dan subsistem aplikasi  yang  dibangun  secara  lebih  seksama. Perancangan  UML  ini  menggunakan  bantuan objek  seperti  simbol  –  simbol  khusus  yang digunakan untuk membantu membuat pemodelan  dari sistem  aplikasi  yang  dibangun dalam  bentuk  visual.  UML  yang  digunakan dalam  penelitian  ini  antara  lain: use  case diagram,  activity  diagram,  sequence  diagram dan class diagram [9].

## 2.8 Javascript
JavaScript adalah salah satu bahasa skrip yang paling banyak digunakan untuk situs web untuk  menambahkan  manipulasi  skrip  HTML dan CSS di sisi klien/browser. JavaScript dapat menyediakan  situs  web  dengan  lebih  banyak fungsi, misalnya memvalidasi formulir, berkomunikasi dengan server, dan menjadikan situs web lebih interaktif dan hidup[5].
2.9 Perpustakaan
Perpustakaan adalah tempat yang menyediakan koleksi berbagai jenis bacaan dan sumber informasi, seperti buku, majalah, jurnal, dan media lainnya, yang disusun dan disimpan secara  sistematis  dalam  ruangan  yang  diatur secara  terorganisasikan  dengan  sistem  tertentu agar  dapat  digunakan  untuk  keperluan  studi, penelitian, pembacaan dan lain-lain[10].
2.10 Express Js
Express  js  adalah framework atau kerangka  kerja  yang  yang  dibangun  di  atas Node js. Framework ini menyediakan Application Programming Interface (API) yang disederhanakan untuk beberapa fungsi Node js. Express  js  ini  menyediakan  benyak  fungsi tambahan  melalui  modul  HTTP  yang  tidak perlu ditulis ulang dari awal untuk tugas-tugas umum dalam menangani permintaan, menentukan rute, atau mengedik aset statis[11].

## 3. METODE PENELITIAN
3.1. Metode Pengembangan Perangkat

## Lunak
Metode yang digunakan dalam penelitian ini adalah  metodologi System  Development  Life Cycle (SDLC)  melalui  pendekatan  terperinci untuk  menganalisis  rancang  dan  bangun website  Perpustakaan  SMA  Negeri  1  Jasinga dengan menggunakan metode
Waterfall. Waterfall dikenal juga sebagai model berurutan
linier. Model  air  terjun  ini  bekerja  secara berurutan atau sekuensial dimulai dengan tahap analisis,  desain,  pengkodean,  pengujian,  dan dukungan[5].
Gambar 1. Model Waterfall Menurut[7], metode waterfall mempunyai 5
tahap sebagai berikut: 1. Analisis Tahap analisis dilakukan dengan
mengidentifikasi masalah dan membuat rencana untuk memecahkan masalah tersebut.
2. Desain
Tahap  desain  dilakukan  dengan  merancang sistem sesuai dengan desain yang sudah di buat seperti basis data menggunakan ERD dan LRS serta desain website user interface.
3. Pengkodean
Tahap-tahap  dalam coding menggunakan framework React JS, Express Js Tailwind CSS. Selain itu, website juga mengimplementasikan bahasa  pemrograman  Javascript,Node  Js,  dan mengimplementasikan database MySQL.
4. Pengujian Pada tahap pengujian dilakukan mencari kesalahan  coding  dan  implementasi  dengan menggunakan metode user testing .

## 4. HASIL DAN PEMBAHASAN
4.1 Perancangan Use Case Diagram

## 4.2 Perancangan Activity Diagram

## Gambar 2. Activity Diagram Perpustakaan
4.3 Perancangan Class Diagram

## Gambar 3. Class Diagram Perpustakaan

## 4.4 Perancangan ERD

## Gambar 4. ERD Perpustakaan

## 4.5 Tampilan Halaman Beranda
Pada  halaman  ini  mengenai  halaman utama  website.  Mengenai  profil  perpustakaan, tata  tertib  dan  fasilitas  apa  saja  yang  tersedia pada  perpustakaan.  Halaman  beranda  dapat dilihat pada gambar 5.

## Gambar 5. Tampilan Halaman Beranda

## 4.6 Tampilan Halaman Login Admin
Pada  tampilan  login  admin  terdapat komponen  field  text  nama  pengguna,  dan
password  dan  tombol  masuk  admin.  Halaman login admin dapat dilihat pada gambar 6.
Gambar 6. Tampilan Halaman Login Admin
4.7 Tampilan Halaman Dashboard
Admin
Tampilan dashboard admin yang berfungsi untuk memanajemen jumlah anggota, buku yang dipinjam dan buku buku yang sudah di  kembalikan.  Halaman  dashboard  admin dapat dilihat pada gambar 7.

## Gambar 7. Tampilan Halaman Dashboard Admin

## 4.8 Tampilan Halaman Data Pengguna
Terdapat  tampilan  data  pengguna  yang digunakan untuk memanajemen para pengguna perpustakaan  sebagai  admin  ataupun  siswa. Halaman  data  pengguna  dapat  dilihat  pada gambar 8.

## Gambar 8. Tampilan Halaman Data Pengguna

## 4.9 Tampilan Form Data Pengguna
Terdapat  form  data  pengguna  berfungsi untuk
menambahkan data pengguna perpustakaan.  Halaman  form  data  pengguna dapat dilihat pada gambar 9.

## Gambar 9. Tampilan Halaman Form Data Pengguna

## 4.10 Tampilan Halaman Data Buku
Tampilan  data  buku  yang  digunakan  untuk mendata  buku-buku  yang  ada  pada  dalam perpustakaan. Halaman data buku dapat dilihat pada gambar 10.

## Gambar 10. Halaman Data Buku

## 4.11 Tampilan Halaman Form Tambah Data Buku
Terdapat  form  tambah  data  buku digunakan  untuk  menambah,update  dan  delete mengenai  buku  yang  ada  pada  perpustakaan. Halaman  form  tambah  data  buku  dapat  dilihat pada gambar 11.
4.12 Tampilan Halaman Kategori

## Buku
Pada tampilan ini terdapat kategori buku mengenai pengelompokan buku dari setiap data buku  pada  perpustakaan.  Halaman  kategori buku dapat dilihat pada gambar 12.

## Gambar 12. Halaman Kategori Buku

## 4.13 Tampilan Rak Buku
Pada  tampilan  rak  buku  ini  digunakan untuk pengelompokan rak dari setiap data buku yang terdapat pada perpustakaan. Tampilan rak buku dapat dilihat pada gambar 13.

## Gambar 13. Halaman Rak Buku

## 4.14 Tampilan Halaman Peminjaman Buku
Pada  tampilan  ini  digunakan  untuk memanajemen  siswa  yang  meminjam  buku  di perpustakaan.  Tampilan  peminjaman  buku dapat dilihat pada gambar 14.

## Gambar 14. Halaman Peminjaman Buku

## 4.15 Tampilan Halaman Pengembalian
Pada  tampilan  ini  suatu  transaksi pengembalian  buku  mengenai  siswa  dan  buku yang  sudah  di  kembalikan  pada  perpustakaan. Tampilan  pengembalian  buku  dapat  dilihat pada gambar 15.

## Gambar 15. Halaman Pengembalian

## 4.16 Tampilan Halaman Login Siswa
Pada  tampilan  ini  siswa  dapat  login sebelum masuk ke dalam website perpustakaan. Tampilan login siswa dapat dilihat pada gambar 16.

## 4.17 Tampilan Halaman Data Buku Siswa
Tampilan ini berisi tentang kategori buku apa  saja  yang  tersedia  yang  ada  pada perpustakaan. Tampilan data buku siswa dapat dilihat pada gambar 17.

## Gambar 17. Halaman Data Buku

## 4.18 Tampilan Halaman Detail Buku
Pada  tampilan  ini  berfungsi  untuk melihat  detail  buku  terdiri  dari  judul  buku, synopsis,  jumlah  buku,  dan  tombol  untuk pinjam. Halaman detail buku dapat dilihat pada gambar 18.
Gambar 18. Halaman Detail Buku

## 4.19 Tampilan Halaman Data Peminjaman Buku Siswa
Halaman  ini  berfungsi  untuk  melihat riwayat    buku  apa  saja  yang  dipinjam  oleh siswa.  Tampilan  data  peminjaman  buku  siswa dapat dilihat pada gambar 19.
Gambar 19. Halaman Data Peminjaman Buku Siswa
4.20 Tampilan Halaman Data Pengembalian Buku Siswa Pada halaman ini dapat mengetahui buku apa  saja  yang  sudah  di  kembalikan  oleh  siswa pada perpustakaan. Tampilan
data pengembalian  buku  dapat  dilihat  pada  gambar 20.

## Gambar 20. Halaman Data Pengembalian Buku

## 4.21 Tampilan Halaman Profil Siswa
Pada  tampilan  profil  siswa  ini  dapat mengetahui  profil  detail  siswa  dan  juga  bisa mengedit isi dari profilnya.
Gambar 21. Halaman Profil Siswa

## 4.22 Tampilan Halaman Form Update Profile Siswa
Halaman  update  profil  siswa  berfungsi untuk  mengedit  atau  memperbarui  data  siswa melalui form yang di sediakan.

## Gambar 22. Halaman Form Update Profile Siswa

## 5. KESIMPULAN
Berdasarkan analisa yang telah dilakukan  pada  Rancang  dan  Bangun  Sistem Informasi Berbasis Website Pada Perpustakaan SMA  Negeri  1  Jasinga  Menggunakan  Metode Waterfall dapat disimpulkan bahwa:
a. Instansi  sekolah  seperti  SMA Negeri  1  Jasinga,  membutuhkan website perpustakaan untuk membantu staff perpustakaan dalam mendata  otomatis  dan  siswa  dalam proses peminjaman.
b. Mempermudah siswa dapat melihat berbagai  macam  jenis  buku  yang tersedia  dan  stock  buku  melalui website  perpustakaan  SMA  Negeri
1 Jasinga
c. Memudahkan  staff  perpustakaan dalam  memanajemen  peminjaman buku  dan  pengembalian  buku dengan  meminimalisir  kesalahan yang terjadi.

## UCAPAN TERIMA KASIH
Pada  kesempatan  ini  penulis  mengucapkan terima  kasih  kepada  semua  pihak,  terutama kepada :
a. Bapak  Prof.  Dr.  Ade  Maman Suherman,  S.H.,  M.Sc.  sebagai Rektor  Universitas  Singaperbangsa Karawang.
b. Bapak Dr. Oman Komarudin, S.Si.,
M.Kom  sebagai  Dekan  Fakultas Ilmu Komputer Universitas Singaperbangsa Karawang. c. Bapak  Apriade  Voutama,  M.Kom. sebagai  Dosen  Pengampu  mata kuliah Proposal dan Tugas Akhir

## DAFTAR PUSTAKA
[1]  Y.  Rahmanto,  D.  Alita,  A.  D.  Putra,  P. Permata,  and  S.  Suaidah,  “Penerapan  Sistem Informasi  Perpustakaan  Berbasis  Web  Pada Smk  Nurul  Huda  Pringsewu,” J.  Soc.  Sci. Technol.  Community  Serv. ,  vol.  3,  no.  2,  p. 151, 2022, doi: 10.33365/jsstcs.v3i2.2009.
[2]  Ade  Ajie  Ferizal,  Mohamad  Anas  Sobarnas, and  Djoko  nursanto,  “Sistem  Informasi Perpustakaan Berbasis Web di SMK Fatahillah Cileungsi,” INFOTECH    J.  Inform.  Teknol. , vol.  2,  no.  2,  pp.  104–113,  2021,  doi: 10.37373/infotech.v2i2.178.
[3]  J. H. Zainal, A. Pagaralam, and B. Lampung, “Pantai Mutun,” vol. 2, no. 2, pp. 61–71, 2016.
[4]  H.  Putri,  F.  Rini,  and  A.  Pratama,  “Sistem Informasi  Perpustakaan  Berbasis  Web,” J. Pustaka  Data  (Pusat  Akses  Kaji.  Database, Anal. Teknol. dan Arsit. Komputer) , vol. 2, no.
1, pp. 5–10, 2022, doi: 10.55382/jurnalpustakadata.v2i1.138.
[5]  A. Yudhistira, “Perancangan dan
Implementasi  Sistem  Informasi  Perpustakaan Berbasis  Web,” JSK  (Jurnal  Sist.  Inf.  dan Komputerisasi  Akuntansi) ,  vol.  7,  no.  1,  pp. 14–20, 2023, doi: 10.56291/jsk.v7i1.95.
[6]  Luh  Elda  Evaryanti  et  al.,  “Rancang  Bangun Sistem  Informasi  Perpustakaan  Berbasis Website pada SMK N 1 Gianyar,” J. Chem. Inf. Model. , vol. 53, no. 9, pp. 1689–1699, 2017.
[7]  R.  B.  B.  Sumantri,  W.  Setiawan,  and  D.  N. Triwibowo, “Rancang Bangun Aplikasi Media
Jasa  Desain  Logo  Dengan  Metode  Waterfall Berbasis  Website,” METHOMIKA  J.  Manaj. Inform. dan Komputerisasi Akunt. , vol. 6, no. 6, pp. 157–163,
2022,
doi: 10.46880/jmika.vol6no2.pp157-163.
[8]  A.  Muda,  S.  Huda,  and  Y.  Fernando,  “E-
Ticketing  Penjualan  Tiket  Event  Musik  Di Wilayah Lampung Pada Karcismu
Menggunakan Library Reactjs,” J. Teknol. dan
Sist.  Inf. ,  vol.  2,  no.  1,  pp.  96–103,  2021, [Online].
Available:
http://jim.teknokrat.ac.id/index.php/JTSI
[9]  Y.  Purnama,  P.  Sokibi,  and  S.  Parman,
“RANCANG BANGUN SISTEM INFORMASI MANAJEMEN ASET MENGGUNAKAN  METODE  STRAIGHT LINE (Studi Kasus: SMK Samudra Nusantara Cirebon),” J. Inform. dan Tek. Elektro Terap. , vol. 12, no. 1, 2024, doi: 10.23960/jitet.v12i1.3599.
[10]  F. Nugraha, “Analisa Dan Perancangan Sistem Informasi  Perpustakaan,” Simetris  J.  Tek. Mesin, Elektro dan Ilmu Komput. , vol. 5, no. 1, pp. 27–32, 2014, doi:
10.24176/simet.v5i1.132.
[11]  A.  H.  Aziira,  H.  Kamil,  and  A.  D.  Kartika, “Pembangunan Sistem Informasi Pengelolaan Rencana  Pembelajaran  Semester  (RPS),” J.
Nas.  Teknol.  dan  Sist.  Inf. ,  vol.  9,  no.  2,  pp.
103–112, 2023,
doi: 10.25077/teknosi.v9i2.2023.103-112.