LAPORAN KERJA PRAKTEK

SISTEM INFORMASI PERPUSTAKAAN BERBASIS WEB PADA

PERPUSTAKAAN FISIP UNIMAL

Untuk Melengkapi Sebagian Dari

Syarat-syarat Akademik yang Diperlukan Pada

Prodi Teknik Informatika Fakultas Teknik

Universitas Malikussaleh

Tanggal 04 Maret s/d 22 Agustus 2020

Disusun Oleh:

PUTRA HALOMOAN SIREGAR

170170084

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNIK

UNIVERSITAS MALIKUSSALEH

ACEH UTARA

2020
 ABSTRAK

Sistem Informasi Perpustakaan adalah sebuah sistem informasi yang dapat

membantu proses pelayanan di sebuah perpustakaan. Saat ini Perpustakaan FISIP
UNIMAL belum memiliki sistem yang efisien dan dapat dipakai secara
bersamaan oleh pustakawan untuk mengelola data buku serta mencatat
peminjaman buku. Dengan dibuatnya Sistem Informasi Perpustakaan, tentu dapat
mempermudah petugas dalam menjalankan tugasnya. Sistem Informasi
Perpustakaan ini sudah berbasis web dan menggunakan database mySQL
sehingga dapat diakses melalui banyak perangkat dan pengolahan database buku
menjadi lebih efesien.

Kata Kunci : Sistem informasi, web, perpustakaan, MYSQL, database.

i
 KATA PENGANTAR

Penulis ucapkan puji syukur atas terselesaikannya Laporan Praktek Kerja

Lapangan di Perpustakaan FISIP UNIMAL dengan tepat pada waktunya. Dalam
kesempatan ini penulis mengambil judul laporan “Sistem Informasi
Perpustakaan Berbasis Web Pada Perpustakaan FISIP UNIMAL”.

Adapun laporan ini merupakan salah satu syarat untuk menyelesaikan

program studi Teknik Informatika Universitas Malikussaleh. Laporan Kerja
Praktek ini disusun berdasarkan ilmu yang diperoleh penulis selama
melaksanakan Kerja Praktek yang berlangsung mulai 04 s/d 29 Maret 2020
dilanjutkan pada 20 Juli s/d 22 Agustus 2020 di Perpustakaan FISIP UNIMAL.

Pada saat melaksanakan Praktek Kerja Lapangan dan menyusun laporan

penulis banyak mendapat bimbingan, arahan, dan petunjuk dari berbagai pihak,
sehingga sangat membantu dalam pelaksanaan Praktek Kerja Lapangan dan
menyusun laporan ini, maka pada kesempatan ini penulis mengucapkan terima
kasih kepada :

1. Kedua orang tua dan keluarga yang telah banyak memberikan memberikan
nasehat dan juga do’a sampai selesainya laporan ini.

2. Kepada Bapak Jamaluddin, S.Sos. selaku Kepala Kantor Perpustakaan FISIP

UNIMAL

3. Kepada Ibu Purnama Sari, S.T. selaku staf Perpustakaan FISIP UNIMAL.

4. Bapak Safwandi S.T., M.Kom. selaku Ketua Prodi Teknik Informatika.

5. Bapak Rizal, S.Si., M.IT. selaku Dosen Pembimbing Kerja Praktek.

6. Seluruh Dosen dan Staf Jurusan Teknik Informatika Universitas Malikussaleh.

7. Kepada teman-teman jurusan Teknik Informatika Universitas Malikussaleh

angkatan 2017.

8. Beberapa pihak yang tidak dapat penulis sebutkan satu persatu.

ii
 Penulis menyadari bahwa tanpa bantuan dari berbagai pihak, penyusunan
laporan ini tidak akan berjalan dengan baik. Penulis menyadari sepenuhnya bahwa
dalam penulisan laporan ini masih jauh dari kesempurnaan, oleh karena itu
penulis mengharapkan kritik dan saran yang bersifat membangun demi
kesempurnaan pada masa yang akan datang. Semoga laporan ini memberikan
informasi dan bermanfaat untuk pengembangan wawasan dan peningkatan ilmu
pengetahuan bagi kita semua.

Akhir kata penulis mengucapkan rasa syukur dan semoga Laporan Kerja
Praktek Lapangan ini dapat bermanfaat bagi kita semua.

Bukit Indah, September 2020

Penulis

PUTRA HALOMOAN SIREGAR

NIM.170170084

iii
 DAFTAR ISI

ABSTRAK...............................................................................................................i
KATA PENGANTAR............................................................................................ii
DAFTAR ISI..........................................................................................................iv
DAFTAR GAMBAR.............................................................................................vi
DAFTAR TABEL................................................................................................vii
BAB I PENDAHULUAN......................................................................................1
1.1 Latar Belakang Masalah............................................................................1
1.2 Rumusan Masalah.....................................................................................2
1.3 Batasan Masalah........................................................................................2
1.4 Tujuan Penulisan.......................................................................................2
1.5 Metodelogi Penulisan................................................................................3
1.6 Waktu dan Tempat Pelaksanaan................................................................3
1.7 Sistematika Penulisan................................................................................3
BAB II GAMBARAN UMUM INSTANSI..........................................................5
2.1 Perpustakaan Fisip Universitas Malikussaleh...........................................5
2.2 Visi............................................................................................................7
2.3 Misi............................................................................................................7
2.4 Struktur Organisasi....................................................................................7
BAB III TINJAUAN PUSTAKA.........................................................................9
3.1 Konsep Dasar Sistem Informasi................................................................9
3.1.1 Pengertian Sistem...............................................................................9
3.1.2 Pengertian Informasi..........................................................................9
3.1.3 Pengertian Sistem Informasi............................................................10
3.2 Unified Modeling Language (UML)........................................................10
3.2.1 Use Case Diagram...........................................................................11
3.2.2 Class Diagram.................................................................................13
3.2.3 Activity Diagram..............................................................................15
3.3 Tools Perangkat Lunak............................................................................16
3.3.1 Web server........................................................................................16

iv
 3.3.2 XAMPP............................................................................................17
3.3.3 Database..........................................................................................17
3.3.4 Personal Homepage (PHP).............................................................18
3.3.5 Framework.......................................................................................18
3.3.6 Web Browser dan HTML.................................................................19
3.3.7 MySQL.............................................................................................20
3.3.8 Bootstrap..........................................................................................21
3.3.9 Javascript..........................................................................................21
3.3.10 JQuery..............................................................................................22
3.3.11 CSS...................................................................................................23
3.4 MVC (Model View Controller)....................................................................24
BAB IV PERANCANGAN & IMPLEMENTASI.............................................25
4.1 Perancangan Sistem....................................................................................25
4.1.1 Use Case Diagram...............................................................................25
4.1.2 Activity Diagram..................................................................................25
4.1.3 Class Diagram.....................................................................................27
4.1.4 ERD (Entity Relationship Diagram)....................................................27
4.1.5 Perancangan Database.........................................................................29
4.1.6 Desain Tampilan..................................................................................31
4.1.7 Desain Output......................................................................................37
4.2 Implementasi Sistem...................................................................................38
BAB V PENUTUP................................................................................................39
5.1 Kesimpulan..............................................................................................39
5.2 Saran........................................................................................................39
DAFTAR PUSTAKA...........................................................................................40

v
 DAFTAR GAMBAR

Gambar 3.1 Transformasi Data Menjadi Informasi (Sutanta, 2003).....................10

Gambar 4.1 Use Case Diagram..............................................................................25
Gambar 4.2 Activity Diagram................................................................................26
Gambar 4.3 Class Diagram....................................................................................27
Gambar 4.4 ERD....................................................................................................28
Gambar 4.5 Halaman Masuk.................................................................................31
Gambar 4.6 Halaman Daftar Akun........................................................................31
Gambar 4.7 Halaman Daftar Buku........................................................................32
Gambar 4.8 Halaman Daftar Buku Dipinjam........................................................32
Gambar 4.9 Halaman Info Buku............................................................................33
Gambar 4.10 Halaman Ubah Info Buku................................................................33
Gambar 4.11 Halaman Tambah Buku Baru...........................................................34
Gambar 4.12 Halaman Daftar Mahasiswa.............................................................34
Gambar 4.13 Halaman Info Mahasiswa.................................................................35
Gambar 4.14 Halaman Ubah Data Mahasiswa......................................................35
Gambar 4.15 Halaman Tamabah Mahasiswa........................................................36
Gambar 4.16 Halaman Pinjam Buku.....................................................................36
Gambar 4.17 Halaman Kembalikan Buku.............................................................37
Gambar 4.18...........................................................................................................37
Gambar 4.19...........................................................................................................38

