PENGEMBANGAN SISTEM INFORMASI MANAJEMEN TKA/TPA BERBASIS MVC (Studi Kasus di TKA/TPA Al-Iman Kalibayem)

(Studi Kasus di TKA/TPA Al-Iman Kalibayem)

Skripsi

untuk memenuhi sebagian persyaratan mencapai derajat Sarjana S-1

Diajukan oleh : Wildan Fahmi Ilman

20120140020

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNIK

UNIVERSITAS MUHAMMADIYAH YOGYAKARTA

2016

iv

sepanjang pengetahuan saya juga tidak mengandung karya atau pendapat yang pernah ditulis atau diterbitkan oleh orang lain, kecuali yang secara tertulis diacu dalam naskah dan disebutkan dalam daftar pustaka.

Yogyakarta, 29 Agustus 2016

v

melimpahkan rahmat dan hidayah-Nya sehingga penulis dapat menyelesaikan skripsi dengan judul “Pengembangan Sistem Informasi Manajemen TKA/TPA Berbasis MVC (Studi Kasus di TKA/TPA Al-Iman Kalibayem)”.

Berbagai usaha dan upaya telah penulis lakukan untuk menyelesaikan penyusunan skripsi ini, penulis meminta maaf apabila terdapat kesalahan dalam pemilihan kata, susunan penulisan dan sistematika pembahasan.

Dalam melakukan penelitian dan penyusunan laporan skripsi penulis telah mendapatkan banyak dukungan dan bantuan dari berbagai pihak. Penulis mengucapkan terima kasih yang tak terhingga kepada:

1. Bapak Helmi Zain Nuri, S.T., MT. selaku Ketua Program Studi Teknik Informatika Universitas Muhammadiyah Yogyakarta.

2. Bapak Haris Setyawan, S.T., M.Eng. selaku pembimbing utama yang telah membimbing penulis dengan kesabaran dan ketulusan dalam pengembangan sistem dan penulisan skripsi.

3. Bapak Asroni, S.T., M.Eng. selaku pembimbing pendamping yang telah meluangkan waktu dan sangat sabar membimbing penulis dalam pembuatan skripsi dan pengembangan sistem.

4. Bapak Cahya Damarjati, S.T., M. Eng. selaku dosen penguji yang bersedia meluangkan waktu untuk memberikan kritik dan saran kepada penulis dalam pembuatan skripsi.

vi

dan mengajarkan ilmunya kepada penulis selama perkuliahan.

6. Staff Tata Usaha Jurusan Teknik Informatika Fakultas Teknik Universitas Muhammadiyah Yogyakarta, Mas Reza, Mas Ronald, Mbak Lilis, Mbak Novi, Mas Andi, dan Mas Haris yang senantiasa membantu penulis dalam urusan administrasi.

7. Bapak, Ibu, Mbak Hani, dan Dek Tsalist yang selalu memberikan dukungan motivasi, kasih sayang dan doa kepada penulis hingga penulis dapat mencapai ke tahap sekarang ini.

8. Penghuni kontrakan “mbah Warjoyo”, Hadi, Puput, dan Faisal yang selalu menemani penulis dan memberikan motivasi kepada penulis.

9. Teman seperjuangan Fiddin, Adit, Maulana, Amek, Bima, Wahyu, Sinta, Ayu, Hida, Kiki, Roni, Fairus, Yatman dan angkatan 2012 lainnya yang tidak bisa penulis cantumkan satu persatu, terimakasih banyak kepada kalian semua yang selalu menemani dan membantu penulis.

10. Annis, Ica, Mentari, Farah, Yolanda, Sinta, Topan, Julian, Mas Juna, Candra dan sahabatku lainnya, kalian merupakan sahabat yang senantiasa berbagi ilmu, berbagi semangat, suka cita dan suka duka selama kuliah di UMY. 11. Pihak-pihak lainnya yang tidak dapat disebutkan satu per satu, yang

telah memberikan bantuan kepada penulis, sehingga penulis dapat menyelesaikan penyusunan skripsi ini.

vii

HALAMAN PENGESAHAN I ... ii

HALAMAN PENGESAHAN II ... iii

PERNYATAAN ... iv

PRAKATA ... v

DAFTAR ISI ... vii

DAFTAR TABEL ... xi

DAFTAR GAMBAR ... xii

INTISARI ... xiv

BAB I PENDAHULUAN ... 1

1.1 Latar Belakang ... 1

1.2 Rumusan Masalah ... 3

1.3 Tujuan Penelitian ... 3

1.4 Manfaat Penelitian ... 3

1.5 Sistematika Penulisan ... 4

BAB II TINJAUAN PUSTAKA DAN LANDASAN TEORI ... 6

2.1 Tinjauan Pustaka ... 6

viii

2.2.3 Sistem Informasi Manajemen ... 12

2.2.4 Metode Systems Development Life Cycle (SDLC)... 13

2.2.5 Pengembangan Aplikasi Berbasis Web ... 15

2.2.6 Metode Model View Controller (MVC) ... 16

2.2.7 ASP.NET ... 17

2.2.8 Sql Server Management Studio ... 20

2.2.9 Microsoft Visual Studio ... 20

BAB III METODE PENELITIAN... 22

3.1. Alat dan Bahan Penelitian ... 22

3.1.1 Alat ... 22

3.1.2 Bahan... 22

3.2 Teknik Pengumpulan Data ... 23

3.2.1 Wawancara ... 23

3.2.2 Observasi ... 23

3.2.3 Alur Penelitian ... 24

3.3 Analisis Penelitian ... 26

3.3.1 Arsitektur ... 26

ix

3.3.5 Analisis Monitoring Hafalan Santri ... 28

3.3.6 Analisis Kebutuhan ... 29

3.4 Rancangan Sistem dan Basis Data ... 29

3.4.1 Use CaseDiagram ... 30

3.4.2 ActivityDiagram ... 31

3.4.3 ER Diagram ... 33

3.4.4 Class Diagram ... 36

3.5 Rancangan Antarmuka ... 38

3.5.1 Rancangan Antarmuka Halaman Awal dan Login ... 39

3.5.2 Rancangan Antarmuka Halaman Utama ... 41

3.5.3 Rancangan Antarmuka Halaman Data Santri ... 43

3.5.4 Rancangan Antarmuka Halaman Data Ustadz ... 46

3.5.5 Rancangan Antarmuka Halaman Monitoring Qiroah Santri ... 48

3.5.6 Rancangan Antarmuka Halaman Monitoring Hafalan Santri ... 50

3.5.7 Rancangan Antarmuka Halaman Keuangan ... 52

3.6 Metode Pengujian ... 53

BAB IV HASIL DAN PEMBAHASAN ... 55

x

4.3.1 Halaman Awal dan Login... 62

4.3.2 Halaman Utama ... 64

4.3.3 Halaman Data Santri ... 67

4.3.4 Halaman Data Ustadz ... 70

4.3.5 Halaman Monitoring Qiroah Santri ... 73

4.3.6 Halaman Monitoring Hafalan Santri ... 75

4.3.7 Halaman Keuangan Santri... 78

4.4 Pengujian Sistem ... 80

BAB V KESIMPULAN DAN SARAN ... 85

5.1 Kesimpulan ... 85

5.2 Saran ... 85

DAFTAR PUSTAKA ... 86

xi

Tabel 4. 1 Tabel Santri ... 56

Tabel 4. 2 Tabel Ustadz ... 57

Tabel 4. 3 Tabel Ngaji ... 58

Tabel 4. 4 Tabel Data Hafalan ... 59

Tabel 4. 5 Tabel Jenis Hafalan ... 59

Tabel 4. 6 Tabel SPP ... 60

xii

Gambar 3. 2 Arsitektur Riil ... 26

Gambar 3. 3 Alur Pendaftaran Santri ... 27

Gambar 3. 4 Alur Monitoring Qiroah Al-Quran dan Iqro Santri ... 28

Gambar 3. 5 Alur Monitoring Hafalan Santri ... 28

Gambar 3. 6 Use case Diagram Aplikasi... 30

Gambar 3. 7 Activity Diagram Sistem Informasi Manajemen ... 31

Gambar 3. 8 ER Diagram... 33

Gambar 3. 9 Class Diagram... 36

Gambar 3. 10 Rancangan Antarmuka Halaman Utama ... 39

Gambar 3. 11 Rancangan Antarmuka Halaman Login ... 40

Gambar 3. 12 Rancangan Antarmuka Halaman Registrasi ... 40

Gambar 3. 13 Rancangan Antarmuka Halaman Utama ... 41

Gambar 3. 14 Rancangan Antarmuka Halaman Daftar Data Santri ... 44

Gambar 3. 15 Rancangan Antarmuka Halaman Tambah Data Santri ... 45

Gambar 3. 16 Rancangan Anatrmuka Halaman Hapus Data Santri ... 45

Gambar 3. 17 Rancangan Antarmuka Halaman Daftar Data Ustadz ... 46

Gambar 3. 18 Rancangan Antarmuka Halaman Tambah Data Ustadz ... 47

Gambar 3. 19 Rancangan Antarmuka Halaman Hapus Data Ustadz ... 47

Gambar 3. 20 Rancangan Antarmuka Halaman Daftar Qiroah Santri ... 48

Gambar 3. 21 Rancangan Antarmuka Halaman Tambah Data Qiroah Santri ... 49

Gambar 3. 22 Rancangan Antarmuka Halaman Isi Hafalan Santri ... 50

Gambar 3. 23 Rancangan ANtarmuka Halaman Data Hafalan Santri ... 51

Gambar 3. 24 Rancangan Antarmuka Halaman Pembayaran SPP ... 52

Gambar 3. 25 Rancangan Antarmuka Halaman Data Pembayaran SPP ... 53

Gambar 4. 1 Basis Data Aplikasi ... 56

Gambar 4. 2 Antarmuka Halaman Awal ... 62

Gambar 4. 3 Antarmuka Halaman Login ... 63

xiii

Gambar 4. 9 Antarmuka Menu Keuangan Pada Halaman Utama ... 67

Gambar 4. 10 Antarmuka Halaman Daftar Data Santri ... 68

Gambar 4. 11 Antarmuka Halaman Tambah Data Santri ... 69

Gambar 4. 12 Antarmuka Halaman Ubah Data Santri ... 69

Gambar 4. 13 Antarmuka Halaman Hapus Data Santri ... 70

Gambar 4. 14 Antarmuka Halaman Daftar Data Ustadz... 71

Gambar 4. 15 Antarmuka Halaman Tambah data Ustadz... 72

Gambar 4. 16 Antarmuka Halaman Ubah Data Ustadz ... 72

Gambar 4. 17 Antarmuka Halaman Hapus Data Ustadz... 73

Gambar 4. 18 Antarmuka Halaman Daftar Data Monitoring Qiroah ... 74

Gambar 4. 19 Antarmuka Halaman Tambah Data Qiroah ... 74

Gambar 4. 20 Antarmuka Daftar Santri ... 75

Gambar 4. 21 Antarmuka Pilih Jenis Hafalan ... 76

Gambar 4. 22 Antarmuka Halaman Isi Hafalan ... 77

Gambar 4. 23 Antarmuka Daftar Data Hafalan Santri ... 78

Gambar 4. 24 Antarmuka Halaman Daftar Data Pembayaran SPP ... 79

xiv

