PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

15
i LAPORAN SKIRPSI PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN FRAMEWORK CODEIGNITER PADA SISTEM LAYANAN MANDIRI MASYARAKAT (Studi Kasus : Desa Rejoagung Trangkil Pati) Disusun Oleh : MOH. AHSIN MUZAQI NIM. 201551101 DOSEN PEMBIMBING : Endang Supriyanti, S.Kom , M.Kom Ratih Nindyasari, S.Kom, M.Kom PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS TEKNIK UNIVERSITAS MURIA KUDUS KUDUS 2019

Transcript of PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

Page 1: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

i

LAPORAN SKIRPSI

PENERAPAN MODEL VIEW CONTROLLER

(MVC) DENGAN FRAMEWORK CODEIGNITER

PADA SISTEM LAYANAN MANDIRI

MASYARAKAT (Studi Kasus : Desa Rejoagung Trangkil Pati)

Disusun Oleh :

MOH. AHSIN MUZAQI

NIM. 201551101

DOSEN PEMBIMBING :

Endang Supriyanti, S.Kom , M.Kom

Ratih Nindyasari, S.Kom, M.Kom

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNIK

UNIVERSITAS MURIA KUDUS

KUDUS 2019

Page 2: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

ii

HALAMAN PERSETUJUAN

PENERAPAN MODEL VIEW CONTROLLER (MVC)

DENGAN FRAMEWORK CODEIGNITER PADA SISTEM

LAYANAN MANDIRI MASYARAKAT

(Studi Kasus : Desa Rejoagung Trangkil Pati)

MOH. AHSIN MUZAQI

NIM. 201551101

Kudus, 17 Juli 2019

Menyetujui,

Pembimbing Utama Pembimbing Pendamping

Endang Supriyanti, S.Kom, M.Kom Ratih Nindyasari, S.Kom, M.Kom

NIDN. 0629077402 NIDN. 0625028501

Mengetahui

Koordinator Skripsi

Esti Wijayanti, S.Kom, M.Kom

NIDN. 060509890

Page 3: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

iii

HALAMAN PENGESAHAN

PENERAPAN MODEL VIEW CONTROLLER (MVC)

DENGAN FRAMEWORK CODEIGNITER PADA SISTEM

LAYANAN MANDIRI MASYARAKAT

(Studi Kasus : Desa Rejoagung Trangkil Pati)

MOH. AHSIN MUZAQI

NIM. 201551101

Kudus, 15 Agustus 2019

Ketua Penguji,

Muhammad Imam Ghozali,S.kom.,M.kom

NIDN.0618058602

Anggota Penguji I,

Ahmad Jazuli, S.Kom,M.Kom

NIDN.0406107004

Anggota Penguji II,

Wibowo Harry Sugiharto,S.kom.,M.kom

NIDN.0619059101

Mengetahui ,

Pembimbing Utama

Endang Supriyanti , S.Kom ,M.Kom

NIDN.0629077402

Pembimbing Pendamping

Ratih Nindyasari , S.Kom,M.Kom

NIDN.0625028501

Dekan Fakultas Teknik

Moh.Dahlan,S.T.,M.T

NIDN.0601076901

Ketua Program Studi

Teknik Infromatika

Ahmad Jazuli , S.Kom,M.Kom

NIDN.0406107004

Page 4: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

iv

PERNYATAAN KEASLIAN

Saya yang bertanda tangan dibawah ini :

Nama : Moh. Ahsin Muzaqi

NIM : 201551101

Tempat & Tanggal Lahir : Pati, 02 Oktober 1996

Judul Skripsi : Penerapan Model View Controller (MVC) Dengan

Framework Codeigniter Pada Sistem Layanan

Mandiri Masyarakat (Studi Kasus:Desa

Rejoagung Trangkil Pati)

Menyatakan dengan sebenarnya bahwa penulisan Skripsi ini bedasarkan

hasil penelitian, pemikiran dan pemaparan asli dari saya sendiri, baik untuk

naskah , laporan maupun kegiatan lain yang tercantum sebagai bagian dari skripsi

ini. Seluruh ide, pendatap, atau materi dari sumber lain telah dikutip dalam

Skripsi dengan cara penulisan referensi yang sesuai.

Demikian pernyataan ini saya buat dengan sesungguhnya dan apabila dikemudian

hari terdapat penyimpangan dan ketidakbenaran dalam pernyataan ini, maka saya

