JSiI | Jurnal Sistem Informasi | Vol. 9 | No. 1 | Maret 2022 | 6-11

## IMPLEMENTASI FRAMEWORK BOOTSTRAP PADA SISTEM KERJA PRAKTEK BERBASIS WEB RESPONSIVE
Hafiz Maulana Siagian 1 , M. Irwan Padli Nasution
2 , Triase 3
1,2,3 Jurusan Sistem Informasi Fakultas Sains dan Teknologi UIN Sumatera Utara Jl. IAIN No.1, Gaharu, Kec. Medan Tim., Kota Medan, Sumatera Utara 20235
1 hafiz.maulana@uinsu.ac.id
2 irwannst@uinsu.ac.id
3 triase@uinsu.ac.id

## Abstrak
Sistem  informasi  memfasilitasi integrasi data,  kecepatan dan  perkiraan pemrosesan data,  meningkatkan kualitas informasi dan kontrol manajemen, meningkatkan layanan, dan menyederhanakan prosedur. Universitas Islam Negeri Sumatera Utara (UINSU) adalah  sebuah  universitas  di  Medan,  Sumatera  Utara,  Indonesia.  Sains  dan  Teknologi  merupakan  salah  satu  fakultas.  Kerja Praktek (KP) merupakan salah satu mata kuliah di program studi sistem informasi yang mewajibkan mahasiswa untuk melakukan KP di perusahaan atau instansi dengan persyaratan saat ini. Sistem ini dapat memberikan laporan kerja praktek, petunjuk kerja praktek, izin kerja praktek, dan informasi kerja praktek. Tujuan dari penelitian ini adalah untuk mengumpulkan data tentang KP, mempermudah pengolahan data, dan membuat sistem informasi kerja (KP) yang realistis di Universitas Islam Negeri Sumatera Utara Fakultas Sains dan  Teknologi Medan. RAD (Rapid Application Development), bahasa pemrograman PHP, dan database MySQL  semuanya digunakan  dalam  proses  pengembangan sistem.  Sistem  dapat  menyajikan  informasi  kerja  praktek  berbasis web yang responsif yang dapat memudahkan kegiatan KP di FST seperti bisa mendapatkan izin KP secara online, melaporkan kegiatan KP setiap hari dengan tepat waktu, dan mengunggah hasil laporan KP. hasil akhir yang dievaluasi menggunakan black box pengujian.
Kata kunci : Fakultas Sains dan Teknologi , Framework Bootstrap , Kerja Praktek, Web Responsive
I.   P ENDAHULUAN
Sistem informasi mempermudah integrasi data, mempercepat  pemrosesan  data, meningkatkan  kualitas informasi  dan  pengendalian  manajemen,  meningkatkan layanan,  dan  menyederhanakan  prosedur.  Sistem  informasi adalah  kumpulan  komponen  yang  saling  berhubungan  atau terhubung di dalam perusahaan yang memperoleh, memproses, menyimpan, dan mentransfer data untuk membantu pemenuhan tugas dan pengambilan keputusan [1].
UINSU  (Universitas  Islam  Sumatera  Utara)  adalah  sebuah lembaga  pendidikan  tinggi  di  Kota  Medan  yang  memiliki banyak fakultas, termasuk Fakultas Sains dan Teknologi (FST). Ilmu  Komputer,  Sistem  Informasi,  Matematika,  Biologi,  dan Fisika  adalah  lima  program  studi  yang  ditawarkan  FST.  Ada mata kuliah Kerja Praktek (KP) di prodi sistem informasi, dan topik  KP  mengharuskan  mahasiswa  melakukan  KP  di  suatu perusahaan  atau  instansi  dengan  persyaratan  saat  ini  [2]. Prosedur  pelaksanaan  KP  saat  ini  dimulai  dengan  mahasiswa mengajukan surat KP yang telah disahkan oleh Program Studi, setelah  itu  pihak  administrasi  memberikan  izin  KP  pada perusahaan  yang  ditekuni  mahasiswa  tersebut.  Prodi  Sistem Informasi  menunjuk  Pembimbing  KP,  setelah  itu  mahasiswa menyampaikan hasil KP kepada Pembimbing KP, Pembimbing
Akademik,  Prodi  Sistem  Informasi,  Perpustakaan,  dan Perusahaan.  Saat  ini  implementasi  KP  di  Prodi  Sistem Informasi  belum  terintegrasi  secara  efektif.  Baik  tata  cara pendaftaran  KP  maupun  pelaksanaan  KP,  serta  pengajuan laporan akhir. Kesulitan lain bagi FST, seperti pemilihan/penugasan pengawas KP dan pemantauan proses KP secara manual, dapat diatasi dengan mengumumkan informasi tentang KP melalui Sistem Informasi KP berbasis website.
Lalu ada penyimpanan data KP yang belum dimasukkan ke dalam database sistem. Misalnya laporan KP  mahasiswa yang belum didigitalisasi. Laporan KP Mahasiswa Sistem Informasi UIN Sumut untuk ganjil tahun 2015 berjumlah 55 laporan KP, sedangkan periode ganjil tahun 2016 berjumlah 78 laporan KP, karena  jumlah  mahasiswa  yang  melaksanakan  KP  akan  terus meningkat  setiap  periodenya.  Data  dapat  hilang  atau  musnah apabila  data  disimpan  secara  manual,  oleh  karena  itu diperlukan  suatu  sistem  yang  menggabungkan  semua  data laporan KP sehingga semua prosedur pelaksanaan KP ditangani oleh satu sistem.
Selanjutnya, mahasiswa mencari informasi KP tentang Prodi Sistem  Informasi  yang  masih  diturunkan  dari  mulut  ke  mulut dan  pertanyaan  serta  tanggapan  dari  pengalaman  mahasiswa yang  lebih  tua.  Kendala  dalam  penyebaran  informasi  ini  bagi
JSiI | Jurnal Sistem Informasi | Vol. 9 | No. 1 | Maret 2022 | 6-11
mahasiswa yang belum mengenal KP dan kebutuhannya, serta kurangnya waktu untuk mendapatkan informasi yang benar dan terkini.  Lalu  ada  administrasi  administrasi,  yang  berbentuk cetakan dari awal sampai akhir, yang mungkin memakan biaya dan waktu. Mahasiswa kemudian berinteraksi langsung dengan dosen  di  kampus  untuk  mengedit  laporan  KP  yang  artinya mahasiswa  bertemu  dengan  dosen  di  kampus  untuk memperbaiki  kesalahan  dalam  laporannya.  Sebaiknya  hindari keramaian  selama  masa  pandemi  Covid-19,  karena  saat  ini banyak  program  online  yang  dapat  membantu  mahasiswa dalam  menyampaikan  laporan  dengan  cepat  dan  tanpa  harus bertemu dengan dosen.