manual sehingga informasi yang didapatkan kurang akurat dan tidak terdokumentasi dengan baik bahkan kurang rapi yang dikarenakan masih berupa tulisan tangan sehingga menyebabkan pekerjaan dilakukan berulang kali yaitu harus diketik ulang data yang sudah dicatat oleh catatan tangan. Masalah tersebut dapat dikurangi dengan membuat aplikasi web yang mampu menyimpan data seluruh proses akademik yang ada pada TKA/TPA Al-Iman. Metode yang digunakan dalam pembuatan aplikasi adalah metode Waterfall. Aplikasi berbasis web yang dibuat menggunakan Bahasa pemrograman C# berbasis ASP.NET dengan metode MVC framework dan database SQL Server Management Studio. Berdasarkan hasil pengujian dapat disimpulkan bahwa aplikasi yang dibuat dapat membantu proses manajemen yaitu menyimpan data disetiap kegiatan akademik yang praktis dan dalam bentuk digital yang menggantikan catatan dalam bentuk tulisan tangan.

BAB I PENDAHULUAN

1.1 Latar Belakang

Perkembangan teknologi informasi yang demikian pesatnya telah membawa perubahan pada hampir seluruh segi kehidupan manusia, lebih-lebih pada kegiatan dunia pendidikan atau akademik. Saat ini kegiatan dunia akademik banyak dipermudah dan dipercepat oleh penggunaan teknologi informasi, dimana tanpa adanya informasi yang cepat, lengkap, dan akurat, keputusan-keputusan yang diambil menjadi terlambat dan menyesatkan. Dengan demikian, lembaga akademik menjadi tidak mampu bersaing dengan lembaga lain.

Dengan komputer manfaatnya bisa dirasakan dalam kehidupan sehari-hari. Komputer bisa menjadi alat bantu dalam mengolah data guna memberi informasi secara cepat. Meskipun demikian teknologi itu sendiri tergantung pada orang yang menggunakan, dengan sedikit kreativitas pengolahan dalam penggunaan komputer bisa menjadikan segala sesuatu menjadi efektif dan efisien meskipun dalam praktek hasilnya tidak mutlak harus dirasakan akan tetapi bisa membuat suatu perubahan berkelanjutan.

Taman Kanak-Kanak Al-Qur’an (TKA) dan Taman Pendidikan Al-Qur’an (TPA/TPQ) adalah lembaga atau kelompok masyarakat yang menyelenggarakan pendidikan non formal jenis keagamaan Islam yang bertujuan untuk memberikan pengajaran membaca Al-Qur’an sejak usia dini, serta

memahami dasar-dasar dinul Islam pada anak usia taman kanak-kanak, sekolah dasar dan atau madrasah ibtidaiyah (SD/MI) atau bahkan yang lebih tinggi.

TKA/TPA Al-Iman Kalibayem merupakan sebuah lembaga yang menyelenggarakan pendidikan nonformal berupa keagamaan Islam. Seiring dengan perkembangan zaman yang dibarengi dengan peningkatan kemajuan Teknologi dan Informasi maka TKA/TPA Al-Iman Kalibayem sudah menggunakan komputer sebagai kelengkapan pemenuhan administrasi. Selama ini sistem pembukuan di TPA/TKA Al-Iman Kalibayem masih bersifat manual, dan sering terjadi kesalahan, pergeseran data yang mengakibatkan terlambatnya proses laporan. Hal ini sangat memakan waktu karena laporan harus sering melakukan perbaikan, yang bahkan cenderung merugikan.

Melihat kebutuhan akan program aplikasi sistem informasi manajemen pada TKA/TPA Al-Iman Kalibayem ini sangat penting maka diambil untuk membuat tugas akhir dengan judul “PENGEMBANGAN SISTEM INFORMASI MANAJEMEN TKA/TPA BERBASIS MVC STUDI KASUS DI TKA/TPA AL-IMAN KALIBAYEM”. Sistem informasi ini merupakan sebuah aplikasi alat bantu dalam proses pengolahan data yang digunakan di TKA/TPA Al-Iman Kalibayem yang merupakan sebuah lembaga di suatu wilayah yang bertugas untuk mengkoordinasi dan mendidik santri Taman Kanak Al-Qur’an atau Taman Pendidikan Al-Qur’an di Kalibayem. Aplikasi ini dibuat berdasarkan kebutuhan yang ada di TKA/TPA Al-Iman Kalibayem yang antara lain mengolah data seputar data pengurus, santri, ustad/dzah, laporan dan keuangan. Sistem ini dibuat menggunakan MVC dan perancangan database menggunakan Microsoft SQL

Server Management. Dengan aplikasi ini diharapkan akan memberikan kemudahan dalam pengolahan data yang selama ini masih kurang tertata secara rapi.

1.2 Rumusan Masalah

Dari latar belakang permasalahan di atas, maka dapat disimpulkan bahwa TKA/TPA Al-Iman Kalibayem memiliki beberapa permasalahan mengenai pengolahan data, baik data santri, ustadz, bahkan keuangan santri yang dikerjakan menggunakan sistem pembukuan secara manual sehingga memungkinkan adanya kesalahan dalam pencatatan data yang menyebabkan terhambatnya proses laporan bahkan kesalahan laporan.

1.3 Tujuan Penelitian

Tujuan dari penelitian ini diantaranya adalah untuk membangun aplikasi sistem informasi manajemen berbasis web yang dapat mengelola data santri, ustadz/ustadzah, rapot, pembayaran SPP, dan kartu prestasi santri sehingga tidak terjadi kembali sistem pembukuan yang digunakan secara manual melainkan menggunakan teknologi yang ada agar proses manajemen berjalan dengan lancar, mudah dan menjadikan sistem di TKA/TPA lebih baik dari pada sebelumnya. 1.4 Manfaat Penelitian

Manfaat yang didapatkan dari penelitian ini adalah sebagai berikut:

1. Pencatatan data santri dan ustadz/ustadzah pada TKA/TPA Al-Iman Kalibayem.

2. Pencatatan kartu prestasi akademik santri selama santri aktif belajar sehingga memudahkan orang tua santri untuk memonitoring anaknya.

3. Mempermudah bagian keuangan khususnya pada pembayaran SPP, dan infaq santri.

1.5 Sistematika Penulisan

Sistematika penulisan tugas akhir secara garis besar diuraikan sebagai berikut:

BAB I PENDAHULUAN

Bab I menjelaskan mengenai latar belakang pemilihan tema, perumusan masalah, identifikasi masalah, tujuan dan manfaat serta sistematika penulisan.

BAB II TINJAUAN PUSTAKA DAN LANDASAN TEORI

Bab II memaparkan kajian-kajian pustaka sebagai pembanding dan menjelaskan teori-teori yang menjadi acuan dalam penulis, yaitu mulai dari penjelasan tentang teknologi, penjelasan tentang teori yang digunakan dalam membangun aplikasi hingga pada database yang digunakan.

BAB III METODE PENELITIAN

Bab III berisi analisis kebutuhan dalam membangun aplikasi, analisis sistem yang sedang berjalan pada aplikasi apakah sesuai dengan metode pembangunan perangkat lunak yang digunakan. Selain itu terdapat juga rancangan antarmuka untuk aplikasi.

BAB IV HASIL DAN PEMBAHASAN

Bab IV menjelaskan mengenai implementasi sistem dan hasil pengujian sistem yang telah dibuat.

BAB V KESIMPULAN DAN SARAN

Bab V menjelaskan mengenai kesimpulan dan saran yang dibutuhkan dari hasil penelitian yang telah dibuat.

BAB II

TINJAUAN PUSTAKA DAN LANDASAN TEORI

2.1 Tinjauan Pustaka

Taman Kanak-kanak Al-Qur’an dan Taman Pendidikan Al-Qur’an merupakan metode pendekatan dalam pembelajaran membaca Al-Qur’an, Iqro dan lain-lain untuk anak usia dini hingga anak-anak. Di Indonesia menempuh pendidikan TKA/TPA tidaklah wajib, namun dalam perkembangannya masyarakat membutuhkan lembaga ini untuk memberikan dasar-dasar membaca Al-Qur’an atau mengaji kepada anak-anaknya terutama bagi orang tua yang bekerja.

Penerapan teknologi pada era ini sangat dibutuhkan dan membantu dalam mengelola manajemen baik perusahaan ataupun lembaga. Rilla Gantino dan Ari Anggarani (2014) membuat sebuah jurnal penelitian dan pembuatan aplikasi tentang sistem informasi manajemen pada TPA yang berjudul “Perancangan dan implementasi sistem informasi manajemen pada TPA Kecamatan Pulogadung”,

pada penelitian tersebut dijelaskan bahwa dalam rangka meningkatkan kualitas pendidikan agama perlu dirancang sebuah sistem informasi manajemen yang akan memberikan informasi secara cepat dan tepat baik mengenai proses manajemen maupun informasi tentang keuangan dan akuntansi serta tentang proses pelaksanaan dan proses belajar mengajar pada TPA tersebut.

Sistem informasi manajemen bertujuan untuk menghasilkan informasi kepada pihak manajemen serta menjamin terselenggaranya tertib administrasi yang akan

menjamin keberlanjutan operasional dan pengembangan wilayah operasi TPA berbasis IT. Hal tersebut didukung oleh beberapa penelitian yang berkait dengan analisis dan perancangan sistem informasi misalnya yang dilakukan oleh Yosua P.W Simaremare, Apol Pribadi S dan Radityo Prasetianto Wibowo (2013) mengembangkan aplikasi tentang “Perancangan dan Pembuatan Aplikasi Manajemen Publikasi Ilmiah Berbasis Online pada Jurnal SISFO”. Mereka mengembangkan aplikasi dengan menggunakan metode Spesifikasi Kebutuhan Perangkat Lunak (SKPL) dan untuk pembuatan aplikasi mereka menggunakan Java Enterprise Edition (JEE). Dalam penelitiannya, Yosua P.W Simaremare, Apol Pribadi S dan Radityo Prasetianto Wibowo menyimpulkan bahwa untuk menjadikannya proses pengelolaan manajemen pada sistem publikasi ilmiah dibutuhkannya aplikasi manajemen publikasi ilmiah berbasis online yang mampu mengelola kegiatan publikasi ilmiah untuk menciptakan pengelolaan dan publikasi yang lebih baik dan meningkatkan kemudahan akses.

Vindhy Agus Setiawan (2011) membuat penelitian berupa analisis dan perancangan yang berjudul “Analisis dan Perancangan Sistem Informasi Simpan Pinjam Pada LKM Gerembeng Bali”, Pada penelitian tersebut dijelaskan bahwa teknologi komputer saat ini sangat dibutuhkan khususnya pada bidang administrasi seperti halnya lembaga keuangan untuk menunjang kelancaran seluruh transaksi yang dilakukan, sehingga dapat memberikan pelayanan transaksi dengan cepat dan akurat. Sistem informasi tersebut dirancang menggunakan Bahasa pemrograman Java dan MySQL sebagai databasenya.

Dari ketiga penelitian diatas, dapat diambil kesimpulan bahwa teknologi sangat dibutuhkan dalam membuat sistem informasi manajemen, yaitu dengan dibuatnya aplikasi agar sistem informasi lebih efektif dan efisien. Selain itu juga untuk mempermudah pengguna dalam mengelola manajemen, baik membuat data baru, edit data, hapus data, dan rekap laporan. Berdasarkan penelitian yang sudah ada, maka penulis menambahkan beberapa spesifikasi yang menjadi perbedaan dengan sistem yang dikembangkan. Perbedaan tersebut adalah sebagai berikut: 1. Aplikasi dibuat menggunakan MVC ASP.NET sehingga dapat diolah tidak

