Jurnal Teknik Informatika (JUTIF) DOI: https://doi.org/10.20884/1.jutif.2022.3.2.186 Vol. 3, No. 2, April 2022, hlm. 321-329 p-ISSN: 2723-3863 e-ISSN: 2723-3871

## FRONTEND DEVELOPMENT IN THE FINAL STUDY MANAGEMENT SYSTEM (SIPEDA) AT THE ENGINEERING FACULTY OF JENDERAL SOEDIRMAN UNIVERSITY
Qotrunnada Oktiriani *1 , Arief Kelik Nugroho *2 , Eddy Maryanto 3
1,2,3 Program Studi Informatika, Fakultas Teknik, Universitas Jenderal Soedirman, Indonesia Email: 1 qotrunnada.oktiriani@mhs.unsoed.ac.id , 2 arief.nugroho@unsoed.ac.id , 3 eddy.maryanto@unsoed.ac.id
(Naskah masuk: 06 Maret 2022, Revisi : 20 Maret 2022, diterbitkan: 25 April 2022)

## Abstract
Frontend is a very important part in system development because it is a communication mechanism between the user and the system, so that it will help users to understand how to use and work an application or system. An attractive  frontend  is  also  an  important  factor  to  improve  the  quality  and  user  experience  while  using  an application. The purpose of this research is to build frontend final study management system at the engineering faculty of Jenderal Soedirman University with an attractive and easy-to-use interface to facilitate the academic community  in  managing  the  final  study  process  which  includes  final  assignments,  comprehensive  examination and graduation which can be accessed through the website. The development of the management system of this final study uses the DevOps method where the stages discussed in this study include the planning, development, and  deployment.  The  final  study  management  system  login  is  already  connected  to  the  SSO  KORI  Unsoed.  In developing this frontend system, the Laravel framework is used by utilizing the blade templating engine feature and  several  javascript  libraries  that  can  simplify  and  speed  up  the  system  display  development  process.  The results of this study are the final study management system interface that has been adapted to the needs of each system user and is connected to the database and can be accessed on an Unsoed server.
Keywords : DevOps, Final study management, Frontend, Laravel.

## PENGEMBANGAN ANTARMUKA PADA SISTEM PENGELOLAAN STUDI AKHIR (SIPEDA) DI FAKULTAS TEKNIK UNIVERSITAS JENDERAL SOEDIRMAN

## Abstrak
Antarmuka  sistem  merupakan  bagian  yang  sangat  penting  dalam  pengembangan  sistem  karena  merupakan mekanisme  komunikasi  antara  pengguna  dengan  sistem  sehingga  akan  membantu  pengguna  untuk  memahami cara  penggunaan  dan  cara  kerja  sebuah  aplikasi  atau  sistem.  Tampilan  antarmuka  yang  menarik  juga  menjadi faktor penting untuk meningkatkan kualitas serta pengalaman pengguna selama menggunakan aplikasi tersebut. Tujuan  dari penelitian ini yaitu untuk membangun antarmuka sistem pengelolaan studi akhir di Fakultas Teknik Universitas  Jenderal  Soedirman  dengan  tampilan  yang  menarik  dan  mudah  digunakan  guna    mempermudah civitas akademika dalam mengelola proses studi akhir yang meliputi tugas akhir, pendadaran dan yudisium yang dapat di akses melalui website . Pengembangan sistem pengelolaan studi akhir ini menggunakan metode DevOps dimana tahapan yang di bahas dalam penelitian ini meliputi tahap perencanaan, pengembangan, serta penerapan. Login sistem pengelolaan studi akhir ini sudah terhubung dengan login SSO KORI Unsoed. Pada pengembangan antarmuka  sistem  ini    digunakan  framework  laravel  dengan  memanfaatkan  fitur blade  templating  engine dan beberapa library javascript yang dapat mempermudah dan mempercepat proses pengembangan  tampilan sistem. Hasil  dari  penelitian  ini  yaitu  antarmuka  sistem  pengelolaan  studi  akhir  yang  sudah  disesuaikan  dengan kebutuhan  masing  -  masing  pengguna  sistem  dan  sudah  terhubung  dengan  database  serta  dapat  diakses  pada server Universitas Jenderal Soedirman.
Kata kunci : kata Antarmuka Sistem, DevOps, Laravel, Pengelolaan Studi Akhir.

