SISTEM INFORMASI PENGOLAHAN NILAI SISWA BERBASIS WEB DENGAN PHP DAN MYSQL DI SMP NEGERI 5 PURWANEGARA

(1)

Skripsi

untuk memenuhi sebagian persyaratan mencapai derajat Sarjana S-1

Diajukan oleh : Putri Rahayu

20120140006

PROGRAM STUDI TEKNOLOGI INFORMASI

FAKULTAS TEKNIK

UNIVERSITAS MUHAMMADIYAH YOGYAKARTA

2016


(2)

Skripsi

untuk memenuhi sebagian persyaratan mencapai derajat Sarjana S-1

Diajukan oleh : Putri Rahayu

20120140006

PROGRAM STUDI TEKNOLOGI INFORMASI

FAKULTAS TEKNIK

UNIVERSITAS MUHAMMADIYAH YOGYAKARTA

2016


(3)

SKRIPSI

SISTEM PENDAFTARAN SISWA BARU SECARA ONLINE

DI SMP NEGERI 5 PURWANEGARA

Diajukan Oleh:

HABIBIE ADICHA PRADANA PUTRA 20120140019

Telah Disetujui Oleh:

Pembimbing 1 Pembimbing 2

Haris Setyawan, S.T., M.Eng. Asroni, S.T., M.Eng.


(4)

SKRIPSI

SISTEM PENDAFTARAN SISWA BARU SECARA ONLINE

DI SMP NEGERI 5 PURWANEGARA

Diajukan Oleh:

HABIBIE ADICHA PRADANA PUTRA 20120140019

Skripsi telah Dipertahankan dan Disahkan di depan Dewan Penguji Program Studi Teknik Informatika Fakultas Teknik Universitas Muhammadiyah Yogyakarta

Tanggal 13 Januari 2017

Dewan Penguji:

Haris Setyawan, S.T., M.Eng.

NIK: 19691111200004123043

Asroni, S.T., M.Eng.

NIK: 19740426201504123072

Aprilia Kurnianti, S.T., M. Eng.


(5)

Saya menyatakan bahwa skripsi tidak mengandung karya yang pernah diajukan untuk memperoleh gelar kesarjanaan di suatu Perguruan Tinggi, dan 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.


(6)

Alhamdulillahirabbil’alamin Puji syukur kehadirat Allah SWT yang telah melimpahkan rahmat dan hidayah-Nya sehingga penulis dapat menyelesaikan skripsi dengan judul “Sistem Informasi Pengolahan Nilai Berbasis Web dengan PHP dan MySQL di SMP Negeri 5 Purwanegara”.

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. Segenap dosen dan pengajar di Jurusan Teknik Informatika Universitas Muhammadiyah Yogyakarta, Bapak Slamet, Bapak Giga, Bapak Eko, Bapak


(7)

dan mengajarkan ilmunya kepada penulis selama perkuliahan.

5. 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.

6. Bapak, Mama, Dek Adit yang selalu memberikan dukungan motivasi, kasih sayang dan doa kepada penulis hingga penulis dapat mencapai ke tahap sekarang ini.

7. Penghuni kos “Bu Fitri” yang selalu menemani penulis dan memberikan motivasi kepada penulis.

8. Teman seperjuangan angkatan 2012 yang tidak bisa penulis cantumkan satu persatu, terimakasih banyak kepada kalian semua yang selalu menemani dan membantu penulis.

9. Habibie sahabatku yang senantiasa berbagi ilmu, berbagi semangat, suka cita dan suka duka selama kuliah di UMY.

10.Pihak-pihak lainnya yang tidak dapat disebutkan satu per satu, yang telah memberikan bantuan kepada penulis, sehingga penulis dapat menyelesaikan penyusunan skripsi ini.


(8)

HALAMAN JUDUL ... i

HALAMAN PENGESAHAN I ... ii

HALAMAN PENGESAHAN II ... iii

PERNYATAAN ... iv

PRAKATA ... v

DAFTAR ISI ... vii

DAFTAR TABEL ... x

DAFTAR GAMBAR ... xi

INTISARI ... xiii

ABSTRACT ... xiv

BAB I PENDAHULUAN ... 1

1.1 Latar Belakang... 1

1.2 Rumusan Masalah ... 3

1.3 Tujuan Penelitian ... 4

1.4 Manfaat Penelitian ... 4

1.5 Sistematika Penulisan ... 5

BAB IITINJAUAN PUSTAKA ... 7

2.1 Tinjauan Pustaka ... 7

2.2 Landasan Teori ... 9

2.2.1 Pengertian Sistem ... 9

2.2.2 Pengertian Data dan Informasi ... 9

2.2.3 Pengertian Sistem Informasi ... 10

2.2.4 Pengertian Rekap Nilai ... 11

2.2.5 Teori Nilai Raport ... 11

2.2.6 Pengembangan Aplikasi Berbasis Web ... 12

2.2.7 HTTP ... 13

2.2.8 HTML ... 13

2.2.9 PHP ... 14

2.2.10 Javascript ... 14

2.2.11 MySQL ... 15


(9)

BAB IIIMETODOLOGI PENELITIAN... 20

3.1 Peralatan Pendukung ... 20

3.1.1 Perangkat Keras ... 20

3.1.2 Perangkat Lunak... 20

3.2 Bahan Penelitian ... 21

3.2.1 Studi Literatur ... 21

3.2.2 Wawancara ... 21

3.2.3 Observasi ... 22

3.3 Langkah Penelitian ... 22

3.4 Sistem yang Sedang Berjalan di SMP Negeri 5 Purwanegara ... 24

3.5 Analisis Kebutuhan Fungsional dan Non Fungsional ... 26

3.5.1 Kebutuhan Fungsional ... 26

3.5.2 Kebutuhan Non Fungsional... 26

3.6 Arsitektur Sistem ... 27

3.7 Perancangan Sistem ... 28

3.7.1 Use Case Diagram Aplikasi... 28

3.7.2 Activity Diagram Aplikasi... 29

3.8 Perancangan Basis Data ... 30

3.8.1 ER Diagram Aplikasi ... 30

3.8.2 Kamus Data ... 31

3.8.3 Class Diagram Aplikasi... 41

3.9 Perancangan Antarmuka ... 45

3.9.1 Rancangan Antarmuka Menu Utama ... 45

3.9.2 Rancangan Antarmuka Halaman Login Guru ... 46

3.9.3 Rancangan Antarmuka Halaman Form Nilai Siswa ... 47

3.9.4 Rancangan Antarmuka Halaman Login Admin ... 48

3.9.5 Rancangan Antarmuka Halaman Manage Data ... 48

3.9.6 Rancangan Antarmuka Halaman Login Siswa ... 51

3.9.7 Rancangan Antarmuka Halaman Laporan Nilai Siswa ... 52


(10)

4.1 Pengembangan Sistem ... 54

4.2 Pembuatan Database ... 54

4.3 Implementasi Antarmuka ... 55

4.3.1 Antarmuka Halaman Awal Admin... 55

4.3.2 Antarmuka Halaman Login Admin ... 56

4.3.3 Antarmuka Halaman Manage Guru ... 57

4.3.4 Antarmuka Halaman Manage Mata Pelajaran ... 58

4.3.5 Antarmuka Halaman Manage Siswa ... 60

4.3.6 Antarmuka Halaman Manage Kelas ... 61

4.3.7 Antarmuka Halaman Manage Admin ... 63

4.3.8 Antarmuka Halaman Login Guru ... 64

4.3.9 Antarmuka Halaman Form Nilai Siswa ... 65

4.3.10 Antarmuka Halaman Login Siswa ... 66

4.3.11 Antarmuka Halaman Raport Online Siswa ... 67

4.4 Pengujian Sistem ... 67

BAB V KESIMPULAN DAN SARAN ... 73

5.1 Kesimpulan ... 73

5.2 Saran ... 73

DAFTAR PUSTAKA ... 74


(11)

Tabel 3. 1 Kamus Data Tabel Admin ... 32

Tabel 3.2 Kamus Data Tabel Kelas ... 33

Tabel 3.3 Kamus Data Tabel Siswa ... 34

Tabel 3.4 Kamus Data Tabel Guru ... 35

Tabel 3.5 Kamus Data Tabel Mata Pelajaran ... 37

Tabel 3.6 Kamus Data Tabel Nilai ... 38

Tabel 3.7 Kamus Data Tabel Guru Matpel ... 39

Tabel 3. 8 Kamus Data Tabel Siswa Per Kelas ... 40


(12)

Gambar 3.1 Metode SDLC model Waterfall ... 23

Gambar 3.2 Sistem yang berjalan ... 25

Gambar 3.3 Raport Siswa SMP Negeri 5 Purwanegara ... 26

Gambar 3.4 Arsitektur Sistem yang Diusulkan ... 27

Gambar 3.5 Use Case Diagram Aplikasi ... 28

Gambar 3.6 Activity Diagram Aplikasi ... 29

Gambar 3.7 ER Diagram Aplikasi ... 30

Gambar 3.8 Class Diagram Aplikasi ... 41

Gambar 3.9 Rancangan antarmuka menu utama ... 46

Gambar 3.10 Rancangan Antarmuka Login Guru ... 47

Gambar 3.11 Rancangan Antarmuka Halaman Form Nilai Siswa ... 47

Gambar 3.12 Rancangan Antarmuka Login Admin ... 48

Gambar 3.13 Rancangan Antarmuka Manage Data Guru ... 49

Gambar 3.14 Rancangan Antarmuka Manage Data Mata Pelajaran ... 49

Gambar 3.15 Rancangan Antarmuka Manage Data Siswa... 50

Gambar 3.16 Rancangan Antarmuka Manage Data Kelas ... 50

Gambar 3.17 Rancangan Antarmuka Manage Data Admin ... 51

Gambar 3.18 Rancangan Antarmuka Login Siswa ... 52

Gambar 3.19 Rancangan Antarmuka Laporan Nilai Siswa ... 52

Gambar 4.1 Pembuatan Database dengan phpMyAdmin ... 55

Gambar 4.2 Antarmuka Halaman Awal Admin ... 56

Gambar 4.3 Antarmuka Halaman Login Admin ... 56

Gambar 4.4 Antarmuka Halaman Lihat Data Guru ... 57