vi
 DAFTAR TABEL

1
Tabel 4.1 Tabel Book.............................................................................................29
Tabel 4.2 Tabel Issued...........................................................................................29
Tabel 4.3 Tabel Librarians.....................................................................................30
Tabel 4.4 Tabel Members......................................................................................30

vii
 BAB I
PENDAHULUAN

1.1 Latar Belakang Masalah

Kehadiran sistem informasi dan teknologi informasi yang terus

berkembang pesat membawa perkembangan baru pada dunia bisnis, perdagangan
dan pendidikan. Sistem informasi pun digunakan sebagai sarana efisiensi dari
sistem manual menjadi sistem digital atau sistem komputerisasi. Teknologi
informasi adalah salah satu contoh produk teknologi yang pada saat ini terus
berkembang dari hari ke hari. Perusahaan penyedia jasa informasi berlomba-
lomba untuk menyajikan informasi yang relevan, akurat dan tepat waktu, sehingga
mudah dimanfaatkan untuk keperluan pribadi, pendidikan, bisnis, pemerintahan,
dan yang dibutuhkan oleh masyarakat. Dalam perkembangan dunia teknologi saat
ini, sistem informasi sangat dibutuhkan untuk pengolahan data dalam melihat,
memasukkan, mengedit, hingga menghapus data.

Perpustakaan FISIP UNIMAL merupakan salah satu unsur penting yang

kontribusinya dibutuhkan guna mendukung kegiatan belajar dan mengajar di
lingkungan Fakultas Ilmu Sosial dan Ilmu Politik Universitas Malikussaleh. Salah
satu peran dari Perpustakaan adalah menyediakan fasilitas ruang baca dan
peminjaman buku bagi Civitas Akademik Universitas Malikussaleh, khususnya di
lingkungan Fakultas Ilmu Sosial dan Ilmu Politik.

Untuk menjalankan peran tersebut, dibutuhkan sebuah sistem pendataan

dan peminjaman buku yang efisien, saat ini Perpustakaan FISIP UNIMAL belum
memiliki sistem yang dapat dipakai secara bersamaan oleh petugas untuk
mengelola data buku serta mencatat peminjaman buku. Hal ini disayangkan
karena sebenarnya Perpustakaan FISIP UNIMAL memiliki cukup Komputer yang
dapat digunakan oleh dua orang petugas, namun saat ini hanya satu unit komputer
yang dipergunakan oleh petugas secara bergantian untuk mendata dan mencatat
peminjaman buku.

1
 2

Adapun sistem yang dimiliki oleh Perpustakaan FISIP UNIMAL pada saat
ini masih berupa input data melalui program Microsoft Excel untuk inventaris
buku, cara ini dinilai kurang efisien karena untuk menginput data buku hanya
dapat dilakukan dengan cara mengedit sebuah file Excel dan hanya dapat
dilakukan oleh petugas secara bergantian di satu unit komputer saja, hal ini
membuat pekerjaan menginput data buku memakan waktu yang cukup panjang.
Untuk pendataan pada peminjaman buku masih dicatat pada sebuah kertas/kartu,
yang terkadang menimbulkan antrian karena peminjaman buku hanya dapat
dilayani oleh satu orang petugas. Selain itu, mencatat data penting pada sebuah
kertas memiliki kekurangan pada sisi keamanan dan keawetan data.

Berangkat dari masalah di atas penulis mencoba untuk mengangkat sebuah

topik yang berjudul “Sistem Informasi Perpustakaan Berbasis Web Pada
Perpustakaan FISIP UNIMAL”.

1.2 Rumusan Masalah

Berdasarkan latar belakang diatas, rumusan masalah dalam Laporan Kerja

Praktek ini adalah bagaimana merancang Sistem Informasi Perpustakaan pada
Perpustakaan FISIP UNIMAL.

1.3 Batasan Masalah

Adapun batasan masalah dalam penulisan Laporan Kerja Praktek ini

yaitu :
1. Pembahasan mengenai cara kerja Sistem Informasi Perpustakaan Berbasis
Web.
2. Membahas fitur-fitur yang ada dalam Sistem Informasi Perpustakaan
Berbasis Web.

1.4 Tujuan Penulisan

Tujuan penulisan laporan kerja praktek ini adalah :

 3

1. Membuat Sistem Inforamasi Perpustakaan pada Perpustakaan

FISIP UNIMAL.
2. Penulis dapat mengaplikasikan ilmu didalam dunia kerja,
terutama dalam pemrograman web.
3. Sebagai salah satu syarat penuntasan mata kuliah Kerja Praktek
(KP).
4. Melihat keefisienan Sistem Informasi Perpustakaan Berbasis
Web dalam mengelola kegiatan Pendataan dan Pinjam Pakai
Buku.

1.5 Metodelogi Penulisan

Metode-metode yang digunakan dalam penelitian untuk mengumpulkan

data-data yang diperlukan penulis sebagai bahan penulisan laporan kerja praktek
diantaranya adalah :

1. Field Research (Penelitian Lapangan) yaitu melalui pengamatan

langsung pada kegiatan sehari-hari di Perpustakaan FISIP UNIMAL.
2. Study Literature (Penelitian Kepustakaan) yaitu tinjauan kepustakaan
yang terkait dengan masalah yang dibahas, seperti perancangan sistem
informasi dan analisis kelayakan sistem informasi.

1.6 Waktu dan Tempat Pelaksanaan

Kerja Praktek ini dilaksanakan di Perpustakaan FISIP UNIMAL, yang

berlokasi di Kampus Bukit Indah, Jalan Sumatera, Kecamatan Muara Satu, Kota
Lhokseumawe, Provinsi Aceh. Adapun lama waktu pelaksanaan kerja praktek ini
selama 2 (Dua) bulan yaitu terhitung dari tanggal 04 s/d 29 Maret 2020 dan
dilanjutkan pada 20 Juli 2020 s/d 22 Agustus 2020.
 4

1.7 Sistematika Penulisan

Secara garis besar materi penulisan laporan Kerja Praktek ini terbagi
menjadi lima(5) BAB dengan sistematis penulisan sebagai berikut :

BAB I PENDAHULUAN

Pada bab ini menjelaskan tentang latar belakang, rumusan masalah,

batasan masalah, tujuan penulisan, metodologi penulisan, dan sistematika
penulisan.

BAB II GAMBARAN UMUM ISTANSI

Pada bab ini menjelaskan tentang sejarah perusahaan, struktur organisasi

dan aktivitas pada Perpustakaan FISIP UNIMAL.

BAB IIITINJAUAN PUSTAKA

Pada bab ini menjelaskan teori-teori yang berhubungan dengan

pembahasan dan isi laporan.

BAB IV PERANCANGAN DAN IMPLEMENTASI

Pada bab ini akan membahas mengenai perancangan dan implementasi

Sistem Informasi Pendataan dam Peminjaman Buku Berbasis Web.

BAB V PENUTUP

Pada bab ini akan membahas tentang kesimpulan dan saran hasil dari
perancangan Sistem Informasi Pendataan dan Peminjaman Buku
Berbasis Web.

DAFTAR PUSTAKA
Berisikan referensi-referensi yang digunakan dalam proses penulisan
laporan kerja praktek.

LAMPIRAN
 BAB II
GAMBARAN UMUM INSTANSI

2.1 Perpustakaan Fisip Universitas Malikussaleh

Perpustakaan FISIP Universitas Malikussaleh berdiri seiring dengan