hanya satu komputer saja.

2. Aplikasi yang dikembangkan menggunakan SQL Server Management sebagai database.

3. Aplikasi dapat mencatat semua data santri, hingga prestasi santri.

4. Aplikasi dapat mengelola keuangan administrasi santri yaitu SPP, infaq, dan sedekah.

5. Aplikasi dapat menampilkan laporan setiap santri beserta keterangan santri. 2.2 Landasan Teori

2.2.1 Taman Kanak-Kanak / Pendidikan Al-Qur’an

Taman Kanak-kanak Al-Qur’an (TKA) dan Taman Pendidikan Al-Qur'an (TPA) merupakan tempat pembelajaran Al-Qur'an untuk anak-anak sejak usia dini. Anak mampu menerima pelajaran TPA dan dapat memahami materi jika sudah berumur 3,5 tahun ke atas untuk TKA dan 6 tahun keatas untuk TPA yang dibubuhi dengan permainan, bernyanyi, dan hafalan-hafalan doa harian sehingga anak dapat menerima materi yang diberikan oleh guru mereka.

TKA/TPA memiliki banyak kelebihan dibandingkan jika anak diajari al-Qur'an dengan cara privat di rumah, di antaranya adalah:

1. Anak mudah bersosialisasi, mandiri dan siap berkompetisi dengan santri lainnya.

2. Model kenaikan ke jilid atau materi selanjutnya akan benar-benar terkontrol karena melalui tahap ujian oleh kepala sekolah/ Tim penguji.

3. Sistem klasikal di TKA/TPA akan semakin membuat anak bersemangat untuk segera naik ke kelas berikutnya, sehingga anak termotivasi untuk belajar di rumah.

4. Bukan hanya membaca, menulis arab, bernyanyi, bertepuk, mengusai hafalan dan praktek sholat juga merupakan materi penting yang akan efektif jika diajarkan bersama-sama.

5. Setelah purna ngaji, Santri akan diwisuda bersama santri lainnya.

Ada beberapa hal yang perlu diperhatikan untuk menjadikan TKA/TPA lebih efektif dan kompeten, diantaranya:

1. Jam masuk dan jam pulang yang on time, sehingga anak-anak sejak usia dini sudah dididik untuk belajar tepat waktu.

2. Petugas/pengelola yang selalu stand by di kantor untuk melayani pendaftaran dan informasi TKA/TPA.

3. Ustadz/ustadzah yang selalu siaga untuk mengajar, dan mengawasi santri, jika terdapat ustadz/ustadzah yang berhalangan hadir harus ada ijin ke pengelola, sehingga akan dicarikan penggantinya.

4. Terdapat tim penguji kenaikan jilid, yang terdiri dari penguji per jilid, dan penguji materi hafalan do'a harian, praktek sholat dan surat-surat pendek. 5. Terdapat buku prestasi santri untuk mengontrol kenaikan halaman setiap

jilid.

6. Diadakannya evaluasi oleh pengelola TKA/TPA bagi ustadz/ustadzah agar setiap permasalahan dapat teratasi, dan juga diadakannya tadarus Al-Qur’an untuk ustadz/ustadzah agar kualitas bacaan terkontrol.

7. Tempat KBM yang nyaman dan menarik sesuai dengan umur santri. 8. Semua ustadz/ustadzah harus benar-benar sudah menguasai metodologi

pengajaran TKA/TPA.

9. Pembekalan untuk ustadz dalam menangani santri bermasalah, santri lambat menerima pelajaran dan lainnya.

Pengoperasian TKA/TPA masih bersifat manajemen kekeluargaan, artinya semua yang dikelola dalam hal manajemen masih bersifat manual dan informasi yang dihasilkan masih parsial. Untuk itu agar TKA/TPA dapat dikembangkan, perlu dirancang sebuah sistem informasi manajemen berbasis IT yang akan memberikan informasi secara cepat dan tepat baik mengenai proses manajemen maupun informasi tentang keuangan dan akuntansi serta tentang proses pelaksaan proses belajar mengajar pada TKA/TPA tersebut.

2.2.2 Sistem Informasi

Menurut Hall (2008 : 4), sistem didefinisikan sebagai sekelompok dua atau lebih komponen-komponen atau subsistem-subsistem yang saling berkaitan untuk mencapai tujuan yang sama. Definisi menurut Gelinas dan Dull (2008 : 11), sistem

merupakan seperangkat elemen yang saling bergantung yang bersama-sama mencapai tujuan tertentu. Sistem harus memiliki organisasi, hubungan timbal balik, integrasi, dan tujuan pokok.

Sistem informasi menurut Hall (2008 : 6), adalah sebuah rangkaian prosedur formal dimana data dikumpulkan, diproses menjadi informasi, dan didistribusikan kepada para pemakai. Nilai tambah dari Sistem Informasi adalah adalah memperbaiki kualitas dan mengurangi biaya produksi dan jasa, memperbaiki efisiensi, memperbaiki decision making capabilities, serta menaikkan the sharing of knowledge.

Terdapat tiga aktivitas pada sistem infromasi :

1. Input adalah sekumpulan data mentah dalam organisasi maupun di luar organisasi untuk diproses dalam suatu sistem ekonomi.

2. Processing adalah konversi/pemindahan, manipulasi dan analisis input mentah menjadi bentuk yang lebih berarti bagi manusia.

3. Output adalah distribusi informasi yang sudah diproses ke anggota organisasi dimana output tersebut akan digunakan.

Menurut Jogiyanto (2005). Sistem informasi adalah kerangka kerja yang mengkoordinir sumber daya (manusia, komputer) untuk mengubah masukan (input) menjadi keluaran (output) berupa informasi guna mencapai sasaran. Sistem informasi terdiri dari komponen- komponen yang disebut blok bangunan atau

building block.

Dengan demikian sistem merupakan kumpulan dari beberapa bagian yang memiliki keterkaitan dan saling bekerja sama serta membentuk suatu kesatuan

untuk mencapai suatu tujuan dari sistem tersebut. Maksud dari suatu sistem adalah untuk mencapai suatu tujuan dan sasaran dalam ruang lingkup yang sempit.

2.2.3 Sistem Informasi Manajemen

Menurut McLeod & Schell (2008: 12), Sistem Informasi Manajemen (SIM) adalah sistem berbasis komputer yang membuat informasi tersedia untuk user dengan kebutuhan. Sistem informasi manajemen dibedakan dengan sistem informasi biasa karena SIM digunakan untuk menganalisis sistem informasi lain yang diterapkan pada aktivitas operasional organisasi. Secara akademi, istilah ini umumnya digunakan untuk merujuk pada kelompok metode manajemen informasi yang bertalian dengan otomasi atau dukungan terhadap pengambilan keputusan manusia, misalnya sistem pendukung keputusan, sistem pakar, dan sistem informasi eksekutif.

Menurut Chr. Jimmy L. Gaol (2008) Sistem Informasi Manajemen secara umum apat dikatakan sebagai sebuah sistem manusia dan mesin yang terintegrasi dalam menyediakan informasi guna mendukung fungsi operasi manajemen dan penentuan alternative tindakan dalam sebuah organisasi sistem tersebut. Dalam operasinya, sistem informasi manajemen menggunakan perangkat keras (hardware), perangkat lunak (software), prosedur, model manajemen, dan keputusan serta sebuah terminal data.

Sistem Informasi Manajemen (SIM) atau Management Information System (MIS) dikembangkan untuk memberikan dukungan kepada kelompok-kelompok besar manajer, atau kemungkinan seluruh manajer di perusahaan. Pengenalan SIM

disertai dengan munculnya aplikasi-aplikasi berorientasi kantor yang mengalami evolusi, menjadi apa yang dikenal saat ini sebagai kantor virtual.

Sistem Informasi Manajemen merupakan keseluruhan jaringan informasi yang ditujukan kepada pembuatan keterangan keterangan bagi para manajer dan para pengguna lainnya yang berfungsi untuk pengambilan keputusan atau kebutuhan lain dalam cakupan organisasi atau perorangan. Informasi adalah data yang telah diolah, dianalisis melalui suatu cara sehingga memiliki arti dan makna. Sedangkan data adalah fakta atau fenomena yang belum dianalisis. Hal yang perlu diperhatikan dalam SIM adalah:

1. Identifikasi jenis informasi yang dibutuhkan. 2. Menentukan jenis informasi yang dibutuhkan.

3. Menentukan kapan dan siapa yang membutuhkan informasi.

4. Mengkomunikasikan informasi tersebut secara tepat kepada para pengguna.

2.2.4 Metode Systems Development Life Cycle (SDLC)

SDLC (The Systems Development Life Cycle) adalah proses pembuatan dan pengubahan sistem serta model dan metodologi yang digunakan untuk mengembangkan sistem-sistem tersebut. Konsep ini umumnya merujuk pada sistem komputer atau informasi. SDLC juga merupakan pola yang diambil untuk mengembangkan sistem perangkat lunak, yang terdiri dari tahap-tahap: rencana (planning), analisis (analysis), desain (design), implementasi (implementation), uji coba (testing) dan pengelolaan (maintenance).

Dalam rekayasa perangkat lunak, konsep SDLC mendasari berbagai jenis metodologi pengembangan perangkat lunak. Metodologi-metodologi ini membentuk suatu kerangka kerja untuk perencanaan dan pengendalian pembuatan sistem informasi, yaitu proses pengembangan perangkat lunak. Terdapat 3 jenis metode siklus hidup sistem yang paling banyak digunakan, yakni: siklus hidup sistem tradisional (traditional system life cycle), siklus hidup menggunakan prototyping (life cycle using prototyping), dan siklus hidup sistem orientasi objek (object-oriented system life cycle).

Dengan siklus SDLC, proses membangun sistem dibagi menjadi beberapa langkah dan pada sistem yang besar, masing-masing langkah dikerjakan oleh tim yang berbeda. Dalam sebuah siklus SDLC, terdapat enam langkah. Jumlah langkah SDLC pada referensi lain mungkin berbeda, namun secara umum adalah sama. Langkah tersebut adalah :

1. Analisis sistem, yaitu membuat analisis aliran kerja manajemen yang sedang berjalan.

2. Spesifikasi kebutuhan sistem, yaitu melakukan perincian mengenai apa saja yang dibutuhkan dalam pengembangan sistem dan membuat perencanaan yang berkaitan dengan proyek sistem.

3. Perancangan sistem, yaitu membuat desain aliran kerja manajemen dan desain pemrograman yang diperlukan untuk pengembangan sistem informasi.

4. Pengembangan sistem, yaitu tahap pengembangan sistem informasi dengan menulis program yang diperlukan.

5. Pengujian sistem, yaitu melakukan pengujian terhadap sistem yang telah dibuat.

6. Implementasi dan pemeliharaan sistem, yaitu menerapkan dan memelihara sistem yang telah dibuat.

2.2.5 Pengembangan Aplikasi Berbasis Web

Aplikasi berbasis web merupakan pengembangan sistem aplikasi/perangkat lunak pada komputer yang didukung dengan beberapa bahasa pemrograman seperti PHP, HTML, ASP.NET, JavaScript, Ruby, CSS dan lain-lain.