Gambar 4.5 Antarmuka Halaman Tambah Data Guru ... 57

Gambar 4.6 Antarmuka Halaman Ubah Data Guru ... 58

Gambar 4.7 Antarmuka Halaman Hapus Data Guru ... 58

Gambar 4.8 Antarmuka Halaman Lihat Data Mata Pelajaran ... 59

Gambar 4.9 Antarmuka Halaman Tambah Data Mata Pelajaran ... 59

Gambar 4.10 Antarmuka Halaman Hapus Data Mata Pelajaran ... 60


(13)

Gambar 4.13 Antarmuka Halaman Ubah Data Siswa ... 61

Gambar 4.14 Antarmuka Halaman Lihat Data Kelas ... 62

Gambar 4.15 Antarmuka Halaman Tambah Data Kelas ... 62

Gambar 4.16 Antarmuka Halaman Ubah Data Kelas... 62

Gambar 4.17 Antarmuka Halaman Hapus Data Kelas ... 63

Gambar 4.18 Antarmuka Halaman Lihat Data Admin ... 63

Gambar 4.19 Antarmuka Halaman Tambah Data Admin ... 64

Gambar 4.20 Antarmuka Halaman Ubah Data Admin... 64

Gambar 4.21 Antarmuka Halaman Login Guru ... 65

Gambar 4.22 Antarmuka Halaman Form Nilai Siswa ... 65

Gambar 4.23 Antarmuka Halaman Form Nilai Siswa (Tampilan Daftar Siswa) 66 Gambar 4.24 Antarmuka Halaman Login Siswa ... 66


(14)

"Sistem Informasi Pengolahan Nilai Siswa Berbasis Web dengan PHP dan MySQL di SMP Negeri 5 Purwanegara"adalah judul skripsi penelitian yang saya tulis. Dalam makalah ini dibahas bagaimana merancang sebuah sistem nilai rekapitulasi raport siswa berbasis web yang dapat mengakomodasi pengolahan raport siswa dengan nilai raport siswa yang dapat diakses secara online. Penelitian ini didasarkan pada perkembangan pesat dari informasi teknologi, sehingga sistem diperlukan untuk mengambil lebih banyak pekerjaan dengan cepat dan efisien. Saat ini SMP Negeri 5 Purwanegara masih menggunakan manual dalam pengumpulan dan pengolahan buku laporan. Tetapi dengan sistem baru maka guru menjadi lebih mudah untuk menyerahkan nilai akhir siswa. Siswa juga dapat mengakses laporan akhir mereka dan memantaunya langsung. Admin menjadi lebih mudah untuk mengelola data nilai dan raport siswa. Dengan sistem baru ini diharapkan dapat membantu pekerjaan di SMP Negeri 5 Purwanegara dalam proses pengumpulan dan pengolahan raport siswa menjadi lebih cepat dan lebih efisien.


(15)

"Web-Based Student’s School Scores with PHP and MySQL at SMP Negeri 5 Purwanegara " is the title of the research essay that I wrote. In this paper discussed how to design a system recapitulation value of student report cards in web-based that can accommodate the processing of student report cards to the value of student report cards that can be accessed online. The study was based on the rapid development of information technology, so the system is required to take more work quickly and efficiently. Currently SMA Negeri 1 Klaten still use manual in the collection and processing of report cards. But with the new system then the teacher becomes easier to submit final grades of students. Students can also access their final report and print it directly. Likewise, the admin becomes easier to manage the data values and student report cards. With the new system is expected to help the work of SMA Negeri 1 Klaten in the process of collecting and processing of student report cards become faster and more efficient.


(16)

(17)

(18)

"Sistem Informasi Pengolahan Nilai Siswa Berbasis Web dengan PHP dan MySQL di SMP Negeri 5 Purwanegara"adalah judul skripsi penelitian yang saya tulis. Dalam makalah ini dibahas bagaimana merancang sebuah sistem nilai rekapitulasi raport siswa berbasis web yang dapat mengakomodasi pengolahan raport siswa dengan nilai raport siswa yang dapat diakses secara online. Penelitian ini didasarkan pada perkembangan pesat dari informasi teknologi, sehingga sistem diperlukan untuk mengambil lebih banyak pekerjaan dengan cepat dan efisien. Saat ini SMP Negeri 5 Purwanegara masih menggunakan manual dalam pengumpulan dan pengolahan buku laporan. Tetapi dengan sistem baru maka guru menjadi lebih mudah untuk menyerahkan nilai akhir siswa. Siswa juga dapat mengakses laporan akhir mereka dan memantaunya langsung. Admin menjadi lebih mudah untuk mengelola data nilai dan raport siswa. Dengan sistem baru ini diharapkan dapat membantu pekerjaan di SMP Negeri 5 Purwanegara dalam proses pengumpulan dan pengolahan raport siswa menjadi lebih cepat dan lebih efisien.


(19)

"Web-Based Student’s School Scores with PHP and MySQL at SMP Negeri 5 Purwanegara " is the title of the research essay that I wrote. In this paper discussed how to design a system recapitulation value of student report cards in web-based that can accommodate the processing of student report cards to the value of student report cards that can be accessed online. The study was based on the rapid development of information technology, so the system is required to take more work quickly and efficiently. Currently SMA Negeri 1 Klaten still use manual in the collection and processing of report cards. But with the new system then the teacher becomes easier to submit final grades of students. Students can also access their final report and print it directly. Likewise, the admin becomes easier to manage the data values and student report cards. With the new system is expected to help the work of SMA Negeri 1 Klaten in the process of collecting and processing of student report cards become faster and more efficient.


(20)

BAB I PENDAHULUAN

1.1 Latar Belakang

Pendidikan memegang peranan yang amat penting untuk menjamin kelangsungan hidup bangsa dan negara. Karena pendidikan merupakan sebuah wadah untuk meningkatkan dan mengembangkan kualitas sumber daya manusia. Melalui pendidikan yang baik akan menjadikan masyarakat mempunyai pola pikir yang baik dan kritis dalam menanggapi suatu masalah serta dapat menyelesaikannya dengan benar.

Terlebih di zaman sekarang dimana teknologi dan infomasi berkembang sangat pesat dan menawarkan berbagai kemudahan dalam hal pencarian informasi. Dunia pendidikan pun mengalami kemajuan dalam berbagai hal. Dapat kita lihat telah banyak sekolah – sekolah yang memiliki

website sendiri dan mempunyai sistem informasi akademik yang terintegrasi

di dalamnya.

SMP Negeri 5 Purwanegara merupakan salah satu Sekolah Menengah Pertama Negeri yang beralamat di Jl. Raya Petir, desa Petir, Kecamatan Purwanegara, Kabupaten Banjarnegara. SMP Negeri 5 Purwanegara belum memiliki website sendiri. Mengingat status sebagai sekolah negeri sudah resmi tersemat pada sekolah ini, sudah saatnya SMP Negeri 5 Purwanegara mengembangkan sistem informasi manajemennya agar mampu mengikuti perubahan zaman.


(21)

Pemanfaatan teknologi informasi ini sangat dibutuhkan oleh SMP Negeri 5 Purwanegara untuk meningkatkan efisiensi dan produktivitas bagi manajemen pendidikan. Guru dan pengurus sekolah tidak lagi disibukkan oleh pekerjaan – pekerjaan operasional yang sesungguhnya dapat digantikan oleh komputer. Penghematan waktu dan kecepatan penyajian informasi karena penerapan teknologi informasi tersebut akan memberikan kesempatan kepada guru dan pengurus sekolah untuk meningkatkan kualitas komunikasi dan pembinaan kepada siswa.

Di SMP Negeri 5 Purwanegara pengolahan data nilai siswa dan raport masih menggunakan cara konvensional. Meskipun pengolahan nilai sudah menggunakan excel, tetapi dalam menyampaikan nilai ulangan harian, ulangan semester dan penulisan raport masih manual. Hal ini menyebabkan pengolahan nilai tidak terintegrasi. Apabila ada kesalahan atau ada perbaikan nilai, maka membutuhkan waktu lama agar siswa atau orang tua dapat melihatnya. Mereka harus menunggu wali kelas membagikan kertas ulangan dan kertas tugas yang sudah siswa kerjakan. Setelah itu guru mata pelajaran memberikan nilai tersebut kepada wali kelas untuk dimasukkan ke excel dan raport siswa.

Kebutuhan orang tua dan murid akan akses informasi terbaru yang dapat dilihat kapanpun dan dimanapun menjadi permasalahan yang penulis hadapi. Selain itu, pengolahan nilai yang memakan waktu lama karena masih menggunakan cara manual menjadi pertimbangan penulis untuk membangun


(22)

sebuah sistem informasi yang dapat membantu efektivitas pengolahan nilai sekaligus distribusi informasi kepada orang tua dan murid.

Oleh karena itu perlu adanya sistem informasi berbasis web untuk memecahkan masalah di atas. Sehingga dengan adanya sistem informasi ini guru mata pelajaran tidak perlu menyerahkan nilai siswa kepada wali kelas. Guru mata pelajaran cukup memasukkan nilai – nilai siswa kedalam database. Sehingga siswa dan orang tua dapat melihatnya secara online menggunakan ID dan password mereka masing – masing. Dengan begitu pengolahan nilai menjadi lebih efektif dan distribusi informasi menjadi lebih cepat.

Dari uraian di atas, maka dalam laporan tugas akhir ini penulis mengambil judul “Sistem Pengolahan Nilai dan Raport Online di SMP Negeri 5 Purwanegara”.

1.2 Rumusan Masalah

Berdasarkan latar belakang yang telah dikemukakan di atas yang menjadi pokok permasalahan dalam laporan Tugas Akhir ini adalah bagaimana membangun sistem informasi berbasis web yang diimplementasikan untuk pengolahan data nilai dan bagaimana mengatasi sulitnya penyampaian informasi berupa nilai kepada orang tua dan murid di SMP Negeri 5 Purwanegara.


(23)

1.3 Tujuan Penelitian

Adapun tujuan dari penelitian berdasarkan permasalahan di atas adalah sebagai berikut :

1. Menghasilkan website SMP Negeri 5 Purwanegara untuk mengolah nilai dan raport online yang dapat diakses kapanpun dan dimanapun. 2. Memanfaatkan suatu sistem pengolahan nilai online untuk