pendirian Fakultas Ilmu Sosial dan Ilmu Politik Universitas Malikussaleh pada 5
September 2003. Pada mulanya perpustakaan FISIP Universitas Malikussaleh
masih sangat sederhana baik dari jumlah koleksi, sarana dan prasarana. Berawal
dengan jumlah koleksi yang sangat terbatas serta minat baca yang masih rendah,
tapi dalam perkembangannya yang terakhir Perpustakaan FISIP Universitas
Malikussaleh telah mengalami sedikit peningkatan dari jumlah koleksi buku,
sarana dan prasarana.

Saat ini Perpustakaan FISIP Universitas Malikussaleh telah memiliki lebih

dari 7000 koleksi buku, walaupun dinilai masih kekurangan. Namun
dibandingkan dengan keadaan sebelumnya, perkembangan sekarang lebih
menggembirakan. Sekarang Perpustakaan FISIP Universitas Malikussaleh telah
memiliki ruangan yang dilengkapi dengan alat pendingin ruangan yang
menciptakan suasana ruang pustaka yang sejuk sehingga menambah keinginan
bagi pengguna untuk berlama-lama berada di pustaka. Selain itu saat ini
Perpustakaan FISIP telah dilengkapi dengan 3 unit komputer dan fasilitas layanan
internet yang dapat dimanfaatkan oleh petugas untuk memaksimalkan pelayanan
di perpustakaan.

Perpustakaan FISIP Universitas Malikussaleh merupakan pustaka induk di

lingkungan FISIP, dan sangat diharapkan agar Perpustakaan FISIP Universitas
Malikussaleh dapat menerapkan sistem pustaka digital/digital library yang
berbasis pengguna. Perpustakaan FISIP Universitas Malikussaleh saat ini belum
dapat melayani pengguna dengan cepat dan benar dan dari waktu ke waktu terus
membenah diri untuk memberikan pelayanan yang berkualiatas.

Perpustakaan FISIP Universitas Malikussaleh sebagai pusat informasi

mempunyai peranan yang sangat penting dalam meningkatkan kualitas

5
 6

pengetahuan civitas akademika Universitas Malikussaleh khususnya dilingkungan

Fakultas Ilmu Sosial dan Ilmu Politik dan merupakan mata rantai komunikasi
ilmiah antara pemakai dengan sumber informasinya.

Kendala yang dihadapi oleh Perpustakaan FISIP Universitas Malikussaleh

untuk mencapai layanan prima kepada pengguna, adalah belum adanya suatu
kebijakan teknis atau pedoman layanan yang bisa dijadikan tolak ukur dan bahan
acuan ke arah layanan prima. Fasilitas pendataan dan peminjaman buku pada
perpustakaan FISIP juga dinilai belum cukup efisien, mengacu pada
perkembangan Sistem Informasi Pada saat ini.

Bertolak dari kendala tersebut dan sesuai dengan tugas dan fungsi
Perpustakaan FISIP Universitas Malikussaleh khususnya dalam pemberian
layanan perpustakaan dan informasi kepada pengguna, maka penyusunan
kebijakan teknis layanan perpustakaan dan lnformasi, serta pengembangan pada
sisi teknologi merupakan suatu kebutuhan yang mendesak dan harus segera
direalisasikan.

Dampak adanya kebijakan teknis ini tidak hanya untuk Pengembangan

layanan prima kepada pengguna tetapi juga diharapkan hasilnya dapat dirasakan
langsung oleh pemakai jasa Perpustakaan FISIP Universitas Malikussaleh.
7
 8

2.2 Visi

Menjadikan Pustaka Digital (Digital Library) Sebagai Pusat pelayanan

terhadap Civitas akademika Universitas Malikussaleh.

2.3 Misi

Menyediakan layanan akses terhadap informasi secara cepat dan tepat

guna mendukung Tri Dharma Perguruan Tinggi melalui pengadaan dan
penyediaan bahan pustaka yang Up To Date.

2.4 Struktur Organisasi

Perpustakaan FISIP Universitas Malikussleh berada dibawah naungan

langsung dari UPT. Perpustkaan Universitas Malikussleh. Sehingga bagan
struktur organisasinya secara langsung berhubungan dengan UPT. Perpustakaan
Universitas Malikussaleh.

Adapun struktur organisasi Perpustakaan FISIP Universitas Malikussaleh

pada saat ini terdiri dari :

1. Kepala Perpustakaan
2. Staf Perpustakaan

Tugas Kepala Perpustakaan :

1. Merencanakan pengadaan buku-buku pustaka/media cetak.
2. Pengurusan pelayanan perpustakaan.
3. Perencanaan pengembangan perpustakaan.
4. Memelihara dan perbaikan buku-buku/bahan pustaka/media
elektronik.
5. Inventarisasi dan pengadministrasian buku-buku/bahan pustaka/media
elektronika.
6. Melakukan layanan bagi mahasiswa, dosen dan tenaga kependidikan
lainnya, serta masyarakat.
 9

7. Menyusun tata tertib perpustakaan.

8. Menyusun laporan pelaksanaan kegiatan perpustakaan secara berkala.
9. Menyiapkan kartu pinjam buku.
10. Melayani peminjaman buku.
11. Mengklasifikasi buku perpustakaan.
12. Mengatur dan memelihara ruangan perpustakaan.
13. Menjaga dan menata keasrian dan kebersihan ruangan.

Tugas Staf Perpustakaan :

1. Pengurusan pelayanan perpustakaan.
2. Memelihara dan perbaikan buku-buku/bahan pustaka/media
elektronik.
3. Inventarisasi dan pengadministrasian buku-buku/bahan pustaka/media
elektronika.
4. Melakukan layanan bagi mahasiswa, dosen dan tenaga kependidikan
lainnya, serta masyarakat.
5. Menyiapkan kartu pinjam buku.
6. Melayani peminjaman buku.
7. Mengklasifikasi buku perpustakaan.
8. Mengatur dan memelihara ruangan perpustakaan.
9. Menjaga dan menata keasrian dan kebersihan ruangan.
 BAB III
TINJAUAN PUSTAKA

3.1 Konsep Dasar Sistem Informasi

3.1.1 Pengertian Sistem

Sistem adalah sekelompok komponen dan elemen yang digabungkan

menjadi satu untuk mencapai tujuan tertentu. Sistem juga merupakan kesatuan
bagian-bagian yang saling berhubungan yang berada dalam suatu wilayah serta
memiliki item-item penggerak. Sistem adalah seperangkat elemen yang
membentuk kumpulan atau prosedur-prosedur atau bagan-bagan pengolahan yang
mencari suatu tujuan bagian atau tujuan bersama dengan mengoperasikan data
atau barang pada waktu rujukan tertentu untuk menghasilkan informasi, energi,
dan barang[CITATION Mur91 \l 1057 ].

3.1.2 Pengertian Informasi

Informasi merupakan data yang telah diproses atau memiliki arti. Adapun
karakteristik penting yang harus dimiliki oleh informasi, seperti: relevansi, akurat,
ketepatan waktu, dan kelengkapan [ CITATION JrR08 \l 1057 ].

Informasi yang berguna memiliki karakteristik sebagai berikut:

1. Akurat
2. Tepat Waktu
3. Lengkap
4. Ringkas

10
 11

3.1.3 Pengertian Sistem Informasi

Sistem informasi adalah komponen-komponen yang saling berkaitan yang

bekerja bersama-sama untuk mengumpulkan, mengolah, menyimpan, dan
menampilkan informasi untuk mendukung pengambilan keputusan, koordinasi,
pengaturan, analisa, dan visualisasi pada sebuah organisasi[ CITATION Lau06 \l
1057 ]. Istilah sistem informasi mengarah pada penggunan teknologi komputer di
dalam organisasi untuk menyajikan informasi kepada pemakai. Sistem Informasi
berbasis komputer adalah kumpulan perangkat keras (hardware) dan perangkat
lunak (software) yang dirancang untuk mengubah data menjadi informasi yang
bermanfaat[ CITATION Bod06 \l 1057 ].

Gambar 3.1 Transformasi Data Menjadi Informasi [ CITATION Sut03 \l 1057 ]