bersedia menerima sanksi akademik berupa pencabutan gelar dan sanksi

lain sesuai dengan peraturan yang berlaku di Universitas Muria Kudus.

Demikian Pernyataan ini saya buat dalam keadaan sadar tanpa paksaan dari pihak

manapun.

Kudus, 17 Juli 2019

Yang memberi pernyataan,

Moh. Ahsin Muzaqi

Page 5: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

v

PENERAPAN MODEL VIEW CONTROLLER (MVC)

DENGAN FRAMEWORK CODEIGNITER PADA SISTEM

LAYANAN MANDIRI MASYARAKAT

(Studi Kasus : Desa Rejoagung Trangkil Pati)

Nama : Moh.Ahsin Muzaqi

NIM : 2015-51-101

Pembimbing :

1. Endang Supriyanti, S.Kom, M.Kom

2. Ratih Nindyasari, S.Kom, M.Kom

RINGKASAN

Pelayanan masyarakat di desa seringkali masih di lakukan secara

konvensional dan tidak berjalan sebagaimana semestinya , ketika

masyarakat mengurus surat , layanan yang di berikan tidak sesuai harapan

dan tidak paham alur untuk pengurusannya.Selain itu juga belum ada

wadah dalam layanan menyampaikan pendapat , aduan , ataupun hal

lainnya secara cepat.

Pada penelitian ini akan membuat Sistem Informasi Layanan

Mandiri masyarakat yang akan di gunakan oleh perangkat desa dan

masyarakat dalam mempermudah proses layanan kepada masyarakat yang

mengajukan surat maupun layanan menyampaikan aduan. Dengan adanya

aplikasi ini di harapkan proses pengajuan surat berjalan secara cepat dan

efesien , serta mempermudah masyarkat dalam menyampaikan aspirasi

dan aduan kepada pihak desa.Aplikasi ini di bangun dengan framework

Codeigniter yang menerapakan model view controller (MVC) dalam

pembuatannya dan perancangan sistem menggunakan UML (Unified

Modeling Language).

Kata Kunci : Sistem Informasi, Layanan Mandiri , Framework

Codeigniter, MVC , UML

Page 6: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

vi

APPLICATION OF MODEL VIEW CONTROLLER (MVC) WITH

CODEIGNITER FRAMEWORK ON INDEPENDENT COMMUNITY

SERVICE SYSTEM

(Studi Kasus : Desa Rejoagung Trangkil Pati)

Nama : Moh.Ahsin Muzaqi

NIM : 2015-51-101

Pembimbing :

1. Endang Supriyanti, S.Kom, M.Kom

2. Ratih Nindyasari, S.Kom, M.Kom

ABSTRACK

Community service in the village is often still done conventionally

and does not work as it should, when the community takes care of the

letter, the services provided are not as expected and do not understand the

flow for management. In addition there is also no place in the service to

express opinions, complaints or matters. others quickly.

Pada penelitian ini akan membuat Sistem Informasi Layanan In

this study, a community self-service information system that will be used

by village officials and the community will be made to facilitate the service

process for the people who submit letters and provide complaints. With

this application, it is expected that the letter submission process will run

quickly and efficiently, and make it easier for the community to convey

aspirations and complaints to the village. This application is built with a

CodeIgniter framework that applies the model view controller (MVC) in

the design and system design using UML ( Unified Modeling Language).

Keyword: Sistem Informasi, Layanan Mandiri , Framework

Codeigniter, MVC , UML

Page 7: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

vii

KATA PENGANTAR

Dengan memanjatkan puji syukur kehadirat Allah SWT yang telah melimpahkan

rahmat dan kasih sayang-Nya sehingga pada kesempatan kali ini penulis dapat

menyelesaikan Laporan Skripsi yang berjudul “Penerapan Model View Controller

(MVC) Dengan Framework CodeIgniter Pada Sistem Layanan Masyarakat(Studi

Kasus : Desa Rejoagung Trangkil Pati)”.Dengan bantuan, bimbingan, dan

dorongan dari berbagai pihak, maka terselesailah skripsi ini. Tidak lupa penulis

mengucapkan terima kasih kepada :

1. Bapak Dr.Suparnyo, SH.MS, selaku Rektor Universitas Muria Kudus.

2. Bapak Mohammad Dahlan, ST.MT, selaku Dekan Fakultas Teknik