meningkatkan pelayanan kepada siswa dan orang tua, memberikan informasi yang cepat, tepat dan akurat guna mendukung kelancaran dalam memantau hasil belajar siswa.

1.4 Manfaat Penelitian

Manfaat penelitian yang diharapkan dapat diperoleh dari penelitian ini adalah :

1. Bagi penulis

a. Sebagai sarana untuk menerapkan ilmu yang diperoleh selama berada di bangku perkuliahan.

b. Sebagai pembelajaran serta menambah wawasan tentang dunia kerja khususnya mengenai Sistem Informasi Berbasis Web yang telah didapatkan selama perkuliahan.

2. Bagi SMP Negeri 5 Purwanegara

a. Membantu kinerja wali kelas dalam pengolahan nilai yang cepat dan efisien.

b. Membantu siswa siswi SMP Negeri 5 Purwanegara untuk melihat nilai kapan saja.


(24)

3. Bagi pembaca

Sebagai bahan pengetahuan, pembanding dan acuan dalam menghadapi permasalahan atau kasus penelitian yang sama.

1.5 Sistematika Penulisan

Sistematika susunan laporan penelitian ini disusun dalam lima bab yang membahas hal sebagai berikut :

BAB I : PENDAHULUAN

Pada Bab 1 membahas tentang pendahuluan yang berisi latar belakang masalah, rumusan masalah, batasan masalah, tujuan penelitian, manfaat penelitian dan sistematika penulisan yang digunakan untuk pembuatan laporan tugas akhir.

BAB II : TINJUAN PUSTAKA DAN LANDASAN TEORI

Bab tinjauan pustaka dan landasan teori berisi tentang kajian pustaka dan landasan teori yang digunakan dalam peneletian. Berupa konsep dan teknologi yang digunakan serta segala sesuatu yang berhubungan dengan topik penelitian.

BAB III : METODOLOGI PENELITIAN

Bab metodologi penelitian membahas tentang metode dan alat yang digunakan untuk merancang sistem yang akan diimplementasikan serta mengacu pada bab II.

BAB IV : HASIL DAN PEMBAHASAN

Bab hasil dan pembahasan berisi penjelasan tentang hasil yang diperoleh dari seluruh penelitian dan hasil pengujian pada hasil implementasi.


(25)

BAB V : KESIMPULAN DAN SARAN

Bab kesimpulan dan saran merupakan penutup yang berisi kesimpulan yang diambil dari penelitian dan saran yang berguna untuk pengembangan lebih lanjut.


(26)

BAB II

TINJAUAN PUSTAKA

2.1 Tinjauan Pustaka

Natanael Sundoro (2013) dalam penelitiannya yang berjudul Analisis dan Perancangan Rekapitulasi Nilai Raport Siswa Pada SMA Negeri 1 Klaten Berbasis Web. Dalam penelitiannya dibahas bagaimana merancang sebuah sistem nilai rekapitulasi raport siswa berbasis web yang dapat mengakomodasi pengolahan raport siswa dengan nilai raport siswa yang dapat diakses secara online. Penelitian ini didasarkan pada perkembangan pesat dari informasi teknologi, sehingga sistem diperlukan untuk mengambil lebih banyak pekerjaan dengan cepat dan efisien.

Susy Kusuma Wardani (2013) dalam penelitiannya yang berjudul Sistem Informasi Pengolahan Data Nilai Siswa Berbasis Web Pada Sekolah Menengah Atas (SMA) Muhammadiyah Pacitan. Sistem Informasi Pengolahan Data Nilai Siswa Berbasis Web merupakan suatu sistem yang memberikan informasi laporan keaktifan siswa secara online yang berupa laporan nilai serta informasi siswa yang bersangkutan dengan berbasiskan web, sehingga membantu kecepatan dan kualitas dalam penyampaian informasi. Permasalahan yang terjadi dalam pengolahan nilai raport di SMA Muhammdiyah Pacitan saat ini masih bersifat konvensional, yaitu masih ditulis di buku raport dan leger nilai sehingga banyak waktu dan tenaga diperlukan untuk memproses tugas tersebut. Penelitian ini bertujuan untuk


(27)

membangun suatu sistem informasi nilai yang mempermudah pengcekan, pencatatan dan laporan data nilai siswa yang terkomputerisasi. Selain itu dengan berbasiskan web maka informasi data dapat diakses kapan saja.

Eki Puspitasari (2013) dalam penelitiannya yang berjudul Sistem Informasi Pengolahan Raport Siswa Pada SMP Negeri 3 Kebonagung, menyatakan bahwa pengolahan raport untuk menghasilkan informasi yang dibutuhkan oleh pihak SMP Negeri 3 Kebonagung apabila dengan menggunakan sistem konvensional atau sistem yang lama tidak efektif dan efisien. Karena disebabkan masih adanya perbedaan dalam penulisan nilai atau kesalahan dan juga keterlambatan.

Pada penelitian website pengolahan nilai SMP Negeri 5 Purwanegara di fokuskan pada penginputan data dan pemantauan nilai melalui website, memudahkan dalam pencarian data, pengolahan data siswa, data guru, dan data. Metode pengembangan sistem yang digunakan adalah

waterfall dalam website ini menggunakan fitur bootstrap atau lebih dikenal

dengan responsive, keunggulan dari responsive lebih sedikit mengonsumsi memori dibanding dengan website yang belum responsive. Tampilan website

responsive terlihat lebih baik dan dapat menyesuaikan lebar layar ketika

diakses diberbagai perangkat seperti PC desktop, Tablet PC, dan smartphone,

website responsive memiliki kecepatan loading yang lebih cepat dibanding

website yang belum responsive ketika mengakses halaman website tersebut.

Website responsive lebih banyak menggunakan CSS dibanding script seperti


(28)

menggunakan bahasa pemrograman PHP, HTML, Javascript, CSS dan MySQL sebagai databasenya.

2.2 Landasan Teori

2.2.1 Pengertian Sistem

Sebuah sistem saling berelasi dan berinteraksi dalam suatu kesatuan yang dirancang untuk mencapai suatu tujuan. Namun pengertian dan definisi sistem berkembang sesuai dengan konteks dimana pengertian sistem itu digunakan.

Menurut Murdick, R.G sistem adalah seperangkat elemen-elemen yang membentuk suatu kumpulan dari berbagai prosedur atau berbagai bagan pengolahan untuk mencari sebuah tujuan bersama dengan cara mengoperasikan data maupun barang untuk menghasilkan suatu informasi.

2.2.2 Pengertian Data dan Informasi

Data adalah fakta yang tidak sedang digunakan pada proses keputusan, biasanya dicatat dan diarsipkan tanpa maksud untuk segera diambil kembali untuk pengambilan keputusan (Kumorotomo dan Margono, 2010:11). Sebuah data biasanya rincian peristiwa yang sifatnya masih mentah dan juga belum diolah.

Informasi adalah kumpulan data yang sudah diolah sedemikian rupa. Dalam prosesnya, data yang sudah dihimpun kemudian diolah dan menghasilkan sesuatu yang berguna dan dapat diterima oleh masyarakat luas.


(29)

2.2.3 Pengertian Sistem Informasi

Menurut Tafri D. Muhyuzir, Sistem Informasiadalah data yang dikumpulkan, dikelompokkan dan diolah sedemikian rupa sehingga menjadi sebuah satu kesatuan informasi yang saling terkait dan saling mendukung sehingga menjadi suatu informasi yang berharga bagi yang menerimanya. Atau dalam pengertian lainnya, Sistem Informasi merupakan kumpulan elemen yang saling berhubungan satu sama lain yang membentuk satu kesatuan untuk mengintegrasikan data, memproses dan menyimpan serta mendistribusikan informasi.

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


(30)

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.4 Pengertian Rekap Nilai

Rekap atau rekapitulasi adalah fungsi utama pada sistem yang akan dirancang. Proses ini akan mengumpulkan nilai – nilai yang disetorkan oleh guru – guru mata pelajaran untuk selanjutnya disetorkan kepada wali kelas. Selanjutnya nilai tersebut akan diolah menjadi raport dan dibagikan pada siswa.

2.2.5 Teori Nilai Raport

Raport berasal dari kata Belanda yaitu rapport yang mempunyai makna melaporkan, memberikan laporan tentang prestasi anak di sekolah. Raport disajikan dalam bentuk angka – angka yang mencerminkan kemampuan siswa dalam menempuh kegiatan belajarnya di sekolah selama satu semester. Melalui nilai raport seorang


(31)

guru dapat menentukan apakah seorang siswa dapat dinaikkan ke kelas selanjutnya atau tetap tinggal di kelas yang sama.

Mempunyai nilai raport yang tinggi menjadi suatu kebanggaan tersendiri bagi siswa maupun orang tua. Karena nilai raport yang tinggi menjadi tolak ukur kesuksesan siswa di masa depan. Meskipun tidak mutlak bahwa kesuksesan siswa karena nilai raport, tetapi nilai raport dapat menjadi acuan dan semangat belajar bagi para siswa.

2.2.6 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


(32)

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.7 HTTP

HTTP (Hypertext Transfer Protocol) adalah suatu protokol yang menggunakan aturan yang perlu diikuti oleh web browser dalam meminta atau mengambil suatu dokumen dan oleh web server dalam menyediakan dokumen yang diminta oleh web browser. Protokol ini merupakan protokol standar yang digunakan untuk mengakses dokumen HTML. Di dalam internet dikenal beberapa protokol lain diantaranya: FTP (File Transfer Protocol),Gopher,NNTP (Network

News Transfer Protocol).

2.2.8 HTML

Menurut Prasetio (2012), HTML (Hyper Text Markup

Language) yang didefinisikan sebagai sebuah file teks yang berisi

tag-tag markup. Tag markup berfungsi untuk memberitahukan browser

bagaimana harus menampilkan sebuah halaman. Pada file HTML harus memiliki ekstensi htm atau html dan dapat dibuat menggunakan editor


(33)

Menurut James Sugrue, HTML5 adalah standar untuk penataan dan penyajian konten di web. Ini menggabungkan fitur seperti

Geolocation, pemutaran video dan drag-and-drop. HTML5

memungkinkan pengembang untuk membuat aplikasi internet yang kaya tanpa membutuhkan API pihak ketiga dan browserplug-in.

2.2.9 PHP