Aplikasi berbasis web menjadi popular karena kemudahan tersedianya aplikasi klien untuk mengaksesnya, penjelajah web, yang kadang disebut sebagai

thin client (klien tipis). Kemampuan untuk memperbarui dan memelihara aplikasi web tanpa harus mendistribusikan dan menginstalasi perangkat lunak pada kemungkinan ribuan komputer klien merupakan alasan kunci popularitasnya. Aplikasi web yang umum misalnya webmail, took ritel daring, lelang daring, wiki, papan diskusi, weblog, serta MMORPG menurut Pratama (2010).

Aplikasi berbasi web dapat digunakan untuk berbagai macam tujuan yang berbeda. Sebagai contoh aplikasi berbasis web dapat digunakan untuk membuat

invoice dan memberikan cara yang mudah dalam penyimpanan data di database. Aplikasi ini juga dapat dipergunakan untuk mengatur persediaan, karena fitur tersebut sangat berguna khususnya bagi mereka yang berbisnis ritel. Bukan hanya itu, Aplikasi berbasis web juga dapat bekerja memonitoring sistem dalam hal tampilan. Rudi Yusrin (2013).

2.2.6 Metode Model View Controller (MVC)

Model View Controller atau MVC adalah sebuah metode untuk membuat sebuah aplikasi dengan memisahkan data (Model) dari tampilan (View) dan cara bagaimana memprosesnya (Controller). Dalam Implementasinya kebanyakan

framework dalam aplikasi website adalah berbasis arsitektur MVC.

MVC memisahkan pengembangan aplikasi berdasarkan komponen utama yang membangun sebuah aplikasi seperti manipulasi data, antarmuka pengguna, dan bagian yang menjadi control dalam sebuah aplikasi. Berikut merupakan penjelasan mengenai bagian dari MVC:

1. Model mewakili struktur data. Biasanya model berisi fungsi-fungsi yang membantu seseorang dalam pengelolaan basis data seperti memasukan data ke basis data, pembaruan data, dan lain-lain.

2. View adalah bagian yang mengatur tampilan pengguna. Bisa dikatakan berupa halaman web.

3. Controller merupakan bagian yang menjembatani model dan view. Controller berisi perintah-perintah yang berfungsi untuk memproses suatu data dan mengirimkannya ke halaman web.

MVC memiliki beberapa jenis yang diterapkan pada website. Jenis MVC pada website antara lain:

1. Server Side MVC. Server Side MVC biasa terjadi pada aplikasi

web tradisional, yang tidak melibatkan client side seperti Javascript, Java applet, Flash, dan lain-lain. Server Side MVC menyerahkan keseluruhan proses bisnis pada server, aplikasi pada sisi pengguna hanya dapat

menerima. MVC jenis ini kadang-kadang disebut juga dengan nama Thin Client.

2. Mixed Client Side and Server Side MVC. Pada Mixed Client Side and Server Side MVC 1 client tidak menggunakan model sebagai jembatan untuk melakukan komunikasi pada server, dibandingkan dengan Server Side MVC, arsitektur ini memiliki tingkat kompleksitas yang lebih tinggi karena lebih banyak komponen yang terlibat. Untuk selanjutnya arsitektur ini disebut, dengan Mixed MVC 1. Pada Mixed Client Side and Server Side

MVC 2, client menggunakan model sebagai jembatan untuk melakukan komunikasi pada server, dibandingkan dengan arsitektur MVC yang lain, arsitektur ini memiliki tingkat kompleksitas yang paling tinggi karena lebih banyak komponen yang terlibat, sehingga membutuhkan sumber daya yang lebih besar pula. Untuk selanjutnya arsitektur ini disebut dengan Mixed

MVC 2.

3. Rich Internet Application MVC. Application MVC Rich Internet

Application (RIA) disebut juga dengan nama Fat Client, merupakan aplikasi web yang memiliki kemampuan dan fungsi hampir seperti aplikasi desktop. RIA pada sisi client, memiliki mesin untuk mengambil data yang berada pada server, sehingga pada client terdapat bagian MVC sendiri dan hanya membutuhkan bagian model pada sisi server.

2.2.7 ASP.NET

Active Server Pages .NET (sering disingkat sebagai ASP.NET) adalah kumpulan teknologi dalam Framework .NET untuk membangun aplikasi

web dinamik dan XML Web Service (Layanan Web XML). Halaman ASP.NET dijalankan di server kemudian akan dibuat halaman markup (penanda) seperti HTML ( Hypertext Markup Language), WML (Wireless Markup Language), atau XML (Extensible Markup Language) yang dikirim ke browser desktop atau mobile. Selain itu juga Bahasa pemograman ini dikembangkan oleh Microsoft. ASP.NET digunakan untuk membuat halaman web yang merupakan bagian integral dari Microsoft .NET framework. Sebagai anggota dari .NET, ASP.NET adalah tool yang sangat berguna bagi programmer yang memudahkan programmer untuk membuat website yang dinamis yang disertai dengan bahasa VB dan C# (Daniel Utomo, 2013).

ASP.NET merupakan komponen Internet Information Services (IIS). Oleh karena itu, untuk menginstalasikan ASP, harus juga menginstalasikan IIS. ASP.NET adalah komponen utama Window yang membuat IIS dapat menjalankan aplikasi yang berbasiskan .NET.

ASP.NET memiliki banyak keunggulan, antara lain:

1. Penyederhanaan ASP.NET lebih mudah untuk dibuat, seperti pembuatan form, otentikasi client, validasi data, konfigurasi situs, dan deployment. 2. Perbaikan Performa, karena ASP.NET dikompilasi ke CLR sehingga

performanya lebih baik dari ASP yang interpreter.

3. Form-form Web, merupakan model pemrograman baru yang menggabungkan aplikasi ASP dengan kemudahan pengembangan dan produktifitas Visual Basic.

4. Kode Nonspaghetti. Model pemrograman ASP.NET memisahkan kode dari presentasi sehingga mempermudah membuat konstruksi dan mengelola kode.

5. Perbaikan Manajemen Status. ASP.NET menyediakan status aplikasi dan sesi yang mudah digunakan. ASP.NET mengatasi keterbatasan tersebut dengan menyediakan dukungan pendistribusian status sesi dalam server

web, menaruh informasi status dalam SQL Server, serta menyediakan pengelolaan status tanpa cookies.

6. Pengamanan. ASP.NET menyediakan layanan otorisasi (menentukan apakah pengguna memiliki izin untuk melakukan tindakan yang diminta) dan otentikasi (menentukan identitas pengguna yang melakukan permintaat) yang telah diperbaiki menggunakan Cookie Authentication Module dan URL Authorization Module.

7. Konfigurasi. ASP.NET menggunakan file XML untuk menyimpan pengaturan konfigurasi. Hal ini membuat deployment situs menjadi lebih mudah.

8. Layanan Web. ASP.NET dapat digunakan untuk mengekspos fungsi bisnis ke partner melalui protokol Web standar.

9. Caching. Disediakan mesin caching untuk meningkatkan kinerja aplikasi dan mengurangi beban pemroses server web dan serverdatabase.

10. Debugging. ASP.NET memiliki utilitas tracking yang build-in.

11. Deployment. Deployment dapat dilakukan dengan cara menyalin file karena semua pengaturan konfigurasi situs terdapat dalam file XML.

2.2.8 Sql Server Management Studio

Microsoft SQL Server Management Studio adalah sebuah aplikasi sistem manajemen basis data relasional (RDBMS) produk Microsoft. Bahasa query utamanya adalah Transact-SQL yang merupakan implementasi dari SQL standar ANSI/ISO yang digunakan oleh Microsoft dan Sybase. Umumnya SQL Server digunakan di dunia bisnis yang memiliki basis data berskala kecil sampai dengan menengah, tetapi kemudian berkembang dengan digunakannya SQL Server pada basis data besar. Microsoft SQL Server dan Sybase/ASE dapat berkomunikasi lewat jaringan dengan menggunakan protokol TDS (Tabular Data Stream). Selain dari itu, Microsoft SQL Server juga mendukung ODBC (Open Database Connectivity), dan mempunyai driver JDBC untuk bahasa pemrograman Java. Fitur yang lain dari SQL Server ini adalah kemampuannya untuk membuat basis data mirroring dan clustering.

Microsoft SQL Server termasuk DBMS profesional. Beberapa pesaing seperti MySQL, Oracle, telah mengembangkan software serupa dalam beberapa tahun terakhir, tetapi Microsoft SQL Server lebih mudah digunakan dan memiliki lebih banyak fitur. Pemicunya antara lain adalah dukungan penuh dari Microsoft. Perangkat lunak yang ditawarkan oleh Microsoft juga menawarkan integrasi yang erat dengan .NET framework, dan ini tidak dimiliki oleh produk lain (Aiska, 2011). 2.2.9 Microsoft Visual Studio

Microsoft Visual Studio merupakan sebuah perangkat lunak lengkap (suite) yang dapat digunakan untuk melakukan pengembangan aplikasi, baik itu aplikasi bisnis, aplikasi personal, ataupun komponen aplikasinya, dalam bentuk aplikasi

console, aplikasi Windows, ataupun aplikasi Web. Visual Studio mencakup kompiler, SDK, Integrated Development Environment (IDE), dan dokumentasi (umumnya berupa MSDN Library). Kompiler yang dimasukkan ke dalam paket Visual Studio antara lain Visual C++, Visual C#, Visual Basic, Visual Basic .NET, Visual InterDev, Visual J++, Visual J#, Visual FoxPro, dan Visual SourceSafe.

Microsoft Visual Studio dapat digunakan untuk mengembangkan aplikasi dalam native code (dalam bentuk bahasa mesin yang berjalan di atas Windows) ataupun managed code (dalam bentuk Microsoft Intermediate Language di atas .NET Framework). Selain itu, Visual Studio juga dapat digunakan untuk mengembangkan aplikasi Silverlight, aplikasi Windows Mobile (yang berjalan di atas .NET Compact Framework).

BAB III

METODE PENELITIAN

3.1. Alat dan Bahan Penelitian

Dalam penelitian dibutuhkan beberapa alat dan bahan untuk mendukung berjalannya perancangan dan implementasi aplikasi.

3.1.1 Alat

Alat yang digunakan berupa perangkat keras dan perangkat lunak. a. Perangkat Keras

1. Personal Computer (PC) atau laptop.

32/64 bit architecture processor, 8 GB Random Access Memmory

(RAM), Sistem Operasi Windows 8. 2. Printer dokumen untuk mencetak laporan. b. Perangkat Lunak

1. Microsoft Visual Studio 2013 2. SQL Server Management 2014 3.1.2 Bahan

Dalam penelitian bahan yang digunakan adalah:

1. Data yang diperoleh melalui studi literatur berdasarkan penelitian sebelumnya yang masih memiliki keterkaitan dengan aplikasi yang dikembangkan. Dari data yang diperoleh, maka didapatkan kebutuhan dari aplikasi pada saat pengembangan aplikasi.

2. Data TKA/TPA, santri, ustadz dan keuangan TKA/TPA Al-Iman Kalibayem.

3.2 Teknik Pengumpulan Data 3.2.1 Wawancara

Pengambilan data dalam penelitian ini menggunakan metode wawancara yang merupakan percakapan antara dua orang atau lebih dan berlangsung antara narasumber dan pewawancara. Tujuan dari wawancara adalah untuk mendapatkan informasi di mana sang pewawancara melontarkan pertanyaan-pertanyaan untuk dijawab oleh orang yang diwawancarai.

