Laporan tugas besar tentang pembuatan website penerimaan peserta didik baru SMA Negeri 1 Pasuruan menggunakan teknologi JavaScript, jQuery, CSS, AJAX. Website ini memungkinkan siswa mendaftar secara online tanpa harus datang langsung ke sekolah. Terdiri dari halaman admin untuk mengelola data dan halaman umum untuk pendaftaran siswa baru.

1. LAPORAN TUGAS BESAR
PEMROGRAMAN BERBASIS WEB
“Penerimaan Peserta Didik Baru SMA Negeri 1 Pasuruan”
Disusun oleh:
Dewi Intan Mustikasari (1110651038)
Ilmi Amaliyah R. (1110651002)
Yeni Wahyuningtyas (1110651040)
Tut Wuri Handayani (1110651239)
JURUSAN TEKNIK INFORMATIKA
FAKULTAS TEKNIK
UNIVERSITAS MUHAMMADIYAH JEMBER
2013

2. 1. Tujuan
 Memahami dasar JavaScript dan penggunaannya pada website.
 Memahami dasar jQuery dan penggunaannya pada website.
 Memahami konsep dasar CSS dan penggunaannya pada web.
 Memahami JavaScript dan penggunaanya.
 Memahami ajax dan juga penerapannya.
2. Dasar Teori
Adapun fitur-fitur teknologi yang digunakan dalam Project ini antara lain :
1) Javascript
JavaScript adalah bahasa yang berbentuk kumpulan skrip yang pada fungsinya berjalan
pada suatu dokumen HTML. Bahasa ini merupakan bahasa pemrograman untuk
memberikan kemampuan tambahan terhadap HTML yang berjalan pada sisi user/client,
bukan pada sisi server.
2) Jquery
JQuery adalah library JavaScript yang sangat ringkas dan sederhana untuk memanipulasi
komponen di HTML, menangani even, animasi, dan efek. Slogan jQuery: write less, do more.
Yaitu menulis kode lebih sedikit, tetapi melakukan pekerjaan lebih banyak. jQuery merupakan
library yang gratis dan open source.
a) CSS
CSS adalah singkatan dari Cascading Style Sheets. CSS adalah aliran dari suatu kode
ke kode lain yang saling berhubungan. CSS merupakan kumpulan kode-kode
berurutan dan saling berhubungan untuk mengatur format / tampilan suatu halaman
HTML.
Terdiri dari beberapa set peraturan yang memiliki: selector, property, value.
selector {property: value;}
Selector menunjukkan bagian mana yang hendak diatur/diformat.
Property bagian dari selector yang hendak diatur.
Value adalah nilai dari pengaturannya.
b) Bootstrap
Secara default, templating bootstrap tanpa memiliki fitur responsive. Responsive features
berfungsi untuk menjadikan CSS berbasis pada beberapa kondisi: rasio, width, tipe display,
dan lain-lain. Dengan fitur responsif tersebut, dapat menyesuaikan dengan layar device.

3. c) MetroUI
3) AJAX
AJAX adalah singkatan dari Asynchronous Javascript and XML AJAX dibuat dari
serangkaian teknologi dengan kemampuan: Javascript, XML, dan metode komunikasi
asinkron antara client dan server. Dalam prosesnya, AJAX menggunakan metode
XMLHttpRequest untuk tukar menukar data antara client & server. Javascript 
menangkap isyarat dan menggunakan jalur komunikasi pada server melalui
XMLHttpRequest untuk memanggil method yang tersimpan pada server. XML 
sebagai mekanisme pengiriman data. Jika javascript telah menerima respon dari server,
maka javascript memanipulasi struktur DOM dengan menampilkan data dari server dan
diterima client melalui browser.
3. Hasil Project
i. Untuk User Admin
a) Halaman Admin
 Dan setelah Login dengan Username dan Password admin, maka akan
muncul tampilan home administrasi seperti gambar dibawah ini :

4. b) Halaman Home Admin
 Dan ketika kita memilih menu Setting, di dalam menu setting ada 3 menu
lagi yaitu Manage Menu, Manage User, Informasi.
c) Halaman Manage Menu, Halaman manage menu ini digunakan untuk
mengaktif dan non aktifkan menu, misalnya ketika tanggal pendaftaran telah
habis, menu pendaftar akan di non aktifkan, dan menu pengumuman di
aktifkan.

5. d) Halaman Manage User, Dari halaman ini kita bisa melihat siapa saja
admin yang telah online.
e) Biodata, Halaman ini digunakan admin untuk melihat biodata pendaftar
yang sudah mendaftarkan dirinya.
f) Nilai Rapor, Halaman ini digunakan admin untuk melihat nilai pendaftar
yang sudah mendaftarkan dirinya.

6. g) Cetak Nilai, Halaman ini digunakan untuk mencetak nilai pendaftar.
h) Logout, Halaman ini digunakan untuk Log out setelah selesai melakukan
proses,
ii. Untuk User Selain Admin
a) Untuk tampilan home awal seperti ini :

7. b) Untuk peserta didik baru yang ingin mendaftar adalah klik menu daftar baru
dan setelah itu tampilannya menjadi seperti ini :
c) Setelah selesai klik daftar setalah itu muncul tampilan seperti ini, dan
silahkan di catat no.peserta dan passwordnya.

8. d) Setelah itu lakukan Login dan tampilannya seperti ini :
e) Setelah selesai mengisi form login klik Login, dan setelah itu muncul
tampilan seperti ini dan silahkan isi kelengkapan biodatanya.

9. f) Setelah selesai klik simpan dan selanjutnya mengisi form nilai raport.

10. g) Setelah itu klik simpan dan lakukan cetak dokumen biodata dan nilai rapor.
h) Setelah semua proses selesai klik tombol Log out dan tunggu pengumuman.
4. Kendala
a) Kurangnya komunikasi antar anggota kelompok sehingga menyebabkan projek ini
kurang maksimal.
5. Kesimpulan
Kesimpulan dari web Penerimaan Peserta Didik Baru SMA NEgeri 1 Pasuruan ini
adalah Sistem pendaftaran Siswa SMA yang dilakukan secara online. Supaya Siswa
yang rumahnya jauh tidak kesusahan untuk melakukan pendaftaran dikarenakan siswa
bisa mendaftarkan dirinya secara simple di website ini. Web ini menggunakan fitur
AJAX, JQuery, JavaScript.