Menurut Arief (2011c:43) PHP adalah Bahasa server-side

scripting yang menyatu dengan HTML untuk membuat halaman web

yang dinamis. Karena PHP merupakan server-side scripting maka sintaks dan perintah – perintah PHP akan diesksekusi diserver kemudian hasilnya akan dikirimkan ke browser dengan format HTML.

Data akan diolah ke sebuah database server (pemrograman

database yang terletak di sisi server) untuk memudahkan hasilnya

ditampilkan di browser sebuah situs (Madcoms, 2011).

Jadi, bahasa pemrograman PHP merupakan bahasa yang digunakan untuk membuat sebuah website dengan menampilkan data yang ada pada database server.

2.2.10 Javascript

Menurut Kadir (2011), Javascript adalah kode untuk menyusun halaman web yang memungkinkan dijalankan pada sisi klien.

Javascript adalah bahasa yang digunakan agar dokumen HTML yang


(34)

memberikan beberapa fungsionalitas ke dalam halaman web, sehingga dapat menjadi sebuah program yang disajikan dengan antarmuka yang menarik.

JavaScript merupakan bahasa script, bahasa yang tidak

memerlukan kompiler untuk menjalankannya, cukup dengan interpreter. Tidak perlu ada proses kompilasi terlebih dahulu agar program dapat dijalankan. Oleh karena itu, javascript dapat dijalankan di dalam aplikasi browser yang merupakan sebuah aplikasi interpreter, asalkan browser tersebut telah mendukung penggunaan javascript.

2.2.11 MySQL

MySQL adalah sebuah sistem manajemen database relasi

(relational database management system) yang bersifat open source

(Arbie, 2004: 5).

Pengertian MySQL menurut MySQL manual adalah sebuah open source software database SQL (Search Query Language) yang menangani sistem manajemen database dan sistem manajemen database relational. MySQL adalah open source software yang dibuat oleh sebuah perusahaan Swedia yaitu MySQL AB. MySQL mempunyai fitur-fitur yang sangat mudah dipelajari bagi para penggunanya dan dikembangkan untuk menangani database yang besar dengan waktu yang lebih singkat. Kecepatan, konektivitas dan keamanannya yang lebih baik membuat MySQL sangat dibutuhkan untuk mengakses database di internet.


(35)

2.2.12 XAMPP

Menurut Riyanto (2014:3), XAMPP adalah sebuah software

yang berfungsi untuk menjalankan website berbasis PHP dan menggunakan pengolah data MySQL dikomputer local. XAMPP berperan sebagai server web pada komputer anda. XAMPP juga dapat disebut sebuah CPanel server virtual, yang dapat membantu anda melakukan preview sehingga dapat memodifikasi website tanpa harus

online atau terakses dengan internet.

Software XAMPP dapat diproleh secara gratis dari situs

www.apachefriends.org atau dapat juga dicari di google untuk beberapa

versi tertentu. XAMPP adalah perangkat lunak yang bebas, yang mendukung banyak sistem operasi dan merupakan komplikasi dari beberapa program. Fungsi adalah sebagai server yang berdiri sendiri yang terdiri dari atas program Apache HTTP server, MySQL database, dan penerjemah bahasa yang ditulis dalam dengan pemprograman PHP dan Perl.

2.2.13 Sublime Text

Sublime Text adalah aplikasi editor untuk kode dan teks yang

dapat berjalan diberbagai platform operating system dengan menggunakan teknologi Phyton API. Terciptanya aplikasi ini terinspirasi dari aplikasi Vim, Aplikasi ini sangatlah fleksibel dan

powerfull. Fungsionalitas dari aplikasi ini dapat dikembangkan dengan


(36)

source dan juga aplikasi yang dapat digunakan dan didapatkan secara gratis, akan tetapi beberapa fitur pengembangan fungsionalitas

(packages) dari aplikasi ini merupakan hasil dari temuan dan mendapat

dukungan penuh dari komunitas serta memiliki linsensi aplikasi gratis.

Sublime Text mendukung berbagai bahasa pemrograman dan mampu

menyajikan fitur syntax highlight hampir di semua bahasa pemrogramman yang didukung ataupun dikembangkan oleh komunitas seperti; C, C++, C#, CSS, D, Dylan, Erlang, HTML, Groovy, Haskell, Java, JavaScript, LaTeX, Lisp, Lua, Markdown, MATLAB, OCaml, Perl, PHP, Python, R, Ruby, SQL, TCL, Textile and XML. Biasanya bagi bahasa pemrograman yang didukung ataupun belum terdukung secara default dapat lebih dimaksimalkan atau didukung dengan menggunakan add-ons yang bisa diunduh sesuai kebutuhan pengguna.

Berikut beberapa fitur yang diunggulkan dari aplikasi Sublime Text:

1. Goto Anything

Fitur yang sangat membantu dalam membuka file ataupun menjelajahi isi dari file hanya dengan beberapa keystrokes.

2. Multiple Selections

Fitur ini memungkinkan user untuk mengubah secara interaktif banyak baris sekaligus, mengubah nama variabel dengan mudah, dan memanipulasi file lebih cepat dari sebelumnya.


(37)

3. Command Pallete

Dengan hanya beberapa keystorkes, user dapat dengan cepat mencari fungsi yang diinginkan, tanpa harus menavigasi melalu menu.

4. Distraction Free Mode

Bila user memerlukan fokus penuh pada aplikasi ini, fitur ini dapat membantu user dengan memberikan tampilan layar penuh.

5. Split Editing

Dapatkan hasil yang maksimal dari monitor layar lebar dengan dukungan editing perpecahan. Mengedit sisi file dengan sisi, atau mengedit dua lokasi di satu file. Anda dapat mengedit dengan banyak baris dan kolom yang user inginkan.

6. Instant Project Switch

Menangkap semua file yang dimasukkan kedalam project pada aplikasi ini. Terintegrasi dengan fitur Goto Anything untuk menjelajahi semua file yang ada ataupun untuk beralih ke file dalam project lainnya dengan cepat.

7. Plugin API

Dilengkapi dengan plugin API berbasis Phyton sehingga membuat aplikasi ini sangat tangguh.


(38)

8. Customize Anything

Aplikasi ini memberikan user fleksibilitas dalam hal pengaturan fungsional dalam aplikasi ini.

9. Cross Platform

Aplikasi ini dapat berjalan hampir disemua operating system

modern seperti Windows, OS X, dan Linux based operating


(39)

BAB III

METODOLOGI PENELITIAN

3.1 Peralatan Pendukung

Penelitian membutuhkan berbagai perangkat untuk mendukung berjalannya perancangan dan implementasi website, antara lain:

3.1.1 Perangkat Keras

Dalam perancangan dan implementasi website raport online SMP Negeri 5 Purwanegara, penulis menggunakan perangkat keras berupa Personal Computer (Laptop). Berikut adalah spesifikasi perangkat keras yang digunakan.

a. 64 bit architectre processor

b. 6 GB Random Access Memory (RAM)

3.1.2 Perangkat Lunak

a. Sistem Operasi Windows 8.0. b. Web Editor : Sublime Text

c. Web Server : Apache

d. Bahasa Pemrograman : PHP, HTML, CSS, Javascript

e. Database Server : MySQL


(40)

3.2 Bahan Penelitian 3.2.1 Studi Literatur

Proses studi literatur dilakukan dengan mempelajari bahan – bahan literatur tentang rekapitulasi nilai dan pembuatan laporan nilai siswa yang didapat melalui internet dan buku – buku dari perpustakaan.

Sehingga bahan literatur yang telah dipelajari dapat diterapkan untuk membuat sistem pengelolaan nilai raport yang baik. Selain itu, penulis mempelajari berbagai teknologi yang sesuai dengan kebutuhan sistem dan kebutuhan pengguna yang menjadi acuan pembangunan sistem yang lebih baik.

3.2.2 Wawancara

Wawancara dilakukan dengan cara mewawancarai langsung pihak – pihak terkait, yang berguna untuk mendapatkan informasi maupun data – data yang dibutuhkan untuk perancangan dan pembangunan yang akan dibuat yaitu:

1. Wawancara terhadap pihak sekolah SMP Negeri 5 Puwanegara dengan melakukan wawancara kepada Ibu Wartini sebagai kepala sekolah yang berguna untuk mendapatkan data maupun informasi.

2. Wawancara terhadap 2 orang guru dan siswa sebagai pihak pengguna yang berguna untuk menganalisis kebutuhan pengguna terhadap sistem yang dibuat.


(41)

Hasil dari wawancara ini berguna untuk mendukung bahasan penelitian ini dalam hal melakukan perancangan dan membangun sistem yang dapat menghasilkan rancangan sistem.

3.2.3 Observasi

Tujuan dari observasi adalah dengan mendeskripsikan setting

yang diamati, tempat kegiatan orang-orang yang berpartisipasi dalam kegiatan tersebut dan makna apa yang diamati menurut perspektif pengamat (Patton,1990 : 202). Proses observasi didasarkan pada pengamatan langsung dan mencatat perilaku atau kejadian seperti keadaan yang sebenarnya.

Pada metode pengamatan (observasi), ini dilakukan peninjauan dan penelitian langsung di lapangan untuk memperoleh dan mengumpulkan data yang dibutuhkan. Pengamatan ini dilakukan pada tanggal 18 sampai dengan 19 Juli 2016, di SMP Negeri 5 Purwanegara.

3.3 Langkah Penelitian

Penelitian tentang Sistem Pengelolaan Nilai dan Raport Online di SMP Negeri 5 Purwanegara menggunakan metode System Development Life Cycle

(SLDC) model waterfall. SDLC adalah metodologi umum dalam siklus

pengembangan sistem dan penyusunan suatu sistem yang baru untuk menggantikan sistem yang lama atau memperbaiki sistem yang sudah ada.

SDLC merupakan pola yang diambil untuk mengembangkan sistem perangkat lunak, yang terdiri dari tahap – tahap : perencanaan sistem


(42)

(implementation), pengujian (testing) dan pengelolaan (maintenance). Dalam rekayasa perangkat lunak, konsep SDLC mendasari berbagai jenis metodologi pengembangan perangkat lunak.

Fase – fase pada System Development Life Cycle (SDLC) meliputi: 1. Perencanaan Sistem (Systems Planning).