## 1. PENDAHULUAN
Keberhasilan  sebuah  instansi  yang  bergerak  di bidang pendidikan bukan hanya diperhitungkan dari ketepatan  dan  banyaknya  lulusan  yang  dihasilkan,
melainkan  juga  dari  bagaimana  instansi  tersebut mengelola berbagai data yang ada untuk mendapatkan  suatu  informasi  yang  diperlukan  oleh civitas  akademika  instansi  yang  bersangkutan.
Informasi  yang  berkualitas  adalah  informasi  yang dapat  disajikan  secara  relevan,  akurat,  dan  tepat waktu  [1].  Sehingga  pihak  yang  menerima  akan dapat  memanfaatkan  informasi  tersebut  sesuai harapan [2].
Dengan  perkembangan  teknologi  saat  ini  yang semakin  pesat  sangat  membantu  dalam  kemudahan penyampaian  dan  penerimaan  informasi  khususnya perguruan tinggi yang membutuhkan sebuah website sistem  informasi  untuk  mempermudah  kebutuhan mahasiswa  memperoleh  berbagai  macam  informasi yang  dibutuhkan  serta  percepatan  informasi  yang dapat  disajikan.  Penggunaan  sistem  informasi  di beberapa  perguruan  tinggi  sudah  menjadi  hal  yang wajib  dilakukan  untuk  meningkatkan  kualitas pelayanan  dan  pembelajaran,  termasuk  di  Fakultas Teknik  Universitas  Jenderal  Soedirman  yang  sudah memanfaatkannya untuk menunjang kegiatan pembelajaran.
Namun,  yang  menjadi  permasalahan  di Fakultas Teknik yaitu proses pengelolaan studi akhir masih  terkomputerisasi  secara sederhana yang mana dalam pengelolaan berkas – berkas studi akhir dapat menghabiskan banyak sekali kertas karena bapendik harus  membuat  dan  mencetak  berkas  yang dibutuhkan  secara  manual.  Selain  itu,  tahapan  studi akhir  yang  meliputi  tugas  akhir,  pendadaran  dan yudisium masih  dikelola secara  terpisah dan belum saling terintegrasi. Hal tersebut dinilai kurang efektif dan  dapat  memperlambat  proses  penyelesaian  studi akhir  dari  mahasiswa.  Selain    itu,  data-data  studi akhir  mahasiswa  tersebut  harus  tersimpan  dengan baik,  agar  memudahkan  dalam  proses  pemeriksaan setiap  data  yang  masuk  dan  menghindari  terjadinya kehilangan data.
Front-End merupakan  antarmuka  pengguna yang  menyajikan  fungsi  atau  kegunaan  dari  sebuah website serta  berinteraksi  secara  langsung  dengan pengguna  dan  juga  berkaitan  dengan  pengalaman dari  pengguna  ketika  berinteraksi  dengan website [3]. antarmuka  pengguna  adalah  sebuah  jembatan untuk  menghubungkan  antara  reaksi  dari  sistem (dalam  hal  ini  aplikasi)  dengan  reaksi  pengguna aplikasi secara efisien [4]. Tampilan antarmuka yang menarik  juga  menjadi  faktor  penting  untuk meningkatkan  kualitas  serta  pengalaman  pengguna selama  menggunakan  aplikasi  tersebut,  apalagi  di era  serba  teknologi  seperti  sekarang  ini  dimana desain website atau  aplikasi  menjadi  sangat  popular dan  beragam,  tentunya  dalam  membangun  sebuah sistem informasi akademik juga harus memperhatikan hal tersebut.
Berdasarkan latar belakang tersebut, diperlukan adanya  pengembangan  sistem  pengelolaan  studi akhir  di  Fakultas  Teknik  Universitas  Jenderal Soedirman  yang  saling  terintegrasi,  dimana  dalam pengembangannya  dibagi  menjadi  beberapa  tugas antara  lain  bagian backend (bagian  belakang  layar dari sebuah website [5]), frontend , pengujian sistem serta  bagian  API.  Penelitian  ini  berfokus  pada
pengembangan  tampilan  antarmuka  ( front-end ) sistem  yang  mudah  digunakan  oleh  pengguna dengan tampilan yang menarik, responsive dan fitur yang tidak membingungkan sehingga dapat mempermudah  penggunanya  dalam  mengelola proses  studi  akhir  dan  meningkatkan  pengalaman pengguna  selama  menggunakan  sistem  studi  akhir. Pada pengembangan antarmuka sistem ini, digunakan framework laravel dengan memanfaatkan fitur blade  templating  engine dan  beberapa library JavaScript yang dapat mempermudah dan mempercepat proses pengembangan tampilan sistem dengan  metode  pengembangannya  menggunakan metode  DevOps.  Diharapkan  dengan  dilakukannya penelitian  ini  akan  meningkatkan  kualitas  layanan akademik  khususnya  dibidang  pengelolaan  studi akhir  serta  dapat  mewujudkan  terciptanya smart campus di  lingkungan  Fakultas  Teknik  Universitas Jenderal Soedirman