## II.  M ETODOLOGI P ENELITIAN
Berikut  ini  adalah  metodologi  penelitin  yang  digunakan dalam membuat Sistem Kerja Praktek.
a)    Observasi Observasi adalah strategi atau teknik untuk mengumpulkan  informasi  atau  data  yang  melibatkan pengamatan  sistematis  dan  catatan  dari  peristiwa  yang dipelajari  [3].  Penelitian  ini  dilakukan  di  Fakultas  Sains  dan Teknologi  dan  Bagian  Akademik  melakukan  peninjauan langsung dan pedataan secara terstruktur terhadap tujuan yang akan  diteliti.  Sehingga  mendaparkan  data  maupun  informasi yang sesuai kemudian dapat ditarik kesimpulan.
b)    Wawancara
Wawancara Salah satu prosedur pengumpulan data dalam penelitian adalah wawancara, yang melibatkan dua orang, satu sebagai  informan  dan  yang  lainnya  sebagai  informer. [4].Wawancara  atau  diskusi  dilakukan  di  prodi  Sistem Informasi  supaya  data  yang  diperoleh  lebih  jelas.  Penulis menyelidiki  fakta,  informasi,  dan  kerangka  informasi  dari subjek penelitian dalam wawancara ini. Wawancara dilakukan kepada Ketua Prodi Sistem Informasi UIN SU Bapak Samsudin ST,  M.Kom,  Sekretaris  Prodi  Sistem  Informasi  UIN  SU  Ibu Triase ST, M.Kom serta Bagian Akademik Ibu Fatma.
c)    Studi Pustaka
Menurut  Hart  studi  Daftar  Pustaka  adalah  kumpulan jurnal  (baik  yang  diterbitkan  maupun  yang  tidak  diterbitkan) tentang  topik  tertentu  yang  terdiri  dari  informasi,  pemikiran, fakta,  dan  bukti  yang  dibuat  dari  sudut  pandang  tertentu  atau menyampaikan sudut pandang tertentu tentang suatu  masalah, cara  meneliti  itu,  dan  penilaian  yang  efektif..  [5].  Dalam penelitian ini, menggunakan referensi seperti jurnal-jurnal dan berbagai macam buku yang terkait dengan masalah penelitian. Dari  proses  studi  pustaka  diharapkan  dapat  melengkapi informasi  yang  berguna  untuk  membantu dalam  penyelesaian masalah.
d)    Pengembangan Sistem
Rapid  Application  Development  (RAD)  yang  tergabung dalam pendekatan  aditif digunakan  sebagai  metode pengembangan  sistem.  Siklus  pengembangan  yang  pendek dan cepat menjadi fokus RAD. Dalam pengembangan sistem, RAD menggunakan teknik verbatim (berulang) di mana model sistem fungsional dikembangkan di awal siklus pengembangan   untuk   menentukan   kebutuhan   pengguna.
Terkadang  model  kerja  berfungsi sebagai  dasar  untuk  desain dan eksekusi sistem akhir.