2. Analisis Sistem (System Analysis). 3. Perancangan Sistem (Systems Design). 4. Implementasi Sistem (Systems Maintenance).

Model Waterfall merupakan model klasik yang sederhana dengan aliran sistem yang linier. Output dari setiap tahap merupakan input bagi tahap berikutnya. Model ini pertama kali diperkenalkan oleh Winston Royce tahun 1970, sekarang model ini lebih dikenal dengan Liner Sequential Model.

Karakteristik dari metodologi waterfall ini meliputi beberapa bagian, yaitu:

 Aktivitas mengalir dari satu fase ke fase lainnya secara berurutan.

 Setiap fase dikerjakan terlebih dahulu sampai selesai, jika sudah selesai baru mulai menuju fase berikutnya.

Tahapan model Waterfall dapat digambarkan pada gambar 3.1 di bawah ini.


(43)

Penjelasan mengenai tahapan metode SDLC model Waterfall adalah sebagai berikut.

1. System Engineering merupakan tahapan untuk menetapkan segala

hal yang diperlukan dalam pelaksanaan proyek.

2. Analysis merupakan tahapan untuk menganalisis hal-hal yang

diperlukan untuk pembuatan atau pengembangan perangkat lunak dan melakukan pengumpulan data serta informasi yang diperlukan melalui observasi (pengamatan) dan wawancara.

3. Design merupakan tahap penerjemahan dari keperluan atau data

yang telah dianalisis ke dalam bentuk yang mudah dimengerti oleh programmer. Tiga atribut yang penting dalam proses perancangan yaitu : struktur data, arsitektur perangkat lunak dan prosedur rinci / algoritma.

4. Code merupakan tahapan untuk menerjemahkan data yang telah dirancang / algoritma ke dalam bahasa pemrograman yang telah ditentukan.

5. Testing merupakan tahapan uji coba terhadap program telah dibuat.

6. Maintenance merupakan perubahan atau penambahan program

sesuai dengan permintaan user.

3.4 Sistem yang Sedang Berjalan di SMP Negeri 5 Purwanegara

Di dalam sistem pengelolaan nilai pada SMP Negeri 5 Purwanegara terdapat beberapa kendala dalam proses pencatatan dan pelaporan data nilai. Dikarenakan setiap siswa memiliki nilai sendiri – sendiri dan berbeda-beda


(44)

setiap semesternya. Proses pencarian data nilai siswa yang memerlukan cukup banyak waktu dan tenaga sehingga kinerja dari sistem menjadi kurang efektif dan menyita waktu yang sangat lama. Kurang efektifnya pengolahan nilai sehingga masih terjadi adanya kesalahan dalam memberikan informasi nilai bagi siswa maupun wali siswa.

Sistem yang berjalan di sekolah saat ini dapat digambarkan pada gambar 3.2.

Gambar 3.2 Sistem yang berjalan

Perlu adanya sistem terkomputerisasi untuk mengoptimalkan pengolahan data nilai sehingga dihasilkan informasi yang cepat, relevan, juga waktu pengaksesan cepat dan akurat Saat ini sistem informasi yang digunakan dalam pengolahan data nilai siswa masih bersifat konvensional,


(45)

sehingga kurang optimal dan membutuhkan waktu yang lama dalam pencatatan, sehingga selalu terhambat dalam pengumpulan nilai. Sistem yang berjalan saat ini kurang efektif dan efisien dimana masih manual cara pengolahan nilainya masih dituliskan ke dalam buku raport (Gambar 3.3) sehingga prosesnya sangat lama.

Gambar 3.3 Raport Siswa SMP Negeri 5 Purwanegara

3.5 Analisis Kebutuhan Fungsional dan Non Fungsional 3.5.1 Kebutuhan Fungsional

1. Data Siswa

2. Data Mata Pelajaran 3. Data Guru

4. Data Nilai

5. Laporan Nilai Siswa

3.5.2 Kebutuhan Non Fungsional

1. Laporan nilai siswa ditampilkan hanya kepada siswa yang bersangkutan.


(46)

3.6 Arsitektur Sistem

Pada tahap ini dilakukan penentuan perancangan sistem yang akan digunakan. Berikut ini merupakan perancangan sistem yang diusulkan:

Gambar 3.4 Arsitektur Sistem yang Diusulkan

Gambar 3.4 merupakan rancangan arsitektur sistem yang diusulkan untuk membuat website Raport Online SMP Negeri 5 Purwanegara.

Database server yang digunakan pada aplikasi MySql dan menggunakan

Apache sebagai web server. Komunikasi antara pengguna dan web server

menggunakan internet dan web browser pada perangkat pengguna. Saat pengguna mengakses aplikasi, web server memuat antarmuka dan melakukan pengambilan data yang diperlukan dari database server. Melalui antarmuka yang dimuat web server pengguna bisa menyimpan data ke


(47)

3.7 Perancangan Sistem

Dalam pembuatan aplikasi dilakukan perancangan database

menggunakan bantuan Diagram ER. Metode perangan lain yang digunakan dalam aplikasi adalah United Markup Language (UML) yang dipakai dalam pengembangan aplikasi yaitu model Use Case Diagram, Activity Diagram,

dan Class Diagram.

3.7.1 Use Case Diagram Aplikasi

Gambaran Use Case Diagram yang digunakan dalam aplikasi dapat dilihat pada Gambar 3.5.

Gambar 3.5Use Case Diagram Aplikasi Berikut penjelasan tentang Gambar 3.5:

1. Terdapat 3 aktor pada use case diagram aplikasi yakni admin, guru dan siswa.


(48)

2. Admin berhubungan langsung pada manage data guru, data mata pelajaran, data siswa, data kelas dan data admin. Admin berhak menambah, mengurangi ataupun merubah data di dalamnya. 3. Guru dapat melakukan input nilai dan merubahnya sesuai dengan

nilai siswa yang bersangkutan.

4. Siswa dapat melihat dan mencetak nilai sesuai dengan NIS masing – masing.

3.7.2 Activity Diagram Aplikasi

Gambar Activity Diagram yang digunakan dalam aplikasi dapat dilihat pada Gambar 3.6.


(49)

Gambar 3.6 menunjukkan Acitivy Diagram pada kegiatan alur proses raport online. Admin dapat melakukan penambahan data guru, data siswa, data kelas maupun data mata pelajaran. Selanjutnya guru dapat melihat data siswa dan melakukan input nilai dan mengubahnya sesuai dengan nilai siswa yang terbaru. Kemudian siswa dapat melihat dan mencetak nilai sesuai dengan NIS masing – masing.

3.8 Perancangan Basis Data 3.8.1 ER Diagram Aplikasi

Gambar 3.7 berikut ini menjelaskan hubungan data dalam basis data yang terdapat di dalam sistem Raport Online SMP Negeri 5 Purwanegara:

Gambar 3.7ER Diagram Aplikasi Berikut penjelasan tentang Gambar 3.7:

1. Terdapat 5 entitas yang masing – masing memiliki atribut dan relasi.


(50)

2. Entitas Kelas memiliki relasi many-to-many ke entitas Siswa, artinya sebuah kelas memiliki banyak siswa di dalamnya, dan sebaliknya Siswa mempunyai banyak kelas.

3. Entitas Guru memiliki relasi many-to-many ke entitas Mata Pelajaran, artinya seorang guru dapat mengampu banyak mata pelajaran, dan sebaliknya sebuah mata pelajaran dapat diampu oleh banyak guru.

4. Entitas Siswa memiliki relasi many-to-many ke entitas Mata Pelajaran, artinya siswa dapat mengambil banyak mata pelajaran, dan sebaliknya mata pelajaran dapat diambil oleh banyak siswa. 5. Entitas Admin tidak memiliki relasi ke entitas lainnya.

3.8.2 Kamus Data

Kamus data merupakan daftar rancangan basis data dan tabel yang akan dibuat. Dari sebuah ER Diagram dapat dikonversi menjadi tabel – tabel pada kamus data dengan lebih lengkap dan terperinci. Pada

ER Diagram yang digambarkan pada gambar 3.7, terdapat entitas

Admin, Kelas, Siswa, Mata Pelajaran dan Guru. Masing – masing entitas dapat dikonversikan menjadi sebuah tabel pada kamus data.

Berikut ini merupakan kamus data dalam basis data yang diperlukan dalam perancangan sistem:

1. Tabel Admin

Tabel Admin terbentuk dari entitas Admin pada ER


(51)

masing kolom mempunyai fungsi yang akan dijelaskan pada tabel di bawah ini.

Tabel 3. 1 Kamus Data Tabel Admin

No. Nama Tipe Data Panjang Keterangan

1. Id Int - Kolom yang berfungsi sebagai primary key

pada tabel admin. 2. Nama Varchar 50 Kolom yang

menunjukkan nama admin.

3. Username Varchar 10 Kolom yang menunjukkan identitas admin saat login. 4. Password Varchar 8 Kolom yang

menunjukkan password saat admin login.

2. Tabel Kelas

Tabel Kelas terbentuk dari entitas Kelas pada ER Diagram. Tabel Kelas mempunyai beberapa kolom. Masing – masing kolom mempunyai fungsi yang akan dijelaskan pada tabel di bawah ini.


(52)

Tabel 3.2 Kamus Data Tabel Kelas

No. Nama Tipe Data Panjang Keterangan

1. Id_kelas Int - Kolom yang berfungsi sebagai primary key

pada tabel Kelas. 2. Kelas Varchar 10 Kolom yang

menunjukkan nama kelas.

3. Tahun Varchar 30 Kolom yang menunjukkan tahun ajaran.

4. Wk Varchar 20 Kolom yang menunjukkan nama wali kelas.

3. Tabel Siswa

Tabel Siswa terbentuk dari entitas Siswa pada ER Diagram. Tabel Siswa mempunyai beberapa kolom. Masing – masing kolom mempunyai fungsi yang akan dijelaskan pada tabel di bawah ini.


(53)

Tabel 3.3 Kamus Data Tabel Siswa

No. Nama Tipe Data Panjang Keterangan

1. Id Int - Kolom yang berfungsi sebagai primary key

pada tabel Siswa. 2. Nisn Varchar 10 Kolom yang

menunjukkan NISN (Nomor Induk Siswa Nasional)

3. Nama Varchar 50 Kolom yang menunjukkan nama siswa.