3.2 Unified Modeling Language (UML)

UML (Unified Modeling Language) adalah metode pemodelan secara
visual sebagai sarana untuk merancang dan atau membuat software berorientasi
objek. Karena UML ini merupakan bahasa visual untuk pemodelan bahasa
berorientasi objek, maka semua elemen dan diagram berbasiskan pada paradigma
object oriented.

UML adalah salah satu tool / model untuk merancang pengembangan

software yang berbasis object oriented. UML sendiri juga memberikan standar
penulisan sebuah sistem blue print, yang meliputi konsep bisnis proses, penulisan
kelas-kelas dalam bahasa program yang spesifik, skema database, dan
komponenkomponen yang diperlukan dalam sistem software.
 12

Dengan menggunakan UML kita dapat membuat model untuk semua jenis
aplikasi piranti lunak, dimana aplikasi tersebut dapat berjalan pada piranti keras,
sistem operasi dan jaringan apapun, serta ditulis dalam bahasa pemrograman
apapun. Tetapi karena UML juga menggunakan class dan operation dalam konsep
dasarnya, maka ia lebih cocok untuk penulisan piranti lunak dalam bahasa-bahasa
berorientasi objek seperti C++, Java, C# atau VB.NET. Walaupun demikian,
UML tetap dapat digunakan untuk modeling aplikasi prosedural dalam VB atau C.

Seperti bahasa-bahasa lainnya, UML mendefinisikan notasi dan

syntax/semantik. Notasi UML merupakan sekumpulan bentuk khusus untuk
menggambarkan berbagai diagram piranti lunak. Setiap bentuk memiliki makna
tertentu, dan UML syntax mendefinisikan bagaimana bentuk-bentuk tersebut
dapat dikombinasikan. Notasi UML terutama diturunkan dari 3 notasi yang telah
ada sebelumnya: Grady Booch OOD (Object-Oriented Design), Jim Rumbaugh
OMT (Object Modeling Technique), dan Ivar Jacobson OOSE (Object-Oriented
Software Engineering) [ CITATION Jac96 \l 1057 ].

3.2.1 Use Case Diagram

Use case adalah deskripsi fungsi dan sebuah sistem dari perspektif
pengguna. Use case bekerja dengan cara mendeskripsikan tipikal antara pengguna
sebuah sistem dengan sistemnya sendiri melalui sebuah cerita bagaimana sebuah
sistem dipakai. Urutan langkah-langkah yang menerangkan antara pengguna dan
sistem disebut scenario. Setiap scenario mendeskripsikan urutan kejadian. Setiap
urutan diinisialisasikan oleh orang, sistem yang lain, perangkat keras atau urutan
waktu.

Dengan demikian secara singkat bisa dikatakan, “use case adalah

serangkaian serangkaian scenario yang digabunggkan bersama-sama oleh tujuan
umum pengguna” [ CITATION Mun05 \l 1057 ].

Use case diagram adalah penggambaran interaksi pengguna sistem(actor)

dengan kasus (use case) yang telah disesuaikan dengan langkah-langkah
(scenario). Diagram use case menunjukkan 3 aspek dari sistem yaitu actor, use
 13

case dan sistem, sub sistem boundary. Actor mewakili peran orang sistem yang
lain atau alat ketika berkomunikasi dengan usecase. Simbol – simbo, Use case
diantaranya :

Tabel 3.1 Daftar simbol Use Case Diagram

GAMBAR NAMA KETERANGAN

Menspesifikasi himpunan
peran yang pengguna mainkan
Actor
ketika berinteraksi dengan use
case
Hubungan dimana perubahan
yang terjadi pada suatu elemen
mandiri (independen) akan
Dependency
mempengaruhi elemen tang
bergantung padanya elemen
yang tidak mandiri
Hubungan dimana objek anak
(decendent) berbagi perilakau
Generalization an struktur data dari objek
yang ada di atasanya objek
induk (ancestor)
Menspesifakasi bahwa use
Include
case sumber secara eksplisit
Menspesifikasi bahwa use case
target memperluas perilaku
Extends
dari use case sumber pada
suatu titik yang diberikan
Apa yang menghubungkan
Associaton antara objek suatu dengan
objek lainya
Menspesifikasi paket yang
Sistem menampilkan sistem secara
terbatas
 14

Deskripsi dari urutan aksi-aksi

yang ditampilkan sistem yang
Use case
menghasilkan suatu hasil yang
terukur bagi satu aktor
Elemen fisik yang eksis saat
aplikasi dijalankan dan
Note
mencerminkan suatu sumber
daya komputasi

3.2.2 Class Diagram

Class dalam notasi UML digambarkan dengan kotak. “Class adalah
sebuah sebuah spesifikasi yang jika diinstansiasi akan menghasilkan sebuah objek
dan merupakan inti dari pengembangan dan desain berorientasi
objek”[ CITATION Mun05 \l 1057 ]. Class menggambarkan keadaan (atribut atau
program) suatu sistem, sekaligus menawarkan layanan untuk memanipulasi
keadaan tersebut (metoda atau fungsi).

Class mempunyai beberapa bagian yang menjelaskan isi dari class :

1. Attribute adalah property dari sebuah class. Attribute ini

melukiskan batas nilai yang mungkin ada pada objek class. Sebuah
class mungkin mempunyai nol atau lebih attribute.
2. Operation adalah sesuatu yang bisa dilakukan oleh sebuah class
atau class yang lain dapat lakukan untuk sebuah class.
3. Responsibility adalah keterangan tentang apa yang akan dilakukan
class yaitu apa yang akan dicapai oleh attribute dan operation.

Atribut dan metode dapat memiliki salah satu sifat berikut :

1. Private, tidak dapat dipanggil dari luar class yang bersangkutan.

2. Protected, hanya dapat dipanggil oleh class yang bersangkutandan anak-
anak yang mewarisinya.
3. Public, dapat dipanggil oleh siapa saja.
 15

4. Package, hanya dapat dipanggil oleh instance sebuah class pada paket
yang sama.

Simbol- simbol Class Diagram diantaranya :

Tabel 3.2 Daftar Simbol Class Diagram

GAMBAR NAMA KETERANGAN

Hubungan dimana objek anak
(decendent) berbagi perilakau an
Generalization
struktur data dari objek yang ada di
atasanya objek induk (ancestor)

Nary Upaya untuk menghindari asosiasi

Association dengan lebih 2 objek

Himpunan dari objek-objek yang

Class berbagi atribut serta operasi yang
sama
Operasi yang benar-benar
Realization
dilakukan oleh suatu objek
Hubungan dimana perubahan yang
terjadi pada suatu elemen mandiri
Dependency (independen) akan mempengaruhi
elemen yang bergantung padanya
elemen yang tidak mandiri.
Apa yang menghubungkan antara
Associaton
objek suatu dengan objek lainya

3.2.3 Activity Diagram

“Activity Diagram adalah teknik untuk mendiskripsikan logika procedural,
proses bisnis dan aliran kerja dalam banyak kasus” [ CITATION Mun05 \l 1057 ].
Activity diagram bisa mendukung perilaku parallel sedangkan flowchart tidak
bisa.
 16

Activity diagram menggabarkan berbagai alir aktivitas dalam sistem yang

sedang dirancang, bagaimana masing-masing alir berawal, decision yang mungkin
terjadi dan bagaimana mereka berakhir, activity diagram juga dapat
menggambarkan proses paralel yang mungkin terjadi pada beberapa eksekusi.

Tabel 3.3 Daftar Simbol Activity Diagram

Simbol Fungsi Keterangan

Status awal aktivitas sistem,
Status awal sebuah diagram aktivitas
memiliki status awal
Aktivitas yang dilakukan
Aktivitas sistem, aktivitas biasanya
diawali dengan kata kerja
Asosiasi percabangan dimana
Percabanagan
jika ada pilihan aktivitas lebih
/Decision
dari satu

Status akhir Status

Memisahkan organisasi bisnis

Swimlane yang bertanggung jawab
terhadap aktivitas yang terjadi