## 1.1. Rumusan masalah
Adapun  rumusan  masalah  dalam  penelitian  ini sebagai berikut.
1) Bagaimana  cara  merancang  antarmuka  sistem pengelolaan  studi  akhir  yang  menarik  dan mudah  dipahami  untuk  mendukung  pelayanan akademik  di  Fakultas  Teknik  Universitas Jenderal Soedirman?
2) Bagaimana  cara  membuat  tampilan  antarmuka yang  sesuai  dengan  kebutuhan  masing  – masing pengguna sistem?
3) Bagaimana  cara  meng- install sistem  ke  dalam server di Fakultas Teknik Unsoed?

## 1.2. Batasan Masalah
Agar  penelitian  ini  sesuai  dengan  apa  yang akan  diteliti,  maka  pembahasan  masalah  pada penelitian ini akan dibatasi pada hal-hal berikut ini.
1) Sistem  yang  dibangun  berbasis website dan berfokus  pada  bagian front - end atau  tampilan antarmuka dari sistem pengelolaan studi akhir.
2) Pengembangan  antarmuka  ( front - end )  sistem dibangun  menggunakan  framework  laravel dengan  memanfaatkan  fitur blade  templating engine .
3) Pengguna dari sistem ini yaitu bapendik selaku admin,  komisi  studi  akhir,  dosen  yang  dapat berperan  sebagai  dosen  pembimbing  tugas akhir  dan  dosen  penguji  pendadaran,  ketua jurusan dan mahasiswa.

## 2. METODE PENELITIAN
Dalam rangka memperoleh informasi atau data dalam  sebuah  penelitian,  diperlukan  langkah- langkah  yang  terstruktur  dan  sistematis.  Metode penelitian memberikan gambaran rancangan penelitian  yang  meliputi  langkah  -  langkah  yang harus  ditempuh,  sumber  data,  waktu  penelitian  dan dengan langkah apa data-data tersebut diperoleh dan
selanjutnya  diolah  dan  dianalisis  [6].  Metode penelitian yang dilakukan dalam penelitian ini dapat dilihat pada Gambar 1.
Gambar 1. Metode Penelitian
Penelitian  ini  dimulai  dari  analisis  masalah yang  ada  dilanjutkan  dengan  pengumpulan  data yang  diperlukan.  Kemudian  data-data  yang  telah didapatkan  akan  digunakan  sebagai  acuan  dalam melakukan  pengembangan  aplikasi  pada  bagian tampilan  antarmuka.  Tahap  selanjutnya  setelah aplikasi  selesai  dikembangkan  adalah  menganalisis hasil aplikasi tersebut untuk mendapatkan kesimpulan  bahwa  aplikasi  sudah  sesuai  dengan kebutuhan.
dimasukkan  pada  semua  bab,  kecuali  di kesimpulan.

## 2.1. Analisis masalah
Permasalahan  di  Fakultas  Teknik  yaitu  proses pengelolaan  studi  akhir  masih  terkomputerisasi secara  sederhana  yang  mana  dalam  pengelolaan berkas  –  berkas  studi  akhir  dapat  menghabiskan banyak  sekali  kertas  karena  bapendik  harus membuat  dan  mencetak  berkas  yang  dibutuhkan secara  manual.  Selain  itu,  tahapan  studi  akhir  yang meliputi  tugas  akhir,  pendadaran  dan  yudisium masih  dikelola  secara  terpisah  dan  belum  saling terintegrasi.  Hal  tersebut  dinilai  kurang  efektif  dan dapat memperlambat proses penyelesaian studi akhir dari  mahasiswa.  Selain  itu,  data-data  studi  akhir mahasiswa  tersebut  harus  tersimpan  dengan  baik, agar  memudahkan  dalam  proses  pemeriksaan  setiap data  yang  masuk  dan  menghindari  terjadinya kehilangan  data  karena  data  tersebut  sangat  penting mengingat  studi  akhir  adalah  proses  yang  sangat mempengaruhi lulus tidaknya mahasiswa.

## 2.2. Pengumpulan Data
Pengumpulan  data  adalah  tahap  dimana  data  - data yang dibutuhkan untuk penelitian dikumpulkan dengan  menggunakan  metode  tertentu.  Data    pada penelitian ini didapatkan melalui metode wawancara, studi literatur dan konsultasi. 1) Wawancara,  wawancara  adalah  suatu  kegiatan yang  dilakukan  untuk  mendapatkan  informasi secara langsung dengan mengungkapkan pertanyaan  -  pertanyaan  pada  para  responden. Wawancara  dalam  penelitian  ini  dilakukan dengan  mengajukan  beberapa  pertanyaan kepada  wakil  dekan  bidang  akademik  dan badan pendidik di  Fakultas Teknik  Universitas Jenderal  Soedirman  untuk  memperoleh  data  – data yang dibutuhkan.
2) Studi  Literatur,  Studi  Literatur  adalah  suatu teknik  pengumpulan  data  yang  dilakukan dengan  mempelajari  buku  atau  dokumen  yang berkaitan  dengan  penelitian  [7].    Data pendukung  pada  penelitian  ini  diperoleh  dari berbagai sumber yang ada seperti jurnal, artikel ilmiah,  dan  juga  beberapa  penelitian  terdahulu sebagai  bahan  pertimbangan  dan  acuan pengembangan aplikasi sesuai dengan penelitian yang dilakukan.
3) Konsultasi, merupakan proses tanya jawab atau bimbingan dan diskusi kepada dosen pembimbing  mengenai  sistem  yang  di  buat sehingga  ditemukan  arah  seperti  apa  sistem nantinya [8]. konsultasi dengan dosen pembimbing  dilakukan  secara  daring  melalui aplikasi whatApps ataupun google meet.