4. Id_kelas Int - Kolom yang menunjukkan id_kelas yang merupakan

foreign key dari tabel

Kelas.

5. Username Varchar 10 Kolom yang menunjukkan identitas siswa saat login.


(54)

6. Password Varchar 8 Kolom yang menunjukkan password

siswa saat login.

7. Ortu Varchar 50 Kolom yang menunjukkan nama orang tua siswa.

4. Tabel Guru

Tabel Guru terbentuk dari entitas Guru pada ER Diagram. Tabel Guru mempunyai beberapa kolom. Masing – masing kolom mempunyai fungsi yang akan dijelaskan pada tabel di bawah ini.

Tabel 3.4 Kamus Data Tabel Guru

No. Nama Tipe Data Panjang Keterangan

1. Id_guru Int - Kolom yang berfungsi sebagai primary key

pada tabel Guru.

2. Nama Varchar 50 Kolom yang menunjukkan nama guru.

3. Nip Varchar 18 Kolom yang menunjukkan NIP


(55)

(Nomor Induk Pegawai) guru.

4. Nuptk Varchar 16 Kolom yang menunjukkan NUPTK guru.

5. Username Varchar 10 Kolom yang menunjukkan identitas guru saat login.

6. Password Varchar 8 Kolom yang menunjukkan password

guru saat login.

7. Status_wk Varchar 1 Kolom yang menunjukkan status wali kelas.

8. Gelar Varchar 7 Kolom yang menunjukkan gelar guru.

5. Tabel Mata Pelajaran

Tabel Mata Pelajaran terbentuk dari entitas Mata Pelajaran pada ER Diagram. Tabel Mata Pelajaran mempunyai beberapa


(56)

kolom. Masing – masing kolom mempunyai fungsi yang akan dijelaskan pada tabel di bawah ini.

Tabel 3.5 Kamus Data Tabel Mata Pelajaran

No. Nama Tipe Data Panjang Keterangan

1. Id Int - Kolom yang berfungsi sebagai primary key

pada tabel Mata Pelajaran.

2. Id_guru Int - Kolom yang menunjukkan identitas guru yang merupakan

foreign key dari tabel

Guru.

3. Matpel Varchar 20 Kolom yang menunjukkan nama mata pelajaran.

6. Tabel Nilai

Tabel Nilai terbentuk dari hasil relasi many-to-many antara entitas Siswa dengan entitas Mata Pelajaran pada ER Diagram. Tabel Nilai mempunyai beberapa kolom. Masing – masing kolom mempunyai fungsi yang akan dijelaskan pada tabel di bawah ini.


(57)

Tabel 3.6 Kamus Data Tabel Nilai

No. Nama Tipe Data Panjang Keterangan

1. Id Int - Kolom yang berfungsi sebagai primary key

pada tabel Nilai. 2. Id_siswa Varchar 10 Kolom yang

menunjukkan id_siswa yang merupakan

foreign key dari tabel

Siswa.

3. Matpel Varchar 20 Kolom yang menunjukkan nama mata pelajaran.

4. Semester Int - Kolom yang menunjukkan semester yang ditempuh.

5. Nilai Int - Kolom yang menunjukkan nilai siswa tiap mata pelajaran.


(58)

6. KKM Int - Kolom yang menunjukkan batas minimal nilai yang harus dicapai.

7. Ketercapaian Varchar 8 Kolom yang menunjukkan status ketercapaian siswa.

7. Tabel Guru Matpel

Tabel Guru Matpel terbentuk dari hasil relasi

many-to-many antara entitas Guru dengan entitas Mata Pelajaran pada ER

Diagram. Tabel Guru Matpel mempunyai beberapa kolom.

Masing – masing kolom mempunyai fungsi yang akan dijelaskan pada tabel di bawah ini.

Tabel 3.7 Kamus Data Tabel Guru Matpel

No. Nama Tipe Data Panjang Keterangan

1. Id Int - Kolom yang berfungsi sebagai primary key

pada tabel Guru Matpel.

2. Id_guru Int - Kolom yang menunjukkan id_guru


(59)

yang merupakan

foreign key dari tabel

Guru.

3. Matpel Varchar 50 Kolom yang menunjukkan nama mata pelajaran.

4. Kkm Int - Kolom yang menunjukkan KKM ().

8. Tabel Siswa Per Kelas

Tabel Guru Matpel terbentuk dari hasil relasi

many-to-many antara entitas Siswa dengan entitas Kelas pada ER

Diagram. Tabel Guru Matpel mempunyai beberapa kolom.

Masing – masing kolom mempunyai fungsi yang akan dijelaskan pada tabel di bawah ini.

Tabel 3. 8 Kamus Data Tabel Siswa Per Kelas

No. Nama Tipe Data Panjang Keterangan

1. Id Int - Kolom yang berfungsi sebagai primary key pada tabel Siswa Per Kelas.


(60)

2. Id_siswa Int - Kolom yang menunjukkan id_siswa yang merupakan

foreign key dari tabel

Siswa.

3. Id_kelas Int - Kolom yang menunjukkan id_kelas yang merupakan

foreign key dari tabel

Kelas.

3.8.3 Class Diagram Aplikasi

Gambaran Class Diagram yang digunakan dalam aplikasi dapat dilihat pada Gambar 3.8.


(61)

Berikut penjelasan fungsi dari masing masing kelas :

1. Class Admin

Class Admin berfungsi untuk memasukan dan

menampilkan data Admin.

2. Class Kelas

Class Kelas berfungsi untuk memasukkan dan

menampilkan data Kelas. Class Kelas juga memiliki fungsi sebagai penghubung class lain yang akan menampilkan nama Kelas.

3. Class Guru

Class Guru berfungsi untuk memasukkan dan

menampilkan data Guru. Class Kelas juga memiliki fungsi sebagai penghubung class lain yang akan menampilkan nama Guru.

4. Class Siswa

Class Siswa berfungsi untuk memasukan data siswa. Class

Siswa sangat berperan penting pada aplikasi. Class ini berfungsi sebagai sumber data siswa yang akan dihubungkan pada class lain yang menampilkan nama siswa.

5. Class Mata Pelajaran

Class Mata Pelajaran berfungsi untuk memasukkan dan

menampilkan data Mata Pelajaran. Class Mata Pelajaran juga memiliki fungsi sebagai penghubung class lain yang akan menampilkan nama Mata Pelajaran.


(62)

6. Class Nilai

Class Nilai berfungsi untuk memasukkan data nilai para

siswa. Pada Class Nilai dapat menampilkan nama siswa, mata pelajaran yang ditempuh, dan nilai tiap mata pelajaran.

Berikut merupakan penjelasan relasi antar kelas pada Class

Diagram yang digambarkan pada gambar 3.8:

1. Terdapat kelas pada diagram digunakan untuk inisialisasi ke dalam

table model dan basis data aplikasi.

2. Pada class Admin memiliki association dengan class Kelas, artinya admin berhak melihat data Kelas dari database melalui

method getDataKelas() dan mengembalikan nilai dengan tipe data

string. Admin juga dapat menyimpan data ke dalam database

menggunakan method setDataKelas().

3. Pada class Admin memiliki association dengan class Guru, artinya admin berhak melihat data Guru dari database melalui method

getDataGuru() dan mengembalikan nilai dengan tipe data string. Admin juga dapat menyimpan data ke dalam database

menggunakan method setDataGuru().

4. Pada class Admin memiliki association dengan class Siswa, artinya admin berhak melihat data Siswa dari database melalui


(63)

string. Admin juga dapat menyimpan data ke dalam database

menggunakan method setDataSiswa().

5. Pada class Admin memiliki association dengan class Mata Pelajaran, artinya admin berhak melihat data Mata Pelajaran dari

database melalui method getDataMataPelajaran() dan

mengembalikan nilai dengan tipe data string. Admin juga dapat menyimpan data ke dalam database menggunakan method

setDataMataPelajaran().

6. Pada class Nilai mempunyai composition dengan class Siswa, artinya class Nilai tidak dapat terbentuk apablia class Siswa tidak ada. Siswa disini hanya dapat melihat data dari class Nilai melalui

method getDataNilai() dan mengembalikan nilai dengan tipe data

string.

7. Pada class Nilai mempunyai composition dengan class Mata Pelajaran, artinya class Nilai tidak dapat berdiri sendiri apablia

class Mata Pelajaran tidak ada.

8. Pada class Guru mempunyai association dengan class Kelas, artinya Guru dapat melihat data Kelas di dalam database. Guru mengambil data dari database menggunakan method

getDataKelas() dan mengembalikan nilai dalam tipe data string.

9. Pada class Guru mempunyai association dengan class Siswa, artinya Guru dapat melihat data Siswa di dalam database. Guru


(64)

mengambil data dari database menggunakan method

getDataSiswa() dan mengembalikan nilai dalam tipe data string.

10.Pada class Guru mempunyai association dengan class Mata Pelajaran, artinya Guru dapat melihat data Mata Pelajaran di dalam

database. Guru mengambil data dari database menggunakan

method getDataMataPelajaran() dan mengembalikan nilai dalam

tipe data string.

11.Pada class Guru mempunyai association dengan class Nilai, artinya Guru dapat melihat serta merubah data nilai di dalam

database. Guru mengambil data dari database menggunakan

method getDataNilai() dan mengembalikan nilai dalam tipe data

string serta menyimpan data yang berupa tipe data string melalui

method setDataNilai(string) dan mengembalikan dalam tipe data

void.

3.9 Perancangan Antarmuka

Antarmuka sangatlah penting dalam suatu aplikasi karena merupakan bagian dari perangkat lunak yang menjadi sarana komunikasi antara pengguna dengan sistem serta dapat memberikan kemudahan bagi pengguna dalam melakukan aktivitasnya.

3.9.1 Rancangan Antarmuka Menu Utama

Rancangan antarmuka halaman utama merupakan tampilan utama dari aplikasi yang dapat dilihat oleh guru, murid dan admin.


(65)

Gambaran rancangan antarmuka halaman utama aplikasi dapat dilihat pada Gambar 3.9.

Gambar 3.9 Rancangan antarmuka menu utama

Terdapat menu-menu yang dapat dibuka sesuai dengan pengguna. Jika pengguna sudah masuk pada halaman utama, semua menu akan aktif.