## III. H ASIL DAN P EMBAHASAN

## 3.1.   Analisis Sistem Berjalan
Metode  pelaksanaan  KP  saat  ini  dimulai  dengan mahasiswa  mengajukan  surat  KP  yang  telah  disahkan  oleh Prodi,  dilanjutkan  dengan  administrasi  mengeluarkan  izin  KP kepada perusahaan yang dibidik mahasiswa, dan Prodi Sistem Informasi  menunjuk  pembimbing  KP.  Seleksi/penugasan pengawas  KP  masih  manual,  mengakibatkan  mahasiswa kurang  memahami  apa  yang  mereka  lakukan  selama  kerja praktek  di  perusahaan  yang  disasar  mahasiswa,  kemudian prosedur pembimbingan  masih  manual  yaitu  mahasiswa pergi ke  dosen  pembimbing,  semua  kendala  FST.  Mahasiswa kemudian mencari informasi KP tentang Program Studi Sistem Informasi  yang  masih  berdasarkan  dari  mulut  ke  mulut  dan tanya  jawab  dari  pengalaman  mahasiswa  sebelumnya. Kurangnya  pemahaman  mahasiswa  tentang  KP,  cara persyaratan KP, serta kerangka waktu pelaksanaan yang masih keliru  dan  ketinggalan  zaman  menjadi  kendala  dalam penyampaian  informasi  tersebut.  Lalu  ada  administrasi,  yang dilakukan  seluruhnya  di  cetak  dari  awal  sampai  akhir,  yang mungkin mahal dan memakan waktu.
3.2. Analisis Sistem Usulan
Dengan mendaftar Kerja Praktek, mengupload laporan KP, dan melakukan bimbingan online melalui sistem Kerja Praktek, sistem  baru  ini  akan  membantu  mahasiswa  dalam  memenuhi berbagai  kriteria  untuk  memenuhi  proses  Kerja  Praktek  yang ada. Mahasiswa juga dapat memperoleh informasi lebih lanjut tentang  Kerja  Praktek  di  Fakultas  Sains  dan  Teknologi  UIN Sumatera Utara, mulai dari formulir pendaftaran KP, nilai, dan berita terkini lainnya. Selain mahasiswa, sistem Kerja Praktek yang  diusulkan  akan  membantu  dosen  dalam  menjalankan tanggung jawabnya, seperti memberikan informasi yang  up to date kepada mahasiswa, memonitoring mahasiswa saat KP, dan mahasiswa dapat melaporkan bimbingan secara online melalui sistem  informasi  kerja  praktek,  dan  akademisi  dapat mempermudah pengiriman surat  balasan atau  surat  pengantar. Perusahaan  kemudian  dapat  memantau  tindakan  siswa  setiap hari  dan  memberikan  nilai  kepada  siswa  selama  KP  di perusahaan.
3.3. Perancangan Sistem
Sistem  usulan  pada  penelitian  ini  terdiri  dari  rancangan usecase,  class  diagram, dan  Desain Database. Gambar  2 memperlihatkan usecase yang  akan  diusulkan. Use  Case Diagram berfungsi  melakukan  tugas-tugas  khusus  yang menjadi ciri proses bisnis sistem [7]. Pada Use case ada 5 aktor yaitu  akademisi,  mahasiswa,  program  studi,  fakultas  dan institusi.  Dalam  sistem  ini,  program  studi  berfungsi  sebagai pengelola  sistem  untuk  entri  data,  modifikasi  data, penghapusan  data  pengguna,  mahasiswa  dan  fakultas. Mahasiswa  dalam  sistem  ini  diminta  untuk  memasukkan  data KP, melakukan data, data jurnal harian, dan menyerahkan data laporan KP yang telah diverifikasi oleh Prodi. Sedangkan tugas dosen  adalah  memperoleh  informasi  tentang  data  mahasiswa untuk  keperluan  konseling  KP,  dan  data  mahasiswa  untuk
JSiI | Jurnal Sistem Informasi | Vol. 9 | No. 1 | Maret 2022 | 6-11
Column Type bimbinganID (Primary) int(11) bimbinganUserID bigint(20) bimbinganPembimbingID bigint(20) bimbinganMkpID int(11) bimbinganAttachment text bimbinganCatatan text bimbinganTanggal datetime bimbinganStatus enum('Diajukan', 'Diterima', 'Ditolak') bimbinganTanggalStatus datetime
konseling. Perusahaan dapat memasukkan nilai, melihat jurnal harian, dan memperbarui data perusahaan.
Gambar 1. Usecase Sistem Usulan
Berikutnya adalah class diagram. Class   Diagram yaitu model desain sistem, ada hubungan antara kelas dan deskripsi menyeluruh dari setiap kelas. [8]. Gambar 3 merupakan Class Diagram pada  penelitian. Class  diagram pada  penelitian  ini terdapat  13  class  yaitu,  perusahaan,  user,  bimbingan,  surat pengantar,  rbac,  surat  tugas,  kegiatan,  pengajuan,  berkas, jadwal, migration, masterkp, setting.
Gambar 2. Class Diagram Sistem Usulan Adapun  selanjutnya  adalah  tahapan  Desain Database. Database adalah kumpulan informasi sistematis yang disimpan
di  komputer  yang  dapat  diverifikasi  menggunakan  aplikasi komputer  untuk  mengekstrak  informasi  dari database. [9]. Berikut adalah desain Database pada sistem usulan , terdiri dari 10 yang digunakan dalam pembuatan database untuk sistem ini yaitu  tabel  master  KP,  tabel  berkas,  tabel  bimbingan,  tabel jadwal, tabel kegiatan, tabel pengajuan, tabel perusahaan, tabel surat pengajuan, tabel surat tugas, dan tabel user antara lain :
Tabel 1. Master KP Column Type mkpID (Primary) int(11) mkpKode varchar(200) mkpTanggal datetime mkpDateline datetime mkpTanggalUpdate datetime mkpUserID bigint(20) mkpPerusahaanID int(11) mkpPembimbingID bigint(20) mkpPgjID int(11) mkpAngkatan int(4) mkpSemester varchar(20) mkpJudul varchar(200) mkpAbstrak text mkpMetode text mkpNilai int(11) mkpNilaiTanggal datetime mkpPerusahaanUserID bigint(20) mkpLaporan varchar(200) mkpHasil enum('Lulus', 'Tidak Lulus', 'Belum Selesai') mkpStatus enum('Belum  Selesai', 'Selesai') Tabel 2. Berkas Column Type berkasID (Primary) int(11) berkasUserID bigint(20) berkasPengajuanID int(11) berkasNama varchar(200) berkasFile varchar(200) berkasTanggal datetime
Tabel 3. Bimbingan
Column Type jadwalID (Primary) int(11) jadwalTanggalMulai datetime jadwalTanggalSelesai datetime
Column Type kegiatanID (Primary) int(11) kegiatanUserID bigint(20) kegiatanPembimbingID bigint(20) kegiatanMkpID int(11) kegiatanJudul text kegiatanDeskripsi text kegiatanTanggal
datetime
kegiatanStatus
enum('Dilaporkan', 'Terverifikasi', 'Tidak Terverifikasi') kegiatanCatatan text kegiatanTanggalStatus datetime
Column Type pgjID (Primary) int(11) pgjKode varchar(200) pgjTanggal datetime pgjTanggalUpdate datetime pgjUserID bigint(20) pgjPerusahaanID int(11) pgjCalonPembimbingID bigint(20) pgjAngkatan int(4) pgjSemester varchar(20) pgjHasil enum('Pengajuan KP Diterima', 'Pengajuan KP Ditolak') pgjStatus enum('Menunggu Validasi', 'Selesai Validasi') Column Type perusahaanID (Primary) int(11) perusahaanNama varchar(200) perusahaanEmail varchar(200) perusahaanTelepon varchar(20) perusahaanUserID bigint(20) perusahaanAlamat text perusahaanDeskripsi text perusahaanStatus enum('Aktif', 'Non Aktif') Column Type spID (Primary) int(11) spFile varchar(200) spMkpID int(11) spUserID bigint(20) spPgjPerusahaanID int(11)
spTanggal
datetime
Tabel 4. Jadwal
Tabel 5. Kegiatan Tabel 6. Pengajuan
Tabel 7. Perusahaan Tabel 8. Pengajuan
Tabel 9. Surat Tugas
Column Type stID (Primary) int(11) stMkpID int(11) stUserID bigint(20) stFile varchar(200) stTanggal datetime
Tabel 10. User
Column Type userID (Primary) bigint(20) username varchar(255) password varchar(255) nama varchar(35) email varchar(255) telegram varchar(200) telepon varchar(20)
foto text tanggal_pendaftaran date role
int(11)
token_aktivasi
text status enum('Pending', 'Aktif', 'Non
Aktif')
3.4.   Implementasi Sistem
Implementasi  dapat  didefinisikan  sebagai  aktivitas  yang berhubungan  dengan  pekerjaan  yang  melibatkan  penggunaan sarana  (alat)  untuk  mencapai  tujuan  [10].  Pada  tahap  ini, perancangan  sistem  yang  dibuat  menggunakan  pemograman PHP  dan  database  menggunakan  MySQL  dan  memakai framework Bootstrap.
Gambar  3  merupakan  homepage,  yang  berfungsi  untuk sebagai identitas website.
Gambar 4  merupakan halaman login, yang berfungsi untuk user  yang  akan  menggunakan  aplikasi  dengan  memasukkan username dan password yang ada pada sistem.
Gambar  5  merupakan  halaman  menu  utama  pada  Admin prodi,  yang  berisikan  menu  data  perusahaan,  data  pengajuan, data  berkas,  data  pelaksanaan KP,  data  surat  pengantar,  data surat tugas dosen, data bimbingan KP, data kegiatan KP, data Nilai KP.
Gambar 6 merupakan halaman menu utama pada Mahasiswa, yang  berisikan  menu  data  pengajuan,  data  kerja  praktek,  data surat pengantar, data bimbingan KP, data kegiatan KP.
Gambar  7  merupakan  halaman  menu  utama  pada  Dosen, yang  berisikan  menu  data  pelaksanaan  KP,  data  surat  tugas dosen, data bimbingan KP.
Gambar 8merupakan halaman menu utama pada Akademik, yang  berisikan  menu  data  pengajuan  dan  menu  data  surat pengantar.
Gambar  9  merupakan  halaman  menu  utama  pada Perusahaan,  yang  berisikan  menu  data  kerja  praktek  dan  data kegiatan KP.
JSiI | Jurnal Sistem Informasi | Vol. 9 | No. 1 | Maret 2022 | 6-11
Gambar 3. Home Page
Gambar 4. Login
Gambar 5. Menu Utama Admin
Gambar 6. Menu Utama Mahasiswa
Gambar 7. Menu Utama Dosen
Gambar 8. Menu Utama Akademik
Gambar 9. Menu Utama Perusahaan

## IV. K ESIMPULAN
1)    Sistem ini menggunakan Framework Bootstrap untuk mempermudah  pemakaian  dalam  Sistem  Informasi KP pada Fakultas Sains dan Teknologi UIN SU.
2)    Sistem yang telah dibangun, memberikan kemudahan pengolahan  semua  data  KP  yang  dilaksanakan  di Fakultas Sains dan Teknologi UIN SU.
3)      Sistem  yang  dibangun  berupa  informasi  KP  yang  di dalamnya  memuat  data-data  yang  dimulai  dari pengajuan KP hingga mengupload laporan KP
REFERENSI
[1]    H. T. Sihotang, “Sistem Informasi Pengagendaan Surat Berbasis Web Pada Pengadilan Tinggi Medan,” vol. 3, no.  1,  pp.  6–9,  2019,  doi:  10.31227/osf.io/bhj5q.
JSiI | Jurnal Sistem Informasi | Vol. 9 | No. 1 | Maret 2022 | 6-11
[2]      F. Sains, D. A. N. Teknologi, U. I. Negeri, and S. U. Medan,   “Buku   panduan   penulisan   laporan   kerja praktik program studi sistem informasi.”
[3]      R. Widia, V. Novianti, Y. Syahidin, and M. Hidayati, “Sistem  Informasi  Korespondensi  Rekam  Medis  di Rumah Sakit Menggunakan Microsoft Visual Studio,” Expert J. Manaj. Sist. Inf. dan Teknol. , vol. 11, no. 1, p. 56, 2021, doi: 10.36448/expert.v11i1.2013.
[4]      S.    R.    I.    Solehah,    P.    Pancasila,    D.    A.    N. Kewarganegaraan, F. Keguruan, D. A. N. Ilmu, and U. M.  Mataram,  “Skripsi  Penanaman  Nilai  –  Nilai Pancasila Dalam Membentuk Karakter Anak  Sebagai Upaya  Pencegahan  „  Lost  Generation  ‟  Di  Tpa Pendidikan  Pesantren  Nu  Hidayatul  Muttaqin  – Pagutan,” 2019.
[5]          L.  Aldianto,  I.  Raafaldini  Mirzanti,  D.  Sushandoyo, and  E.  Fitriana  Dewi,  “Pengembangan  Science  Dan Technopark  Dalam  Menghadapi  Era  Industri  4.0    - Sebuah Studi Pustaka,” J. Manaj. Indones. , vol. 18, no. 1, pp. 68–76, 2018, doi: 10.25124/jmi.v18i1.1261.
[6]      J. R. Sagala, “Model Rapid Application Development (Rad)  Dalam  Pengembangan  Sistem  Informasi Penjadwalan  Belajar  Mengajar,” J.  Mantik  Penusa , 2018.
[7]     Suendri,   Triase,   and   S.   Afzalena,   “Implementasi Metode  Job  Order  Costing  Pada  Sistem  Informasi Produksi Berbasis Web,” J. Sekol. , vol. Vol 4, pp. 97– 106, 2020.
[8]      Suendri,  “Implementasi  Diagram  UML  (Unified Modelling  Language)  Pada  Perancangan  Sistem Informasi   Remunerasi   Dosen   Dengan   Database Oracle (Studi Kasus: UIN Sumatera Utara Medan),” J. Ilmu Komput. dan Inform. , 2018.
[9]      N.  Yuslem,  M.  Nasution,  and  A.  B  Syarbaini, “Development of Database of The Abu Lais‟ Thought Regarding   Hadith,”   2020,   doi:   10.4108/eai.2-10- 2018.2295289.
[10]    A.          P.          Erwan          and          R.          S.          Dyath, “Implementasi_Kebijakan_Publik._pdf.pd  f,”  no. September.  p.  194,  2018,  [Online].  Available: www.gavamedia.net.