## 2.3. Pengembangan Aplikasi
Penelitian  ini  menggunakan  metode  DevOps sesuai  kebutuhan  pengembangan  sistem  studi  akhir. Adopsi  DevOps  adalah  salah  satu  contoh  langkah mempererat kerjasama antara tim IT di mana hal itu sangat  dibutuhkan  dalam  pengembangan  dan pemeliharaan  perangkat  lunak  [9].  Metode  DevOps terdiri  dari  beberapa  tahapan  seperti plan,  develop, build,  test,  deploy,  operate, dan monitor .  Namun, dalam  mengembangkan  antarmuka  sistem  studi akhir ini berfokus pada tahap plan , develop dan juga deploy .    Tahapan  metode  DevOps  ditunjukan  pada Gambar 2.
Tahapan plan meliputi proses desain antarmuka  berdasarkan  data  yang  di  dapatkan  dari hasil  wawancara,  kemudian  desain  tersebut  akan diimplementasikan  ke  dalam  bentuk  tampilan website yang  merupakan  proses  dari  tahap develop , setelah  antarmuka  dan  fitur  di  dalam  sistem  sudah berhasil  berjalan  maka  proses  selanjutnya  adalah dilakukan deploy sistem  ke  server  Universitas Jenderal  Soedirman  agar  dapat  diakses  dan digunakan oleh pengguna.

## 2.4. Analisis Hasil
Analisis  hasil  adalah  tahap  dimana  hasil  dari tahap  pengembangan  aplikasi  akan  dianalisis  untuk mengetahui  apakah  sistem  tersebut  sudah  sesuai dengan  kebutuhan  pengguna  yang  di  dapatkan  dari tahap  wawancara.  Pada  tahap  ini  hasil  pengujian yang  dilakukan  oleh  tim  penguji  akan  dianalisis sejauh  apa  keberhasilan  dari  pengembangan  sistem ini.

## 2.5. Kesimpulan
Tahap kesimpulan merupakan proses penarikan kesimpulan  yang  didasarkan  pada  hasil  penelitian. Pada  tahap  ini  akan  didapatkan  kesimpulan  yang menjelaskan  keberhasilan  proses  penelitian  dalam membangun antarmuka sistem studi akhir ini.

## 3. HASIL DAN PEMBAHASAN
Tahap  ini  menjelaskan  mengenai  tahapan pengembangan  antarmuka  sesuai  dengan  siklus hidup  metode  DevOps  yang  meliputi  tahap perencanaan  ( plan ),  pengembangan  ( develop )  dan penerapan ( deploy ).