Pada teknik ini, peneliti mewawancarai secara langsung pihak yang terkait pada TKA/TPA Al-Iman agar peneliti mendapatkan informasi maupun data-data yang diperlukan untuk perancangan sistem informasi sesuai kebutuhan dari lembaga terkait.

3.2.2 Observasi

Metode observasi ini dilakukan untuk mengamati secara langsung objek penelitian agar peneliti dapat mengumpulkan data dan menyimpulkan data secara langsung di lapangan. Dari hasil pengamatan secara langsung, proses akademik yang terjadi pada TKA/TPA Al-Iman terutama dalam sistem manajemen masih dilakukan secara manual menggunakan catatan baik buku maupun Microsoft Word.

Sehingga hal ini akan menyulitkan bagi admin yang bertugas untuk mengolah data pada lembaga ini.

3.2.3 Alur Penelitian

Untuk perancangan dan pembuatan sistem, peneliti menggunakan model SDLC (Software Development Life Cycle). Model ini dipilih untuk melakukan proses produksi sistem dan juga proses maintenance software.

Model SDLC yang peneliti pakai adalah model Waterfall atau Classic Life Cycle. Disebut waterfall karena tahap demi tahap yang dilalui harus menuggu selesainya tahap sebelumnya secara urut. Model ini adalah model yang sering digunakan dalam hal Software Engineering (SE). Berikut adalah tahapan pembuatan aplikasi sesuai dengan model SDLC Waterfall.

a. System / Information Engineering and Modeling.

Merupakan tahap awal dalam model waterfall. Permodelan ini diawali dengan mencari kebutuhan dari keseluruhan sistem yang akan diaplikasikan ke dalam bentuk software. Dalam tahap ini lebih ditonjolkan bagaimana software

harus dapat berinteraksi dengan elemen-elemen yang lain seperti hardware,

database, dan sebagainya.

b. Software Requirements Analysis

Proses ini lebih difokuskan pada pencarian kebutuhan software. Software Engineer harus mengerti tentang domain informasi dari software agar mengetahui sifat dari program yang akan dibuat, seperti bagaimana user interface yang dibutuhkan, dan kebutuhan fungsi-fungsi lainnya pada aplikasi.

c. Design

Proses ini digunakan untuk mengubah kebutuhan-kebutuhan diatas menjadi representasi ke dalam bentuk “blueprint” software sebelum coding dimulai. Desain harus dapat mengimplementasikan kebutuhan yang telah disebutkan pada tahap sebelumnya. Proses ini harus didokumentasikan sebagai konfigurasi dari software.

d. Coding

Merupakan proses penting, yaitu mengubah bentuk desain menjadi bentuk yang dapat dimengerti oleh mesin, yaitu kedalam bahasa pemrograman melalui proses coding. Tahap ini merupakan implementasi dari tahap design yang secara teknis nantinya dikerjakan menggunakan bahasa ASP.NET sebagai controller dan

e. Testing / Verification

Pada proses ini software hasil produksi harus diuji cobakan, termasuk semua fungsi-fungsinya. Proses ini bertujuan agar software bebas dari error, dan hasilnya harus benar-benar sesuai dengan kebutuhan yang sudah didefinisikan sebelumnya. f. Maintenance

Proses ini merupakan tahap pemeliharaan software. Software yang dibuat harus memiliki tahap pemeliharaan atau pembaharuan, karena proses ini memungkinkan untuk penambahan fitur-fitur baru, dan juga perbaikan apabila terdapat error pada sistem yang dikembangkan.

3.3 Analisis Penelitian 3.3.1 Arsitektur

Gambar 3. 2 Arsitektur Riil

Database server yang digunakan pada aplikasi adalah SQL Server 2014 Management Studio yang kemudian akan diolah melewati IIS server local. Aplikasi yang digunakan oleh pengguna menggunakan Web Application dengan metode MVC (Model View Control) berbahasa ASP.NET sebagai controller, dan Html

sebagai View/User Interface. Saat pengguna mengakses aplikasi, local server

memuat antarmuka dan melakukan pengambilan data yang diperlukan dari

database server. Melalui antarmuka yang ditampilkan oleh web application melalui

browser, pengguna dapat mengolah data, baik menyimpan, menghapus, dan mengedit data pada aplikasi dan disimpan kedalam database.

3.3.2 Analisis Pengguna

Website yang dibuat hanya digunakan oleh ustadz/ustadzah yang sekaligus berperan sebagai administrator. Administrator memiliki hak akses atau dapat melakukan apapun dalam website, seperti mengolah data santri, monitor qiroah santri, hafalan santri, dan donasi. Disetiap fitur data, administrator dapat menambah, menghapus, dan mengubah data.

3.3.3 Analisis Pendaftaran Santri

Proses pendaftaran santri pada TKA/TPA Al-Iman Kalibayem dapat dilihat pada gambar 3.3.

Penjelasan tentang gambar 3.3 adalah sebagai berikut:

1. Calon santri datang ke TKA/TPA Al-Iman untuk melakukan registrasi sebagai santri.

2. Admin menginput data lengkap santri baru kedalam website.

3.3.4 Analisis Monitoring Qiroah Santri

Proses monitoring qiroah santri pada TKA/TPA Al-Iman Kalibayem dapat dilihat pada gambar 3.4.

Gambar 3. 4 Alur Monitoring Qiroah Al-Quran dan Iqro Santri Penjelasan gambar 3.4 adalah sebagai berikut:

1. Santri datang ke TKA/TPA Al-Iman untuk memulai aktifitas belajar. 2. Santri menyetorkan bacaan Al-Quran atau Iqro kepada admin.

3. Admin memonitoring dan menginput hasil bacaan Al-Quran/Iqro santri kedalam website.

3.3.5 Analisis Monitoring Hafalan Santri

Gambaran proses monitoring hafalan santri yang ada pada TKA/TPA Al-Iman dapat dilihat pada gambar 3.5.

Penjelasan tentang gambar 3.5 adalah sebagai berikut:

1. Santri datang ke TKA/TPA Al-Iman untuk memulai aktifitas belajar. 2. Santri menyetorkan beberapa macam hafalan kepada admin.

3. Admin memonitoring dan menginput hasil hafalan santri kedalam website.

3.3.6 Analisis Kebutuhan

Analisis kebutuhan didapat dari studi literature dan diskusi bersama pengelola TKA/TPA Al-Iman. Berikut ini merupakan analisis kebutuhan pada aplikasi:

a. Halaman pengaturan tabel untuk pengisian biodata santri, ustadz/ustadzah, dan donatur.

b. Halaman pengaturan tabel untuk tabel jenis hafalan, data hafalan, pilihan jilid iqro, juz alquran, dan daftar surat al-quran.

c. Halaman proses akademik qiroah santri untuk memonitoring dan merekap data bacaan santri.

d. Halaman proses akademik hafalan santri untuk memonitoring dan merekap data hafalan santri.

e. Halaman donasi untuk mendata daftar donasi dari donatur. 3.4 Rancangan Sistem dan Basis Data

Dalam pembuatan aplikasi web dilakukan perancangan database

menggunakan Diagram ER. Metode yang digunakan dalam perancangan aplikasi web adalah United Markup Language (UML). Model UML yang dipakai dalam pengembangan aplikasi yaitu model Use Case Diagram, Activity Diagram, dan

3.4.1 Use Case Diagram

Gambaran Use CaseDiagram yang digunakan dalam aplikasi dapat dilihat pada gambar 3.6.

Gambar 3.6 menunjukan bagaimana hubungan antara actor dan use case. Pada gambar 3.6 menjelaskan bahwa pada aplikasi hanya admin yang diberi hak akses. Admin dapat mengolah data di semua fitur setelah melakukan proses login. Kemudian setelah login admin dapat menemukan fitur pengaturan tabel, proses akademik, proses keuangan, dan rekap laporan.

3.4.2 Activity Diagram

Gambar 3.7 menunjukan ActivityDiagram pada kegiatan pengolahan data sistem informasi manajemen TKA/TPA AL-Iman oleh admin. Admin memiliki hak akses penuh untuk mengelola data santri. Untuk melanjutkan pengolahan data, admin harus mengecek status santri, apakah santri tersebut masih aktif atau sudah tidak aktif. Jika santri tersebut tidak aktif, maka data santri akan diolah kembali bahwa santri tersebut tidak aktif. Sedangkan jika santri tersebut masih aktif mengikuti kegiatan belajar mengajar di TKA/TPA Al-Iman Kalibayem, admin akan melanjutkan proses pengolahan data untuk monitoring qiroah, hafalan, dan pembiayaan SPP dan donasi disetiap data santri. Selanjutnya hasil rekapan semua data akan diolah kembali oleh admin dan dibuat laporan disetiap menu.

3.4.3 ER Diagram

Pada gambar 3.8 dapat dilihat bahwa database yang dirancang memiliki 7 buah entitas yaitu :

a. Login b. Santri c. Ustadz d. Ngaji

e. Data Hafalan f. Jenis Hafalan g. SPP

Pada entitas login tidak terdapat relasi ke entitas lainnya, relasi antar entitas dimiliki oleh entitas Santri, ustadz, ngaji, data hafalan, jenis hafalan, dan spp. Berikut penjelasan tentang relasi antar entitas yang tertera pada Gambar 3.8: 1. Entitas Santri memiliki relasi one-to-many dengan entitas Data hafalan,

relasi one-to-one dengan entitas Ngaji, dan relasi one-to-one dengan entitas SPP. Relasi one-to-many antara entitas Santri dengan entitas Data hafalan mempunyai arti bahwa satu data pada entitas Santri dapat mempunyai banyak data pada entitas Data hafalan. Sedangkan relasi one-to-one pada entitas Santri untuk entitas dan entitas Ngaji dan entitas SPP mempunyai arti bahwa satu data pada entitas Santri hanya memiliki satu data pada entitas Ngaji dan entitas SPP. Begitu juga dengan sebaliknya, satu data pada entitas Ngaji dan SPP hanya mempunyai satu data pada entitas Santri. 2. Entitas Ngaji memiliki relasi many-to-one dengan entitas Ustadz, artinya

Ustadz. Begitu juga sebalinya, satu data pada entitas Ustadz dapat mengolah banyak data pada entitas Ngaji.

3. Entitas Ustadz memiliki relasi one-to-many dengan entitas SPP, artinya satu data pada entitas Ustadz mempunyai banyak data pada SPP. Ustadz dapat mengakses banyak data yang ada pada entitas SPP.

4. Entitas SPP memiliki relasi one-to-one dengan entitas Santri, artinya satu data entitas SPP hanya memiliki satu data pada entitas Santri. Begitu juga sebaliknya.

5. Entitas Data hafalan memiliki relasi many-to-many dengan entitas Jenis hafalan, artinya banyak data pada entitas Data hafalan dapat memiliki banyak data pada entitas Jenis hafalan.

3.4.4 Class Diagram

Penjelasan fungsi:

1. Class Jenis_Hafalan

Class Jenis_Hafalan berfungsi untuk memasukan dan menampilkan data jenis hafalan yang akan digunakan pada Class Data_Hafalan.

2. Class Data_Hafalan

Class Data_Hafalan berfungsi untuk menyimpan data hafalan santri sesuai dengan jenis hafalannya. Pada kelas Data_hafalan dapat menampilkan nama santri, dan juga jenis hafalan yang dihafal oleh santri.