3.9.2 Rancangan Antarmuka Halaman Login Guru

Rancangan untuk halaman login Guru terdapat dua buah kolom dan satu button yaitu kolom enter username, password dan satu button

masuk. Guru dapat login sesuai username, password yang telah dibuat oleh admin. Kemudian di bawahnya terdapat link untuk kembali ke halaman utama. Gambaran rancangan antarmuka halaman login guru dapat dilihat pada Gambar 3.10.


(66)

Gambar 3.10 Rancangan Antarmuka Login Guru

3.9.3 Rancangan Antarmuka Halaman Form Nilai Siswa

Rancangan untuk halaman Form Nilai Siswa terdapat beberapa label dan button yang berfungsi apabila kita mengeksekusi. Gambaran rancangan antarmuka halaman Form Nilai Siswa dapat dilihat pada Gambar 3.11.


(67)

3.9.4 Rancangan Antarmuka Halaman Login Admin

Rancangan untuk halaman login Admin terdapat dua buah kolom dan satu button yaitu kolom enter username, password dan satu

button masuk. Admin dapat login sesuai username, password.

Kemudian di bawahnya terdapat link untuk kembali ke halaman utama. Gambaran rancangan antarmuka halaman login admin dapat dilihat pada Gambar 3.12.

Gambar 3.12 Rancangan Antarmuka Login Admin

3.9.5 Rancangan Antarmuka Halaman Manage Data

Rancangan antarmuka halaman manage data merupakan tampilan dari aplikasi yang hanya dapat dilihat oleh admin. Gambaran rancangan antarmuka halaman manage data aplikasi dapat dilihat pada Gambar 3.13 sampai dengan 3.17. Halaman – halaman ini berfungsi untuk mengatur dan merubah data sesuai dengan kuasa admin.


(68)

Gambar 3.13 Rancangan Antarmuka Manage Data Guru


(69)

Gambar 3.15 Rancangan Antarmuka Manage Data Siswa


(70)

Gambar 3.17 Rancangan Antarmuka Manage Data Admin

3.9.6 Rancangan Antarmuka Halaman Login Siswa

Rancangan untuk halaman login Siswa terdapat dua buah kolom dan satu button yaitu kolom enter username, password dan satu button

masuk. Siswa dapat login sesuai username, password yang telah diberikan oleh Admin. Kemudian di bawahnya terdapat link untuk kembali ke halaman utama. Gambaran rancangan antarmuka halaman


(71)

Gambar 3.18 Rancangan Antarmuka Login Siswa

3.9.7 Rancangan Antarmuka Halaman Laporan Nilai Siswa

Rancangan untuk halaman laporan nilai siswa. Siswa dapat melihat dan mencetak laporan nilai siswa sesuai dengan NIS masing – masing. Gambaran rancangan antarmuka halaman laporan dapat dilihat pada Gambar 3.19.


(72)

3.10 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 yang menjadi perhatian dalam pengujian adalah aplikasi dapat menyimpan dan mengubah data seluruh siswa, nilai siswa, kelas, guru dan mata pelajaran. Aplikasi dapat mengolah data mata pelajaran dan nilai yang didapat.


(73)

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 siswa, data guru, data kelas, dan data mata pelajaran 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 Database

Setelah Apache dan MySQL berhasil terhubung langkah selanjutnya adalah pembuatan database dengan cara membuka browser kemudian ketikkan

localhost/phpmyadmin. Pada sistem yang telah dibangun database diberi nama

PPDB online yang didalamnya berisi banyak tabel meliputi: rpt_admin, rpt_guru, rpt_kelas, rpt_matpel, rpt_matpelajaran, rpt_nilai, dan rpt_siswa.


(74)

Gambar 4.1 Pembuatan Database dengan phpMyAdmin

4.3 Implementasi Antarmuka

Untuk mengimplementasikan aplikasi, rancangan desain user interface harus diubah ke dalam Bahasa pemrograman yaitu menggunakan Bahasa pemrograman PHP. Sedangkan perangkat lunak pendukung yang digunakan dalam implementasi adalah Sublime Text Editor.

4.3.1 Antarmuka Halaman Awal Admin

Antarmuka halaman awal admin merupakan tampilan awal saat menu admin dijalankan. Tampilan ini dapat dilihat oleh admin. Tampilan halaman awal admin dapat dilihat pada gambar 4.2.


(75)

Gambar 4.2 Antarmuka Halaman Awal Admin

4.3.2 Antarmuka Halaman Login Admin

Halaman login merupakan halaman utama admin sebelum menggunakan sistem. Halaman ini berisi form username dan password

yang harus diisi dengan benar. Halaman login admin dapat dilihat pada gambar 4.3.


(76)

4.3.3 Antarmuka Halaman Manage Guru

Setelah admin melakukan login, admin dapat melihat data – data sesuai dengan kewenangannya. Salah satunya adalah mengatur data – data guru di SMP Negeri 5 Purwanegara. Admin dapat melihat, menambah, mengubah dan menghapus data guru sesuai dengan kebutuhan. Tampilan halaman manage guru dapat dilihat pada gambar 4.4 sampai dengan gambar 4.7.

Gambar 4.4 Antarmuka Halaman Lihat Data Guru


(77)

Gambar 4.6 Antarmuka Halaman Ubah Data Guru

Gambar 4.7 Antarmuka Halaman Hapus Data Guru

4.3.4 Antarmuka Halaman Manage Mata Pelajaran

Selanjutnya, admin mempunyai kewenangan untuk mengatur data mata pelajaran yang ada di SMP Negeri 5 Purwanegara. Admin dapat melihat, menambah, dan menghapus data mata pelajaran sesuai dengan kebutuhan. Tidak ada pilihan untuk mengubah (edit) data mata pelajaran,


(78)

karena data mata pelajaran sudah ditetapkan untuk semua kelas dan sesuai dengan kurikulum yang berlaku. Tampilan halaman manage guru dapat dilihat pada gambar 4.8 sampai dengan gambar 4.10.

Gambar 4.8 Antarmuka Halaman Lihat Data Mata Pelajaran


(79)

Gambar 4.10 Antarmuka Halaman Hapus Data Mata Pelajaran

4.3.5 Antarmuka Halaman Manage Siswa

Kemudian, admin mempunyai kewenangan untuk mengatur data siswa yang ada di SMP Negeri 5 Purwanegara. Admin dapat melihat, menambah, mengubah dan menghapus data siswa sesuai dengan kebutuhan. Tampilan halaman manage siswa dapat dilihat pada gambar 4.11 sampai dengan gambar 4.13.


(80)

Gambar 4.12 Antarmuka Halaman Tambah Data Siswa

Gambar 4.13 Antarmuka Halaman Ubah Data Siswa

4.3.6 Antarmuka Halaman Manage Kelas

Admin juga mempunyai kewenangan untuk mengatur data kelas yang ada di SMP Negeri 5 Purwanegara. Admin dapat melihat, menambah, mengubah dan menghapus data kelas sesuai dengan kebutuhan. Tampilan halaman manage kelas dapat dilihat pada gambar 4.14 sampai dengan gambar 4.17.


(81)

Gambar 4.14 Antarmuka Halaman Lihat Data Kelas

Gambar 4.15 Antarmuka Halaman Tambah Data Kelas


(82)

Gambar 4.17 Antarmuka Halaman Hapus Data Kelas

4.3.7 Antarmuka Halaman Manage Admin

Admin juga mempunyai kewenangan untuk mengatur data admin

website raport online SMP Negeri 5 Purwanegara. Admin dapat melihat,

menambah, mengubah dan menghapus data admin sesuai dengan kebutuhan. Tampilan halaman manage admin dapat dilihat pada gambar 4.18 sampai dengan gambar 4.20.


(83)

Gambar 4.19 Antarmuka Halaman Tambah Data Admin

Gambar 4.20 Antarmuka Halaman Ubah Data Admin

4.3.8 Antarmuka Halaman Login Guru

Halaman login merupakan halaman utama guru sebelum menggunakan sistem. Halaman ini berisi form username dan password

yang harus diisi dengan benar. Halaman login guru dapat dilihat pada gambar 4.21.


(84)

Gambar 4.21 Antarmuka Halaman Login Guru

4.3.9 Antarmuka Halaman Form Nilai Siswa

Setelah guru melakukan login, halaman form nilai siswa akan muncul. Guru terlebih dahulu melengkapi atribut mata pelajaran, kelas dan semester yang sesuai. Setelah itu, button Tampilkan Siswa dapat menampilkan daftar siswa sesuai atribut yang dipilih. Pada gambar 4.22 dan 4.23 merupakan tampilan form nilai siswa.


(85)

Gambar 4.23 Antarmuka Halaman Form Nilai Siswa (Tampilan Daftar Siswa)

4.3.10 Antarmuka Halaman Login Siswa

Halaman login merupakan halaman utama siswa sebelum menggunakan sistem. Halaman ini berisi form username dan password

yang harus diisi dengan benar. Halaman login siswa dapat dilihat pada gambar 4.24.


(86)

4.3.11 Antarmuka Halaman Raport Online Siswa

Halaman raport adalah halaman yang digunakan siswa untuk melihat nilai dari masing – masing siswa. Setelah siswa melakukan

login, siswa dapat memantau semua nilainya. Halaman raport online

siswa dapat dilihat pada gambar 4.25.

Gambar 4.25 Antarmuka Halaman Raport Online Siswa

4.4 Pengujian Sistem

Pengujian dilakukan bertujuan untuk melihat hasil eksekusi dan fungsionalitas berdasarkan analisis kebutuhan. Hasil pengujian dapat dilihat pada tabel 4.1.

Tabel 4.1 Hasil Pengujian No Kasus Uji Hasil yang

Diharapkan

Hasil yang Didapat Status

1. Tombol Login

pada halaman

Login Admin

dengan

Admin masuk ke halaman Manage

Guru

Setelah tombol diklik Admin dapat masuk ke halaman Manage

Guru


(87)

authentication

valid

2. Tombol Login

pada halaman Login Admin dengan

authentication

tidak valid

Admin tidak dapat masuk ke halaman

Manage Guru

Setelah tombol diklik Admin tidak dapat masuk ke halaman Manage

Guru

Berhasil

3. Tombol Login