## 3.1. Perencanaan (Plan)
Tahapan  perencanaan  dalam  penelitian  ini meliputi  proses  perancangan  antarmuka  atau  desain mockup . Rancangan antarmuka sebuah sistem dibuat agar  bertujuan  sebagai  acuan  dalam  pengembangan sistem  [10]. Tahap  pemodelan  desain  dari  tampilan sistem  berdasarkan  kebutuhan  pengguna  yang  di dapatkan  dari  hasil  wawancara.  Pada  tahapan  ini, kebutuhan  pengguna  dan  kebutuhan  sistem  akan diubah  menjadi  bentuk  karakteristik  dari  perangkat lunak atau sistem sebelum dilakukan pengembangan berupa  pemorgraman  atau  pengkodean.  Dalam pembuatan  desain interface ini  digunakan  aplikasi Adobe  XD, yaitu      aplikasi      yang      memang diciptakan    untuk    mengembangkan    UI    dan    UX untuk  aplikasi mobile ataupun web [11] .
Terdapat  5  orang  pengguna  dari  sistem pengelolaan  studi  akhir  antara  lain  bapendik,  ketua jurusan,  komisi  studi  akhir,  dosen,  dan  juga mahasiswa yang memiliki hak akses yang berbeda  - beda. Desain untuk halaman login dan juga tampilan dashboard masing  –  masing  pengguna  akan dijelaskan sebagai berikut.
1) Perancangan halaman login sitem Halaman login sistem  terdiri  dari form yang digunakan  oleh  pengguna  yang  akan login . Pengguna  diharuskan  untuk  mengisikan email dan password yang sudah terdaftar. Pengguna juga dapat login menggunakan  akun  SSO  yang  terhubung dengan  KORI  Unsoed. Single  Sign  On (SSO) merupakan  suatu  system  dimana  pengguna  cukup login satu  kali  dan  kemudian  dapat  mengakses berbagai  jenis  sistem  perangkat  [12].  Perancangan halaman login sistem studi akhir seperti terlihat pada Gambar 3.
Gambar 3. Perancangan halaman login
2) Perancangan halaman dashboard bapendik
Bapendik  merupakan  pengguna  yang  memiliki akses  penuh  untuk  dapat  mengelola  data  di  sistem studi  akhir  yang  meliputi  data  master  (data  –  data yang  digunakan  sebagai  acuan  untuk  melakukan proses pengelolaan data sebuah sistem atau aplikasi), data tugas akhir, data pendadaran dan data yudisium. Perancangan  untuk  halaman dashboard bapendik seperti terlihat pada Gambar 4.
Gambar 4. Perancangan dashboard bapendik
3) Perancangan halaman dashboard ketua jurusan Ketua  jurusan  memiliki  hak  akses  untuk  dapat mengelola  data  tugas  akhir,  data  pendadaran  dan data yudisium mahasiswa di jurusan serta mahasiswa  bimbingannya.  Tugas  utama  ketua jurusan  adalah  untuk  menandatangani  berkas  – berkas studi akhir mahasiswa seperti file SPK, berita acara  seminar,  dan  lain  sebagainya.  Ketua  jurusan juga  dapat  berperan  sebagai  dosen  pembimbing tugas  akhir  dan  dosen  penguji  pendadaran.
Qotrunnada Oktiriani, dkk, Pengembangan Antarmuka Pada Sistem Pengelolaan … 325
Perancangan dashboard ketua jurusan seperti telihat pada Gambar 5.
Gambar 5. Perancangan dashboard ketua jurusan
4) Perancangan halaman dashboard komisi
Komisi  hanya  memiliki  hak  akses  untuk  dapat mengelola  data  tugas  akhir  dan  pendadaran.  Tugas utama  komisi  adalah  untuk  melakukan  verifikasi pengajuan  tugas  akhir  dan  pendadaran  serta menentukan  doses  pembimbing  tugas  akhir  serta dosen  penguji  pendadaran.  Komisi  juga  dapat berperan  sebagi  dosen  pembimbing  tugas  akhir  dan dosen  penguji  pendadaran.  Perancangan  halaman dashboard komisi seperti terlihat pada Gambar 6.
Gambar 6. Perancangan dashboard komisi
5) Perancangan halaman dashboard dosen
Dosen  merupakan  pengguna  yang  berperan sebagai  dosen  pembimbing  tugas  akhir  dan  dosen penguji  pendadaran.  Tugas  utama  dosen  adalah untuk  melakukan  verifikasi  konsultasi  tugas  akhir serta input nilai  tugas  akhir  dan  pendadaran. Perancangan dashboard dosen  seperti  terlihat  pada
Gambar 7.
6) Perancangan halaman dashboard mahasiswa

## Gambar 8. Perancangan dashboard mahasiswa
Gambar  8  merupakan  tampilan dashboard tugas akhir untuk mahasiswa. Proses yang dilakukan mahasiswa  pada  menu  tugas  akhir  ini  meliputi proses  pendaftaran,  konsultasi,  pengajuan  seminar, melihat  nilai  tugas  akhir  serta  menggunggah  berkas distribusi.