Digunakan untuk menunjukkan

Fork
kegiatan

Digunakan untuk menunjukkan

Join
kegiatan yang digabungkan

3.3 Tools Perangkat Lunak

Dalam pembuatan aplikasi sistem gaji karyawan yang berbasis web ini
dibutuhkan beberapa tools perangkat lunak, diantaranya sebagai berikut :
 17

3.3.1 Web server

Web server merupakan sebuah perangkat lunak server atau sebuah

perangkat keras yang dikhususkan untuk menjalankan perangkat lunak jenis ini,
yang bertugas untuk memenuhi permintaan client pada World Wide Web. Pada
umumnya sebuah sever bisa menampung satu atau lebih situs web. Sebuah web
server berfungsi untuk memproses permintaan jaringan yang masuk melalui
protokol HTTP dan beberapa protokol terkait lainnnya.

Fungsi utama dari sebuah web server adalah untuk menyimpan,

memproses, dan menyajikan halaman web kepada pengunjung web. Komunikasi
antara server dan client dapat terjadi dengan menggunakan Hypertext Transfer
Protocol (HTTP). Halaman web yang biasanya disajikan sebagian besar dalam
bentuk dokumen HTML, yang didalamnya mungkin memuat gambar, style sheets
dan scripts sebagai tambahan/pelengkap untuk konten berbasis teks.

Sebuah user agent, biasanya sebuah peramban web atau perayap web,
memulai komunikasi dengan cara membuat permintaan kepada server untuk
mengirimkan resource tertentu menggunakan protokol HTTP dan kemudian
server akan merespons dengan mengirimkan konten resource tersebut atau akan
mengirimkan sebuah pesan gagal, jika tidak dapat melakukannya.

Resource biasanya berupa file asli yang berada pada penyimpanan

sekunder sebuah server, tetapi belum tentu demikian dan bergantung pada
bagaimana server web tersebut difungsikan. Meskipun fungsi utamanya adalah
untuk menyajikan konten, implementasi penuh pada HTTP juga mencakup cara-
cara menerima konten dari klien. Fitur ini digunakan untuk mengirimkan web
form dan termasuk juga mengunggah file [CITATION Wik20 \l 1057 ].

3.3.2 XAMPP

XAMPP adalah perangkat lunak gratis yang mendukung banyak sistem

operasi dan merupakan kompilasi dari beberapa program. Fungsinya adalah
sebagai server yang terdiri sendiri (localhost), yang terdiri atas program Apache
HTTP Server, MySQL Database, dan penterjemah bahasa yang ditulis dengan
bahasa pemrograman PHP dan Perl. Nama XAMPP merupakan singkatan dari X
 18

(empat sistem operasi apapun), Apache, MySQL, PHP dan Perl. Program ini
tersedia dalam GNU General Public License dan bebas, merupakan web server
yang mudah digunakan yang dapat melayani tampilan halaman yang dinamis.

3.3.3 Database

Database merupakan media yang digunakan untuk menampung data. Ada

beberapa jenis Database. Antara lain Oracle, Microsoft Access, Microsoft SQL
Server, MySQL dan lain. Pada penelitian ini pneliti menggunakan bahasa
scripting PHP dan Database MySQL maka kita akan menggunakan Database ini
untuk menampung data-data pada sistem yang dibuat, seperti data karyawan,
grade, departemen, gaji. Database memiliki kemampuan dalam menyeleksi data
sehingga menjadi suatu kelompok yang terurut dengan cepat. Hal inilah yang
ahirnya dapat menghasilkan informasi yang dibutuhkan secara cepat pula.
Seberapa cepat pemrosesan data oleh Database tergantung pula pada perancangan
Databasenya. Dengan segudang manfaat dan kegunaan yang dimiliki oleh
Database maka sudah seharusnya semua perusahaan baik itu perusahaan skala
kecil apalagi perusahaan besar memilki Database yang dibangun dengan
rancangan yang baik. Ditambah dengan pemanfaatan teknologi jaringan komputer
maka manfaat Database ini akan semakin besar. Penggunaan Database sekaligus
teknologi jaringan komputer telah banyak digunakan oleh berbagai macam
perusahaan.

3.3.4 Personal Homepage (PHP)

PHP (Personal Homepage, namun lebih populer sebagai Hypertext

Proproser) merupakan bahasa scripting yang bersifat server side, yang diartikan
bahwa kode PHP akan dieksekusi oleh webserver dan hasil eksekusi oleh
webserver tersebut akan dikirim dalam bentuk HTML ke browser client. HTML
merupakan file umum yang dijalankan oleh browser. Dengan demikian, client
tidak dapat melihat kode PHP yang dibuat oleh developer website, tetapi hanya
bisa melihat kode HTML yang merupakan hasil olahan dari Engine PHP. Agar
webserver (Apache) dapat mengolah file PHP ini maka diperlukan aplikasi PHP
yang sebut sebagai Engine PHP untuk ditanamkan bersama aplikasi webserver
tersebut.
 19

Dalam beberapa tahun perkembangannya, PHP menjelma menjadi bahasa

pemrograman web yang powerful dan tidak hanya digunakan untuk membuat
halaman web sederhana, tetapi juga website populer yang digunakan oleh jutaan
orang seperti wikipedia, wordpress, joomla. PHP dapat digunakan dengan gratis
(free) dan bersifat Open Source. PHP dirilis dalam lisensi PHP License, sedikit
berbeda dengan lisensi GNU General Public License (GPL) yang biasa digunakan
untuk proyek Open Source. Kemudahan dan kepopuleran PHP sudah menjadi
standar bagi programmer web di seluruh dunia. Untuk pembuatan web,
kode PHP biasanya di sisipkan ke dalam dokumen HTML. Karena fitur inilah
PHP disebut juga sebagai Scripting Language atau bahasa pemrograman script.

3.3.5 Framework
Framework adalah kerangka kerja. Framework juga dapat di artikan
sebagai kumpulan script (terutama class dan function yang dapat membantu)
developer/programmer dalam menangani berbagai masalah-masalah dalam
pemrograman seperti koneksi ke database, pemanggilan variabel, dan file.
Sehingga developer lebih fokus dan lebih cepat membangun aplikasi [ CITATION
Ros11 \l 1057 ].

Berbicara tentang aplikasi web berskala besar tentu tidak bisa dilepaskan
dari pembagian peran anggota tim. Aplikasi web terutama web berskala besar,
tidak hanya membutuhkan seorang programmer saja, akan tetapi melibatkan pula
seorang web designer, sistem analist, database maintaner, manajer keuangan,
manajer riset dan promosi dan manajer proyek yang akan mengatur jalannya
pembuatan, pengembangan dan pemeliharaan aplikasi tersebut. Tingkat kerumitan
dan kesamaan cara pandang inilah yang melahirkan konsep kerangka kerja
(framework) dalam pengembangan aplikasi berbasis web. Framework
memudahkan anggota tim untuk bekerja bersama dengan satu cara pandang,
sekaligus memudahkan pembagian bagian kerja.

Pada umumnya, framework terdiri dari file-file pustaka berupa kelas-kelas

PHP bisa digunakan dan dikolaborasi dalam aplikasi yang sedang dikembangkan
yang bisa digunakan dan dikolaborasi dalam aplikasi yang sedang dikembangkan.
 20

Saat ini telah tersedia puluhan, bahkan ratusan framework dan Content
Management Sistem (CMS). Sebut saja Mojavi, Prado, Agavi, Seagul,
Codeigniter, Fasebase, PHP Nuke, Past Nuke, Mambo, Joomla, Wordpress,
Blogspot, Aura, Endonesia, dan masih banyak lagi. Ada beberapa developer yang
menyediakan file ini (core) framework saja beserta manualnya, tanpa memberikan
contoh-contoh aplikasi secara detail misalnya Fasbase dan Mojavi ( saat ini riset
Mojavi terhenti, tapi dikembangkan menjadi framework baru, yakni Agavi ). Ada
juga framework yang benar-benar dibuat untuk membangun aplikasi enterprise,
memberikan contoh yang detail [ CITATION Faj10 \l 1057 ].