pada halaman Login Admin dengan authentication tidak valid Diberikan peringatan kepada Admin Peringatan muncul berupa kalimat “Username atau Password Salah”

Berhasil

4. Menu Manage

Guru

Admin masuk ke halaman Manage

Guru

Setelah tombol diklik, admin dapat masuk ke halaman Manage

Guru

Berhasil

5. Menu Manage

Mata Pelajaran

Admin masuk ke halaman Manage

Mata Pelajaran

Setelah tombol diklik, admin dapat masuk ke halaman Manage

Mata Pelajaran

Berhasil

6. Menu Manage

Siswa

Admin masuk ke halaman Manage

Siswa

Setelah tombol diklik, admin dapat masuk ke halaman Manage

Siswa


(88)

7. Menu Manage

Kelas

Admin masuk ke halaman Manage

Kelas

Setelah tombol diklik, admin dapat masuk ke halaman Manage

Kelas

Berhasil

8. Menu Manage

Admin

Admin masuk ke halaman Manage

Admin

Setelah tombol diklik, admin dapat masuk ke halaman Manage

Admin

Berhasil

7. Tombol Tambah pada setiap halaman menu pada Admin Sistem dapat menampilkan halaman untuk menambahkan data Setelah tombol diklik, sistem dapat menampilkan halaman untuk menambahkan data Berhasil

8. Tombol Edit pada setiap halaman menu pada Admin

Sistem dapat menampilkan halaman untuk mengubah data Setelah tombol diklik, sistem dapat menampilkan halaman untuk mengubah data Berhasil

9. Fungsi menyimpan data

Data dari admin dapat masuk ke

database

Sistem telah dapat menyimpan data dari admin ke dalam database

Berhasil

10. Fungsi menghapus data

Data yang dipilih dapat dihapus dari

database

Sistem telah dapat menghapus data dari database


(89)

11. Fungsi Update

data

Data dari admin dapat masuk ke

database

menggantikan data yang sebelumnya telah tersimpan

Sistem telah dapat menyimpan data dari admin ke dalam database

menggantikan data yang sebelumnya telah tersimpan

Berhasil

12. Validasi Kolom Kosong Sistem dapat memberikan info apabila kolom pengisian data tidak diisi Sistem berhasil menampilkan info jika kolom yang wajib diisi masih kosong.

Berhasil

13. Tombol Login

pada halaman

Login Guru dengan

authentication

valid

Guru dapat masuk ke halaman Form

Input Nilai

Setelah tombol diklik Guru berhasil masuk ke halaman Form

Input Nilai

Berhasil

14. Tombol Login

pada halaman Login Guru dengan

authentication

tidak valid

Guru tidak dapat masuk ke halaman Form Input Nilai

Setelah tombol diklik Guru tidak dapat masuk ke halaman Form

Input Nilai

Berhasil

15. Tombol Login

pada halaman Login Guru dengan authentication tidak valid Diberikan peringatan kepada Guru Peringatan muncul berupa kalimat “Username atau Password Salah” Berhasil


(90)

16. Tombol Tampilkan Siswa Sistem dapat menampilkan halaman untuk menampilkan daftar siswa Setelah tombol diklik, sistem berhasil menampilkan halaman untuk menampilkan daftar siswa Berhasil

17. Fungsi

menampilkan data siswa

Data dari database

dapat ditampilkan pada halaman

website dalam

bentuk tabel

Sistem telah dapat menampilkan data dari database

dalam bentuk tabel

Berhasil

18. Fungsi Update

data Nilai siswa

Data nilai dari guru dapat masuk

ke database

menggantikan nilai yang sebelumnya telah tersimpan atau belum pernah tersimpan

Sistem telah dapat menyimpan data dari guru ke dalam

database

menggantikan data yang sebelumnya telah tersimpan atau yang belum pernah tersimpan

Berhasil

17. Validasi Update

Data

Sistem dapat memberikan info ketika data telah tersimpan

Sistem berhasil menampilkan info bahwa data telah tersimpan

Berhasil

18. Tombol Login

pada halaman

Login Siswa

dengan

Siswa dapat masuk ke halaman Raport

Online

Setelah tombol diklik Siswa berhasil masuk ke halaman Raport

Online


(91)

authentication

valid

19. Tombol Login

pada halaman Login Siswa dengan

authentication

tidak valid

Siswa tidak dapat masuk ke halaman Raport Online

Setelah tombol diklik Siswa tidak dapat masuk ke halaman Raport

Online

Berhasil

20. Tombol Login

pada halaman Login Siswa dengan authentication tidak valid Diberikan peringatan kepada Siswa Peringatan muncul berupa kalimat “Username atau Password Salah”

Berhasil

21. Fungsi

menampilkan data nilai siswa

Sistem dapat menampilkan data nilai siswa sesuai dengan semester yang dipilih Sistem berhasil menampilkan nilai siswa sesuai semester yang dipilih Berhasil

Website Raport Online SMP Negeri 5 Purwanegara membantu siswa dan

orang tua dalam memantau nilai raport siswa kapanpun dan dimanapun selama terhubung dengan internet. Website Raport Online dapat memberikan informasi nilai raport siswa tiap semester yang ditempuh. Hasil raport yang ditampilkan dapat dilihat pada Gambar 4.25.


(1)

$kelas = $_GET['kelas'];

$semester = $_GET['semester'];

$sql = "select count(*) as hasil from rpt_nilai where matpel = '$matpel' and semester=$semester";

$query2 = mysql_query($sql);

$hasil2 = mysql_fetch_assoc($query2); $hasil2 = $hasil2['hasil'];

if ($hasil2 == 0) {

$sql = "select id as id_siswa, nisn, nama, '$matpel' as matpel, $semester as semester, 0 as nilai, 0 as KKM, '' as kecapaian from rpt_siswa where

id_kelas=$kelas";

$query = mysql_query($sql); $data = array();

while($row = mysql_fetch_assoc($query)) { $data[] = $row;

}

print json_encode($data); } else {

$sql = "select * from rpt_siswa a inner join rpt_nilai b on a.id = b.id_siswa where matpel='$matpel' and semester=$semester";

$query = mysql_query($sql); $data = array();

while($row = mysql_fetch_assoc($query)) { $data[] = $row;

}

print json_encode($data); }


(2)

10. Source Code Insert Siswa <?php

header("Access-Control-Allow-Origin: *");

header("Access-Control-Allow-Methods: PUT, GET, POST, DELETE, OPTIONS");

header("Access-Control-Allow-Headers: Content-Type, x-xsrf-token"); include '../config.php';

$data = json_decode(file_get_contents("php://input")); $cekMatpel = $data[0]->matpel;

$cekSemester = $data[0]->semester; // cek apakah udah ada yg simpan

$sql = "select count(*) as hasil from rpt_nilai where matpel = '$cekMatpel' and semester=$cekSemester";

$query2 = mysql_query($sql);

$hasil2 = mysql_fetch_assoc($query2); $hasil2 = $hasil2['hasil'];

if ($hasil2 == 0) {

for ($i=0; $i < count($data); $i++) { $id_siswa = $data[$i]->id_siswa; $matpel = $data[$i]->matpel; $semester = $data[$i]->semester; $nilai = $data[$i]->nilai;

$KKM = $data[$i]->KKM;

$kecapaian = $data[$i]->kecapaian;

$input = mysql_query("INSERT INTO rpt_nilai (


(3)

'$id_siswa', '$matpel', '$semester', $nilai, $KKM, '$kecapaian')") or die(mysql_error());

}

if ($input) {

$respone = array('msg' => 'Data berhasil ditambahkan'); echo json_encode($respone);

} else {

$respone = array('msg' => 'Data gagal ditambahkan'); echo json_encode($respone);

} } else {

for ($i=0; $i < count($data); $i++) { $id_siswa = $data[$i]->id_siswa; $matpel = $data[$i]->matpel; $semester = $data[$i]->semester; $nilai = $data[$i]->nilai;

$KKM = $data[$i]->KKM;

$kecapaian = $data[$i]->kecapaian;

$update = mysql_query("UPDATE rpt_nilai set id_siswa = '$id_siswa',

matpel = '$matpel', semester = '$semester', nilai = $nilai,

KKM = $KKM,

kecapaian = '$kecapaian' WHERE matpel = '$matpel' and semester=$semester") or die(mysql_error());


(4)

if ($update) {

$respone = array('msg' => 'Data berhasil dirubah'); echo json_encode($respone);

} else {

$respone = array('msg' => 'Data gagal dirubah'); echo json_encode($respone);

} }

?>

11. Source Code Login Siswa

<?php

session_start(); // Starting Session include('../config.php');

$error = '';

if (isset($_POST['submit'])) {

if (empty($_POST['username']) || empty($_POST['password'])) { $error = "Username atau Password Harus Diisi !";

} else {

$username = $_POST['username']; $password = $_POST['password'];

$query2 = mysql_query("select id, nama from rpt_siswa where username = '$username' and password = '$password'");

$hasil2 = mysql_fetch_assoc($query2); $id = $hasil2['id'];

$nama = $hasil2['nama']; if ($hasil2 != '') {

echo '<script type="text/javascript">alert("Login Berhasil")</script>'; $_SESSION['id']=$id; // Initializing Session


(5)

$_SESSION['nama']=$nama;

header("location: index.php"); // Redirecting To Other Page } else {

$error = "Username atau Password Salah"; }

} }

if(isset($_SESSION['id'])){ header("location: index.php"); }

?>

12. Source Code Get Nilai

header("Access-Control-Allow-Origin: *");

header("Access-Control-Allow-Methods: PUT, GET, POST, DELETE, OPTIONS");

header("Access-Control-Allow-Headers: Content-Type, x-xsrf-token"); include '../config.php';

$id_siswa = $_GET['id_siswa']; $semester = $_GET['semester'];

$sql = "SELECT a.*, cast(IFNULL(b.nilai, 0) as UNSIGNED) as nilai, b.KKM, b.kecapaian FROM rpt_matpelajaran a LEFT OUTER join rpt_nilai b on a.matpel = b.matpel

where (b.semester = $semester or b.semester is null) and (b.id_siswa = $id_siswa or b.id_siswa is null) order by a.ID";

$query = mysql_query($sql); $data = array();

while($row = mysql_fetch_assoc($query)) { $data[] = $row;


(6)

//var_dump($data);

print json_encode($data); ?>