3. Class Santri

Class Santri berfungsi untuk memasukan data santri. Class Santri sangat berperan penting pada aplikasi. Class ini berfungsi sebagai sumber data santri yang akan dihubungkan pada class lain yang menampilkan nama santri.

4. Class Ustadz

Class Ustadz berfungsi untuk memasukan data Ustadz. Class ustadz juga memiliki fungsi sebagai penghubung class lain yang akan menampilkan nama ustadz.

5. Class Ngaji

Class Ngaji berfungsi untuk memasukan data monitoring qiroah santri yang digunakan admin pada saat melakukan proses monitoring bacaan santri. 6. Class SPP

Class SPP berfungsi untuk memasukan data pembayaran SPP santri yang diolah oleh admin.

Berikut penjelasan untuk class diagram pada gambar 3.9:

1. Terdapat kelas pada diagram yang digunakan untuk inisialisasi ke dalam tabel dan basis data aplikasi.

2. Kelas Data_Hafalan memiliki composition dengan kelas Jenis_Hafalan, artinya Jenis_Hafalan merupakan bagian dari kelas Data_Hafalan, kelas Data_Hafalan tidak akan berdiri sendiri jika kelas Jenis_Hafalan tidak ada. 3. Kelas Data_Hafalan memiliki composition dengan kelas Santri, admin yang

akan mengisi data hafalan harus mengisi minimal satu santri. Kelas data hafalan tidak bisa diisi apabila kelas santri tidak ada.

4. Kelas ngaji memiliki composition dengan kelas santri, artinya data ngaji tidak dapat diisi apabila data santri kosong.

5. Kelas Ngaji memiliki asosiasi dengan kelas ustadz, artinya setiap data kelas ngaji dapat memilih satu ustadz.

6. Kelas ustadz memiliki asosiasi dengan kelas SPP, artinya setiap data SPP dapat memilih ustadz untuk mengisi data.

7. Kelas SPP memiliki composition dengan kelas santri, artinya admin tidak bisa mengisi data SPP jika belum ada data santri.

3.5 Rancangan Antarmuka

Setiap aplikasi harus memiliki desain antarmuka. Bagi aplikasi antarmuka sangatlah penting, karena merupakan sarana untuk berinteraksi antara pengguna dengan sistem/aplikasi. Selain itu juga dapat memudahkan bagi pengguna dalam melakukan aktifitas saat menggunakan apliaksi tersebut.

3.5.1 Rancangan Antarmuka Halaman Awal dan Login

Rancangan antarmuka halaman awal merupakan tampilan awal saat aplikasi dijalankan. Gambaran rancangan antarmuka halaman awal dapat dilihat pada Gambar 3.10. Pada halaman awal terdapat menu register untuk mendaftar sebgai admin dan menu login untuk masuk aplikasi. Pengguna harus melakukan login

terlebih dahulu untuk menjalankan aplikasi. Gambaran rancangan antarmuka login

dapat dilihat pada Gambar 3.11, dan rancangan antarmuka menu registrasi dapat dilihat pada Gambar 3.12.

Gambar 3. 11 Rancangan Antarmuka Halaman Login

3.5.2 Rancangan Antarmuka Halaman Utama

Rancangan antarmuka halaman utama merupakan tampilan utama dari aplikasi yang dapat dibuka oleh admin. Pada halaman utama juga terdapat menu-menu utama aplikasi yang dapat digunakan. Gambaran rancangan halaman utama dapat dilihat pada Gambar 3.13.

Gambar 3. 13 Rancangan Antarmuka Halaman Utama

Pada Gambar 3.13 terdapat menu-menu yang dapat dibuka sesuai dengan pengguna. Fungsi menu dapat dilihat pada Tabel 3.1

Tabel 3. 1 Menu Pada Antarmuka Halaman Utama

NO Menu Sub Menu Keterangan

1 Home - Menu Home berfungsi untuk

kembali ke halaman utama. 2 Pengaturan Tabel Data Santri Sub menu data santri

data santri, seperti menambah, mengubah, dan menghapus data santri.

Data Ustadz Sub menu data ustadz berfungsi untuk mengolah data ustadz, seperti menambah, mengubah, dan menghapus data ustadz. Jenis Hafalan Sub menu jenis hafalan

berfungsi untuk mengolah data jenis- jenis hafalan da nisi dari jenis hafalan. Pengguna dapat menambah, mengubah, dan menghapus jenis hafalan. 3 Proses Akademik Monitoring Qiroah

Santri

Sub menu monitoring qiroah santri berfungsi untuk mengolah data qiroah santri. Admin dapat menambah, mengubah, dan menghapus data bacaan santri setiap harinya disetiap santri.

Monitoring Hafalan Santri

Sub menu monitoring hafalan santri berfungsi untuk

mengolah data hafalan santri. Admin dapat menambah, mengubah, dan menghapus data hafalan santri sesuai jenis hafalan dan apa saja hafalan yang disetorkan oleh santri kepada admin/ustadz.

Data Hafalan Sub menu data hafalan santri berfungsi untuk melihat data hafalan santri. Admin dapat menghapus data hafalan santri sesuai data santri yang akan dihapus.

4 Keuangan Pembayaran SPP Sub menu pembayaran SPP berfungsi untuk pembayaran SPP santri setiap bulannya. Infaq dan Donasi Sub menu infaq dan donasi

berfungsi untuk mengolah data donasi dari donatur.

3.5.3 Rancangan Antarmuka Halaman Data Santri

Rancangan antarmuka halaman data santri merupakan halaman yang menampilkan seluruh data santri yang tercatat oleh admin. Admin dapat mengelola

data santri seperti menambah data, menghapus data, dan mengubah data. Gambaran rancangan antarmuka halaman daftar data santri dapat dilihat pada Gambar 3.14, rancangan antarmuka halaman tambah data santri juga dapat dilihat pada Gambar 3.15, dan rancangan antarmuka halaman hapus data santri pada Gambar 3.16.

Gambar 3. 15 Rancangan Antarmuka Halaman Tambah Data Santri

3.5.4 Rancangan Antarmuka Halaman Data Ustadz

Gambar 3. 17 Rancangan Antarmuka Halaman Daftar Data Ustadz

Pada Gambar 3.17 merupakan gambaran rancangan antarmuka halaman daftar data ustadz. Pada halaman ini admin dapat mengelola data ustadz seperti menambah data, mengubah data, dan menghapus data. Gambaran rancangan antarmuka halaman tambah data ustadz dapat dilihat pada Gambar 3.18, dan gambaran rancangan antarmuka halaman hapus data ustadz ada pada Gambar 3.19.

Gambar 3. 18 Rancangan Antarmuka Halaman Tambah Data Ustadz

3.5.5 Rancangan Antarmuka Halaman Monitoring Qiroah Santri

Rancangan antarmuka halaman monitoring qiroah santri merupakan halaman yang digunakan untuk memasukan dan mengubah data bacaan santri baik bacaan iqro maupun al-quran. Admin dapat memasukan data sesuai dengan santri yang menyetorkan bacaannya. Selain itu juga admin dapat langsung memberikan nilai kepada santri melalui halaman ini. Gambaran rancangan antarmuka halaman monitoring qiroah santri dapat dilihat pada Gambar 3.20. Sedangkan gambaran rancangan antarmuka halaman tambah data qiroah santri dapat dilihat pada Gambar 3.21.

Gambar 3. 21 Rancangan Antarmuka Halaman Tambah Data Qiroah Santri

Pada rancangan antarmuka halaman tambah data qiroah santri admin dapat mengisi data sesuai nama santri yang sedang menyetorkan bacaannya. Label nama santri, semester, kelas, dan lain lain dibuat menggunakan drop down list sehingga memudahkan admin untuk memilih pilihan nama santri dan atribut lainnya tanpa harus mengetik secara manual.

3.5.6 Rancangan Antarmuka Halaman Monitoring Hafalan Santri

Rancangan antarmuka halaman monitoring hafalan santri merupakan halaman yang digunakan untuk memasukan data hafalan santri apabila santri mampu menghafal jenis-jenis hafalan seperti hafalan doa-doa harian, hafalan surat pendek, dan hafalan bacaan sholat. Admin dapat memasukan data sesuai dengan santri yang menyetorkan hafalannya. Gambaran rancangan antarmuka halaman untuk mengisi monitoring hafalan santri dapat dilihat pada Gambar 3.22. Sedangkan gambaran rancangan antarmuka halaman lihat data hafalan santri dapat dilihat pada Gambar 3.23.

Gambar 3. 23 Rancangan Antarmuka Halaman Data Hafalan Santri

Gambar 3.22 adalah gambaran rancangan antarmuka pada halaman isi hafalan santri. Pada halaman ini terdapat label yang berisi nama santri yang akan disimpan data hafalannya, dan juga tercantum jenis hafalan apa yang akan disimpan. Jenis hafalan tersebut meliputi hafalan doa-doa harian, surat pendek, dan bacaan sholat. Setelah admin memilih santri dan jenis hafalannya, pada halaman ini akan mencantumkan daftar hafalan sesuai dengan jenisnya, misalkan jenis hafalan doa-doa harian, maka pada daftar hafalan akan menampilkan seperti doa sebelum makan, doa sesudah makan, dan sebagainya. Kemudian pada kolom sebelahnya terdapat checkbox yang berfungsi sebagai status apakah santri tersebut hafal atau tidak. Jika hafal, maka admin akan memberi tanda dibagian yang sudah dihafal oleh santri, kemudian data dapat disimpan setelah admin memilih button simpan.

3.5.7 Rancangan Antarmuka Halaman Keuangan

Rancangan antarmuka halaman keuangan santri merupakan halaman yang digunakan untuk memasukan data pembayaran SPP santri dan donasi. Admin dapat memasukan data sesuai dengan santri yang menyetorkan pembayaran SPP. Gambaran rancangan antarmuka halaman pembayaran SPP santri dapat dilihat pada Gambar 3.24, dan untuk melihat data pembayaran dapat dilihat pada Gambar 3.25.

Gambar 3. 25 Rancangan Antarmuka Halaman Data Pembayaran SPP

Pada rancangan antarmuka halaman tambah pembayaran SPP santri seperti pada Gambar 3.24, admin dapat mengisi data sesuai nama santri yang sudah membayar SPP. Label nama santri, semester, kelas, dan lain lain dibuat menggunakan drop down list sehingga memudahkan admin untuk memilih pilihan nama santri dan atribut lainnya tanpa harus mengetik secara manual.

3.6 Metode Pengujian

Metode pengujian yang dipakai dalam pengembangan aplikasi adalah tes fungsional yang dilakukan untuk memperoleh informasi serta mengevaluasi mengenai kualitas dari produk atau layanan yang sedang diuji. Pengujian menggunakan metode tes fungsional ialah pengujian yang dilakukan hanya mengamati hasil eksekusi melalui data uji dan memeriksa fungsional dari perangkat lunak tersebut.

Hal-hal yang menjadi perhatian dalam pengujian adalah sebagai berikut: a. Aplikasi dapat menyimpan dan mengubah data seluruh santri dan ustadz. b. Aplikasi dapat mengolah data monitoring qiroah/ bacaan santri beserta

rincian bacaan dan nilai yang didapat.

c. Aplikasi dapat mengolah data monitoring hafalan santri beserta rincian hafalan sesuai dengan jenis-jenis hafalan.

d. Aplikasi dapat menyimpan data pembayaran SPP santri dan donasi dari donatur.