3.3.6 Web Browser dan HTML

Web browser adalah aplikasi untuk menampilkan halaman yang berbentuk

kode HTML. “HTML atau (Hypertext Mark Up Language) adalah protocol yang
digunakan untuk mentransfer data atau dokumen dariweb server ke dalam web
browser” (priyatno, 2007). Sebagaimana kita ketahui, HTML (Hypertext Mark
Up Language) adalah standar untuk membuat halaman-halaman web. Semua
halaman web ditulis dengan bahasa HTML. Walaupun beberapa file mempunyai
ektensi yang berbeda(contoh . html, .php, .php3), output file-file tersebut tetap
HTML.

Dalam penggunaanya sebagian besar kode HTML tersebut terletak

diantara tag container, yaitu diawali dengan nama tag dan diakhiri dengan nama
tag (terdapat tanda “/”). Dokumen HTML mempunyai tiga buah tag utama yang
membentuk struktur dari dokumen tersebut. Ketiga buah tag tersebut adalah Tag
HTML. HEAD dan BODY.

Bentuk dari sederhana HTML :

<html>
<head></head>
<body></body>
</html>

Penjelasan :
 21

 HTML sebagai tanda awal dokumen HTML

 HEAD sebagai informasi page header. Di dalam tag ini kita bisa
meletakkan tag-tag title, base, isi index, link, script, style dan meta.
 BODY, didalam tag ini bisa diletakkan berbagai atribut halaman
seperti warna latar belakang, warna teks, warna link, warna visited
link, warna active link dan lain-lain. Contoh atribut : bgcolor,
background, text, link vlink, dan lain-lain

“Web adalah cara yang cukup efesien dan efektif untuk publikasi atau
komersialisasi suatu produk dari perusahaan” (Napitupulu, 2010). Cara
ini menjadi alternative yang menguntungkan jika menjadi alternative
yang menguntungkan jika kita bandingkan dengan cara tradisional
yaitu melalui media massa seperti koran, majalah, tv dan radio yang
membutuhkan inventasi besar.

3.3.7 MySQL

MySQL adalah sebuah perangkat lunak sistem manajemen basis data

SQL(bahasa Inggris: database management sistem) atau DBMS yang multithread,
multi-user, dengan sekitar 6 juta instalasi di seluruh dunia. MySQL AB membuat
MySQL tersedia sebagai perangkat lunak gratis dibawah lisensi GNU/General
Public License (GPL), tetapi mereka menjual dibawah lisensi komersial untuk
kasus-kasus dimana penggunaannya tidak cocok dengan pengguna GPL.

Tidak sama dengan proyek-proyek seperti Apache, dimana prangkat lunak

dikembangkan oleh komunitas umum, dan hak cipta untuk kode sumber dimiliki
oleh penulisnya masing-masing. MySQL dimiliki dan disponsori oleh sebuah
perusahaan komersial Swedia MySQL dimiliki dan disponsori oleh sebuah
perusahaan komersial Swedia MySQL AB, dimana memegang hak cipta hampir
semua kode sumbernya.

3.3.8 Bootstrap

Bootstrap merupakan sebuah framework css yang memudahkan

pengembangan untuk membangun website yang menarik dan responsif. Tidak
 22

konsistensinya terhadap aplikasi individual membuat sulitnya untuk

mengembangkan dan pemeliharaanya. Bootstrap adalah css tetapi dibentuk
dengan LESS, sebuah pre-prosessor yang memberi fleksibilitas dari css biasa.
Bootstrap memberikan solusi rapi dan seragam terhadap solusi yang umum, tugas
interface yang setiap pengembang hadapi. Bootstrap dapat dikembangkan dengan
tambahan lainya karena ini cukup fleksibel terhadap pekerjaan design butuhkan
[CITATION Ott11 \l 1057 ].

Keunggulan dalam menggunakan Bootstap adalah semua bagian untuk

antarmuka pengguna menggunakan style css, Bootstrap dapat menggunakan
LESS preprosessor sebuah teknologi yang mengarungi dan mengefisienkan
penulisan kode CSS. Bootstrap dapat diintegrasikan denagn JavaScript untuk
menjadikan lebih menarik dengan efek-efek yang dapat diberikan dengan
JavaScript (Tectale, 2012). Kelemahan dalam menggunakan Bootstrap adalah
dengan adanya penggunaan bootstrap menjadi tidak adanya keunikan dalam
website karena akan samanya tampilan yang diberikan. Terdapat juga laporan
bahwa sistem grid bootstrap tidak responsif [ CITATION Tec12 \l 1057 ].

3.3.9 Javascript

JavaScript adalah bahasa scripting kecil, ringan, berorientasi objek yang

ditempelkan pada kode HTML dan di proses di sisi client. JavaScript digunakan
dalam pembuatan website agar lebih interaktif dengan memberikan kemampuan
tambahan terhadap HTML melalui eksekusi perintah di sisi browser. JavaScript
dapat merespon perintah user dengan cepat dan menjadikan halaman web menjadi
responsif.

JavaScript memiliki struktur sederhana, kodenya dapat disisipkan pada

dokumen HTML atau berdiri sebagai satu kesatuan aplikasi. Struktur penulisan
JavaScript adalah sebagai berikut [ CITATION BIn14 \l 1057 ].

<script language = “javascript”>

<!--

Penulisan kode javascript

 23

//-->

</script>

3.3.10 JQuery

jQuery adalah JavaScript library yang dirancang untuk meringkas kode-

kode JavaScript, sehingga dapat menyederhanakan penulisan skrip program,
sesuai dengan slogan “write less, do more” . jQuery pertama kali dirilis oleh John
Resig pada tahun 2006, pada perkembangannya jQuery tidak hanya sebagai
framework JavaScript, namun memiliki kelebihan antara lain.

1. Kemudahan mengakses dan memanipulasi elemen-elemen HTML.

2. Memanipulasi CSS.

3. Penanganan event HTML.

4. Efek-efek JavaScript dan animasi.

5. Memodifikasi elemen HTML DOM.

Sintak dasar jQuery $(selector).action(), tanda $ untuk mendefinisikan

jQuery, jQuery selector digunakan untuk mendapatkan elemen HTML, action
adalah tindakan yang dilakukan jQuery pada elemen ()

Contoh penggunaan jQuery untuk menyembunyikan elemen dengan id

“test” sebagai berikut.