## 3.2. Pengembangan (Develop)
Tahap  pengembangan  dalam  penelitian  ini meliputi  proses  pengkodean  atau coding tampilan antarmuka  berdasarkan  perancangan  yang  telah dibuat. Pengkodean antarmuka dibangun menggunakan framework laravel dengan memanfaatkan  fitur blade  templating  engine serta beberapa library javascript untuk membuat tampilan yang  lebih  menarik  serta responsive .  Pengkodean dibuat  dengan  HTML,  CSS,  javascript,  dan  bahasa pemrograman  PHP  serta  menggunakan  Visual Studio Code untuk code editornya, yaitu sebuah text editor  yang  memungkinkan  kita  fokus  pada  proses pengembangan aplikasi dari berbagai macam bahasa pemrograman.
Dalam pengembangan sistem ini juga menggunakan Gitlab sebagai cloud repository untuk memudahkan  pengembang  ( backend dan frontend ) dalam melakukan kolaborasi  serta pengujian. Gitlab adalah  layanan    yang    menyediakan    akses remote ke  Git repositories [13].
326 Jurnal Teknik Informatika (JUTIF) , Vol. 3, No. 2, April 2022, hlm. 321-329
1) Implementasi halaman login sistem Gambar  9  merupakan  implementasi  halaman login sistem studi akhir.
Gambar 9. Implementasi halaman login
Pada  halaman login sistem  memanfaatkan GSAP  untuk  membuat  tampilan  lebih  menarik. GSAP  ( GreenSock  Animation  Platform )  adalah library JavaScript  yang  kuat  yang  memungkinkan pengembang dan desainer front - end untuk  membuat animasi  berbasis  garis  waktu  yang  kuat.  berikut adalah  potongan  kode  untuk  menggunakan  GSAP seperti terlihat pada Gambar 10.
Gambar 10. Potongan kode GSAP
Pengguna juga dapat login menggunakan login SSO  yang  terhubung  dengan  KORI  Unosed sehingga pengguna tidak perlu untuk membuat akun baru.  Berikut  adalah  tampilan  halaman login KORI Unsoed seperti terlihat pada Gambar 11.

## Gambar 11. Tampilan halaman login KORI
Untuk  terhubung  dengan login KORI  pada sistem  ini  menggunakan  CAS Authentication bawaan  laravel.  CAS  ( Central  Authentication Service )  yang  berbasis  CAS Protocol adalah  salah satu  produk  dari  SSO.  CAS  digunakan  untuk menangani masalah komunikasi antara aplikasi yang berbeda.  Dengan  adanya  CAS  pada  SSO  semua aplikasi  yang  ada  pada  Universitas  Jenderal Soedirman dimasukan kedalam sebuah site sehingga terbentuk  sebuah  integrasi  aplikasi  dalam  bentuk web portal [14]. Berikut adalah potongan kode untuk
menghubungkan  ke  dalam  halaman login SSO KORI Unsoed seperti terlihat pada Gambar 12.
Gambar 12. potongan kode menghubungkan ke KORI Unsoed
2) Implementasi halaman dashboard bapendik Gambar  13  merupakan  implementasi  halaman
dashboard bapendik.
Gambar 13. Implementasi dashboard bapendik
Pada halaman beranda, bapendik dapat melihat informasi  seputar  studi  akhir  yang  ditampilkan dalam  bentuk card .  Bapendik  juga  dapat  melihat rekap  data  status  studi  akhir  mahasiswa  di  Fakultas Teknik. 3) Implementasi halaman dashboard ketua jurusan
Gambar  14  merupakan  implementasi  halaman dashboard ketua jurusan.
Gambar 14. Implementasi dashboard ketua jurusan
Sama  seperti  halaman  beranda  bapendik,  pada halaman ini ketua jurusan dapat melihat data seputar studi  akhir  mahasiswa  di  jurusannya.  Ketua  jurusan juga  dapat  melihat  data  dosen  pembimbing  di jurusannya  serta  data  rekap  pelaksanaan  studi  akhir mahasiswa di jurusannya.
4) Implementasi halaman dashboard komisi
Gambar  15  merupakan  implementasi  halaman dashboard komisi.
Gambar 15. Implementasi dashboard komisi
5) Implementasi halaman dashboard dosen
Gambar  16  merupakan  implementasi  halaman dashboard dosen.
Gambar 16. Implementasi dashboard dosen
6) Implementasi halaman dashboard mahasiswa Gambar  17  merupakan  implementasi  halaman
dashboard tugas akhir mahasiswa.
Gambar 17. implementasi dashboard mahasiswa
Pada  halaman  beranda  tugas  akhir  mahasiswa menampilkan  informasi  seputar  data  tugas  akhir mahasiswa  yang  bersangkutan.  Mahasiswa  juga dapat melihat tahapan apa saja yang telah dilakukan sesuai  dengan  status  tugas  akhirnya.  Berikut  adalah potongan  kode  untuk  menampilkan  status  tahapan tugas  akhir  mahasiswa  seperti  terlihat  pada  Gambar 18.
Gambar 18. Potongan kode menampilkan tahapan tugas akhir mahasiwa
3.3. Penerapan (Deploy)
Gambar 19. input alamat IP server
Pada  tahap  ini,  dilakukan  penerapan  sistem secara terus-menerus di lingkungan produksi. Sistem di install ke  dalam  server  Fakultas  Teknik  Unsoed agar dapat diakses secara global dengan memasukkan  alamat  IP  yang  sesuai,  dimana  alamat IP  tersebut  hanya  dapat  diakses  apabila  perangkat yang  digunakan  tersambung  dengan hostpot di server Unsoed. IP address merupakan sebuah alamat berupa  identitas  angka  yang  digunakan  pada  setiap perangkat/komputer  yang  terhubung  ke  dalam jaringan  agar  dapat  saling  berkomunikasi  [15]. Dalam  melakukan  penginstalan  ke  dalam  server digunakan  server  linux  ubuntu  versi  18.04,  Ubuntu adalah  salah  satu  distro  linux  debian  yang  populer saat  ini,    ubuntu  bisa  menjadi  pilihan  karena  selain mudah  digunakan,  ubuntu  juga  adalah  distro  yang stabil,  aman,  cepat,  dan  peirntahnya  cukup  mudah terutama  bagi  pemula  [16].  serta  aplikasi  PuTTY untuk login ke  dalam  server  Unsoed.  PuTTY merupakan  aplikasi remote  server yang  mendukung berbagai  protokol  jaringan  seperti  SSH,  Telnet  dan lain  -  lain.  Aplikasi  ini  digunakan  saat  penulis  akan melakukan  implementasi  dengan  mengambil  file koding  yang  tersimpan  di  github  penulis  ke  dalam
server  domain  dan  menjalankan  beberapa command pada  server  untuk  dapat  menjalankan  sistem  yang dibuat  menggunakan  Framework  Laravel  [17].  SSH adalah protokol jaringanyang memungkinkan pertukaran  data  melalui  saluran  aman  antara  dua perangkat jaringan, terutama banyak digunakan pada sistem  berbasis  linux  [18].  Berikut  adalah  tampilan ketika  memasukkan  alamat  IP  server  menggunakan aplikasi PuTTY seperti telihat pada Gambar 19.
Selanjutnya  akan  tampil  tampilan  terminal dimana kita diharuskan untuk login sebagai root dan memasukkan password yang  sesuai.  Berikut  adalah tampilan login ke  dalam  server  seperti  terlihat  pada Gambar 20.
Gambar 20. login ke server Unsoed
Jika berhasil login maka selanjutnya kita dapat melakukan  installasi  sistem  dan  konfigurasi  sistem di dalam server Unsoed.