BAB IV

HASIL DAN PEMBAHASAN

4.1 Pengembangan Sistem

Langkah pertama dalam mengembangkan sistem dari sebuah aplikasi adalah dimulai dari mengumpulkan data sesuai kebutuhan yaitu data santri, dan data ustadz yang dibuat ke dalam bentuk basis data. Basis data berfungsi sebagai acuan data dalam menjalankan aplikasi, sehingga aplikasi dapat dioperasikan apabila sumber data tersedia dalam bentuk basis data. Setelah basis data sudah dibuat, maka langkah selanjutnya adalah mengimplementasikan sistem aplikasi dengan basis data dan desain User Interface aplikasi yang telah dibuat sebelumnya agar aplikasi dapat digunakan oleh pengguna sesuai kebutuhan.

4.2 Pembuatan Basis Data

Basis data sangat diperlukan dalam mengembangkan sebuah aplikasi. Basis data berperan penting sebagai sumber data yang disimpan di dalam server. Server

yang digunakan adalah Microsoft SQL Server dan perangkat lunak yang digunakan adalah Microsoft SQL Server Management Studio. Hasil pembuatan basis data

Gambar 4. 1 Basis Data Aplikasi

Basis data pada Gambar 4.1 memiliki 7 tabel. Berikut ini adalah penjelasan tabel pada basis data Gambar 4.1 :

1. Tabel Santri

Tabel santri berisi tentang biodata lengkap santri TKA/TPA Al-Iman. Tabel ini sangat berperan penting karena semua tabel yang ada pada sistem terpusat pada tabel santri. Setiap kegiatan yang ada pada aplikasi terdapat nama santri yang berasal dari tabel santri.

Tabel 4. 1 Tabel Santri

No Nama Kolom Tipe Data Panjang Keterangan

1. IdSantri Int Primary Key

2. NamaSantri Varchar 50

4. TempatLahir Varchar 20 5. TanggalLahir date

6. Alamat Varchar 100

7. NamaWali Varchar 50

8. PekerjaanWali Varchar 10

9. NoTelp Varchar 12

2. Tabel Ustadz

Tabel ustadz adalah tabel yang berisi data ustadz yang ada di TKA/TPA Al-Iman. Setiap kegiatan pada aplikasi yang berkaitan dengan santri selalu terdapat nama petugas atau ustadz yang mengambil data dari tabel ustadz.

Tabel 4. 2 Tabel Ustadz

No Nama Kolom Tipe Data Panjang Keterangan

1. IdUstadz Int Primary Key

2. NamaUstadz Varchar 50

3. JenisKelamin Varchar 10

4. TempatLahir Varchar 10

5. TanggalLahir Date

6. Alamat Varchar 100

7. NoHP Varchar 12

8. Email Varchar 20

3. Tabel Ngaji

Tabel ngaji adalah tabel yang berisi data monitoring qiroah / bacaan al-quran dan iqro santri. Di dalam tabel ini terdapat nama santri beserta data bacaannya sesuai yang disetorkan oleh petugas/ustadz.

Tabel 4. 3 Tabel Ngaji

No Nama Kolom Tipe Data Panjang Keterangan

1. IdNgaji Int Primary Key

2. NamaSantri Int Foreign Key

3. Semester Varchar 10

4. Kelas Varchar 10

5. NamaUstadz Int Foreign Key

6. Tanggal Date

7. JilidIqro Varchar 10

8. Halaman Varchar 10

9. NilaiBacaIqro Varchar 5

10. QuranJuz Varchar 5

11. QuranSurat Varchar 10

12. Ayat Varchar 10

13. NilaiBacaQuran Varchar 5

4. Tabel Data Hafalan

Tabel data hafalan adalah tabel yang berisi data monitoring hafalan santri. Di dalam tabel ini terdapat nama santri beserta data hafalannya sesuai yang

disetorkan oleh petugas/ustadz. Hafalan yang disetorkan santri sesuai dengan data pada tabel jenis hafalan, yaitu hafalan doa-doa harian, hafalan surat pendek, dan hafalan bacaan sholat.

Tabel 4. 4 Tabel Data Hafalan

No Nama Kolom Tipe Data Panjang Keterangan

1. IdDataHafalan Int Primary Key

2. NamaSantri Int 50 ForeignKey

3. JenisHafalan Int 20 Foreign Key

4. Tanggal Date

5. StatusHafalan Bit

5. Tabel Jenis Hafalan

Tabel jenis hafalan adalah tabel yang berisi macam macam jenis hafalan yang disediakan oleh lembaga untuk santri. Jenis jenis hafalan yang disediakan antara lain doa-doa harian, surat pendek, dan doa bacaan sholat. Pada jenis hafalan yang disediakan terdapat isi hafalannya, seperti contoh pada jenis hafalan doa-doa harian terdapat doa sebelum makan, doa sesudah makan, dan lain lain. Tabel jenis hafalan akan direlasikan dengan tabel data hafalan sehingga pada User Interface

data hafalan dapat menampilkan jenis-jenis hafalan. Tabel 4. 5 Tabel Jenis Hafalan

No Nama Kolom Tipe Data Panjang Keterangan

1. IdJenisHafalan Int Primary Key

3. IsiHafalan Varchar 20

6. Tabel SPP

Tabel SPP adalah tabel yang berisi data pembayaran SPP santri tiap bulannya. Pada tabel ini admin akan mengolah data pembayaran sesuai nama santri yang sudah membayar, dan sebagai bukti pembayaran terdapat nama petugas/ustadz yang melayani pembayaran.

Tabel 4. 6 Tabel SPP

No Nama Kolom Tipe Data Panjang Keterangan

1. IdSPP Int Primary Key

2. NamaSantri Int Foreign Key

3. Semester Varchar 10

4. Kelas Varchar 10

5. Bulan Varchar 10

6. Nominal Varchar 10

7. Tanggal Date

8. Petugas Int Foreign Key

7. Tabel Login

Tabel login adalah tabel yang berisi username dan password admin yang berfungsi sebagai syarat masuk pada aplikasi agar admin dapat mengoperasikan aplikasi.

Tabel 4. 7 Tabel Login

No Nama Kolom Tipe Data Panjang Keterangan

1. IdLogin Int Primary Key

2. UserName Varchar 20

3. Password Varchar 20

4.3 Implementasi Antarmuka

Untuk mengimplementasikan aplikasi, rancangan desain user interface

harus diubah ke dalam Bahasa pemrograman yaitu menggunakan Bahasa pemrograman C# berbasis ASP.NET dengan metode MVC framework. Sedangkan perangkat lunak pendukung yang digunakan dalam implementasi adalah Microsoft Visual Studio 2013.

4.3.1 Halaman Awal dan Login

Antarmuka halaman awal merupakan tampilan awal saat aplikasi dijalankan.

Gambar 4. 2 Antarmuka Halaman Awal

Pada halaman awal terdapat menu register untuk mendaftar sebagai admin dan menu login untuk masuk aplikasi. Pengguna harus melakukan login terlebih dahulu untuk menjalankan aplikasi. Saat pengguna akan login, pastikan pengguna/admin harus memiliki username dan password. Jika username dan

password benar, maka aplikasi akan menampilkan halaman utama, sedangkan jika

username dan password salah maka akan muncul validasi jika username dan

password yang dimasukan adalah salah, seperti pada Gambar 4.4. Admin harus melalui proses login terlebih dahulu apabila akan mengoperasikan aplikasi.

Gambaran antarmuka login dapat dilihat pada Gambar 4.3, dan antarmuka menu

registrasi dapat dilihat pada Gambar 4.5.

Gambar 4. 3 Antarmuka Halaman Login

Gambar 4. 5 Antarmuka Halaman Register

4.3.2 Halaman Utama

Antarmuka halaman utama merupakan tampilan halaman utama dari aplikasi yang dioperasikan oleh admin. Pada halaman utama juga terdapat menu-menu utama aplikasi yang dapat digunakan. Admin dapat mengoperasikan semua menu yang ada di dalam aplikasi yaitu menu pengaturan tabel, proses akademik, keuangan dan laporan.

Pada menu-menu yang ada pada halaman utama terdapat submenu di dalamnya. Seperti pada menu pengaturan tabel, terdapat submenu antara lain data santri, dan data ustadz. Sedangkan pada menu proses akademik terdapat submenu yaitu monitoring qiroah santri dan monitoring hafalan santri. Gambaran halaman utama dapat dilihat pada Gambar 4.6.

Gambar 4. 6 Antarmuka Halaman Utama Setelah Login

Gambar 4.7 adalah tampilan antarmuka menu pengaturan tabel. Menu pengaturan tabel merupakan menu pendukung yang didalamnya adalah menu-menu yang berperan sebagai pilihan pada menu proses akademik nantinya. Menu-menu tersebut antara lain yaitu pengaturan tabel data santri, pengaturan tabel data ustadz, dan pengaturan tabel data jenis hafalan. Selain dari ketiganya adalah menu pendukung seperti pengaturan tabel jenis kelamin, kelas, semester, dan lain lain.

Gambar 4. 8 Antarmuka Menu Proses Akademik pada Halaman Utama

Gambar 4.8 adalah antarmuka menu proses akademik. Menu proses akademik adalah menu utama pada aplikasi karena proses akademik santri dapat diolah melalui menu ini. Data-data monitoring santri yang akan diolah admin dan menjadi laporan ada pada menu ini. Menu ini terdiri dari menu monitoring qiroah santri dan menu monitoring hafalan santri.

Gambar 4. 9 Antarmuka Menu Keuangan Pada Halaman Utama

Pada Gambar 4.9 terdapat menu keuangan, yaitu menu pembayaran SPP dan menu infaq dan donasi. Menu pembayaran SPP santri adalah menu yang diolah dalam merekap data pembayaran SPP santri disetiap bulannya.

4.3.3 Halaman Data Santri

Antarmuka halaman data santri merupakan halaman yang menampilkan seluruh data santri yang tercatat oleh admin. Didalam data santri terdapat biodata santri TKA/TPA Al-Iman. Admin dapat mengelola data santri seperti menambah data, menghapus data, dan mengubah data. Gambar antarmuka halaman daftar data santri dapat dilihat pada Gambar 4.8.

Gambar 4. 10 Antarmuka Halaman Daftar Data Santri

Pada halaman daftar data santri seperti pada Gambar 4.10 terdapat menu bantuan yaitu menu search dan menu paging page. Menu search berfungsi untuk membantu admin dalam mencari nama santri. Selain 2 menu tambahan, pada halaman ini terdapat 5 menu utama untuk mengelola data santri oleh admin, yaitu menu tambah data, menu ubah, menu details, menu hapus dan menu cetak PDF. Menu Cetak PDF berfungsi untuk mengubah data yang ditampilkan oleh halaman web diubah menjadi PDF. Gambar tampilan menu tambah data bisa dilihat pada Gambar 4.11, menu ubah pada Gambar 4.12, dan menu hapus pada Gambar 4.13.

Gambar 4. 11 Antarmuka Halaman Tambah Data Santri

Gambar 4. 13 Antarmuka Halaman Hapus Data Santri

Gambar 4.13 adalah antarmuka halaman hapus data santri. Saat admin memilih hapus data pada halaman daftar data santri, maka akan menampilkan halaman seperti ini, yang sekaligus berfungsi sebagai validasi apakah data akan dihapus atau tidak.

4.3.4 Halaman Data Ustadz