Universitas Muria Kudus.

3. Bapak Ahmad Jazuli,S.Kom, M.Kom selaku Kepala Program Studi Teknik

Informatika Fakultas Teknik Universitas Muria Kudus dan pembimbing

utama skripsi yang telah banyak memberikan bimbingan, arahan serta

dukungan hingga terselesaikannya penulisan skripsi ini.

4. Ibu Endang Supriyanti, S.Kom, M.Kom selaku pembimbing utama dan Ibu

Ratih Nindyasari, S.Kom,M.Kom selaku pembimbing pendamping skripsi

yang telah banyak memberikan bimbingan, arahan serta dukungan hingga

terselesaikannya penulisan skripsi ini.

5. Kedua orang tua yang selalu mendo’akan, memberi semangat dan

dukungan kepada penulis sehingga terselesainya skripsi ini.

6. Semua pihak yang tidak dapat penulis sebutkan satu persatu, yang telah

membantu hingga terselesaikannya skripsi ini.

Penulis menyadari adanya kekurangan dalam penulisan skripsi ini, oleh karena

itu penulis menerima kritik dan saran dari pembaca sehingga penulis berharap

agar nantinya skripsi ini dapat dikembangkan serta bisa lebih bermanfaat.

Kudus, Juli 2019

Moh. Ahsin Muzaqi

Page 8: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

viii

DAFTAR ISI

HALAMAN JUDUL .............................................................................................. i

HALAMAN PERSETUJUAN ............................................................................. ii

HALAMAN PENGESAHAN .............................................................................. iii

PERNYATAAN KEASLIAN .............................................................................. iv

RINGKASAN ........................................................................................................ v

ABSTRACK ......................................................................................................... vi

KATA PENGANTAR ......................................................................................... vii

DAFTAR ISI ....................................................................................................... viii

DAFTAR TABEL ................................................................................................. x

DAFTAR GAMBAR ........................................................................................... xii

DAFTAR LAMPIRAN ....................................................................................... xv

BAB I PENDAHULUAN ..................................................................................... 1

1.1. Latar Belakang ............................................................................................. 1

1.2.Perumusan Masalah ...................................................................................... 2

1.3.Batasan Masalah............................................................................................ 2

1.4.Tujuan ........................................................................................................... 2

1.5.Manfaat ......................................................................................................... 2

BAB II TINJAUAN PUSTAKA ........................................................................... 5

2.1.Penelitian Terkait .......................................................................................... 5

2.2.Landasan Teori .............................................................................................. 8

2.2.1.Penjelasan Pelayanan Desa ........................................................................ 8

2.2.2. Penjelasan Framework CodeIgniter .......................................................... 8

2.2.3 Model View Controller .............................................................................. 9

Page 9: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

ix

2.2.4 Penjelasan Bootstrap .................................................................................. 9

2.2.5 Penjelasan Sublim Text ..................................................................... 10

2.2.6 Penjelasan Dasar CSS ........................................................................ 10

2.2.7 Penjelasan UML ................................................................................ 11

2.2.8 Penjelasan Black-Box Testing ........................................................... 17

2.2.9 User acceptance testing ...................................................................... 18

2.3 Kerangka Pemikiran ................................................................................ 19

BAB III METODOLOGI PENELITIAN ......................................................... 21

3.1.Object Peneitian .......................................................................................... 21

3.2.Metode Pengumpulan Data ......................................................................... 21

3.3.Metode Pengembangan Sistem ................................................................... 22

3.4.Analisa Sistem ............................................................................................. 22

3.4.1 Analisa Kebutuhan ................................................................................... 22

3.4.2 Analisa Perancangan Sistem .................................................................... 23

3.4.3 Desain Input dan Output .......................................................................... 53

BAB IV HASIL ANALISIS DAN PEMBAHASAN ......................................... 61

4.1.Hasil Pembahasan ...................................................................................... 61

4.2.Pengujian Perangkat Lunak......................................................................... 69

BAB V PENUTUP ............................................................................................... 89

DAFTAR PUSTAKA .......................................................................................... 90

Page 10: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

x

DAFTAR TABEL

Tabel 2. 1.Tabel Perbandingan................................................................................ 7

Tabel 2. 2. Notasi Use Case .................................................................................. 12

Tabel 2. 3. Notasi Class Diagram.......................................................................... 14