## 4. KESIMPULAN
Berdasarkan  penelitian  yang  telah  dilakukan, dapat  disimpulkan  bahwa  sistem  pengelolaan  studi akhir  ini  dapat  digunakan  untuk  mengelola  proses studi akhir di Fakultas Teknik Unsoed yang meliputi tugas  akhir,  pendadaran  dan  yudisium.  Tampilan sistem  pengelolaan  studi  akhir  sudah  disesuaikan dengan  kebutuhan  masing  –  masing  pengguna  yang di dapatkan dari hasil diskusi dan wawancara dengan user serta  dapat  diakses  pada  server  Universitas Jenderal  Soedirman  dengan  mengakses  alamat  IP 10.96.7.151  pada web  browser dan  harus  terhubung dengan hostpot Universitas Jenderal Soedirman.
Saran  –  saran  yang  di  dapatkan  selama penelitian  antara  lain  terdapat  notifikasi  apabila terdapat  SPK  mahasiswa  bimbingan  dosen  yang akan  habis  masa  berlakunya  supaya  mempermudah dosen untuk memantau SPK mahasiswa bimbingannya,  merapihkan  tampilan form sesuai dengan  panjang  karakter  yang  dibutuhkan  agar tampilannya  tidak  monoton  dan  penambahan  hak akses untuk pengguna wakil dekan bidang akademik

