RANCANG BANGUN SISTEM PENGADUAN MASYARAKAT BNNK TANJUNGPINANG BERBASIS WEB
LAPORAN KERJA PRAKTIK
Oleh : Jupri 2001020015 Muhamad Fadli 2001020049
PROGRAM STUDI TEKNIK INFORMATIKA
FAKULTAS TEKNIK DAN TEKNOLOGI KEMARITIMAN UNIVERSITAS MARITIM RAJA ALI HAJI
TANJUNGPINANG 2023
i
LEMBARAN PENGESAHAN
RANCANG BANGUN SISTEM PENGADUAN MASYARAKAT BNNK TANJUNGPINANG BERBASIS WEB
LAPORAN KERJA PRAKTIK
Oleh : Jupri 2001020015 Muhamad Fadli 2001020049
Tanjungpinang, 13 November 2023
Menyetujui,
Dosen Pembimbing Kerja Praktik
Nurfalinda, S.T., M.Cs.
NIDN. 0021018401
Mengetahui,
Ketua Prodi Teknik Informatika Fakultas Teknik dan Teknologi Kemaritiman
Universitas Maritim Raja Ali Haji
Muhamad Radzi Rathomi, S.Kom., M.Cs.
NIP. 198903252019031014
ii
LEMBAR PENGESAHAN INSTANSI
RANCANG BANGUN SISTEM PENGADUAN MASYARAKAT BNNK TANJUNGPINANG BERBASIS WEB
LAPORAN KERJA PRAKTIK
Oleh:
Jupri 2001020015 Muhamad Fadli 2001020049
Tanjungpinang, 12 November 2023 Menyetujui,
Pembimbing Lapangan,
Maylisa Indra Wahyuni, S.Kep NIP. 198109521 2008003 2 003
Mengetahui,
Kepala BNN Kota Tanjungpinang
Kombes Pol Heryanto, S.E.
NRP. 75111021
iii
KATA PENGANTAR
Puji syukur penulis panjatkan kehadirat Allah SWT, atas berkat rahmat dan karunia-Nya penulis dapat menyelesaikan Laporan Kerja Praktik yang berjudul “ RANCANG BANGUN SISTEM PENGADUAN MASYARAKAT BNNK TANJUNGPINANG BERBASIS WEB” tepat pada waktunya.
Laporan Kerja Praktik ini disusun berdasarkan apa yang telah penulis lakukan di Kantor BNN Kota Tanjungpinang yang beralamatkan di JL. Daeng Kemboja Sengaarang Kec. Tj. Pinang Kota, Kota Tanjungpinang, Kepulauan Riau 29115.
Pelaksanaan Kerja Praktik dimulai dari tanggal 14 Agustus s/d 13 September 2023. Tugas penyusunan Laporan Kerja Praktik ini adalah upaya untuk menyelesaikan Mata Kuliah Kerja Praktik pada Jurusan Teknik Informatika, Fakultas Teknik, Universitas Maritim Raja Ali Haji. Dengan menyelesaikan Laporan Kerja Praktik ini, tidak terlepas dari bimbingan, pengarahan, serta dukungan yang diberikan dari berbagai pihak. Oleh karena itu, tidak lupa penulis ucapkan terimakasih yang sebesar besarnya kepada:
1. Allah SWT yang memberikan kekuatan dan rahmat yang penuh kepada penulis sehingga mampu menyelesaikan laporan ini.
2. Bapak Muhamad Radzi Rathomi, S.Kom., M.Cs. selaku Ketua Program Studi Teknik Informatika.
3. Ibu Nurfalinda, S.T., M.Cs. selaku dosen pembimbing yang telah memberikan dukungan, bimbingan dan saran kepada penulis terhadap pelaksanaan Kerja Praktik.
4. Rekan-rekan Mahasiswa Angkatan 2020 Teknik Informatika, Fakultas Teknik, Universitas Maritim Raja Ali Haji.
Dengan demikian, penulis dapat menyelesaikan Laporan Kerja Praktik dengan baik dan berharap dapat bermanfaat bagi semua pihak. Penulis menyadari adanya kekurangan serta keterbatasan ilmu pengetahuan dalam menyelesaikan Laporan Kerja Praktik. Maka dari itu penulis sangat mengharapkan kritik serta saran yang membangun untuk lebih baik di masa yang akan datang.
Tanjungpinang, 12 November 2023
Penulis
iv DAFTAR ISI
KATA PENGANTAR ... iii
DAFTAR ISI ... iv
DAFTAR GAMBAR ... vii
DAFTAR TABEL ... x
BAB I. PENDAHULUAN ... 1
1.1. Latar Belakang... 1
1.2. Rumusan Masalah ... 2
1.3. Batasan Masalah ... 2
1.4. Tujuan ... 3
1.5. Manfaat ... 3
1.6. Tempat dan Waktu Kerja Praktik ... 3
1.7. Sistematika Penyusunan ... 3
BAB II. PROFIL PERUSAHAAN/INSTITUSI ... 5
2.1. Sejarah Kantor BNN Kota Tanjungpinang... 5
2.2. Tugas Pokok ... 6
2.3. Fungsi ... 7
2.4. Struktur Organisasi ... 9
BAB III. LANDASAN TEORI ... 10
3.1. Sistem Informasi ... 10
3.2. Pengaduan Pelayan Publik ... 12
3.3. Website ... 12
3.4. Xampp ... 13
3.5. Visual Studio Code ... 14
3.6. Bootsrap ... 15
3.7.Codeigniter ... 16
3.8. Diagram.net ... 17
3.9. HTML ... 18
3.10. CSS ... 19
3.11. Java Script ... 19
v
3.12. PHP ... 20
3.13. UML ... 21
3.14. Class Diagram ... 22
BAB IV. DESKRIPSI SISTEM ... 23
4.1 Deskripsi Sistem ... 23
4.2 Spesifikasi Perancang Sistem ... 24
4.3 Perancangan Sistem ... 25
4.3.1 Perancangan Basis Data ... 25
4.3.2 Perancangan Alur Sistem ... 30
4.3.3 Perancangan Antar Muka... 66
BAB V. PEMBAHASAN ... 94
5.1 User Interface ... 94
5.1.1 Login Masyarakat ... 94
5.2.2 Register Masyarakat ... 95
5.2.3 Pengaduan ... 96
5.2.4 Profile Masyarakat ... 97
5.2.5 Change Password Masyarakat... 98
5.2.6 Detail Pengaduan ... 98
5.2.7 Edit Pengaduan ... 99
5.2.8 Login Petugas ... 100
5.2.9 Dashboard Petugas ... 101
5.2.10 Profile Petugas ... 102
5.2.11 Change Password Petugas ... 102
5.2.12 Pengaduan Masuk ... 103
5.2.13 Tanggapan ... 104
5.2.14 Pengaduan Diproses ... 105
5.2.15 Pengaduan Ditolak ... 105
5.2.16 Pengaduan Selesai... 106
5.2.17 Tambah Petugas ... 106
5.2.18 Edit Petugas ... 107
5.2.19 Generate Laporan ... 108
BAB VI. PENUTUP ... 109
6.1 Kesimpulan ... 109
6.2. Saran ... 109
vi
DAFTAR PUSTAKA ... 111 LAMPIRAN ... 114
vii
DAFTAR GAMBAR
Gambar 2.1 Struktur Organisasi...9
Gambar 4. 1 Class Diagram ... 26
Gambar 4. 2 Flowchart Sign-Up Masyarakat ... 31
Gambar 4. 3 Flowchart Sign-In Masyarakat ... 32
Gambar 4. 4 Flowchart Logout ... 33
Gambar 4. 5 Flowchart Sign-In Petugas ... 34
Gambar 4. 6 Flowchart Change Password ... 35
Gambar 4. 7 Flowchart Generate Laporan-Masyarakat ... 36
Gambar 4. 8 Flowchart Tambah Petugas ... 37
Gambar 4. 9 Flowchart Delete Petugas ... 38
Gambar 4. 10 Flowchart Edit Petugas ... 39
Gambar 4. 11 Flowchart Buat Pengaduan ... 41
Gambar 4. 12 Flowchart Pengaduan Masuk ... 42
Gambar 4. 13 Flowchart Pengaduan Selesai ... 43
Gambar 4. 14 Flowchart Detail Pengaduan ... 44
Gambar 4. 15 Flowchart Pengaduan Batal ... 45
Gambar 4. 16 Flowchart Edit Pengaduan ... 47
Gambar 4. 17 Use Case Diagram ... 49
Gambar 4. 18 Activity Diagram Sign-In ... 50
Gambar 4. 19 Activity Diagram Sign-Up ... 51
Gambar 4. 20 Activity Diagram Pengaduan ... 52
Gambar 4. 21 Activity Diagram Detail Pengaduan ... 53
Gambar 4. 22 Activity Diagram Edit Pengaduan ... 54
Gambar 4. 23 Activity Diagram Hapus Pengaduan ... 54
Gambar 4. 24 Activity Diagram Change Password... 56
Gambar 4. 25 Activity Diagram Sign-In Petugas ... 57
Gambar 4. 26 Activity Diagram Change Password Petugas ... 57
Gambar 4. 27 Activity Diagram Pengaduan Masuk ... 58
Gambar 4. 28 Activity Diagram Pengaduan Selesai ... 59
Gambar 4. 29 Activity Diagram Tambah Petugas ... 59
Gambar 4. 30 SequenceSign-Up Masyarakat ... 61
Gambar 4. 31 Sequence Sign-In Masyarakat... 62
Gambar 4. 32 Sequence Sign-In Petugas ... 63
Gambar 4. 33 Sequence Pengaduan ... 64
Gambar 4. 34 Sequence Edit Petugas ... 65
Gambar 4. 35 Sequence Change Password ... 65
Gambar 4. 36 Lo-Fi Sign-In Masyarakat ... 67
Gambar 4. 37 Lo-Fi Sign-Up Masyarakat ... 68
Gambar 4. 38 Lo-Fi Pengaduan ... 69
Gambar 4. 39 Lo-Fi Profile Masyarakat ... 69
Gambar 4. 40 Lo-Fi Change Password Masyarakat ... 69
Gambar 4. 41 Lo-Fi Detail Pengaduan ... 71
viii
Gambar 4. 42 Lo-Fi Edit Pengaduan ... 72
Gambar 4. 43 Lo-Fi Login Petugas ... 72
Gambar 4. 44 Lo-Fi Dashboard Petugas ... 73
Gambar 4. 45 Lo-Fi Profile Petugas ... 74
Gambar 4. 46 Lo-Fi Change Password Petugas ... 74
Gambar 4. 47 Lo-Fi Pengaduan Masuk ... 75
Gambar 4. 48 Lo-Fi Tanggapan ... 76
Gambar 4. 49 Lo-Fi Pengaduan Diproses... 77
Gambar 4. 50 Lo-Fi Pengaduan Ditolak ... 77
Gambar 4. 51 Lo-Fi Pengaduan Selesai ... 78
Gambar 4. 52 Lo-Fi Tambah Petugas ... 79
Gambar 4. 53 Lo-Fi Edit Petugas ... 79
Gambar 4. 54 Lo-Fi Generate Laporan ... 79
Gambar 4. 55 Hi-Fi Sign-In Masyarakat ... 81
Gambar 4. 56 Hi-Fi Sign-Up Masyarakat ... 82
Gambar 4. 57 Hi-Fi Pengaduan ... 83
Gambar 4. 58 Hi-Fi Profile Masyarakat ... 83
Gambar 4. 59 Hi-Fi Change Password Masyarakat ... 84
Gambar 4. 60 Hi-Fi Detail Pengaduan ... 84
Gambar 4. 61 Hi-Fi Edit Pengaduan ... 85
Gambar 4. 62 Hi-Fi Sign-In Petugas ... 86
Gambar 4. 63 Hi-Fi Dashboard Petugas ... 86
Gambar 4. 64 Hi-Fi Profile Petugas ... 87
Gambar 4. 65 Hi-Fi Change Password Petugas ... 88
Gambar 4. 66 Hi-Fi Pengaduan Masuk ... 88
Gambar 4. 67 Hi-Fi Tanggapan ... 89
Gambar 4. 68 Hi-Fi Pengaduan Diproses ... 89
Gambar 4. 69 Hi-Fi Pengaduan Ditolak ... 90
Gambar 4. 70 Hi-Fi Pengaduan Selesai ... 91
Gambar 4. 71 Hi-Fi Tambah Petugas ... 92
Gambar 4. 72 Hi-Fi Edit Petugas... 92
Gambar 4. 73 Hi-Fi Generate Laporan ... 92
Gambar 5. 1 Sign-In Masyarakat ... 94
Gambar 5. 2 Sign-Up Masyarakat ... 95
Gambar 5. 3 Pengaduan ... 96
Gambar 5. 4 Profile Masyarakat ... 97
Gambar 5. 5 Change Password Masyarakat... 98
Gambar 5. 6 Detail Pengaduan ... 98
Gambar 5. 7 Edit Pengaduan ... 99
Gambar 5. 8 Login Petugas ... 100
Gambar 5. 9 Dashboard Petugas ... 101
Gambar 5. 10 Profile Petugas ... 102
Gambar 5. 11 Change Password Petugas ... 102
Gambar 5. 12 Pengaduan Masuk ... 103
ix
Gambar 5. 13 Tanggapan ... 104
Gambar 5. 14 Pengaduan Diproses ... 105
Gambar 5. 15 Pengaduan Ditolak... 105
Gambar 5. 16 Pengaduan Selesai ... 106
Gambar 5. 17 Tambah Petugas ... 107
Gambar 5. 18 Edit Petugas ... 107
Gambar 5. 19 Generate Laporan ... 108
x
DAFTAR TABEL
Tabel 4. 1 Spesifikasi Perancang Sistem ... 24
Tabel 4. 2 Tabel Masyarakat ... 27
Tabel 4. 3 Tabel Petugas ... 28
Tabel 4. 4 Tabel Tanggapan ... 29
Tabel 4. 5 Tabel Pengaduan ... 29
1 BAB I PENDAHULUAN 1.1. Latar Belakang
Akibat dari banyaknya orang yang menggunakan komputer saat ini, kemajuan teknologi memiliki banyak manfaat yang dapat diaplikasikan kepada masyarakat secara keseluruhan. Selain digunakan untuk menyimpan dan mentransfer data, kemajuan teknologi juga dapat digunakan untuk memajukan tujuan dan maksud pembangunan bangsa kita sendiri. Seperti yang telah diketahui, kemajuan teknologi sangatlah pesat, bahkan tidak terbayangkan jika hal tersebut terus berlanjut setiap beberapa menit sekali. Inovasi teknologi informasi akhir-akhir ini telah memunculkan beberapa inovasi yang secara signifikan merugikan kesejahteraan manusia.
Dalam era digital dan perkembangan teknologi informasi yang pesat, pemanfaatan sistem informasi berbasis web telah menjadi suatu kebutuhan penting dalam berbagai aspek kehidupan, termasuk pelayanan publik. Pemerintah dan lembaga-lembaga publik di berbagai negara semakin menyadari pentingnya menyediakan mekanisme yang efisien untuk masyarakat dalam menyampaikan keluhan, pengaduan, dan masukan terkait layanan yang diberikan. Sesuai dengan amanat Undang-Undang Nomor 25 Tahun 2009 tentang Pelayanan Publik, Kantor BNN Kota Tanjungpinang telah mencoba terus berusaha untuk meningkatkan kualitas pelayanan yang diberikan kepada pengguna jasa. Oleh karena itu, rancang bangun sistem informasi layanan pengaduan masyarakat berbasis web menjadi suatu solusi yang relevan dan bermanfaat. sebagai hal yang paling dekat dengan pemerintah untuk berhubungan langsung dengan masyarakat dalam hal pelayanan publik.
Demi meningkatkan mutu pelayanan publik yang luar biasa di Kantor BNN Kota Tanjungpinang, kami telah mengambil serangkaian tindakan yang berkelanjutan. Salah satu langkah signifikan dalam perbaikan kualitas pelayanan publik adalah memberikan kesempatan sebanyak mungkin bagi pengguna layanan
2
untuk mengungkapkan pendapat mereka tentang pelayanan yang mereka terima melalui mekanisme pengaduan.
Melalui layanan pengaduan ini, kami berharap dapat menangani segala masalah yang dihadapi oleh pengguna, baik yang bersifat umum maupun spesifik, terkait dengan pelayanan di Kantor BNN Kota Tanjungpinang. Hal ini bertujuan untuk mendorong peningkatan kinerja penyelenggaraan dan pelaksanaan pelayanan publik di Kantor BNN Kota Tanjungpinang, sehingga pelayanan publik kami menjadi lebih baik lagi dan lebih responsif terhadap kebutuhan masyarakat.
1.2. Rumusan Masalah
Berdasarkan latar belakang di atas, maka rumusan masalah dari penelitian ini adalah sebagai berikut:
1. Bagaimana kita dapat menciptakan sistem informasi layanan pengaduan berbasis web yang inovatif dan efisien untuk Kantor BNN Kota Tanjungpinang?
2. Bagaimana dapat meningkatkan partisipasi dan pemanfaatan layanan pengaduan di Kantor BNN Kota Tanjungpinang sehingga memberikan dampak positif yang nyata dalam peningkatan kualitas pelayanan publik?
1.3. Batasan Masalah
Dalam penelitian ini, terdapat batasan masalah yang akan menjadi pedoman agar penelitian lebih terarah. Batasan masalah tersebut dapat dirumuskan sebagai berikut:
1. Sistem yang sedang dikembangkan akan diimplementasikan khusus untuk pengguna jasa di Kantor BNN Kota Tanjungpinang , termasuk Admin dan User.
2. Penelitian ini akan memfokuskan pada perancangan aplikasi web sistem informasi pengaduan, yang akan menjadi langkah awal dalam pengembangan sistem yang lebih luas.
3 1.4. Tujuan
Tujuan utama dari perancangan sistem informasi layanan pengaduan masyarakat ini adalah untuk memberikan kemudahan kepada para pengguna jasa yang ingin menyampaikan keluhan,tindakan,informasi atau masukan terkait suatu tindakan kesalahan yang terjadi di masyarakat ke BNN Kota Tanjungpinang.
1.5. Manfaat
Manfaat yang ingin diperoleh dari laporan ini adalah sebagai berikut:
1. Untuk Kantor BNN Kota Tanjungpinang, sistem ini akan membantu memproses pengaduan dari pengguna jasa dengan lebih efisien dan cepat.
2. Bagi pengguna jasa, sistem ini akan memberikan kemudahan dalam melaporkan pengaduan terkait suatu tindakan kesalahan yang terjadi di masyarakat ke BNN Kota Tanjungpinang.
3. Bagi penulis, laporan ini akan menambah pengetahuan dan wawasan tentang proses perancangan sistem informasi layanan pengaduan serta penerapannya dalam konteks pelayanan publik.
1.6. Tempat dan Waktu Kerja Praktik
Tempat dan waktu pelaksanaan kerja Praktik yaitu:
Tempat : Kantor BNN Kota Tanjungpinang.Kijang, Jl. Daeng Kemboja Senggarang-Tanjunpinanag.
Waktu : 14 Agustus – 13 Oktober 2023
1.7. Sistematika Penyusunan
Adapun sistematika penyusunan dalam laporan kerja Praktik ini adalah sebagai berikut:
BAB I PENDAHULUAN
Pada BAB I membahas tentang latar belakang, rumusan masalah, batasan masalah, tujuan, manfaat, waktu dan tempat kerja Praktik, dan sistematika penulisan.
4
BAB II PROFIL PERUSAHAAN/INSTITUSI
Pada BAB II memaparkan tentang sejarah singkat perusahaan, tugas pokok, fungsi, dan struktur organisasi di Kantor BNN Kota Tanjungpinang.
BAB III LANDASAN TEORI
Pada BAB III ini berisi tentang penjelasan mengenai Sistem Informasi, Pengaduan Pelayan Publik, Website, Xampp,Visual Studio Code, Bootsrap, Codeigniter, Diagram.net. HTML, CSS, Java Script, PHP, UML dan Class Diagram.
BAB IV DESKRIPSI SISTEM
Bab ini menjelaskan tentang kegiatan pembuatan proyek yang dilakukan di tempat Kerja Praktik berupa:
4.1. Deskripsi Sistem
Memaparkan tentang sebuah sistem yang digunakan untuk mempermudah mengelola data pengaduan di Kantor BNN Kota Tanjungpinang.
4.2. Spesifikasi Sistem
Memaparkan tentang perangkat keras dan perangkat lunak yang digunakan selama pembuatan proyek.
4.3. Perancangan Sistem Perancangan sistem terdiri dari:
4.3.1. Perancangan Basis Data 4.3.2. Perancangan Alur Sistem 4.3.3. Perancangan Antar Muka BAB V PEMBAHASAN
Pada bab ini terdapat implementasi serta pembahasan sistem yang telah dibuat.
BAB VI PENUTUP 6.1 Kesimpulan
Kesimpulan ini berisi tentang intisari bab-bab sebelumnya atau rangkuman dari pengerjaan proyek sistem.
6.2 Saran
Berupa solusi atau masukan yang diberikan untuk pengembangan sistem menjadi lebih baik.
5 BAB II
PROFIL PERUSAHAAN/INSTITUSI
2.1. Sejarah Kantor BNN Kota Tanjungpinang
Satuan Kerja Badan Narkotika Nasional Kota Tanjungpinang atau BNNK Tanjungpinang dimulai pada priode tahun 2007-an. Pada saat itu peredaran Narkoba sangat merajalela, untuk membendung dan mempersempit ruang gerak peredaran gelap Narkoba ke wilayah lain maka Walikota Tanjungpinang memutuskan melalui Keputusan Walikota Nomor 63 tahun 2007 tentang Pembentukan Susunan Organisasi Badan Narkotika Kota Tanjungpinang dan Peraturan Daerah Kota Tanjungpinang Nomor 13 Tahun 2009 maka dibentuk lah Badan Narkotika Kota Tanjungpinang atau BNK Tanjungpinang. Badan ini berbentuk forum yang memiliki tanggung jawab untuk melakukan koordinasi dalam menanggulangi penyalahgunaan dan peredaran Narkoba di wilayah Kota Tanjungpinang, Badan Narkotika Kota Tanjungpinang ini masih di bawah naungan Pemerintah Kota Tanjungpinang.
Tahun 2011, Badan Narkotika Nasional Kota Tanjungpinang resmi terbentuk dengan terbitnya Surat Keputusan Kepala Badan Narkotika Nasional Nomor KEP/ 51/ IV/ 2011/BNN tanggal 19 April 2011, dengan melantik AKBP.
Ahmad Yani, S.H sebagai Kepala Badan Narkotika Nasional Kota Tanjungpinang.
Kepala Badan Narkotika Nasional dari Masa ke Masa 1. Ahmad Yani. B, SH (2011 – 2016)
2. Abdul Hasyim Panggabean, SH (2016 – 2018) 3. Darsono, SH (2018 – 2020)
4. Sazili (2021)
5. Heryana, S.E., M.H (2022 – 2023)
6. Kombes Pol. Heryanto, S.E (2023 – sekarang)
6 2.2. Tugas Pokok
Badan Narkotika Nasional yang selanjutnya dalam Peraturan Kepala Badan Narkotika Nasional disebut BNN adalah lembaga pemerintah non kementrian yang berkedudukan di bawah dan bertanggung jawab kepada Presiden melalui koordinasi Kepala Kepolisian Negara Republik Indonesia. BNN dipimpin oleh Kepala.
Tugas :
1. Menyusun dan melaksanakan kebijakan nasional mengenai pencegahan dan pemberantasan penyalahgunaan dan peredaran gelap Narkotika dan Prekursor Narkotika;
2. Mencegah dan memberantas penyalahgunaan dan peredaran gelap Narkotika dan Prekursor Narkotika;
3. Berkoordinasi dengan Kepala Kepolisian Negara Republik Indonesia dalam pencegahan dan pemberantasan penyalahgunaan dan peredaran gelap Narkotika dan Prekursor Narkotika;
4. Meningkatkan kemampuan lembaga rehabilitasi medis dan rehabilitasi sosial pecandu Narkotika, baik yang diselenggarakan oleh pemerintah maupun masyarakat;
5. Memberdayakan masyarakat dalam pencegahan penyalahgunaan dan peredaran gelap Narkotika dan Prekursor Narkotika;
6. Memantau, mengarahkan dan meningkatkan kegiatan masyarakat dalam pencegahan penyalahgunaan dan peredaran gelap Narkotika dan Psikotropika Narkotika;
7. Melalui kerja sama bilateral dan multiteral, baik regional maupun internasional, guna mencegah dan memberantas peredaran gelap Narkotika dan Prekursor Narkotika;
8. Mengembangkan laboratorium Narkotika dan Prekursor Narkotika;
9. Melaksanakan administrasi penyelidikan dan penyidikan terhadap perkara penyalahgunaan dan peredaran gelap Narkotika dan Prekursor Narkotika; dan 10. Membuat laporan tahunan mengenai pelaksanaan tugas dan wewenang.
7 2.3. Fungsi
BNN juga bertugas menyusun dan melaksanakan kebijakan nasional mengenai pencegahan dan pemberantasan penyalahgunaan dan peredaran gelap psikotropika, prekursor dan bahan adiktif lainnya kecuali bahan adiktif untuk tembakau dan alkohol.
Fungsi :
1. Penyusunan dan perumusan kebijakan nasional di bidang pencegahan dan pemberantasan penyalahgunaan dan peredaran gelap narkotika, psikotropika dan prekursor serta bahan adiktif lainnya kecuali bahan adiktif untuk tembakau dan alkohol yang selanjutnya disingkat dengan P4GN.
2. Penyusunan, perumusan dan penetapan norma, standar, kriteria dan prosedur P4GN.
3. Penyusunan perencanaan, program dan anggaran BNN.
4. Penyusunan dan perumusan kebijakan teknis pencegahan, pemberdayaan masyarakat, pemberantasan, rehabilitasi, hukum dan kerjasama di bidang P4GN.
5. Pelaksanaan kebijakan nasional dan kebijakna teknis P4GN di bidang pencegahan, pemberdayaan masyarakat, pemberantasan, rehabilitasi, hukum dan kerjasama.
6. Pelaksanaan pembinaan teknis di bidang P4GN kepada instansi vertikal di lingkungan BNN.Pengoordinasian instansi pemerintah terkait dan komponen masyarakat dalam rangka penyusunan dan perumusan serta pelaksanaan kebijakan nasional di bidang P4GN.
7. Penyelenggaraan pembinaan dan pelayanan administrasi di lingkungan BNN.
8. Pelaksanaan fasilitasi dan pengkoordinasian wadah peran serta masyarakat.
9. Pelaksanaan penyelidikan dan penyidikan penyalahgunaan dan peredaran gelap Narkotika dan Prekursor Narkotika.
8
10. Pelaksanaan pemutusan jaringan kejahatan terorganisasi di bidang narkotika, psikotropika dan prekursor serta bahan adiktif lainnya, kecuali bahan adiktif untuk tembakau dan alkohol.
11. Pengoordinasian instansi pemerintah terkait maupun komponen masarakat dalam pelaksanaan rehabilitasi dan penyatuan kembali ke dalam masyarakat serta perawatan lanjutan bagi penyalahguna dan/atau pecandu narkotika dan psikotropika serta bahan adiktif lainnya kecuali bahan adiktif untuk tembakau dan alkohol di tingkat pusat dan daerah.
12. Pengkoordinasian peningkatan kemampuan lembaga rehabilitasi medis dan rehabilitasi sosial pecandu narkotika dan psikotropika serta bahan adiktif lainnya, kecuali bahan adiktif untuk tembakau dan alkohol yang diselenggarakan oleh pemerintah dan masyarakat.
13. Peningkatan kemampuan lembaga rehabilitasi penyalahguna dan/atau pecandu narkotika dan psikotropika serta bahan adiktif lainnya, kecuali bahan adiktif tembakau dan alkohol berbasis komunitas terapeutik atau metode lain yang telah teruji keberhasilannya.
14. Pelaksanaan penyusunan, pengkajian dan perumusan peraturan perundang- undangan serta pemberian bantuan hukum di bidang P4GN.
15. Pelaksanaan kerjasama nasional, regional dan internasional di bidang P4GN.
16. Pelaksanaan pengawasan fungsional terhadap pelaksanaan P4GN di lingkungan BNN.Pelaksanaan koordinasi pengawasan fungsional instansi pemerintah terkait dan komponen masyarakat di bidang P4GN.
17. Pelaksanaan penegakan disiplin, kode etik pegawai BNN dan kode etik profesi penyidik BNN.
18. Pelaksanaan pendataan dan informasi nasional penelitian dan pengembangan, serta pendidikan dan pelatihan di bidang P4GN.
19. Pelaksanaan pengujian narkotika, psikotropika dan prekursor serta bahan adiktif lainnya, kecuali bahan adiktif untuk tembakau dan alkohol.
20. Pengembangan laboratorium uji narkotika, psikotropika dan prekursor serta bahan adiktif lainnya, kecuali bahan adiktif tembakau dan alkohol.
9
21. Pelaksanaan evaluasi dan pelaporan pelaksanaan kebijakan nasional di bidang P4GN.
2.4. Struktur Organisasi
Gambar 2.1 Struktur Organisasi
10 BAB III LANDASAN TEORI
3.1. Sistem Informasi
Sistem Informasi (SI) adalah sebuah gabungan antara teknologi informasi dan aktivitas manusia yang menggunakan teknologi tersebut untuk mendukung operasional dan manajemen. Dalam pengertian yang lebih luas, istilah sistem informasi sering merujuk pada interaksi antara manusia, proses algoritma, data, dan teknologi. Dalam konteks ini, istilah ini mencakup penggunaan teknologi informasi dan komunikasi oleh organisasi serta cara manusia berinteraksi dengan teknologi tersebut untuk mendukung proses bisnis.
Menurut definisi dari Gordon B. Davis (1991: 91), Sistem Informasi adalah suatu sistem yang menerima input berupa data dan instruksi, mengolah data sesuai dengan instruksi tersebut, dan menghasilkan output.
Sedangkan menurut pandangan Kertahadi (2007), Sistem Informasi adalah sebuah alat yang digunakan untuk menyajikan informasi dengan cara yang bermanfaat bagi penerimanya. Tujuannya adalah untuk memberikan informasi yang mendukung perencanaan, pelaksanaan, pengorganisasian, dan operasional sebuah perusahaan. Sistem informasi ini membantu organisasi dalam pengambilan keputusan dengan menyediakan informasi yang relevan dan terorganisir.
Landasan teori tentang sistem informasi adalah konsep-konsep dasar, prinsip-prinsip, dan teori-teori yang mendukung pemahaman tentang bagaimana informasi dikumpulkan, diproses, disimpan, dan digunakan dalam suatu organisasi atau lingkungan tertentu. Berikut adalah beberapa landasan teori penting dalam bidang sistem informasi:
1. Teori Sistem : Teori ini memandang sistem informasi sebagai suatu sistem yang terdiri dari komponen-komponen yang saling terkait dan berinteraksi untuk mencapai tujuan tertentu. Teori sistem membantu dalam pemahaman tentang bagaimana komponen-komponen tersebut berinteraksi dan berpengaruh satu sama lain.
11
2. Teori Komunikasi: Teori ini membahas tentang bagaimana informasi dikomunikasikan, disebarkan, dan dipahami oleh pihak yang berkepentingan.
Konsep penting dalam teori komunikasi termasuk pengirim, pesan, saluran komunikasi, penerima, dan konteks komunikasi.
3. Teori Organisasi: Teori ini mempelajari bagaimana organisasi bekerja dan bagaimana informasi digunakan dalam proses pengambilan keputusan dan manajemen. Teori ini juga mencakup struktur organisasi, budaya organisasi, dan peran individu dalam organisasi.
4. Teori Manajemen Informasi: Teori ini berkaitan dengan pengelolaan informasi dalam organisasi. Ini mencakup pengumpulan, penyimpanan, pengolahan, dan distribusi informasi untuk mendukung pengambilan keputusan yang efektif.
5. Teori Teknologi Informasi: Teori ini membahas tentang perkembangan teknologi informasi dan dampaknya terhadap organisasi dan masyarakat. Ini mencakup konsep seperti siklus hidup teknologi, adopsi teknologi, dan strategi teknologi informasi.
6. Teori Pengambilan Keputusan: Teori ini menjelaskan proses pengambilan keputusan dalam konteks penggunaan informasi. Ini melibatkan konsep seperti analisis data, evaluasi risiko, dan strategi pengambilan keputusan.
7. Teori Sistem Basis Data: Teori ini fokus pada desain, pengelolaan, dan penggunaan basis data dalam sistem informasi. Ini mencakup konsep seperti model data, normalisasi basis data, dan bahasa penggunaan basis data.
8. Teori Keamanan Informasi: Teori ini berkaitan dengan upaya untuk melindungi informasi dari ancaman dan risiko keamanan. Ini mencakup aspek- aspek seperti kebijakan keamanan, enkripsi data, dan manajemen risiko keamanan.
Semua teori ini membantu dalam pemahaman yang lebih baik tentang bagaimana sistem informasi berfungsi dan bagaimana informasi dapat digunakan secara efektif untuk mendukung tujuan organisasi. Selain itu, integrasi teori-teori ini dapat membantu dalam perancangan, pengembangan, dan pengelolaan sistem informasi yang efisien dan efektif.
12 3.2. Pengaduan Pelayan Publik
Pengertian pengaduan adalah pernyataan ketidakpuasan apapun bentuknya (tertulis, lisan maupun melalui bahasa tubuh) tentang pelayanan, tindakan dan/atau kekurangan tindakan yang dilakukan oleh instansi penyedia pelayanan atau para stafnya yang mempengaruhi dan dirasakan oleh pengguna pelayanan tersebut.
Pengaduan pelayanan publik adalah mekanisme yang disediakan oleh pemerintah atau lembaga publik untuk memungkinkan masyarakat mengungkapkan keluhan, saran, atau masukan terkait dengan layanan yang diberikan oleh lembaga-lembaga pemerintah atau instansi publik. Tujuan utama dari pengaduan pelayanan publik adalah untuk meningkatkan kualitas pelayanan publik, mendengarkan masukan dari masyarakat, dan memberikan solusi terhadap masalah yang timbul. Berikut adalah beberapa aspek yang Perlu dipahami tentang pengaduan pelayanan publik:
Pengaduan pelayanan publik adalah salah satu aspek penting dalam upaya menciptakan pelayanan publik yang lebih baik, transparan, dan akuntabel. Ini merupakan wujud dari partisipasi aktif masyarakat dalam mengawasi dan meningkatkan kualitas pelayanan yang mereka terima dari lembaga pemerintah dan instansi publik.
3.3. Website
Situs web (website) adalah kumpulan halaman web yang saling terhubung, biasanya berada di Server web yang dapat diakses melalui Internet atau jaringan lokal (LAN) dengan menggunakan alamat Internet yang dikenal sebagai URL.
Gabungan dari semua situs web yang dapat diakses secara publik di Internet disebut World Wide Web (WWW).
Sebuah website memiliki alamat URL yang unik dan spesifik yang disebut dengan domain. Misalnya domain Maxmanroe.com, Google.com, Facebook.com, dan lain-lain. Website dapat diakses dengan menggunakan browser dan koneksi
13
internet. Namun, ada beberapa website yang bisa diakses menggunakan jaringan lokal (LAN).
Setiap halaman web adalah berkas teks yang diatur dan diformat dengan instruksi berbasis HTML atau XHTML, kadang-kadang juga menggunakan bahasa skrip. Peramban web (web browser) kemudian menginterpretasikan berkas tersebut dan menampilkannya sebagai halaman pada layar komputer. Pengguna mengakses halaman-halaman web melalui protokol komunikasi jaringan yang disebut HTTP. Untuk meningkatkan keamanan dan privasi, situs web juga dapat mengimplementasikan mekanisme pengaksesan melalui protokol HTTPS.
Sebuah website adalah kumpulan halaman web yang terhubung satu sama lain dan diakses melalui internet. Ini adalah media digital yang digunakan untuk menyajikan berbagai jenis informasi, konten, layanan, dan interaksi online.
Website sangat bervariasi dalam hal desain, tujuan, kompleksitas, dan ukuran.
Mereka dapat mencakup segala hal mulai dari blog pribadi hingga situs web e- commerce besar, situs berita, forum komunitas, dan banyak lagi. Website telah menjadi bagian integral dari cara kita mendapatkan informasi dan berinteraksi dengan dunia online.
3.4. Xampp
Xampp adalah perangkat lunak bebas, yang mendukung banyak sistem operasi, merupakan komplikasi dari beberapa program. Fungsi dari Xampp adalah sebagai Server yang berdiri sendiri (localhost), yang terdiri atas program Apache HTTP Server, MySQL database, dan penerjemah Bahasa yang ditulis dengan Bahasa pemrograman PHP dan Perl.5
Xampp memiliki beberapa bagian sebagai berikut:
1. Program ini dapat dijalankan di banyak sistem operasi, seperti Windows, Linux, Mac OS, dan Solaris.
2. Apache, Server aplikasi Web. Tugas utama Apache adalah untuk menghasilkan halaman web yang benar kepada pengguna terhadap kode PHP yang sudah dituliskan oleh pembuat halaman web. jika Perlu kode PHP juga berdasarkan
14
yang tertulis, dapat database diakses dulu (misalnya MySQL) untuk mendukung halaman web yang dihasilkan.
3. MySQL, Server aplikasi database. Pertumbuhannya disebut SQL singkatan dari Structured Query Language. SQL merupakan bahasa terstruktur yang difungsikan untuk mengolah database. MySQL dapat digunakan untuk membuat dan mengelola database dan isinya. Bisa juga memanfaatkan MySQL guna untuk menambahkan, mengubah, dan menghapus data dalam database.
4. PHP, bahasa pemrograman web. Bahasa pemrograman PHP adalah bahasa pemrograman untuk membuat web yang Server-side scripting. PHP digunakan untuk membuat halaman web dinamis. Sistem manajemen database yang sering digunakan dengan PHP adalah MySQL. Namun PHP juga mendukung Pengelolaan sistem database Oracle, Microsoft Access, Interbase, d-base, PostgreSQL, dan sebagainya.
5. Perl, bahasa pemrograman untuk semua tujuan, pertama kali dikembangkan oleh Larry Wall, mesin Unix. Perl dirilis pertama kali tanggal 18 Desember 1987 yang ditandai dengan keluarnya Perl 1. Pada versi-versi selanjutnya, Perl juga tersedia untuk berbagai sistem operasi Unix (SunOS, Linux, BSD, HP- UX), juga tersedia untuk sistem operasi seperti DOS, Windows, PowerPC, BeOS, VMS, EBCDIC, dan PocketPC.
3.5. Visual Studio Code
Visual Studio Code adalah Sofware yang sangat ringan, namun kuat editor kode sumbernya yang berjalan dari desktop. Muncul dengan built-in dukungan untuk JavaScript, naskah dan Node.js dan memiliki array beragam ekstensi yang tersedia untuk bahasa lain, termasuk C ++, C # , Python, dan PHP. Hal ini didasarkan sekitar Github ini Elektron, yang merupakan versi cross-platform dari Atom komponen kode-editing, berdasarkan JavaScript dan HTML5. Editor ini adalah fitur lengkap lingkungan pengembangan terpadu (IDE) dirancang untuk pengembang yang bekerja dengan teknologi cloud yang terbuka Microsoft. Visual Studio Code menggunakan open source NET perkakas untuk memberikan dukungan untuk ASP.NET C # kode, membangun alat pengembang Omnisharp
15
NET dan compiler Roslyn. Antarmuka yang mudah untuk bekerja dengan, karena didasarkan pada gaya explorer umum, dengan panel di sebelah kiri, yang menunjukkan semua file dan folder Anda memiliki akses ke panel editor di sebelah kanan, yang menunjukkan isi dari file yang telah dibuka. Dalam hal ini, editor telah dikembangkan dengan baik, dan menyenangkan pada mata. Ia juga memiliki fungsi yang baik, dengan intellisense dan autocomplete bekerja dengan baik untuk JSON, CSS, HTML, {kurang}, dan Node.js.
Visual Studio Code telah dirancang untuk bekerja dengan alat-alat yang ada, dan Microsoft menyediakan dokumentasi untuk membantu pengembang bersama, dengan bantuan untuk bekerja dengan ASP.NET 5, Node.js, dan Microsoft naskah, serta alat-alat yang dapat digunakan untuk membantu membangun dan mengelola aplikasi Node.js. Visual Studio Code benar-benar sedang ditargetkan pada pengembang JavaScript yang ingin alat pengembangannya lengkap untuk scripting Server-side mereka dan yang mungkin ingin usaha dari Node.js untuk kerangka berbasis NET. Visual Studio Code, adalah belum solid, lintas platform kode Editor ringan, yang dapat digunakan oleh siapa saja untuk membangun aplikasi untuk Web.
3.6. Bootsrap
Bootstrap adalah framework web development berbasis HTML, CSS, dan JavaScript yang dirancang untuk mempercepat proses pengembangan web responsive dan mobile-first (memprioritaskan perangkat seluler).Menurut Husein Alatas, (2013) Bootstrap merupakan framework untuk membangun desain web secara responsif. Artinya, tampilan web yang dibuat oleh Bootstrap akan menyesuaikan ukuran layer dan browser yang kita gunakan baik di desktop, tablet ataupun mobile device. Dengan Bootstrap kita juga bisa membangun web dinamis ataupun statis.
Selain bisa digunakan untuk mengembangkan website dengan lebih cepat, Bootstrap adalah framework gratis yang bersifat open-source. Skrip dan syntax yang disediakan Bootstrap bisa diterapkan untuk berbagai komponen dalam
16
desain web. Tujuan dan fungsi Bootstrap adalah untuk membuat website responsive dan mobile-first. Jadi, semua elemen antarmuka website dipastikan bisa bekerja secara optimal di semua ukuran layar, baik desktop maupun perangkat seluler.
Teknologi web Bootstrap merupakan framework untuk membangun desain web secara responsif. Artinya, tampilan web yang dibuat dengan framework Bootstrap akan menyesuaikan ukuran layar dari browser yang akan gunakan baik di desktop, tablet ataupun mobile device. Fitur ini bisa diaktifkan ataupun dinon- aktifkan sesuai dengan keinginan sendiri, sehingga bisa membuat web untuk tampilan desktop saja dan apabila dirender oleh mobile browser maka tampilan dari web yang di buat tidak bisa beradaptasi sesuai layar. Dengan Bootstrap, developer web bisa menghemat waktu dalam mendesain tampilan aplikasi. Dalam Bootstrap sudah tersedia CSS, HTML dan juga JQuery Plugin untuk typography, forms, buttons, tables, grids, navigation dan berbagai komponen interface lainnya.
Mendesain web dengan menggunakan Bootstrap akan langsung menyesuaikan dengan lebar dari media perambahnya. Sehingga tampilan web akan tetap rapih dibuka dengan media apapun, baik itu handphone, tablet, laptop ataupun PC desktop. Jadi, tampilan tidak akan terganggu dengan resolusi dari layar.
3.7.Codeigniter
Secara definisi Codeigniter adalah Web Application Framework yang dibuat dengan tujuan mempermudah developer web dalam membuat dan mengakses suatu web. Codeigniter berisi kumpulan kode berupa pustaka (library) dan alat (tools) yang dipadukan sedemikian rupa menjadi suatu kerangka kerja (framework). Selain itu Codeigniter merupakan framework web untuk bahasa pemrograman PHP yang pada awalnya dirancang oleh Rick Ellis pada tahun 2006. Codeigniter memiliki banyak fitur (fasilitas) yang membantu para pengembang PHP untuk dapat membuat aplikasi web secara mudah dan cepat.
Keunggulan lain dari Codeigniter adalah desain yang lebih sederhana dan bersifat
17
fleksibel. Codeigniter mengizinkan para pengembang web untuk menggunakan framework secara parsial atau secara keseluruhan.
Codeigniter Sebuah framework PHP yang bersifat open source dan menggunakan metode MVC (Model, View, Controller) untuk memudahkan developer atau programmer dalam membangun sebuah aplikasi berbasis web tanpa harus membuatnya dari awal. Dalam situs resmi Codeigniter, (Official Website Codeigniter,2002) menyebutkan bahwa Codeigniter merupakan framework PHP yang kuat dan sedikit bug. Codeigniter ini dibangun untuk para pengembang dengan bahasa pemrogram PHP yang membutuhkan alat untuk membuat web dengan fitur lengkap.
Sebuah framework berbasis PHP yang dibangun untuk membuat aplikasi web dengan sederhana dan elegan. Berikut ini akan diuraikan beberapa pengertian Codeigniter menurut para ahli.
Menurut Menurut Ridha (2007:2) “Codeigniter adalah sebuah framework PHP yang bersifat Open source dan dapat digunakan untuk mempercepat pengembang dalam membuat aplikasi web.
Sedangkan Menurut Andriyani (2016:164) “Codeigniter (CI) merupakan aplikasi open source yang berupa framework dengan model MVC (Model, View, Controller) untuk membangun website dinamis menggunakan PHP”.
Berdasarkan teori para ahli diatas dapat disimpulkan bahwa, Codeigniter adalah framework PHP dengan model MVC yang sifatnya open source untuk membangun website yang dinamis.
3.8. Diagram.net
Diagrams.net (sebelumnya draw.io) adalah perangkat lunak menggambar grafik lintas platform gratis dan open source yang dikembangkan dalam HTML5 dan JavaScript. Antarmukanya dapat digunakan untuk membuat Diagram seperti Diagram alur, gambar rangka, Diagram UML, Diagram organisasi, dan Diagram jaringan.
18
Diagrams.net tersedia secara online sebagai aplikasi web lintas-browser, dan sebagai aplikasi desktop offline untuk Linux, macOS, dan Windows. Aplikasi offline-nya dibangun menggunakan framework Electron. Aplikasi web tidak memerlukan Login atau pendaftaran online, dan dapat dibuka dari dan disimpan ke hard drive lokal. Penyimpanan yang didukung dan format ekspor untuk diunduh termasuk PNG, JPEG, SVG, dan PDF. Ini juga terintegrasi dengan layanan cloud untuk penyimpanan termasuk Dropbox, OneDrive, Google Drive, GitHub, dan GitLab.com
3.9. HTML
HTML (Hyper Text Markup Language) adalah sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser Internet. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup Language), HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). HTML berupa kode- kode tag yang menginstruksikan browser untuk menghasilkan tampilan sesuai dengan yang diinginkan. Sebuah file yang merupakan file HTML dapat dibuka dengan menggunakan browser web seperti Mozilla Firefox, Microsoft Internet Explorer,Opera, Googlr Chrome, Safari dan lain-lain.
Hypertext Markup Language (HTML) adalah sebuah bahasa dasar bahasa markup untuk memformat konten halaman web yang digunakan untuk merancang halaman website statis (Wahana Komputer, 2012:3).
Menurut Sibero (2013:19) “Hypertext Markup Language atau HTML adalah bahasa yang digunakan pada dokumen web sebagai bahasa untuk pertukaran dokumen web. Struktur dokumen HTML terdiri dari tag pembuka dan tag penutup”.
19
Berdasarkan defenisi di atas, dapat disimpulkan bahwa HTML merupakan bahasa pemrograman web yang digunakan untuk mengatur format dan tampilan konten/isi dari halaman website.
3.10. CSS
CSS adalah singkatan dari Cascading Style Sheet. CSS merupakan kumpulan perintah yang digunakan untuk menjelaskan tampilan sebuah halaman situs web dalam markup language (HTML). CSS digunakan untuk menentukan gaya halaman web yang akan dibuat, termasuk desain, tata letak, dan variasi tampilan untuk berbagai perangkat dan ukuran layar.
Menurut Aditama (2013:367) “CSS (Cascading Style Sheet) merupakan salah satu bahasa pemrograman web yang bertujuan untuk membuat website agar lebih menarik dan terstruktur.” 9 Dari beberapa pendapat di atas, dapat disimpulkan bahwa CSS adalah suatu bahasa pemrograman web yang berfungi mengatur tampilan teks dan gambar dari suatu website agar terlihat lebih menarik dan terstruktur.
3.11. Java Script
Menurut Sibero (2013:150) “JavaScript adalah suatu bahasa pemrograman yang dikembangkan untuk dapat berjalan pada web browser. Pada awalnya JavaScript dikembangkan pada web browser Netscape oleh Brenden Eich dengan nama Mocha, kemudian berubah menjadi Live-Script dan yang akhirnya menjadi JavaScript”.
Menurut Arifin dan Community (2008:28) “JavaScript adalah script program berbasis client yang di eksekusi oleh browser sehingga membuat halaman web melakukan tugas-tugas tambahan yang tidak bisa dilakukan oleh script HTML biasa”.
20 3.12. PHP
Menurut Anhar (2010:49) “PHP merupakan bahasa pemrograman web Server-side yang bersifat open source”. PHP merupakan script yang terintegrasi dengan HTML dan berada pada Server (Server side HTML embedded scripting).
Dengan kata lain, PHP merupakan bahasa pemrograman web yang bersifat sebagai Server, memudahkan dalam pengelolaan database, serta dapat digunakan dalam file HTML. PHP juga merupakan script yang digunakan untuk membuat halaman website yang sangat dinamis, dinamis berarti halaman tampilan yang akan ditampilkan dibuat saat halaman itu diminta oleh client. PHP pertama kali dibuat oleh Rasmus Lerdorf seorang pemrogram C yang handal dari greenland Denmrak di tahun 1995, PHP diberi nama FI (Form Interpreted) yang digunakan untuk mengelola from dari web. Pada perkembangannya, kode-kode yang digunkan dirilis untuk umum sehingga mulai banyak dikembangkan oleh programmer diseluruh dunia.
Tahun 1997 PHP dirilis dengan versi 2.0, pada versi ini sudah terintegrasi dengan bahasa pemrograman C dan sudah dilengkapi dengan modul sehingga kualitas kerja PHP lebih meningkat secara signifikan. Ditahun yang sama sebuah perusahaan programbernama Zend merilis ulang PHP versi ini dengan lebih baik, bersih dan cepat. Seiring berkembangnya jaman ditahun 1994 PHP versi 4.0 mulai dirilis dan versi ini paling banyak digunakan pada awal abad 21 karena PHP versi ini sudah mampu membangun web komplek dengan stabilitas kecepatan yang tinggi. Ditahun 2004 perusahaan program Zend merilis PHP lagi dengan versi terbarunya 5.0 yang inti dari interpreter PHP mengalami perubahan besar. Versi ini juga memasukkan model pemrograman berorientasi objek kedalam PHP untuk menjawab perkembanngan bahasa pemrograman kearah paradigma berorientasi objek.
Bahasa program PHP sering digunakan karena PHP adalah bahasa open source yang memiliki kesederhanaan dan memiliki beberapa fitur built-in yang berfungsi untuk menangani kebutuhan standart dalam pembuatan aplikasi web.
PHP juga merupakan bahasa script yang paling mudah dipahami karena memiliki
21
beberapa referensi. PHP juga dapat digunakan untuk berbagai sistem operasi anatara laina : Unix, Macintosh serta Windows. PHP dapat dijalankan secara runtime melalui console serta dapat menjalakan perintah-perintah sistem. Open source disini memiliki arti code-code PHP terbuka untuk umum dan tidak berbayar atas pembelian dari license. Web Server yang mendukung PHP dapat ditemukan dimana-mana, mulai dari Apache, IIS, Lighttpd hingga Xitami dengan konfigurasi yang relatif mudah. Selain itu PHP juga dilengkapi dengan berbagai macam pendukung lain seperti support langsung keberbagai macam databasea yang populer seperti Oracle, MySQL dan lain-lain.
3.13. UML
UML (Unified Modelling Language) adalah suatu metode dalam pemodelan secara visual yang digunakan sebagai sarana perancangan sistem berorientasi objek. Awal mulanya, UML diciptakan oleh Object Management Group dengan versi awal 1.0 pada bulan Januari 1997.
UML juga dapat didefinisikan sebagai suatu bahasa standar visualisasi, perancangan, dan pendokumentasian sistem, atau dikenal juga sebagai bahasa standar penulisan blueprint sebuah software.
UML diharapkan mampu mempermudah pengembangan piranti lunak (RPL) serta memenuhi semua kebutuhan pengguna dengan efektif, lengkap, dan tepat.
Hal itu termasuk faktor-faktor scalability, robustness, security, dan sebagainya.
Perlu kamu ketahui bahwa sistem yang baik itu berawal dari perancangan dan pemodelan yang matang. Salah satu yang bisa kamu Praktikkan, yaitu dengan menggunakan UML. Adapun tujuan dan fungsi Perlu adanya UML yaitu sebagai berikut:
1. Dapat memberikan bahasa pemodelan visual atau gambar kepada para pengguna dari berbagai macam pemrograman maupun proses umum rekayasa.
2. Menyatukan informasi-informasi terbaik yang ada dalam pemodelan.
3. Memberikan suatu gambaran model atau sebagai bahasa pemodelan visual yang ekspresif dalam pengembangan sistem.
22
4. Tidak hanya menggambarkan model sistem software saja, namun dapat memodelkan sistem berorientasi objek.
5. Mempermudah pengguna untuk membaca suatu sistem.
6. Berguna sebagai blueprint, jelas ini nantinya menjelaskan informasi yang lebih Detail dalam perancangan berupa coding suatu program.
UML juga dapat digunakan sebagai alat transfer ilmu tentang sistem aplikasi yang akan dikembangkan dari developer satu ke developer lainnya. UML sangat penting bagi sebagian orang karena UML berfungsi sebagai bridge atau jembatan penerjemah antara pengembang sistem dengan pengguna. Di sinilah pengguna dapat memahami sistem yang nantinya akan dikembangkan. Perlu kamu tahu bahwa sebenarnya UML mudah untuk dipelajari lo, tak hanya untuk developer, tetapi juga para pebisnis.
3.14. Class Diagram
Class Diagram atau Diagram kelas adalah salah satu jenis Diagram struktur pada UML yang menggambarkan dengan jelas struktur serta deskripsi class, atribut, metode, dan hubungan dari setiap objek. Ia bersifat statis, dalam artian Diagram kelas bukan menjelaskan apa yang terjadi jika kelas-kelasnya berhubungan, melainkan menjelaskan hubungan apa yang terjadi.
Diagram kelas ini sesuai jika diimplementasikan ke proyek yang menggunakan konsep object-oriented karena gambaran dari Class Diagram cukup mudah untuk digunakan.
Desain model dari Diagram kelas ini sendiri dibagi menjadi dua bagian.
Bagian pertama merupakan penjabaran dari database. Bagian kedua merupakan bagian dari modul MVC, yang memiliki class interface, class control, dan class entity.
23 BAB IV
DESKRIPSI SISTEM 4.1 Deskripsi Sistem
Sistem pengaduan yang bernama “Pengaduan Masyarakat BNNK Tanjungpinang” dirancang untuk memudahkan masyarakat dalam melaporkan penyalahgunaan narkoba dan bahan sejenisnya kepada Badan Narkotika Nasional Kota Tanjungpinang (BNNK Tanjungpinang) secara real-time. Laporan ini akan diproses secepat mungkin.
Berikut adalah arsitektur yang telah dibangun dalam sistem Pengaduan Masyarakat BNNK Tanjungpinang:
1. Masyarakat harus masuk (Sign-In) jika sudah memiliki akun atau pernah mendaftar sebelumnya.
2. Jika belum memiliki akun, Masyarakat dapat membuat akun baru (Sign-Up).
3. Masyarakat dapat membuat pengaduan melalui formulir pengaduan dengan mengisi Detail pengaduan dan menyertakan bukti berupa gambar.
4. Masyarakat dapat melihat progres atau status pengaduan.
5. Masyarakat dapat melihat Detail pengaduan.
6. Jika status pengaduan belum diproses, Masyarakat dapat mengedit atau bahkan menghapus isi pengaduannya.
7. Admin dapat masuk ke dalam sistem menggunakan Username dan password yang telah ditentukan melalui hard code di databse oleh programmer.
8. Admin dapat menambahkan Petugas.
9. Admin dapat memproses pengaduan dari Masyarakat.
10. Admin dapat memberikan respon atau tanggapan atas pengaduan dari Masyarakat.
11. Admin dapat menghasilkan (generate) semua pengaduan, baik yang sudah diproses maupun yang ditolak.
12. Petugas dapat masuk dengan Username dan kata password yang telah didaftarkan oleh Admin.
24
13. Petugas memdapatkan fitur dan peran yang sama dengan Admin kecuali untuk satu fitur yaitu Tambah Petugas yang hanya khusus disediakan untuk Admin.
4.2 Spesifikasi Perancang Sistem
Spesifikasi sistem “ Pengaduan Masyarakat BNNK Tanjungpinang” dapat dilihat pada Tabel 4.1 Spesifikasi Perancang Sistem.
Tabel 4. 1 Spesifikasi Perancang Sistem
Nama Perangkat
Jenis Perangkat
Kegunaan Perangkat Spek/Versi Perangkat
Laptop Perangkat Keras
Sebagai perangkat untuk
menyelesaikan semua tugas Kerja Praktik baik itu pembuatan program, laporan dan sebagainya
Lenovo Yoga Slim 7, Processor Core (TM) i5- 1135G7. Ram 8
DDR4,64-bit, Visual
Studio Code
Perangkat Lunak
Sebagai text editor untuk pengembangan sistem
Version: 1.81.1
MySQL Perangkat Lunak
Sebagai tools untuk penyimpanan database
Version: 5.7
Codeignit er
Perangkat Lunak
Sebagai framework dengan basis PHP
Version: 3.0
Bootstrap Perangkat Lunak
Sebagai framework CSS untuk template UI
Version: 4.0.3
Chrome Perangkat Sebagai browser untuk Version: 118.0.5993.89
25
Lunak menampilkan website dan resource lainnya
PHPMyA dmin
Perangkat Lunak
Untuk menjalankan MySQL database dan web Server
Version: 4.8.5
XAMPP Perangkat Lunak
sebagai Server lokal yang mencakup Apache, MySQL, dan PHP
Version : 7.3.3
4.3 Perancangan Sistem
Perancangan sistem adalah proses yang melibatkan berbagai teknik dan prinsip untuk mendefinisikan sistem secara detail. Ini mencakup komponen, fungsi, antarmuka, data, dan proses yang diPerlukan. Tujuan dari perancangan sistem adalah untuk menghasilkan sistem yang dapat memenuhi kebutuhan dan harapan pengguna serta dapat diimplementasikan secara efektif dan efisien.
Perancangan sistem dilakukan setelah tahap deskripsi sistem, yang bertujuan untuk mengidentifikasi dan mengevaluasi masalah serta kebutuhan yang ada pada sistem saat ini atau yang akan dibangun.
4.3.1 Perancangan Basis Data
Perancangan basis data pada pada perancangan website Pengaduan Masyarakat BNNK Tanjungpinang meliputi Class Diagram dan tabel relasi.
4.3.1.1 Class Diagram
Class Diagram adalah salah satu jenis Diagram struktur pada UML yang menggambarkan struktur dan deskripsi dari class, atribut, metode, dan hubungan dari setiap objek. Class Diagram bersifat statis, artinya tidak menjelaskan proses yang terjadi saat objek berhubungan, melainkan hanya hubungan apa saja yang ada. Class Diagram dapat digunakan untuk memodelkan sistem secara logis, menentukan spesifikasi class dan interface, atau menghasilkan kode program.
Class Diagram terdiri dari beberapa elemen, seperti class, association, generalization, aggregation, composition, dependency, dan realization.
26
Gambar 4. 1 Class Diagram
Class Diagram di atas menggambarkan struktur kelas yang akan dirancang dan diimplementasikan pada kodingan. Struktur kelas di sini meliputi keterkaitan satu kelas dengan kelas lain, atribut maupun komponen fungsi yang akan menjalankan perintah dalam sebuah kelas yang lebih spesifik. Dalam Class Diagram yang dirancang terdapat dua hubungan antar kelas yaitu one to one dan one to many.
27 4.3.1.2 Tabel Relasi
Tabel relasi dalam perancangan website Pengaduan Masyarakat BNNK Tanjungpinang ini merupakan database yang terdiri dari empat table, Tabel Masyarakat, Tabel Pengaduan, Tabel Tanggapan, dan Tabel Petugas.
a. Tabel Masyarakat
Identifikasi/Nama : Masyarakat
Deskripsi isi : Tabel ini berisi data masyarakat Volume : 6 field
Primary Key : nik Tabel 4. 2 Tabel Masyarakat
Name Type Attributes Null Default Ket nik bigint(16) Primary
Key
No None Berisi nik
name varchart(35) Non Key No None Berisi nama Username varchar(25) Non Key No None Berisi Username password varchar(225) Non Key No None Berisi password telp varchar(13) Non Key No None Berisi nomor hp foto_profil
e
varchar(225) Non Key No None Berisi foto profile
b. Tabel Petugas
Identifikasi/Nama : Petugas
Deskripsi isi : Tabel ini berisi data Petugas atau Admin Volume : 7 field
Primary Key : id_petugas
28 Tabel 4. 3 Tabel Petugas
Name Type Attributes Null Default Ket id_petugas int(11) Primary
Key
No None Berisi id etugas
nama_petu gas
varchart(35 )
Non Key No None Berisi nama petugas Username varchar(25) Unique
Key
No None Berisi Username petugas
password varchar(225 )
Non Key No None Berisi password petugas
telp varchar(13) Non Key No None Berisi nomor hp petugas
level enum(‘admi n’,’petugas’
)
Non Key No None Berisi level atau tingkatan dari petugas foto_profil
e
varchar(225 )
Non Key No Non Key
Berisi foto Profile dari petugas
c. Tabel Tanggapan
Identifikasi/Nama : Tanggapan
Deskripsi isi : Tabel ini berisi data tanggapan Volume : 5 field
Primary Key : id_tanggapan
29 Tabel 4. 4 Tabel Tanggapan
Name Type Attributes Null Default Ket id_tanggap
an
int(11) Primary Key
No None Berisi id
tanggapan id_pengad
uan
bigint(16) Key No None Berisi id pengaduan
tgl_tangga pan
Date Non Key No None Berisi tanggal pengaduan
tanggapan Text Non Key No None Berisi tanggapan dari petugas atau admin
id_petugas int(11) Key No None Berisi id petugas
d. Tabel Pengaduan
Identifikasi/Nama : Pengaduan
Deskripsi isi : Tabel ini berisi data pengaduan Volume : 6 field
Primary Key : id_pengaduan Tabel 4. 5 Tabel Pengaduan
Name Type Attributes Null Default Ket id_pengad
uan
biging(16) Primary Key
No None Berisi id pengaduan tgl_pengad
uan
Date Non Key No None Berisi tanggal pengaduan Nik bigint(16) Key No None Berisi nik dari
30
pelapor/masyarakat isi_laporan Text Non Key No None Berisi pengaduan
pelapor Foto varchar(225
)
Non Key No None Berisi foto dari pengaduan Status enum(‘0’’,’
proses’,’sel esai’,’tolak’
)
Non Key No None Berisi status dari respon petugas atau Admin terhadap pengaduan
4.3.2 Perancangan Alur Sistem
Sistem yang dirancang pada layanan Lapor BNNK Tanjungpinang ini terdiri dari flowchart, Use Case Diagram, Activity Diagram, dan sequence Diagram.
4.3.2.1 Flowchart
Flowchart dalam konteks perancangan website, juga dikenal sebagai sitemap, adalah representasi visual dari struktur dan kompleksitas website Anda yang ada atau yang akan datang. Flowchart menunjukkan bagaimana halaman web dan fungsi dalam situs bekerja bersama-sama langkah demi langkah.
Flowchart membantu Anda memahami struktur dan rincian dari website. Dengan struktur yang jelas, konten akan lebih akurat dan mudah dicari. Selain itu, Flowchart juga membantu dalam mengorganisir dan mengklarifikasi informasi untuk menghapus bagian yang tidak Perlu, yang juga bermanfaat dalam mempersiapkan penambahan nanti. Dengan kata lain, Flowchart berfungsi sebagai peta atau blueprint dari website Anda, memberikan gambaran tentang bagaimana setiap bagian dari situs web saling terhubung dan berinteraksi.
31 a. Flowchart Sign-Up Masyarakat
Gambar 4. 2 Flowchart Sign-Up Masyarakat
Gambar di atas adalah Diagram alir untuk proses pendaftaran di situs web Pengaduan Masyarakat BNNK Tanjungpinang. Proses ini dimulai dengan memasukkan data pengguna. Selanjutnya, sistem akan memeriksa apakah nama pengguna sudah ada. Jika belum, sistem akan membuat basis data untuk pengguna baru. Setelah itu, sistem akan menampilkan halaman Login untuk pengguna.
Proses ini berakhir ketika pengguna berhasil masuk ke dalam sistem.
32 b. Flowchart Sign-In Masyarakat
Gambar 4. 3 Flowchart Sign-In Masyarakat
Gambar tersebut adalah Diagram alir untuk proses masuk atau Sign-In di situs web Pengaduan Masyarakat BNNK Tanjungpinang. Proses ini dimulai dengan memasukkan data pengguna. Selanjutnya, sistem akan memeriksa apakah data yang dimasukkan sudah terdaftar dalam sistem. Jika ya, sistem akan menampilkan halaman pengaduan. Proses ini berakhir ketika pengguna berhasil masuk ke halaman pengaduan.
33 c. Flowchart Logout
Gambar 4. 4 Flowchart Logout
Gambar tersebut adalah Diagram alir untuk proses keluar atau Logout dari situs web Pengaduan Masyarakat BNNK Tanjungpinang. Proses ini dimulai dengan masuk ke halaman pengguna. Selanjutnya, sistem akan meminta konfirmasi apakah pengguna ingin keluar. Jika ya, sistem akan menampilkan halaman login. Proses ini berakhir ketika pengguna berhasil keluar dari sistem dan kembali ke halaman login.
34 d. Flowchart Sign-In Petugas
Gambar 4. 5 Flowchart Sign-In Petugas
Gambar tersebut adalah Diagram alir untuk proses masuk atau Sign-In bagi petugas di situs web Pengaduan Masyarakat BNNK Tanjungpinang. Proses ini dimulai dengan memasukkan data petugas. Selanjutnya, sistem akan memeriksa apakah data yang dimasukkan sudah terdaftar dalam sistem. Jika ya, sistem akan menampilkan halaman Dashboard controller. Proses ini berakhir ketika petugas berhasil masuk ke halaman Dashboard controller. Jika data yang dimasukkan tidak sesuai, petugas akan diminta untuk memasukkan data kembali.
35 e. Flowchart Change Password
Gambar 4. 6 Flowchart Change Password
Gambar tersebut adalah Diagram alir untuk proses perubahan kata sandi atau Change Password di situs web Pengaduan Masyarakat BNNK Tanjungpinang. Proses ini dimulai dengan memasukkan kata sandi lama.
Selanjutnya, pengguna akan memasukkan kata sandi baru yang diinginkan. Sistem kemudian akan memverifikasi kata sandi baru tersebut. Proses ini berakhir ketika kata sandi berhasil diubah dan diverifikasi oleh sistem.
36 f. Generate Laporan-Masyarakat
Gambar 4. 7 Generate Laporan-Masyarakat
Gambar tersebut adalah Diagram alir untuk proses Generate laporan atau pengaduan di situs web Pengaduan Masyarakat BNNK Tanjungpinang. Proses ini dimulai dari halaman Dashboard. Jika pengguna adalah admin, mereka dapat melanjutkan ke halaman pembuatan laporan. Jika pengguna bukan admin, mereka akan diblokir oleh sistem. Proses ini berakhir ketika laporan berhasil dibuat atau pengguna diblokir.
37 g. Tambah Petugas
Gambar 4. 8 Tambah Petugas
Gambar tersebut adalah Diagram alir untuk proses penambahan petugas baru di situs web Pengaduan Masyarakat BNNK Tanjungpinang. Proses ini dimulai dengan masuk sebagai admin. Selanjutnya, Admin akan memasukkan data petugas baru. Sistem kemudian akan membuat basis data untuk petugas baru tersebut. Jika berhasil, Admin akan dapat melihat halaman petugas baru tersebut.
Jika tidak, Admin akan menerima pesan peringatan dari sistem.