Halaman data ustadz adalah halaman yang menampilkan data ustadz TKA/TPA Al-Iman. Pada halaman ini admin juga dapat mengolah data, baik menambah data, mengubah data, menghapus data. Gambar antarmuka halaman data ustadz dapat dilihat pada Gambar 4.13 untuk halaman daftar ustadz, Gambar 4.14 untuk halaman mengubah data, dan Gambar 4.15 untuk halaman menghapus data.

Gambar 4. 14 Antarmuka Halaman Daftar Data Ustadz

Gambar 4.14 adalah halaman yang menampilkan daftar data ustadz yang ada di TKA/TPA Al-Iman. Pada halaman ini admin dapat mengolah data seperti menambah data, mengubah data, dan menghapus data. Halaman tambah data seperti pada Gambar 4.15, halaman ubah data seperti pada Gambar 4.16 dan hapus data pada Gambar 4.17.

Gambar 4. 15 Antarmuka Halaman Tambah data Ustadz

Gambar 4. 17 Antarmuka Halaman Hapus Data Ustadz

4.3.5 Halaman Monitoring Qiroah Santri

Halaman ini merupakan halaman yang digunakan untuk memasukan dan mengubah data bacaan santri baik bacaan iqro maupun al-quran. Admin dapat memasukan data sesuai dengan santri yang menyetorkan bacaannya. Selain itu juga admin dapat langsung memberikan nilai kepada santri melalui halaman ini. Seperti halaman-halaman lainnya, pada halaman ini admin juga memiliki hak akses untuk mengolah data, seperti melihat data, menambah data, mengubah data, dan menghapus data. Tampilan antarmuka daftar data monitoring qiroah santri dapat dilihat pada Gambar 4.18. Sedangkan tampilan halaman tambah data qiroah dapat dilihat pada Gambar 4.19.

Gambar 4. 18 Antarmuka Halaman Daftar Data Monitoring Qiroah

return new

HttpStatusCodeResult(HttpStatusCode.BadRequest); }

Mock_Ngaji mock_Ngaji = db.Mock_Ngaji.Find(id); if (mock_Ngaji == null)

{

return HttpNotFound(); }

return View(mock_Ngaji); }

// POST: Mock_Ngaji/Delete/5 [HttpPost, ActionName("Delete")] [ValidateAntiForgeryToken]

public ActionResult DeleteConfirmed(int id) {

Mock_Ngaji mock_Ngaji = db.Mock_Ngaji.Find(id); db.Mock_Ngaji.Remove(mock_Ngaji);

db.SaveChanges();

return RedirectToAction("Index"); }

protected override void Dispose(bool disposing) {

if (disposing) {

db.Dispose(); }

base.Dispose(disposing); }

} }

4. Source Code Monitoring Hafalan

namespace TPAAlIman.Controllers {

public class Data_HafalanController : Controller {

private TPAContext db = new TPAContext(); // GET: Data_Hafalan

public ActionResult Index(string search, int? page) {

var data_Hafalan = db.Data_Hafalan.Include(d => d.Jenis_Hafalan).Include(d =>

d.Santri).Where(d=>d.StatusHafalan==true); return

View(data_Hafalan.Where(x=>x.Santri.Nama_Santri.Contains(search) || search == null).ToList().ToPagedList(page ?? 1, 5));

public ActionResult Details(int? id) {

if (id == null) {

return new

HttpStatusCodeResult(HttpStatusCode.BadRequest); }

Data_Hafalan data_Hafalan = db.Data_Hafalan.Find(id);

if (data_Hafalan == null) {

return HttpNotFound(); }

return View(data_Hafalan); }

public ActionResult Edit(int? id) {

if (id == null) {

return new

HttpStatusCodeResult(HttpStatusCode.BadRequest); }

Data_Hafalan data_Hafalan = db.Data_Hafalan.Find(id);

if (data_Hafalan == null) {

return HttpNotFound(); }

ViewBag.Id_JenisHafalan = new

SelectList(db.Jenis_Hafalan, "Id", "Jenis_Hafalan1", data_Hafalan.Id_JenisHafalan);

ViewBag.Id_Santri = new SelectList(db.Santris, "Id_Santri", "Nama_Santri", data_Hafalan.Id_Santri);

return View(data_Hafalan); }

[HttpPost]

[ValidateAntiForgeryToken]

public ActionResult Edit([Bind(Include = "Id_DataHafalan,Id_Santri,Id_JenisHafalan,Tanggal")] Data_Hafalan data_Hafalan)

{

if (ModelState.IsValid) {

db.Entry(data_Hafalan).State = EntityState.Modified;

db.SaveChanges();

return RedirectToAction("Index"); }

ViewBag.Id_JenisHafalan = new

SelectList(db.Jenis_Hafalan, "Id", "Jenis_Hafalan1", data_Hafalan.Id_JenisHafalan);

ViewBag.Id_Santri = new SelectList(db.Santris, "Id_Santri", "Nama_Santri", data_Hafalan.Id_Santri); ViewBag.StatusHafalan = new

SelectList(db.Data_Hafalan, "Id_DataHafalan", "StatusHafalan", data_Hafalan.StatusHafalan); //viewbag status dg BIT

return View(data_Hafalan); }

public ActionResult Delete(int? id) {

if (id == null) {

return new

HttpStatusCodeResult(HttpStatusCode.BadRequest); }

Data_Hafalan data_Hafalan = db.Data_Hafalan.Find(id);

if (data_Hafalan == null) {

return HttpNotFound(); }

return View(data_Hafalan); }

// POST: Data_Hafalan/Delete/5 [HttpPost, ActionName("Delete")] [ValidateAntiForgeryToken]

public ActionResult DeleteConfirmed(int id) {

Data_Hafalan data_Hafalan = db.Data_Hafalan.Find(id);

db.Data_Hafalan.Remove(data_Hafalan); db.SaveChanges();

return RedirectToAction("Index"); }

protected override void Dispose(bool disposing) {

if (disposing) {

db.Dispose(); }

base.Dispose(disposing); }

}

5. Source Code Pembayaran SPP

namespace TPAAlIman.Controllers {

public class Mock_SPPController : Controller {

private TPAContext db = new TPAContext(); // GET: Mock_SPP

public ActionResult Index(string search, int? page) {

var mock_SPP = db.Mock_SPP.Include(m =>

m.Bulan1).Include(m => m.Kela).Include(m => m.Santri).Include(m => m.Semester1).Include(m => m.Ustadz);

return View(mock_SPP.Where(x =>

x.Santri.Nama_Santri.Contains(search) || search == null).ToList().ToPagedList(page ?? 1, 5));

}

public ActionResult Details(int? id) {

if (id == null) {

return new

HttpStatusCodeResult(HttpStatusCode.BadRequest); }

Mock_SPP mock_SPP = db.Mock_SPP.Find(id); if (mock_SPP == null)

{

return HttpNotFound(); }

return View(mock_SPP); }

public ActionResult Create() {

ViewBag.Bulan = new SelectList(db.Bulans, "Id_Bulan", "Bulan1");

ViewBag.Kelas = new SelectList(db.Kelas, "Id_Kelas", "Kelas");

ViewBag.Nama_Santri = new SelectList(db.Santris, "Id_Santri", "Nama_Santri");

ViewBag.Semester = new SelectList(db.Semesters, "Id_Semester", "Semester1");

ViewBag.Petugas = new SelectList(db.Ustadzs, "id_Ustadz", "Nama_Ust");

return View(); [HttpPost]

[ValidateAntiForgeryToken]

public ActionResult Create([Bind(Include =

"id_SPP,Semester,Nama_Santri,Kelas,Bulan,Nominal,Tanggal,Petugas ")] Mock_SPP mock_SPP)

{

if (ModelState.IsValid) {

db.Mock_SPP.Add(mock_SPP); db.SaveChanges();

return RedirectToAction("Index"); }

ViewBag.Bulan = new SelectList(db.Bulans, "Id_Bulan", "Bulan1", mock_SPP.Bulan);

ViewBag.Kelas = new SelectList(db.Kelas, "Id_Kelas", "Kelas", mock_SPP.Kelas);

ViewBag.Nama_Santri = new SelectList(db.Santris, "Id_Santri", "Nama_Santri", mock_SPP.Nama_Santri);

ViewBag.Semester = new SelectList(db.Semesters, "Id_Semester", "Semester1", mock_SPP.Semester);

ViewBag.Petugas = new SelectList(db.Ustadzs, "id_Ustadz", "Nama_Ust", mock_SPP.Petugas);

return View(mock_SPP); }

// GET: Mock_SPP/Edit/5

public ActionResult Edit(int? id) {

if (id == null) {

return new

HttpStatusCodeResult(HttpStatusCode.BadRequest); }

Mock_SPP mock_SPP = db.Mock_SPP.Find(id); if (mock_SPP == null)

{

return HttpNotFound(); }

ViewBag.Bulan = new SelectList(db.Bulans, "Id_Bulan", "Bulan1", mock_SPP.Bulan);

ViewBag.Kelas = new SelectList(db.Kelas, "Id_Kelas", "Kelas", mock_SPP.Kelas);

ViewBag.Nama_Santri = new SelectList(db.Santris, "Id_Santri", "Nama_Santri", mock_SPP.Nama_Santri);

ViewBag.Semester = new SelectList(db.Semesters, "Id_Semester", "Semester1", mock_SPP.Semester);

ViewBag.Petugas = new SelectList(db.Ustadzs, "id_Ustadz", "Nama_Ust", mock_SPP.Petugas);

return View(mock_SPP); }

[HttpPost]

[ValidateAntiForgeryToken]

public ActionResult Edit([Bind(Include =

"id_SPP,Semester,Nama_Santri,Kelas,Bulan,Nominal,Tanggal,Petugas ")] Mock_SPP mock_SPP)

{

if (ModelState.IsValid) {

db.Entry(mock_SPP).State = EntityState.Modified; db.SaveChanges();

return RedirectToAction("Index"); }

ViewBag.Bulan = new SelectList(db.Bulans, "Id_Bulan", "Bulan1", mock_SPP.Bulan);

ViewBag.Kelas = new SelectList(db.Kelas, "Id_Kelas", "Kelas", mock_SPP.Kelas);

ViewBag.Nama_Santri = new SelectList(db.Santris, "Id_Santri", "Nama_Santri", mock_SPP.Nama_Santri);

ViewBag.Semester = new SelectList(db.Semesters, "Id_Semester", "Semester1", mock_SPP.Semester);

ViewBag.Petugas = new SelectList(db.Ustadzs, "id_Ustadz", "Nama_Ust", mock_SPP.Petugas);

return View(mock_SPP); }

// GET: Mock_SPP/Delete/5

public ActionResult Delete(int? id) {

if (id == null) {

return new

}

Mock_SPP mock_SPP = db.Mock_SPP.Find(id); if (mock_SPP == null)

{

return HttpNotFound(); }

return View(mock_SPP); }

// POST: Mock_SPP/Delete/5 [HttpPost, ActionName("Delete")] [ValidateAntiForgeryToken]

public ActionResult DeleteConfirmed(int id) {

Mock_SPP mock_SPP = db.Mock_SPP.Find(id); db.Mock_SPP.Remove(mock_SPP);

db.SaveChanges();

return RedirectToAction("Index"); }

protected override void Dispose(bool disposing) {

if (disposing) {

db.Dispose(); }

base.Dispose(disposing); }

} }