$(“#test”).hide()

Semua metode jQuery berada di dalam fungsi document.ready() yaitu

perintah inisialisasi yang menunjukan dokumen telah siap ditampilkan dan
sekaligus menjalankan perintah yang terdapat didalam fungsi [ CITATION
BIn14 \l 1057 ].

3.3.11 CSS

CSS pertama kali dikembangkan pada tahun 1997, sebagai suatu cara
untuk pengembang Web untuk menentukan tampilan dan nuansa halaman Web
mereka. Hal itu dimaksudkan untuk memungkinkan pengembang untuk
 24

memisahkan konten dari desain sehingga HTML bisa melakukan lebih dari fungsi
yang awalnya berdasarkan markup dari isi, tanpa rasa khawatir tentang desain dan
tata letak [ CITATION Kym12 \l 1057 ]. CSS tidak mendapatkan popularitas
sampai sekitar tahun 2000, ketika browser Web mulai menggunakan lebih dari
font dasar dan aspek warna CSS. Dan sekarang, semua browser moadern
mendukung semua CSS Lvel 1, CSS 2 dan beberapa aspek Tingkat CSS
3[ CITATION Kym12 \l 1057 ]. CSS adalah singkatan dari Cascading Style
Sheet. Style sheet mengacu pada dokumen itu sendiri. Style sheet telah digunakan
untuk mendesain dokumen selama bertahun-tahun. Mereka adalah spesifikasi
teknis utama layout, apakah cetak atau online. Desainer cetak menggunakan style
sheet untuk memastikan bahwa desain mereka dicetak persis dengan spesifikasi
yang telah mereka buat. Sebuah style sheet untuk halaman Web melayani tujuan
yang sama, tetapi dengan fungsionalitas tambahan juga mengatakan bahwa
Engine Viewing (Web browser) bagaimana untuk membuat dokumen yang dilihat
[ CITATION Kym12 \l 1057 ].

Sedangkan Cascade adalah bagian yang bersifat khusus yang bersifat

khusus. Sebuah style sheet Web dimakusdkan untuk Cascade melalui serangkaian
style sheet, seperti sungai atas air terjun. Air di sungai menghantam semua
berbautan di air terjun, tapi hanya yang dibagian bawah mempengaruhi persis di
mana air akan mengalir. Hal yang sama berlaku dari cascade dalam style sheet
Web [ CITATION Kym12 \l 1057 ].Setiap halaman Web dipengaruhi oleh
setidaknya satu style sheet, bahkan jika desainer Web [ CITATION Kym12 \l
1057 ]. Setiap halaman Web dipengaruhi oleh setidaknya satu style sheet, bahakan
jika desainer Web tidak menerapkan Style. Style sheet ini adalah agen pengguna
style sheet – gaya default yang digunakan browser Web akan digunakan untuk
menampilkan halaman jika tidak ada intruksi lain disediakan. Tetapi jika desainer
menampilkan halaman jika tidak intruksi lain disediakan. Tetapi jika desainer
menyediakan intruksi lain, browser harus tahu mana intruksi harus diutamakan
[ CITATION Kym12 \l 1057 ].

Tujuan dari penggunaan teknologi ini adalah sebagai komplemen pada html5 yang
memiliki batasan pada pembuatan tampilan yang menarik, dan lebih mudah untuk
melalakukan pengendalian tampilan pada semua file tampilan.
 25

3.4 MVC (Model View Controller)

MVC adalah Teknik atau konsep yang memisahkan komponen utama

menjadi tiga komponen yaitu model, view dan controller.

Model

Model merupakan bagian penanganan yang berhubungan dengan

pengolahan atau manipulasi database. Seperti misalnya mengambil data dari
database, menginput dan pengolahan database lainnya. Semua instruksi yang
berhubung dengan pengolahan database diletakkan di dalam model.

View

View merupakan bagian yang menangani halaman user interface atau

halaman yang muncul pada user, tampilan dari user interface dikumpulkan pada
view untuk memisahkannya dengan controller dan model sehingga memudahkan
web designer dalam melakukan pengembangan tampilan halaman website.

Controller

Controller merupakan kumpulan instruksi aksi yang menghubungkan

model dan view, jadi user tidak akan berhubungan dengan model secara langsung,
intinya dari view kemudian controller yang mengolah instruksi.
 BAB IV
PERANCANGAN & IMPLEMENTASI

4.1 Perancangan Sistem

4.1.1 Use Case Diagram

Use case adalah sebuah alat bantu guna menstimulasi pengguna untuk
menggambarkan suatu sistem dari sudut pandangnya. Berikut adalah use
case diagram untuk sistem informasi perpustakaan :

Data User
Input Email dan Kata Sandi

Daftar Akun Baru

<<extend>>
<<include>>
<<include>>
Tambah Buku

Pinjam/Kembalikan Buku

Login <<include>>
Tambah Mahasiswa
Petugas Perpustakaan
<<include>>

<<include>>
Daftar Buku Dipinjam
<<include>>

<<include>>
Daftar Mahasiswa

Daftar Buku
<<extend>>

Cetak Daftar Buku

Gambar 4.2 Use Case Diagram

4.1.2 Activity Diagram

Activity diagram adalah diagram yang menggambarkan workflow

(aliran kerja) atau aktivasi dari sebuah sistem. Berikut adalah Activity Diagram
yang digunakan untuk membangun sistem :

26
 27

Gambar 4.3 Activity Diagram

 28

4.1.3 Class Diagram

Class diagram adalah sebuah spesifikasi yang jika diinstansiasi

akan menghasilkan sebuah objek dan merupakan inti dari penegembangan
dan desain berorientasi objek. Pada sistem ini, setelah melakukan login,
user dapat megakses sistem secara keseluruhan. Setiap form pada sistem
memiliki relasi antara satu dengan yang lainnya menghasilkan informasi
yang dibutuhkan. Gambar dibawah ini menunjukkan relasi-relasi tersebut.
<<Sistem Informasi Perpustakaan>>

+email
+password_hash
+masuk()
+daftarAkunBaru()

1
<<Daftar Mahasiswa>>
Daftar Mahasiswa
*
+cariMahasiswa()
+tampilDaftarMahasiswa()
1
<<Pustakawan>> <<Info Buku>>
+cariMahasiswa()
+get_info_mahasiswa()
1
+user_name +id
+account_activated
1
1 +name
1 +activation_hash +author
+tambahBuku() +penerbit
* +tambahMahasiswa() +isbn
+logOut() +tahun *
<<Info Mahasiswa>> +total_copies
1
* +issued_copies
+name +nomor_panggil
+nim +nomor_inventaris
+registration_date * <<Daftar Buku>>
+hapusBuku()
+jurusan
1 +ubahInfoBuku()
+hapusMahasiswa() Daftar Buku
+pinjamkanBuku()
+ubahInfoMahasiswa() +tampilDaftarBuku() 1 +kembalikanBuku()
+cariBuku()
+get_info_buku() *
*
1 1

<<Buku Dipinjam>> 1

Daftar Buku Dipinjam <<Daftar Buku Dipinjamkan>>

1
+kembalikanBuku()
Daftar Buku Dipinjam
+get_info_buku()
+kembalikanBuku()
1 +get_info_buku()

Gambar 4.4 Class Diagram

4.1.4 ERD (Entity Relationship Diagram)

ERD (Entity Relationship Diagram) merupakan salah satu tahap yang

harus dilakukan dalam proses perancangan sebuah sistem informasi. Tahap ini
penting karena merupakan tahap di mana gambaran relasi antar tabel dalam
database digambarkan dalam beberapa bentuk notasi. Gambaran ERD pada
Sistem Informasi Perpustakaan yang penulis buat dapat dilihat pada gambar
berikut.
 29

id user_name email id name registration

_date

Account_ Librarians password_hash nim Mahasiswa jurusan

activated

activation_hash
book_name

book_id id tahun author

Pinjam

issued_to_nim
issued_to

issued_by return_date
issued_date

name id author penerbit

total_copies Buku isbn

tahun
issued_copies nomor_panggil nomor_inventaris

Gambar 4.5 ERD

 30

4.1.5 Perancangan Database

Setelah melalui tahap pembentukan ERD, tahap selanjutnya adalah

dengan membuat desain file database. Tahapan ini merupakan tahapan di mana
setiap atribut dari entitas yang terdapat di dalam database di definisikan mulai
dari nama, tipe data yang digunakan dan status dari atribut tersebut. Berikut
merupakan Desain File Database dari Sistem Informasi Perpustakaan yang
penulis rancang.
Database test
Tabel book
Tabel 4.1 Tabel Book

Atribut Type Length Keterangan

id int 11 Primary Key
name varchar 255
author varchar 255
penerbit varchar 255
isbn varchar 255
tahun int 4
total_copies int 11
issued_copies int 11
nomor_panggil varchar 255
nomor_inventari varchar 255
s

Tabel issued
Tabel 4.2 Tabel Issued

Atribut Type Length Keterangan

id int 11 Primary Key
book_id int 11

book_name varchar 255

author varchar 255
tahun int 4
issued_to varchar 255
 31

issued_to_nim varchar 9
issued_date date
return_date date
issued_by varchar 255

Database lib_fisip2020
Tabel librarians
Tabel 4.3 Tabel Librarians

Atribut Type Length Keterangan

id int 11 Primary Key
user_name varchar 255

email varchar 255 Foreign Key

password_hash varchar 255

account_activate tinyint 1
d
activation_hash varchar 255

Tabel members
Tabel 4.4 Tabel Members

Atribut Type Length Keterangan

id int 11 Primary Key
name varchar 255

nim varchar 9 Foreign Key

registration_date date

jurusan varchar 255

 32

4.1.6 Desain Tampilan

1. Masuk

Gambar 4.6 Halaman Masuk

Halaman masuk merupakan halaman yang akan pertama muncul

ketika user mengakses domain https://lib.fisip.unima.ac.id/admperpus.
Pada halaman ini user yang telah memiliki akun bisa melakukan input
email dan sandi untuk dapat masuk ke dalam sistem informasi
perpustakaan. Bagi user yang belum memiliki akun, harus mendaftar
terlebih dahulu dengan cara klik tulisan “Daftar akun baru, klik disini”.

2. Daftar Akun

Gambar 4.7 Halaman Daftar Akun

 33

Pada halaman Daftar akun, user yang belum memiliki akun dapat
mendaftar dengan cara menginputkan nama pengguna, email dan sandi.

3. Daftar Buku

Gambar 4.8 Halaman Daftar Buku

Halaman daftar buku berisi daftar seluruh buku yang terdapat

didalam database sistem informasi perpustakaan, pada halaman ini juga
terdapat tombol konversi yang berfungi untuk mengkonfersi data buku
yang ada menjadi file Ms.Excel.

4. Daftar Buku Dipinjamkan

Gambar 4.9 Halaman Daftar Buku Dipinjam

 34

Halaman ini berisi daftar buku yang dipinjamkan kepada

pengunjung perpustakaan. Pada halaman ini juga terdapat tombol untuk
pengembalian buku.

5. Info Buku

Gambar 4.10 Halaman Info Buku

Halaman ini berisi informasi tentang buku tertentu, untuk

mengakses halaman ini dapat dilakukan dengan cara melakukan klik pada
judul buku di halaman Daftar Buku dan Daftar Buku Dipinjamkan. Pada
halaman ini juga terdapat tomboh pinjamkan buku, ubah info buku dan
hapus buku.

6. Ubah Info Buku

 35

Gambar 4.11 Halaman Ubah Info Buku

Halaman ini digunakan untuk melakukan perubahan info pada

buku.

7. Tambah Buku Baru

Gambar 4.12 Halaman Tambah Buku Baru

Halaman ini digunakan untuk melakukan input buku baru kedalam

database yang kemudian akan ditampilkan pada halaman Daftar buku.

8. Daftar Mahasiswa
 36

Gambar 4.13 Halaman Daftar Mahasiswa

Halaman ini berisi nama-nama mahasiswa yang menjadi anggota

perpustakaan.

9. Info Mahasiswa

Gambar 4.14 Halaman Info Mahasiswa

Halaman ini berisi info mahasiswa dan daftar buku yang dipinjam
oleh yang bersangkutan. Pada halaman ini juga terdapat tombol ubah info
mahasiswa dan hapus mahasiswa. Pada daftar buku yang dipinjam,
terdapat tombol recive yang digunakan untuk mengembalikan buku.
 37

10. Ubah data Mahasiswa

Gambar 4.15 Halaman Ubah Data Mahasiswa

Halaman ini berfungsi untuk merubah data mahasiswa.

11. Tambah Mahasiswa

Gambar 4.16 Halaman Tamabah Mahasiswa

Halaman ini berfungsi untuk mendaftarkan mahasiswa sebagai

anggota perpustakaan.

12. Pinjam Buku

 38

Gambar 4.17 Halaman Pinjam Buku

Halaman ini digunakan untuk melakukan peminjaman buku

terhadap pengunjung perpustakaan.

13. Kembalikan Buku

Gambar 4.18 Halaman Kembalikan Buku

Halaman ini digunakan untuk menerima buku pinjaman dari

pengunjung perpustakaan.
 39

4.1.7 Desain Output

1. Tombol konversi data buku menjadi file Ms.Excel pada halaman

Daftar Buku

Gambar 4.19

2. Data buku dalam keluaran File Ms.Excel

Gambar 4.20

4.2 Implementasi Sistem

Setelah melakukan tahapan-tahapan perancangan sistem mulai dari uml,
erd, desain file database, dan desain tampilan. Selanjutnya adalah tahapan
 40

implementasi sistem, tahapan ini dilakukan setelah tahapan pengkodean (koding).

Dan saat ini Sistem Informasi Perpustakaan yang penulis rancang sudah berjalan
dan beroperasi dengan url lib.fisip.unimal.ac.id/admperpus, dan sedang dalam
proses pengujian.
 BAB V
PENUTUP

5.1 Kesimpulan

Dari hasil pembahasan laporan Kerja Praktek (KP) ini penulis

memberikan kesimpulan sebagai berikut :

1. Perpustakaan FISIP UNIMAL berdiri dengan tujuan untuk

mendukung kegiatan belajar dan mengajar dilingkungan FISIP
UNIMAL dengan cara menyediakan fasilitas ruang baca yang
nyaman dan koleksi buku yang lengkap.

2. Dengan dibuatnya Sistem Informasi Perpustakaan pada

Perpustakaan FISIP UNIMAL dapat mempermudah petugas dalam
penyimpanan data koleksi buku dan pencatatan peminjaman buku.

3. Kelebihan dari Aplikasi Sistem Informasi Perpustakaan ini sudah

berbasis web dan menggunakan database mySQL sehingga dapat
diakses melalui banyak perangkat dan pengolahan database buku
menjadi lebih efesien.

5.2 Saran

Saran yang dapat diberikan untuk pengembangan aplikasi Sistem

Informasi Perpustakaan pada Perpustakaan FISIP UNIMAL adalah:

1. Pengembangan Rancang Bangun Sistem Informasi Perpustakaan

ini diharapkan lebih kompleks dan mendukung fitur e-library,
sehingga pengunjung tidak perlu langsung datang ke perpustakaan
untuk membaca buku.

2. Fitur pada halaman pinjam dan kembali buku yang ada pada sistem
saat ini diharapkan bisa dikembangkan lebih lanjut agar mencari
nama peminjam dan judul buku menjadi lebih mudah.
 DAFTAR PUSTAKA

Anon., 2020. Web Server. [Online]

Available at: https://en.wikipedia.org/wiki/Web_server
[Accessed 22 Agustus 2020].
B, I. Y., 2014. Aplikasi Pengolahan Citra Berbasis Web Menggunakan Javascript
dan Jquery. pp. 1-8.
Bodnar, G. H. & Hopwood, W., 2006. Sistem Informasi Akuntansi. Yogjakarta:
ANDI.
Fajriyah, S. K., 2010. Implementasi Framework Code Igniter Untuk Aplikasi Situs
Berita. Yogyakarta: Amikom.
Jacobson, I., Booch, G. & Rumbaugh, J., 1996. The Unified Modeling Language.
s.l.:University Video Communications.
Jr, R. M. & Schell, G. P., 2008. Sistem Informasi Manajemen. Jakarta: Salemba
Empat.
Kymin, J., 2012. What is CSS?. [Online]
Available at: http://webdesign.about.com/od/webdesigntutorials
[Accessed 2020 Agustus 24].
Laudon, C., Laudon, P. J. & K., 2006. Pengertian Sistem Informasi. In:
Management Information System. s.l.:Pearson International, p. 16.
Munawar, 2005. Pemodelan Visual dengan UML. Yogjakarta: Graha Ilmu.
Otto, M., 2011. Bootstrap from Twitter. [Online]
Available at: (https://blog.twitter.com/2011/bootstrap-twitter)
[Accessed 22 Agustus 2020].
R.G, M., 1991. Pengertian Sistem. In: Sistem Informasi Untuk Manajemen
Modern. Jakarta: Erlangga, p. 27.
Rosmala, D., Ichwan, M. & Gandalish, M. I., 2011. Komparasi Framework MVC
(CodeIgniter dan CakePHP) Pada Aplikasi Berbasis Web. Jurnal Informatika,
2(22), pp. 22-30.
Sutanta, E., 2003. Gambar Transformasi Data Menjadi Informasi. In: Sistem
Informasi Manajemen. s.l.:s.n., p. 10.
Tectale, 2012. An Introduction to Twitters Bootstrap. [Online]
Available at: http://www.tectale.com/an-introduction-to-twitters-bootstrap
[Accessed 22 Agustus 2020].
43