## DAFTAR PUSTAKA
[1] H.M.  Jogiyanto, Analisa  dan  Desain  Sistem Informasi:  Pendekatan  Terstruktur  Teori dan  Praktik  Aplikasi  Bisnis .  Yogyakarta: ANDI, 2005.
[2] R.  Prasetyo,  I.  Iftadi,  and  T.  Rochman, “Perancangan Sistem Informasi Tugas Akhir
dan Kerja Praktek di Jurusan Teknik Industri
UNS,” Performa ,  vol.  9,  no.  1,  pp.  55–63, 2010. [3] C. Chastro and E. Darmawan,
“Perbandingan  Pengembangan  Front  End Menggunakan Blade Template dan Vue Js,”
J.  Strateg.  Maranatha ,  vol.  2,  no.  2,  pp. 302–313, 2020.
[4] O.  D.  Yohanes,  A.  Ambarwati,  and  C.
Darujati,  “Pengembangan  Antarmuka  Dan Pengalaman Pengguna Aplikasi Ujian Online Menggunakan Metode Goal-Directed Design,” JOINTECS  (Journal  Inf.  Technol. Comput. Sci. , vol. 6, no. 1, p. 55, 2021, doi: 10.31328/jointecs.v6i1.2153. [5]
J.  Teknologi,  “TEMATIK  -  Jurnal
Teknologi  Informasi  Dan  Komunikasi  Vol. 7, No. 2 Desember 2020,” vol. 7, no. 2, pp. 140–146, 2020. [6] A.  Y.  F.  Bugaresa,  “Monitoring  dan Controlling  Pemberian  Nutrisi  Sayuran Pakcoy  Hidroponik  dengan  Raspberry  Pi Berbasis Web,” Universitas Jenderal Soedirman, 2020. [7] N. K. Sumiari, N. Ketut, D. Ari, N. Luh, and
E. Sukreni, “Sistem Informasi Kerja Praktek Mahasiswa  STMIK  STIKOM  Bali  Berbasis Web,” Konf.  Nas.  Sist.  Inform.  2017 ,  no. February, pp. 390–395, 2017.
[8] F.  Amazon,  W.  Widiatry,  and  V.  H. Pranatawijaya,  “Rancang  Bangun  Sistem
Informasi  Akademik  Fakultas  Matematika Dan  Ilmu  Pengetahuan  Alam  Berbasis
Website,” J. Inf. Technol. Comput. Sci. , vol.
1, no. 1, pp. 20–28, 2021, doi: 10.47111/jointecoms.v1i1.2511.
[9] T. Tohirin, S. F. Utami, S. R. Widianto, and W.  Al  Mauludyansah,  “Implementasi DevOps  Pada  Pengembangan  Aplikasi  e-
Skrining  Covid-19,” Multinetics ,  vol.  6,  no. 1, pp. 15–20, 2020, doi: 10.32722/multinetics.v6i1.2764. [10] J. Panjaitan and A. F. Pakpahan, “Perancangan Sistem E-Reporting Menggunakan  ReactJS  dan  Firebase,” J. Tek. Inform.  dan  Sist.  Inf. ,  vol.  7,  no.  1,  pp. 20–34, 2021, doi: 10.28932/jutisi.v7i1.3098.
[11] I.  G.  Ardikayana,  A.  Mailangkay,  and  I. Pendahuluan,  “SNAP  _  2021  _  FULL
PAPER _ 43 Perancangan Aplikasi Pendidikan Lingkungan Dan Budaya Jakarta Menggunakan UI dan UX Untuk Anak Usia
5-13 Tahun,” pp. 190–199, 2020.
[12] N.  Susanto,  S.  W.  Pramono,  and  D.  R. Adelia, “EVALUASI USER EXPERIENCE SSO UNDIP MENU SIAP BERDASARKAN PERSEPSI MAHASISWA TEKNIK INDUSTRI
MENGGUNAKAN  USER  EXPERIENCE QUESTIONNAIRE ( UEQ ),” vol. 17, no. 1, pp. 30–39, 2022.
[13] A.  Febrianto  and  R.  Franita,  “Penggunaan Library  Fast  Android  Networking  Untuk Membangun  Fitur  Register  Pada  Proyek
Lotus  (Studi  Kasus:  PT.  Agung  Trans
Solusindo),” J.  Cendikia ,  vol.  20,  no.  1,  pp. 439–445, 2020.
[14] Gilang Ramadhan, “ANALISIS TEKNOLOGI  SINGLE  SIGN  ON  (SSO) DENGAN PENERAPAN CENTRAL AUTHENTICATION SERVICE (CAS)
PADA  UNIVERSITAS  BINA  DARMA.”
2012.
[15] U.  U.  Indonesia et  al. ,  “Analisa  Dan Perancangan  Public  Cloud  Storage  Dengan Memanfaatkan  Fitur  Forwarding  Network
Address  Translation  Melalui  Virtual  Private Network  Server  Menggunakan  Mikrotik
Public  Cloud  Storage  Analysis  and  Design By  Using  the  Forwarding  Network  Address
Tran,” vol. 7, no. 2, pp. 56–67, 2021.
[16] A.  Indrus,  “Perancangan  Web  Filter Berbasis  Ubuntu  20.04  pada  PT.  Exhibition Network Indonesia,” J. Sist. dan Teknol. Inf. Indones. ,  vol.  1  no  1,  pp.  52–61,  2021, [Online].
Available:
http://journal.unj.ac.id/unj/index.php/SINTE
SIA/article/view/21266.
[17] S.  A.  Aklani  and  D.  Lim,  “Perancangan Sistem  Pencatatan  dan  Laporan  Keuangan Berbasis Web pada CV Chalista Engineering Batam,” Conf.  Business,  Soc.  Sci.  Technol. , vol.  1,  no.  1,  pp.  117–124,  2021,  [Online]. Available: https://journal.uib.ac.id/index.php/concept/ar ticle/view/4928.
[18] R. Wiryadinata, “Rancang Bangun
Keamanan  Port  Secure  Shell  (  SSH  ) Menggunakan  Metode  Port  Knocking,”  vol. 5, no. 1, pp. 28–33, 2022