Tabel 2. 4. Notasi Sequence Diagram ................................................................... 15

Tabel 2. 5.Notasi Activity Diagram ...................................................................... 17

Tabel 3. 1. Skenario Input Aduan ................................................................... ….27

Tabel 3. 2. Skenario Usecase Konfirmasi Aduan ................................................. 27

Tabel 3. 3. Skenario Usecase Kelola Proses Aduan.............................................. 28

Tabel 3. 4. Skenario Usecase Input Permohonan Surat ........................................ 29

Tabel 3. 5. Skenario Usecase Cetak Data Permohonan Surat ............................... 30

Tabel 3. 6. Skenario Usecase Input Berita ............................................................ 30

Tabel 3. 7. Skenario Usecase Konfirmasi Berita .................................................. 31

Tabel 4. 1. Potongan program auth/ login ........................................................ ….69

Tabel 4. 2. Hasil Pengujian white box testing auth/ login .................................... 70

Tabel 4. 3. Potongan program user ....................................................................... 70

Tabel 4. 4. Hasil Pengujian white box testing user ............................................... 71

Tabel 4. 5. Potongan program user/aduan ............................................................. 72

Tabel 4. 6 . Hasil Pengujian white box testing user/aduan ................................... 73

Tabel 4. 7. Potongan program user/permohonan_surat ........................................ 75

Tabel 4. 8 . Hasil Pengujian white box testing user/permohonan_surat ............... 76

Tabel 4. 9. Potongan program user/berita ............................................................. 77

Tabel 4. 10 . Hasil Pengujian white box testing user/berita .................................. 79

Tabel 4. 11. Hasil Pengujian black box testing fitur registrasi ............................. 80

Page 11: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

xi

Tabel 4. 12. Hasil Pengujian black box testing fitur Login .................................. 81

Tabel 4. 13. Hasil Pengujian black box testing fitur Halaman Utama .................. 82

Tabel 4. 14. Hasil Pengujian black box testing fitur Form Pengaduan ................. 83

Tabel 4. 15. Hasil Pengujian black box testing fitur Form Permohonan Surat .... 84

Tabel 4. 16. Hasil Pengujian black box testing fitur Form Berita ......................... 85

Tabel 4. 17. Hasil Pengujian black box testing fitur konfirmasi aduan ................ 85

Tabel 4. 18. Hasil Pengujian black box testing fitur verifikasi surat .................... 86

Tabel 4. 19. Hasil Pengujian black box testing fitur konfirmasi berita ................. 87

Page 12: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

xii

DAFTAR GAMBAR

Gambar 2. 1.Contoh Use Case (Kendall & Kendal1,2011) .................................. 12

Gambar 2. 2.Contoh Class Diagram (Kendall & Kendall, 2011) ......................... 14

Gambar 2. 3.contoh sequence diagram (Kendall & Kendall, 2011) .................... 15

Gambar 2. 4. Kerangka Pemikiran ........................................................................ 19

Gambar 3. 1. System Use Case ........................................................................ ….26

Gambar 3. 2. Class User ........................................................................................ 32

Gambar 3. 3. Class Role ........................................................................................ 32

Gambar 3. 4. Class Jenis Aduan............................................................................ 33

Gambar 3. 5. Class RT .......................................................................................... 33

Gambar 3. 6. Class RW ......................................................................................... 34

Gambar 3. 7. Class Pengaduan .............................................................................. 34

Gambar 3. 8. Class Surat ....................................................................................... 35

Gambar 3. 9. Class Permohonan Surat.................................................................. 35

Gambar 3. 10. Class Pdk ....................................................................................... 36

Gambar 3. 11. Class Berita ................................................................................... 36

Gambar 3. 12. Class Diagram ............................................................................... 37

Gambar 3. 13. Sequence Diagram Login-Registrasi ............................................. 38

Gambar 3. 14. Sequence Diagram Aduan ............................................................. 39

Gambar 3. 15. Sequence Diagram Permohonan Surat .......................................... 40

Gambar 3. 16. Sequence Diagram Berita .............................................................. 41

Gambar 3. 17. Activity Diagram Registrasi .......................................................... 42

Gambar 3. 18. Activity Diagram Login ................................................................ 43

Gambar 3. 19. Activity Diagram Aduan ............................................................... 44

Page 13: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

xiii

Gambar 3. 20. Activity Diagram Konfirmasi Aduan ............................................ 45

Gambar 3. 21. Activity Diagram Proses Aduan Selesai ....................................... 46

Gambar 3. 22. Activity Diagram Permohonan Surat ............................................ 47

Gambar 3. 23. Activity Diagram cetak permohonan surat.................................... 48

Gambar 3. 24. Activity Diagram input berita ....................................................... 49

Gambar 3. 25. Method Pendaftaran User .............................................................. 50

Gambar 3. 26. Method User Login ....................................................................... 50

Gambar 3. 27. Method Input Aduan ..................................................................... 50

Gambar 3. 28. Method Konfirmasi Aduan............................................................ 51

Gambar 3. 29. Method Konfirmasi Aduan Selesai ............................................... 51

Gambar 3. 30. Method Lihat Statusi Aduan ......................................................... 51

Gambar 3. 31. Method Input Permohonan Surat .................................................. 52

Gambar 3. 32. Method Verifikasi Surat ................................................................ 52

Gambar 3. 33. Method Input Berita ...................................................................... 52

Gambar 3. 34. Desain Halaman utama.................................................................. 53

Gambar 3. 35. Desain Registrasi Member – Form registrasi member .................. 54

Gambar 3. 36. Desain login– Form login member................................................ 54

Gambar 3. 37. Desain halaman aduan– Form halaman aduan .............................. 55

Gambar 3. 38. Desain input aduan– Form input aduan......................................... 55

Gambar 3. 39. Desain input surat– Form input surat ............................................ 56

Gambar 3. 40. Desain input berita– Form input berita ......................................... 56

Gambar 3. 41. Desain Halaman Profil Saya– Form Profil Saya ........................... 57

Gambar 3. 42. Desain Status Aduan Saya– Form Status Aduan .......................... 57

Gambar 3. 43. Desain halaman Surat Saya– Form Download Surat Saya .......... 58

Gambar 3. 44. Desain halaman Dashboard Pihak Desa ........................................ 58

Page 14: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

xiv

Gambar 3. 45. Desain halaman Konfirmsi Aduan ................................................ 59

Gambar 3. 46. Desain halaman Verifikasi Surat ................................................... 59

Gambar 4. 1. User– Registrasi ......................................................................... ….61

Gambar 4. 2. User– Login ..................................................................................... 61

Gambar 4. 3. Masyarakat(user)– Halaman Utama Sistem .................................... 62

Gambar 4. 4. Masyarakat(user)– Halaman Utama Sistem Setelah Login............. 62

Gambar 4. 5. Masyarakat(user)– Halaman Layanan Aduan ................................. 63

Gambar 4. 6. .Masyarakat(user)– Halaman Layanan Input Aduan ....................... 63

Gambar 4. 7. Masyarakat(user)– Halaman Layanan Input Permohonan Surat..... 64

Gambar 4. 8. Masyarakat(user)– Halaman Layanan Input Berita ........................ 65

Gambar 4. 9. Masyarakat(user)– Halaman Profile Saya ....................................... 65

Gambar 4. 10. Masyarakat(user)– Halaman Status Aduan Saya .......................... 66

Gambar 4. 11. Masyarakat(user)– Halaman Surat Saya ....................................... 66

Gambar 4. 12. Pihak Desa– Halaman Konfirmasi Aduan .................................... 67

Gambar 4. 13. Pihak Desa– Halaman Dashborad ................................................ 67

Gambar 4. 14. Pihak Desa– Halaman Verifikasi Surat ......................................... 68

Gambar 4. 15. Ketua RT– Halaman Proses Aduan .............................................. 68

Gambar 4. 16 . Flowgraf auth/ login ..................................................................... 69

Gambar 4. 17. Flowgraf user................................................................................. 71

Gambar 4. 18 . Flowgraf user/aduan ..................................................................... 73

Gambar 4. 19 . Flowgraf user/permohonan_surat ................................................. 76

Gambar 4. 20 . Flowgraf user/berita ..................................................................... 78

Page 15: PENERAPAN MODEL VIEW CONTROLLER (MVC) DENGAN …

xv

DAFTAR LAMPIRAN

Lampiran 1. Surat Balasan Penelitian ................................................................... 92

Lampiran 2. Format Surat ..................................................................................... 93

Lampiran 3. Buku Konsultasi ............................................................................... 94

Lampiran 4. Revisi Sidang .................................................................................... 94