Sistem informasi berbasis web sekolah menengah pertama : studi kasus di SMP 2 Godean Yogyakarta - USD Repository

(1)

i Skripsi

Diajukan untuk Memenuhi Salah Satu Syarat Memperoleh Gelar Sarjana Sains

Oleh : Arum Marwati NIM : 043124013

PROGRAM STUDI ILMU KOMPUTER FAKULTAS SAINS DAN TEKNOLOGI UNIVERSITAS SANATA DHARMA

(2)

ii A Thesis

Presented as Partial Fulfillment of the Requirements

To Obtain the Sarjana Sains Degree in Computer Science Study Program

By : Arum Marwati Student ID : 043124013

COMPUTER SCIENCE STUDY PROGRAM FACULTY OF SCIENCE AND TECHNOLOGY

SANATA DHARMA UNIVERSITY YOGYAKARTA

(3)

iii

SISTEM INFORMASI BERBASIS WEB SEKOLAH MENENGAH

PERTAMA

(Studi Kasus di SMP 2 Godean Yogyakarta)

Oleh : Arum Marwati NIM : 043124013

Telah disetujui oleh :

Pembimbing I

(4)

iv

PERTAMA

(Studi Kasus di SMP 2 Godean Yogyakarta)

Dipersiapkan dan ditulis oleh Arum Marwati

NIM : 043124013

Telah dipertahankan di depan Panitia Penguji pada tanggal 10 Oktober 2008

Dan dinyatakan memenuhi syarat

Susunan Panitia Penguji

Nama Lengkap Tanda Tangan

Ketua : Y. Joko Nugroho, S.Si ... Sekretaris : Eko Hari Parmadi, S.Si., M.Kom. ... Anggota : Iwan Binanto, S.Si., M.Cs. ...

Yogyakarta,

Fakultas Sains dan Teknologi Universitas Sanata Dharma Wakil Dekan I,

(5)

v

Life is like a book. Everyday has a new page with adventures to tell, lessons to

learn and tales of good deeds to remember. Have a great episode todayâ¦

Karya ini kupersembahkan untuk :

Yesus Kristus yang telah menganugerahkan hidup yang begitu indah bagiku.

Orang tuaku yang selalu mencintaiku, menjagaku, mendukungku, dan

mendoakanku hingga aku mampu menggoreskan karya ini bagi mereka.

Abi dan Tomo, adik-adikku yang selalu mendukung dan membantuku.

Seluruh keluargaku yang selalu mendukungku.

Teman-teman IKOM 2004 yang selalu mendukung dan memberi semangat.

Seluruh keluarga besar IKOM.

Dan semua pihak yang ikut membantu tetapi belum disebutkan.

(6)

vi

memuat karya atau bagian karya orang lain, kecuali yang telah disebutkan dalam kutipan dan daftar pustaka, sebagaimana layaknya karya ilmiah.

Yogyakarta, 10 Oktober 2008 Penulis

(7)

vii

sekolah ini dan informasi tentang sekolah ini diberikan kepada masyarakat luas secara manual yaitu dengan papan pengumuman dan berita dari mulut ke mulut sehingga berita atau informasi tersebut kurang akurat dan efisien. Dari sisi siswa dan guru, sistem akademis yang saat ini berjalan juga kurang efisien karena sistem pemberian materi dan nilai masih bersifat manual. Oleh karena itu dibutuhkan sistem informasi SMP 2 Godean berbasis web.

Pembuatan website ini menggunakan bahasa pemrograman PHP, database MySQL, dan editor program Macromedia Dreamweaver MX 2004. Pada sistem ini, user siswa dan guru mendapat atau mengelola informasi berupa nilai, jadwal, dan materi secara online. Masyarakat dapat melihat berita atau pengumuman yang akurat

dan up to date secara online.

Pembuatan website SMP 2 Godean ini membantu siswa, guru dan masyarakat umum dalam mendapat informasi yang dibutuhkan oleh masing-masing pihak tersebut dan meningkatkan mutu dan efisiensi sekolah dalam mendidik para siswanya. Sistem ini dapat memenuhi kebutuhan guru, siswa, sekolah dan masyarakat umum akan informasi tentang sekolah dan data akademik siswa.

(8)

viii

giving manually by pasteboard or people tell the information with others. Therefore, the information or news is not accurate and efficient. From the student and teacher side, academic system is not efficient because manually method in giving textbook and grade. Therefore, SMP 2 Godean needs web base information system of SMP 2 Godean.

To make this website, it uses PHP programming language, MySQL database, and Macromedia Dreamweaver MX 2004 programming editor. In this system, student and teacher can get or manage the information in grade, schedule, and textbook by online. Society can see the accurate and up to date announcement or news by online.

(9)

ix

Yang bertanda tangan di bawah ini, saya mahasiswa Universitas Sanata Dharma :

Nama : Arum Marwati

Nomor Mahasiswa : 043124013

Demi pengembangan ilmu pengetahuan, saya memberikan kepada perpustakaan Universitas Sanata Dharma karya ilmiah saya yang berjudul :

Sistem Informasi Berbasis Web Sekolah Menengah Pertama (Studi Kasus di SMP 2

Godean Yogyakarta) berserta perangkat yang diperlukan (bila ada). Dengan

demikian saya memberikan kepada perpustakaan Universitas Sanata Dharma hak untuk menyimpan, mengalihkan dalam bentuk media lain, mengelolanya dalam bentuk pangkalan darta, mendistribusikan secara terbatas, dan mempublikasikannya di Internet atau media lain untuk kepentingan akademis tanpa perlu minta izin dari saya maupun memberikan royalti kepada saya selama tetap mencantumkan nama saya sebagai penulis.

Demikian pernyataan ini yang saya buat dengan sebenarnya. Dibuat di Yogyakarta

Pada tanggal 10 Oktober 2008 Yang menyatakan

(10)

x menyelesaikan skripsi ini.

Skripsi ini adalah tugas akhir untuk menyelesaikan pendidikan strata satu guna meraih Sarjana Sains di Fakultas Sains dan Teknologi Universitas Sanata Dharma.

Penelitian ini mengambil judul âSistem Informasi SMP 2 Godean Berbasis Webâ dengan harapan memberi sumbangan yang berguna bagi perkembangan ilmu pengetahuan.

Penulisan skripsi ini tidak lepas dari bantuan banyak pihak, oleh karena itu penulis ingin mengucapkan terima kasih banyak kepada :

1. Bapak Y. Joko Nugroho, S.Si selaku dosen pembimbing skripsi yang telah membantu dan mengarahkan penulis dalam menyelesaikan skrispi.

2. Ibu P.H. Prima Rosa, S.Si., M.Sc. selaku Kaprodi yang telah rela berkorban untuk membantu selama kuliah dan menyelesaikan skripsi ini.

3. Eko Hari Parmadi, S.Si., M.Kom. selaku dosen pembimbing akademik dan dosen penguji atas bimbingan dan kesediaanya menguji.

4. Iwan Binanto, S.Si., M.Cs. yang telah bersedia menjadi dosen penguji.

5. Pak Tukijo dan Bu Linda yang telah membantu penulis dalam masalah kemahasiswaan.

6. Seluruh dosen dan karyawan FMIPA yang telah membimbing penulis selama menempuh studi di Universitas Sanata Dharma.

7. Pak Joko dari SMP 2 Godean yang telah membantu dan memberi data yang diperlukan dalam penyelesaian skripsi ini.

(11)

xi

11. Monik, Via, Eka, Trivo, Pakde, dan teman-teman IKOM 2004 yang membantu dan memberi semangat.

12. Seluruh teman-teman IKOM.

Penulis menyadari skrispsi ini jauh dari sempurna, oleh karena itu penulis mengharapkan kritik dan saran guna menyempurnakan skripsi ini. Pada akhirnya penulis berharap semoga skripsi ini berguna bagi semua pihak.

(12)

xii

HALAMAN JUDUL... ii

HALAMAN PERSETUJUAN... iii

HALAMAN PENGESAHAN... iv

HALAMAN PERSEMBAHAN... v

HALAMAN KEASLIAN KARYA... vi

ABSTRAK... vii

ABSTRACT... viii

HALAMAN PERSETUJUAN PUBLIKASI KARYA ILMIAH... ix

KATA PENGANTAR... x

DAFTAR ISI... xii

DAFTAR TABEL... xv

DAFTAR GAMBAR... xvi

BAB I PENDAHULUAN 1.1. Latar Belakang... 1

1.2. Perumusan Masalah... 2

1.3. Batasan Masalah... 3

1.4. Tujuan... 3

1.5. Manfaat... 3

1.6. Metodologi Penyelesaian... 4

1.7. Sistematika Penulisan... 4

BAB II DASAR TEORI 2.1. Sistem Informasi... 6

(13)

xiii

BAB III ANALISIS DAN PERANCANGAN SISTEM

3.1. Gambaran Umum Sistem... 15

3.2. Perancangan Proses... 18

3.3. Perancangan Basis Data... 23

3.4. Perancangan Navigasi Menu... 29

3.4.1. Perancangan Navigasi Menu Admin... 29

3.4.2. Perancangan Navigasi Menu Guru... 30

3.4.3. Perancangan Navigasi Menu Siswa... 30

3.4.4. Perancangan Navigasi Menu Pengunjung... 31

3.5. Perancangan User Interface... 31

3.5.1 Perancangan User Interface Admin... 31

3.5.2. Perancangan User Interface Guru... 35

3.5.3. Perancangan User Interface Siswa... 35

3.5.4. Perancangan User Interface Pengunjung... 36

BAB IV IMPLEMENTASI SISTEM 4.1. Implementasi Basis Data... 38

4.2. Implementasi Proses... 42

4.2.1. Implementasi Proses Admin... 42

4.2.2. Implementasi Proses Guru... 49

4.2.3. Implementasi Proses Siswa... 50

4.2.4. Implementasi Proses Pengunjung... 56

4.3. Implementasi User Interface... 58

4.3.1. Implementasi User Interface Admin... 58

(14)

xiv BAB V PENUTUP

5.1. Kesimpulan... 67 5.2. Saran... 67

(15)

xv

Tabel 2.2 Tabel Notasi ERD... 9

Tabel 3.1 Kamus Data... 27

Tabel 4.1 Tabel Admin... 38

Tabel 4.2 Tabel Agenda Sekolah... 38

Tabel 4.3 Tabel Mata Pelajaran... 38

Tabel 4.4 Tabel Buku Alamat Siswaâ¦â¦â¦.. 39

Tabel 4.5 Tabel Forum Postsâ¦â¦â¦.. 39

Tabel 4.6 Tabel Forum Topicsâ¦â¦â¦ 39

Tabel 4.7 Tabel Galeriâ¦â¦â¦ 39

Tabel 4.8 Tabel Jadwal Ekstrakulikulerâ¦â¦â¦. 39

Tabel 4.9 Tabel Guruâ¦â¦â¦. 40

Tabel 4.10 Tabel Jadwal Pelajaranâ¦â¦â¦ 40

Tabel 4.11 Tabel Kelasâ¦â¦â¦.. 40

Tabel 4.12 Tabel Kritik dan Saran... 40

Tabel 4.13 Tabel Berita... 41

Tabel 4.14 Tabel Materi... 41

Tabel 4.15 Tabel Nilai... 41

Tabel 4.16 Tabel Pengumuman... 41

(16)

xvi

Gambar 3.1 Diagram Konteks... 19

Gambar 3.2 DFD Level 1 Sisi Admin... 20

Gambar 3.3 DFD Level 1 Sisi Guru... 21

Gambar 3.4 DFD Level 1 Sisi Siswa... 22

Gambar 3.5 DFD Level 1 Sisi Pengunjung... 23

Gambar 3.6 Entitas Relasi Diagram... 24

Gambar 3.8 Navigasi Menu Admin... 29

Gambar 3.9 Navigasi Menu Guru... 30

Gambar 3.10 Navigasi Menu Siswa... 30

Gambar 3.11 Navigasi Menu Pengunjung... 31

Gambar 3.12 Halaman Login Admin... 32

Gambar 3.13 Halaman Utama Admin... 32

Gambar 3.14 Input Data... 33

Gambar 3.15 Halaman Upload Galeri... 33

Gambar 3.16 Edit Data... 34

Gambar 3.17 Cari Data Jadwal Pelajaran... 34

Gambar 3.18 Form Login Siswa... 35

Gambar 3.19 Halaman Utama Guru... 35

Gambar 3.20 Halaman Login Siswa... 36

Gambar 3.21 Halaman Utama Siswa... 36

Gambar 3.22 Halaman Utama Pengunjung... 36

Gambar 3.23 Halaman Kritik dan Saran... 37

Gambar 3.24 Halaman Forum... 37

Gambar 4.1 Halaman Login Admin... 58

(17)

xvii

Gambar 4.6 Halaman Cari Pengumuman... 60

Gambar 4.7 Halaman Edit Jadwal Pelajaran... 61

Gambar 4.8 Halaman Edit Jadwal Ekstrakulikuler... 61

Gambar 4.9 Halaman Download Materi... 62

Gambar 4.10 Halaman Utama Pengunjung... 62

Gambar 4.11 Halaman Forum... 63

(18)

BAB I

PENDAHULUAN

1.1. Latar Belakang

Informasi sangat penting dalam kehidupan kita sebagai manusia. Informasi sangat dibutuhkan oleh pihak-pihak yang terkait dalam berbagai bidang seperti bidang pendidikan, bidang pariwisata, bisnis, dan lain-lain. Saat ini, informasi dapat diakses menggunakan berbagai media.

Salah satu teknologi informasi yang banyak digunakan saat ini adalah teknologi internet. Internet mudah digunakan dan banyak tersedia di sekitar kita sehingga pertukaran informasi dapat dialakukan dengan mudah dan cepat. Salah satu cara mengakses informasi melalui internet adalah menggunakan website. Website sering dikenal dengan istilah world wide web (www). Website dapat memuat berbagai informasi seperti iklan, berita, materi pelajaran, hiburan, dan lain-lain. Dengan website, kita dapat mengakses informasi tanpa harus bertemu langsung dengan sumber informasi tersebut.

Di sisi lain, dunia pendidikan berkembang sangat pesat, sehingga sistem pembelajarannya juga berkembang. Sistem pembelajaran yang dulu menggunakan media kertas dan papan tulis sekarang cenderung menggunakan media teknologi multimedia untuk meningkatkan mutu pembelajaran.

(19)

memiliki 3 SMP negeri. Setiap tahunnya SMP ini menerima murid sebanyak 240 yang dianggap berpotensi dalam hal akademik dan sebagian besar berasal dari Godean.

Dengan jumlah murid yang cukup banyak maka pembelajaran di kelas kurang efektif untuk siswa dalam menangkap materi. Oleh karena itu, dibutuhkan media tambahan dimana para siswa dapat mengambil materi atau menanyakan pelajaran kepada guru yang bersangkutan secara online. Dengan media ini pembicaraan atau diskusi antara siswa dan guru tidak terbatas hanya dalam ruang kelas.

Karena sekolah ini juga belum begitu dikenal oleh masyarakat Yogyakarta dan luar Yogyakarta pada umumnya diperlukan media promosi yang dapat memberikan gambaran tentang sekolah ini. Media-media tersebut dapat dijangkau menggunakan website.

Pada akhirnya dengan pembuatan website SMP 2 Godean ini diharapkan dapat membantu siswa, guru dan masyarakat umum dalam mendapat informasi yang dibutuhkan oleh masing-masing pihak tersebut dan meningkatkan mutu dan efisiensi sekolah dalam mendidik para siswanya.

1.2. Perumusan Masalah

(20)

1.3. Batasan Masalah

Adapun batasan dalam topik tugas akhir ini adalah : a. Sistem dibuat untuk SMP 2 Godean

b. Sistem dibuat dengan pendekatan terstruktur c. Sistem yang dibangun berbasis web

d. Sistem dibuat dengan software Macromedia Dreamweaver, PHP, dan basis data dibuat dengan MySQL

1.4. Tujuan

Tujuan dari tugas akhir ini adalah membuat sistem informasi untuk SMP 2 Godean sehingga mampu memberikan informasi kepada pihak yang membutuhkan.

1.5. Manfaat

Manfaat dari tugas akhir ini antara lain :

a. Bagi pihak sekolah membantu memberi informasi kepada pihak-pihak yang membutuhkan.

b. Siswa dapat melihat pengumuman, mendapat materi, dan melihat nilai secara online.

(21)

1.6. Metodologi Penyelesaian Masalah

a. Studi literatur bagaimana membangun sistem informasi secara konsep b. Melakukan wawancara pada pihak terkait

c. Metode yang digunakan untuk menyelesaikan tugas akhir ini adalah : i. Analisis mempelajari dan memahami masalah yang ada untuk

menentukan mengidentifikasi data atau informasi yang akan diproses.

ii. Perancangan membuat sistem informasi

iii. Implementasi pembuatan sistem menggunakan PHP, MySQL, dan Dreamweaver untuk mengatasi permasalahan yang ada iv. Pengujian dan analisa hasil menguji apakah sistem telah

berjalan dengan baik.

d. Penyusunan laporan berupa proses penulisan dokumentasi dan laporan tugas akhir seperti disyaratkan oleh Program Studi Ilmu Komputer, Fakultas Sains dan Teknologi, Universitas Sanata Dharma.

1.7. Sistematika Penulisan

Dalam Penulisan Tugas Akhir ini terdiri dari beberapa bagian diantaranya sebagai berikut :

BAB I Pendahuluan

(22)

BAB II Dasar Teori

Bab ini berisi tentang teori â teori yang bersangkutan dengan pembuatan skripsi ini.

BAB III Analisis Dan Perancangan Sistem

Bab ini membahas tentang analisis dan perancangan sistem yang akan digunakan dalam membangun sistem.

BAB IV Implementasi

Dalam bab ini menuangkan hasil analisa dan perancangan ke dalam program.

BAB V Kesimpulan dan Saran

(23)

BAB II

DASAR TEORI

2.1. Sistem Informasi

Definisi dari sistem adalah suatu rangkaian komponen atau variabel yang berinteraksi dengan manusia dan membantu pekerjaan manusia. Komponen sistem yang kita bicarakan di sini terdiri dari perangkat keras yaitu : CPU, disk, terminal, printer, dan tape dan perangkat lunak, yaitu : sistem operasi, sistem database, program pengontrol komunikasi, dan program aplikasi (Pohan, 1997).

Salah satu hal yang dihasilkan oleh sistem adalah informasi. Informasi adalah data yang diolah menjadi bentuk yang lebih berguna dan lebih berarti bagi yang menerimanya, sedangkan data merupakan sumber informasi yang menggambarkan suatu kejadian (kumpulan fakta). Data adalah suatu fakta yang mewakili suatu objek seperti manusia, hewan, peristiwa, konsep, keadaan, dan sebagainya yang dapat dicatat dan mempunyai arti yang implisit.

(24)

Sistem informasi berbasis web adalah sistem informasi yang tidak terbatas dalam hal pengaksesan karena informasi dapat diakses dimana saja dan kapan saja.

2.2. Perencanaan Sistem Informasi

Dalam perencaraan membangun suatu sistem tentu memerlukan suatu tools

atau alat bantu. Adanya alat bantu-alat bantu tersebut mempermudah kita dalam membangun sistem. Alat bantu yang digunakan untuk membangun sistem adalah DAD (Diagram Aliran Data) atau DFD (Data Flow Diagram) dan ERD (Entity

Relationship Diagram).

2.2.1. DAD (Diagram Aliran Data) atau DFD(Data Flow Diagram)

DAD adalah suatu model logika data atau proses yang dibuat untuk menggambarkan dari mana asal data dan kemana tujuan data yang keluar dari sistem, dimana data disimpan, proses apa yang menghasilkan data tersebut dan interaksi antara data yang tersimpan dan proses yang dikenakan pada data tersebut.

Simbol-simbol yang digunakan dalam pembuatan DAD dapat dilihat pada tabel 2.1.

Dalam pembuatan DAD, terdapat aturan-aturan sebagai berikut : a. Antar entitas tidak diijinkan terjadi hubungan atau relasi

b. Tidak boleh ada aliran data antara entitas eksternal dengan data store c. Untuk alasan kerapian (menghindari aliran data yang bersilangan),

(25)

Tabel 2.1 Simbol DAD Komponen DeMarco and

Yourdan Simbols

Gane and Sarson Simbols

Kesatuan luar

Proses

Data flow Arus data Data store Simpanan data

d. Satu aliran data boleh mengalirkan beberapa paket data e. Bentuk anak panah aliran data boleh bervariasi

f. Semua objek harus mempunyai nama

g. Aliran data selalu diawali atau diakhir dengan proses h. Semua aliran data harus mempunyai tanda arah

i. Jumlah proses tidak lebih dari sembilan proses dalam sistem, jika melebihi maka sebaiknya dikelompokkan beberapa proses yang bekerja bersama-sama didalam suatu subsistem

2.2.2. ERD (Entity Relational Diagram)

(26)

Tabel 2.2 Notasi ERD

Notasi Arti

Entitas

Relationship

Atribut

Atribut Primary Key

Notasi-notasi ERD berupa entitas, relationship, atribut, dan atribut primary key. Berikut ini adalah pengertian-pengertian dari notasi-notasi ERD.

a. Entitas

Entitas adalah obyek yang dapat dibedakan dalam dunia nyata. Entity set

adalah kumpulan dari entity yang sejenis Himpunan entitas dapat berupa :

1. Obyek secara fisik : rumah, kendaraan, peralatan 2. Obyek secara konsep : pekerjaan , perusahaan, rencana

b. Relationship

Relationship adalah hubungan yang terjadi antara satu atau lebih entity.

Relationship set adalah kumpulan relationship yang sejenis. c. Atribut

(27)

Nilai Atribut merupakan suatu data aktual atau informasi yang disimpan pada suatu atribut di dalam suatu entity atau relationship. Jenis-jenis atribut antara lain :

1. Key adalah tribut yang digunakan untuk menentukan suatu entity secara unik.

2. Atribut Simple

3. Atribut yang bernilai tunggal. 4. Atribut Multivalue

5. Atribut yang memiliki sekelompok nilai untuk setiap instan entity. Hal lain yang berkaitan dengan ERD adalah Cardinality Ratio Constraint yaitu batasan jumlah keterhubungan satu entity dengan entity lainnya. Jenis-jenis

Cardinality Ratio Constraint dapat dilihat pada gambar 2.1.

Pada Gambar 2.1 terdapat 3 jenis Cardinality Ratio Constraint, yaitu : one to one, one to many, dan many to many.

2.3. Pembangunan Sistem Informasi

Sistem yang akan dibuat adalah berbasis web. Sistem berbasis web tidak lepas dari suatu teknologi bernama internet. Internet adalah sistem komputer umum, yang berhubung secara global dan menggunakan TCP/IP sebagai protokol pertukaran paket

(28)

Gambar 2.1 Cardinality Ratio Constraint

Pertukaran data melalui internet mempunyai ruang yang disebut dengan

WWW (World Wide Web) yaitu suatu ruang informasi di mana sumber-sumber daya

yang berguna diidentifikasi oleh pengenal global yang disebut Uniform Resource

(29)

tertentu, yang digunakan untuk menunjukkan alamat suatu sumber - seperti dokumen dan gambar - di internet.

Untuk mentransfer dokumen dan gambar antara web server ke web browser

digunakan protokol yang disebut HTTP (HyperText Transfer Protocol). Perangkat lunak server yang berfungsi menerima permintaan HTTP atau HTTPS dari klien yang dikenal dengan browser web dan mengirimkan kembali hasilnya dalam bentuk halaman-halaman web yang umumnya berbentuk dokumen HTML disebut web server. Server web yang terkenal diantaranya adalah apache dan Microsoft Internet

Information Service (IIS). Apache merupakan server web antar-platform, sedangkan

IIS hanya dapat beroperasi di sistem operasi Windows. Sedangkan web browser, adalah perangkat lunak yang berfungsi menampilkan dan melakukan interaksi dengan dokumen-dokumen yang disediakan oleh server web. Penjelajah web yang populer adalah Microsoft Internet Explorer dan Mozilla Firefox.

Dalam membuat suatu halaman web, digunakan sebuah bahasa yang disebut HTML. HTML adalah sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser

Internet. Bahasa berupa kode yang digunakan untuk membuat dokumen hypertext

yang digunakan pada website. Struktur penulisan HTML : <HTML>

<head>

<!Header di bagian HTML>

<title>Judul dari website</title> </head>

<body>

<!Isi dari layout website yang dibuat> </body>

(30)

Selain menggunakan HTML, dikenal pula PHP (Hypertext Preprocessor)

dalam membangun suatu halaman web, yaitu Suatu script untuk membuat suatu aplikasi yang dapat terintegrasikan ke dalam halaman HTML, sehingga suatu halaman web tidak lagi bersifat statis namun dinamis. Contoh program Hello World yang ditulis menggunakan PHP adalah sebagai berikut:

<?php

echo("<b>Hello World</b>");

?>

Contoh program ini adalah program untuk menampilkan barisan bilangan

Fibonacci.

<?php

$now = 1; $prev = 0; $jumlah = 8;

while ($i < $jumlah) { $temp = $prev; $prev = $now; $now = $now + $temp;

echo($now . ", "); $i++;}

?>

Dalam mengelola data pada suatu halaman web yang dinamis diperlukan suatu database. Database dalam sistem berbasis web menggunakan database. Salah satu database yang sering digunakan adalah MySQL yaitu multiuser database yang menggunakan bahasa Structured Query Language (SQL). Database tersebut menghubungkan script PHP menggunakan perintah query dan escape character yang sama dengan PHP.

(31)

(32)

BAB III

ANALISA DAN PERANCANGAN SISTEM

Analisa sistem berguna untuk mengetahui hal-hal apa saja yang diperlukan untuk membangun sistem tersebut dan sistem yang bagaimana yang akan dibangun. Analisa sistem juga dilakukan untuk mengetahui informasi apa saja yang dibutuhkan oleh user dan bagaimana sistem bekerja sehingga memudahkan dalam membangun sistem karena sudah diketahui hal apa saja yang terdapat dalam sistem.

Perancangan sistem dilakukan untuk memudahkan pembuat sistem untuk membangun sistem. Perancangan yang terjadi dalam pembuatan sistem ini antara lain perancangan proses, perancangan basis data, perancangan navigasi menu, dan perancangan user interface. Perancangan proses menggunakan alat bantu berupa DFD

(Data Flow Diagram) dan untuk perancangan basis data menggunakan alat bantu

ERD (Entity Relational Diagram). Kedua alat bantu tersebut dibuat menggunakan program Easy Case. Analisa dan perancangan sistem ini dilakukan sebelum tahap implementasi sistem.

3.1. Gambaran Umum Sistem

(33)

Pihak yang mengelola seluruh sistem akan disebut sebagai admin. Admin merupakan superuser yang dapat melakukan semua olah data pada website. Untuk mengelola data tersebut, seorang admin harus login terlebih dahulu. Pengelolaan data yang dapat dilakukan admin antara lain : berita, pengumuman, materi, agenda sekolah, prestasi, nilai, siswa, guru, kelas, mata pelajaran, jadwal pelajaran, forum, daftar kritik dan saran yang masuk.

Guru dapat melihat data siswa, mata pelajaran, kelas, jadwal, materi, dan nilai yang nantinya akan disebut data akademik siswa. User guru hanya dapat mengupdate materi dan password. Siswa dapat melihat nilai, jadwal, dan materi. Siswa juga memiliki fasilitas untuk menyimpan buku alamat siswa.

User lain, yaitu para pengunjung website dapat melihat informasi-informasi yang diberikan oleh sekolah. Pengunjung juga dapat mengisi buku tamu dan mengikuti forum.

Seluruh fasilitas diatas dapat dilakukan di mana saja dan kapan saja karena berbasis web. Para pengunjung yang membutuhkan informasi tidak harus datang ke sekolah yang mungkin jaraknya jauh. Fasilitas yang dapat dilihat oleh pengunjung dalam sistem ini antara lain adalah :

1. Home, berupa halaman muka dari situs SMP 2 Godean 2. Profil sekolah

Halaman ini berisi sub menu antara lain :

(34)

b. Sejarah Singkat c. Visi dan Misi

d. Kegiatan meliputi data-data kegiatan yang pernah diikuti oleh sekolah, diprioritaskan untuk kegiatan yang berskala regional, nasional, dan internasional.

e. Fasilitas meliputi fasilitas-fasilitas yang dimiliki oleh sekolah, seperti laboratorium, koperasi, tempat ibadah dan lain sebagainya.

3. Galeri, berisi halaman foto-foto yang berkaitan dengan sekolah sebagai salah satu alat publikasi.

4. Berita, berisi tampilan berita yang menyangkut sekolah.

5. Pengumuman, berisi pengumuman kepada siswa maupun kepada pengunjung yang menyangkut sekolah.

6. Forum, berisi diskusi antar semua user dengan topik tertentu.

7. Kritik&Saran. User dapat mengungkapkan kritik dan saran terhadap sekolah maupun terhadap website ini. Menu ini bisa disebut juga buku tamu.

Pada halaman utama terdapat menu login untuk siswa dan guru yang kemudian menuju ke halaman login.

Pembuatan sistem ini menggunakan spesifikasi sebagai berikut : 1. Software

Web server : Apache

(35)

Database : MySQL

User Interface : Macromedia Dreamweaver MX 2004 2. Hardware

Processor : Intel Pentium 4 CPU 2.26 GHz

RAM : 1024 MB

Sistem Operasi : Microsoft Windows XP Professional

Sistem dapat diakses dengan menggunakan spesifikasi web browser Internet Explorer 6.0 keatas dan sistem operasi Microsoft Windows XP Professional keatas

3.2. Perancangan Proses

Perancangan proses sistem membahas tentang bagaimana jalannya sistem. Perancangan ini dibantu dengan alat bantu berupa DFD. Proses aliran data yang terjadi pada sistem ini terlihat pada Gambar 3.1.

(36)

tidak hanya dapat melihat data siswa, jadwal dan nilai tetapi juga dapat mengelola buku alamat. Jadwal pada user siswa memiliki arti jadwal pelajaran dan jadwal ekstrakulikuler. 1 Sis tem Informasi SMP 2 Godean siswa admin pengunjung guru

us ername,pas sword konfirmasi pass word datasitus materi konfirmasi pass word noinduk ,pass word konfirmasi pass word nilai

keyword

guru data s itus

materi berita materi pengumuman forum jadwal

kritik saran topik forum balasan topik forum

kritik saran

buku alamat buku alamat nip,password agenda sekolah siswa prestasi matapelajaran galeri kelas keyword nilai keyword jadwal siswa

Gambar 3.1 Diagram Konteks

Pengunjung dapat melihat home, profil sekolah, gallery, prestasi, berita, pengumuman, materi, jadwal, forum, kritik dan saran. Pada diagram konteks tidak disebutkan home dan profil sekolah karena pengelolaan data-data tersebut bersifat statis, sehingga pengelolaan yang dilakukan pun bersifat stastis.

(37)

tambah, admin menambah data site yang ada. Proses lihat, admin dapat melihat seluruh data yang ada dalam database. Proses cari, admin dapat melihat data dengan mencari terlebih dahulu data yang diperlukan, dalam melakukan pencarian, admin menginputkan suatu keyword terlebih dahulu. Proses update, admin dapat mengupdate semua data yang ada di database.

Proses aliran data dari sisi admin dapat dilihat pada DFD Level 1 Admin.

1 login

2 tambah

3 lihat

4 update 5

cari admin

data situs us ername,password

konfirmasi login

data s itus

keyword

data s itus data situs data situs

data situs data s itus data situs

data s itus

password password

(38)

Dalam proses login terdapat 3 proses yaitu input username dan password, mencocokan username dan password, dan konfirmasi ke login. Proses yang pertama, user memasukkan username dan password kemudian sistem mencocokkan username dan password tersebut dengan simpanan data admin. Jika cocok, maka user akan masuk ke sistem, tetapi jika tidak cocok, sistem akan kembali lagi ke hal login.

Aliran proses yang dilakukan oleh guru dapat dilihat pada DFD level 1 sisi guru. Aliran data untuk user guru antara lain nilai, siswa, mata pelajaran, jadwal pelajaran, materi, dan kelas pada level 1 disingkat mejadi data akademik siswa untuk mempermudah pembangunan desain DFD. User guru dapat mengupdate password dan materi.

1 login

2 lihat

3 cari

4 update guru

data akademik siswa nip,pas sword

nip,pas sword

konfirmasi login

data akademik siswa data akademik siswa

data akademik siswa

pass word data akademik

siswa

keyword

materi

(39)

1 login

2

lihat jadwal siswa

4 cari 3

update

nilai

buku alamat noinduk ,pass word

noinduk ,pass word konfirmasi login

data nilai

jadwal

keyword buku alamat,jadwal,nilai

nilai

buku alamat nilai

jadwal agenda

data s is wa

buku alamat

buku alamat buku alamat

jadwal

buku alamat buku alamat,jadwal,nilai pass word

Gambar 3.4 DFD Level 1 Sisi Siswa

(40)

1 lihat

2 isi

berita pengumuman

galeri

forum_topic

forum_post kritik saran

agenda sekolah

prestasi berita

pengumuman

galeri

forum, kritik saran

forum_topic forum_topic

forum_pos t forum_post

kritik saran kritik saran

berita pengumuman agenda sekolah galeri prestasi

agenda sekolah

prestasi forum, kritik

saran

kritik saran forum_topic forum_pos t

Gambar 3.5 DFD Level 1 Sisi Pengunjung

3.3. Perancangan Basis Data

(41)

siswa kelas

mata pelajaran wali_k el as

anggota memilik i isi belajar noinduk desk ripsi kode_mp kode_k kelas mata pelajaran nama_file nama asal sekolah TTL alamat ada tgl tahun ajaran ket_nilai hari jam nilai semester tahun lulus password guru kode_bk_alamt nip alamat

TTL notel p

jabatan nama pass word buku alamat siswa memi liki nama alamat no_telp hp_1 hp_2

jenis_k elami n

memberi materi kode_mat judul m 1 m m m m m 1 m 1 m m 1 post

topic is i

post_owner

post_tex t post_create_time

topic _c reat e_t ime topic_owner topic_title

post_id topic _id

1 m

(42)

Hasil mapping dari ERD diatas adalah :

1. Siswa (noinduk, nama, kelas, alamat, TTL, jenis_kelamin, asal_sekolah, tahun_lulus, password)

2. Buku_alamat_siswa(kode_bk_almt, noinduk, nama, alamat, no_telp, hp_1, hp_2)

3. Guru(nip, nama, jabatan,TTL, alamat, notelp, password) 4. Mata pelajaran(kode_m, nama_m)

5. Kelas(kode_k, nama_k, wali_kelas)

6. Nilai(kode_nilai,noinduk, kode_m, nilai, ket_nilai, semester, tahun_ajaran)

7. Jadwal_pelajaran(kode_k, kode_m, nip, hari, jam)

8. Materi(kode_mat, kode_m, nip, judul, tgl, nama_file, deskripsi, direktori)

9. topic(topic_id,topic_title,topic_create_time,topic_owner) 10. post(topic_id,topic_id,post_text,post_create_time,post_owner)

Pada ERD gambar 3.6 mempunyai 11 entitas yaitu buku alamat siswa, siswa, prestasi, kelas, mata pelajaran, guru, dan materi yang masing-masing memiliki atribut sendiri-sendiri.

(43)

dan kelas memiliki hubungan many to one, yang berarti banyak siswa berada di satu kelas. Primary key dari kelas menjadi salah satu atribut siswa. Siswa dan mata pelajaran memiliki hubungan many to many yang berarti banyak siswa belajar banyak mata pelajaran, karena hubungan many to many maka terbentuk tabel baru yaitu tabel nilai yang memiliki atribut key dari sisi siswa dan matapelajaran. Tabel nilai memiliki atribut antara lain noinduk, kode_m, nilai, ket_nilai, semester, tahun_ajaran.

Kelas, matapelajaran, dan guru memiliki hubungan many to many yang berarti di banyak kelas memiliki banyak mata pelajaran sehingga terbentuk pula tabel baru yaitu jadwal. Jadwal memiliki atribut antara lain : kode_k, kode_m, nip, hari, jam.

Mata pelajaran dan guru terhadap materi memiliki hubungan one to many

yang berarti primary key dari guru dan mata pelajaran menjadi atribut dari materi. Materi memiliki atribut antara lain : kode_mat, kode_k, nip, judul, tgl, nama_file, deskripsi, direktori.

Topic dan Post adalah entitas dalam forum yang memiliki hubungan one to many

yang berarti primary key dari topic menjadi atribut post.

Simpanan lain yang dibutuhkan oleh sistem adalah berita, pengumuman, galeri, dan kritik & saran. masing-masing simpanan tidak dibuat ERD tetapi tetap memiliki atribut. Berikut ini adalah atribut dari masing-masing simpanan tersebut.

1. Admin(id, username, password)

(44)

4. Agenda Sekolah(kode_ag, tema, isi, tgl_mulai, tgl_selesai, tgl_posting) 5. Galeri(kode_g, nama_file, deskripsi, direktori)

6. Kritik dan Saran(kodesaran,tanggal,nama,email,komentar) 7. Jadwal Ektrakulikuler(kode_e, ekstra, hari, jam, tempat)

Kamus data untuk seluruh data yang ada terdapat pada Tabel 3.1 Kamus Data. Tabel 3.1 Kamus Data.

Siswa Noinduk+nama+kelas+alamat+TTL+jenis_kelamin+asal_se kolah+tahun_lulus+password

Buku_alamat_siswa kode_bk_almt+noinduk+nama+alamat+no_telp+hp_1+hp_2 Guru nip+nama+jabatan+tempatlahir+tgl_lahir+alamat+no.telp+p

assword

Data mata pelajaran kode_m+nama_m

Data jadwal pelajaran kode_k+kode_m+nip+hari+jam

Data nilai noinduk+kode_m+ket_nilai+nilai+semester+thn_ajaran Data berita kode_b+judul+tanggal+isi+penulis

Data pengumuman kode_peng+judul+isi+penulis

Data materi kode_mat+kode_m+nip+judul+tgl+nama_file+deskripsi+ direktori

topic_id+topic_title+topic_create_time+topic_owner Data forum

post_id+topic_id+post_text+post_create_time+post_owner

topic_id {varchar}50

topic_title {varchar}100

topic_create_time dd +mm+yyyy, dd={0-9}2, mm={0-9}2, yyyy={0-9}4 topic_owner {varchar}50

post_id {varchar}50

(45)

post_create_time dd +mm+yyyy, dd={0-9}2, mm={0-9}2, yyyy={0-9}4

post_owner {varchar}50

prestasi kode_p+ noinduk+ tgl+tingkat+prestasi

nip {varchar}5

noinduk {varchar}50

nama {varchar}50

kelas {varchar}15

tempat lahir {varchar}5

tanggal lahir dd +mm+yyyy, dd={0-9}2, mm={0-9}2, yyyy={0-9}4 jeniskelamin {varchar}10

alamat {varchar}50

notelp {varchar}25

asalsekolah {varchar}50

username {varchar}25

password {varchar}25

kode_m {varchar}15

nilai {int}2

kode_b {varchar}15

kode_peng {varchar}15

tgl dd +mm+yyyy, dd={0-9}2, mm={0-9}2, yyyy={0-9}4

judul {varchar}50

isi {text}

penulis {varchar}50

* Keterangan

(46)

3.4 Perancangan Navigasi Menu

Perancangan ini dibuat untuk memudah programer untuk membuat alur program dalam sistem yang akan dibuat. Karena sistem ini adalah sistem berbasis web, maka sebisa mungkin navigasi yang dibuat tidak membingungkan dan tidak merepotkan user. Menu yang ada pada sistem hendaknya juga saling berkaitan dengan menu yang lain, sehingga user tidak kesulitan jika ingin kembali ke halaman sebelumnya atau ke menu yang lain.

Berikut ini adalah gambaran rancangan menu dalam sistem informasi ini. Gambaran menu yang terdapat dalam sistem dilihat dari sisi user yang terlibat yaitu :

3.4.1. Perancangan Navigasi Menu Admin

Setelah login, admin masuk ke menu seperti pada gambar 3.8, navigasi menu admin. Pada setiap menu, admin dapat mengupdate maupun menambah data. Menu-menu yang terdapat pada halaman utama admin adalah berita, pengumuman, materi, nilai, siswa, matapelajaran, jadwal pelajaran, forum, kritik saran, ganti password, dan log out.

(47)

3.4.2 Perancangan Navigasi Menu Guru

Guru memiliki menu antara lain : materi, data siswa, nilai, jadwal, mata pelajaran, ganti password, dan log out. Menu-menu tersebut seperti terlihat pada Gambar 3.9 Navigasi Menu Guru.

Gambar 3.9 Navigasi Menu Guru

3.4.3. Perancangan Navigasi Menu Siswa

Siswa memiliki menu antara lain : data siswa, nilai, nilai rapor, jadwal, agenda, buku alamat, ganti password, logout. Padabuku alamat, siswa dapat mengupdatenya. Menu-menu tersebut terlihat pada Gambar 3.10 Navigasi Menu Siswa.

(48)

3.4.4. Perancangan Navigasi Menu Pengunjung

Pengunjung memiliki menu seperti terlihat pada Gambar 3.11 Navigasi Menu Pengunjung.

Gambar 3.11 Navigasi Menu Pengunjung

3.5. Perancangan User Interface

Perancangan user interface dilakukan untuk merancang bagaimana wajah sistem yang akan dibuat dan memudahkan programer untuk membuat tampilan dari sistem yang akan dibuat.

Perancangan user interface dibedakan sesuai dengan user yang terlibat, yaitu admin, guru, siswa, dan pengunjung.

3.5.1. Perancangan User Interface Admin

(49)

Gambar 3.12 Halaman Login Admin

Halaman utama admin seperti terdapat pada gambar 3.13. Pada bagian atas adalah header, tengah kiri terdapat daftar menu dan bagian bawah adalah footer.

header

berita

pengumuman

materi

nilai

siswa

guru

kelas

mata pelajaran

jadwal pelajaran

jadwal

ektrakulikuler

forum

kritik & saran

galeri

ganti password

logout

Isi

footer

(50)

Halaman input data mata pelajaran terlihat seperti pada gambar 3.14. header berita pengumuman materi nilai siswa guru kelas mata pelajaran jadwal pelajaran jadwal ektrakulikuler forum

kritik & saran

galeri

ganti password

logout

Input Mata Pelajaran

kode pelajaran :

nama pelajaran :

input Reset

footer

Gambar 3.14 Input Data

Halaman upload galeri terlihat seperti pada Gambar 3.15

header berita pengumuman materi nilai siswa guru kelas mata pelajaran jadwal pelajaran jadwal ektrakulikuler forum

kritik & saran

galeri

ganti password

logout

Upload Galeri

File upload : _browse

Deskripsi :

upload

footer

(51)

Halaman edit data jadwal terlihat seperti pada gambar 3.16. header berita pengumuman materi nilai siswa guru kelas mata pelajaran jadwal pelajaran jadwal ektrakulikuler ... Edit Jadwal

No : 2

Hari : kamis

Jam : 4

Kode Kelas : 7a

Kode Pelajaran : bi

Guru : pak gi

footer

Gambar 3.16 Edit Data

Halaman cari data jadwal pelajaran terlihat seperti pada gambar 3.17.

header berita pengumuman materi nilai siswa guru kelas mata pelajaran jadwal pelajaran jadwal ektrakulikuler ...

Cari jadwal pelajaran

--pilih--Masukkan kata yang dicari

cari

footer

(52)

3.5.2 Perancangan User Interface Guru

Halaman pertama guru adalah form login untuk dapat masuk ke sistem. Gambar 3.18 memperlihatkan form login guru.

Gambar 3.18 Form Login Siswa

Halaman utama guru terlihat pada Gambar 3.19.

header

Data pribadi

Jadwal pribadi

materi

siswa

nilai

kelas

mata pelajaran

jadwal pelajaran

jadwal ekstrakuikuler

ganti password

logout

Isi

footer

Gambar 3.19 Halaman Utama Guru

3.5.3. Perancangan User Interface Siswa

(53)

Gambar 3.20 Halaman Login Siswa

Halaman utama siswa seperti terdapat pada Gambar 3.21. Pada bagian atas adalah header, tengah kiri terdaapt daftar menu dan bagian bawah adalah footer.

header

Data siswa

Nilai

Jadwal pelajaran

Jadwal

ekstrakulikuler

Materi

Buku alamat

Logout

Isi

footer

Gambar 3.21 Halaman Utama Siswa

3.5.4 Perancangan User Interface Pengunjung

Halaman utama pengunjung terlihat pada Gambar 3.22.

header

Home Profi sekolah Galeri Berita Pengumuman Forum kritik dan saran Login

Guru Siswa Contact Us

footer

(54)

Berikut ini adalah Gambar 3.23 untuk rancangan halaman kritik dan saran :

header

[1]

Tanggal : 2008-10-10 21:23:11 Nama : aa

Email : [email protected] Komentar : hmmmm, entahlah

Silakan mengisi kritik dan saran :

Nama : Email : Komentar : Input reset

Home Profi sekolah Galeri Berita Pengumuman Forum kritik dan saran

Login Guru Siswa

Contact Us

footer

Gambar 3.23 Halaman Kritik dan Saran

Gambar 3.24 memperlihatkan rancangan untuk halaman forum.

Gambar 3.24 Halaman Forum

header

Halaman Forum

Judul Topik Post

website yang menarik

Sep 28 2008 at 10:34:38 PM dibuat oleh [email protected] 2

Tambah topik baru, klik add a topic?

Home Profi sekolah Galeri Berita Pengumuman Forum kritik dan saran

Login Guru Siswa

Contact Us

(55)

BAB IV

IMPLEMENTASI SISTEM

4.1. Implementasi Basis Data

Basis data merupakan salah satu komponen yang penting dalam sistem ini karena dalam database inilah tersimpan informasi-informasi yang diolah oleh sistem dan memberi informasi kepada user. Implementasi basis data dilakukan dengan menggunakan PHPMyAdmin. Database pada sistem ini bernama âsmp2godeanâ dan memiliki 22 tabel. Tabel-tabel yang terdapat dalam database tersebut adalah sebagai berikut :

1. Admin

Tabel 4.1 Tabel Admin

2. Agenda Sekolah

Tabel 4.2 Tabel Agenda Sekolah

3. Mata Pelajaran

(56)

4. Buku Alamat Siswa

Tabel 4.4 Tabel Buku Alamat Siswa

5. Forum

Tabel 4.5 Tabel Forum Posts

Tabel 4.6 Tabel Forum Topics

6. Galeri

Tabel 4.7 Tabel Galeri

7. Jadwal Ekstrakulikuler

(57)

8. Guru

Tabel 4.9 Tabel Guru

9. Jadwal Pelajaran

Tabel 4.10 Tabel Jadwal Pelajaran

10. Kelas

Tabel 4.11 Tabel Kelas

11. Kritik dan Saran

(58)

12. Berita

Tabel 4.13 Tabel Berita

13. Materi

Tabel 4.14 Tabel Materi

14. Nilai

Tabel 4.15 Tabel Nilai

15. Pengumuman

(59)

16. Siswa

Tabel 4.17 Tabel Siswa

Untuk melakukan koneksi database dibuat program sambung yang disimpan dalam sambung.php. Berikut ini adalah skrip program untuk melakukan koneksi database.

<?php

$host="localhost"; $userdb="root"; $passdb="";

$namadb="smp2godean";

$sambung=mysql_connect($host,$userdb,$passdb); mysql_select_db($namadb,$sambung);

?>

4.2. Implementasi Proses

Implementasi proses dilihat dari sisi user yang terlibat dalam sistem terdapat 4 proses, yaitu proses dari sisi admin, proses dari sisi guru, proses dari sisi siswa, dan proses dari sisi tamu atau pengnjung. Berikut ini adalah implementasi proses dari masing-masing user tersebut.

4.2.1. Implementasi Proses dari Sisi Admin

(60)

a. Proses Login

Proses login melibatkan 2 penggalan program yaitu form login dan cek login. Form login disimpan dalam file index.php, cek login disimpan dalam file cek_login.php. Programnya adalah sebagai berikut :

<tr><td>Username</td><td> : <input type="text" name="username"></td></tr> <tr><td>Password</td><td> : <input type="password" name="password"></td></tr> <tr><td colspan="2"><input type="submit" value="Login"></td></tr>

</table> </form>

Berikut ini adalah skrip program untuk cek login, jika user salah input, maka user harus mengulang login, tetapi jika user benar dalam mengisi form login maka user dapat masuk ke sistem.

<?

session_start();

session_register("username"); if((!$username) or (!$password)) {

echo '<script>';

echo 'alert("Password kosong!! Silahkan diisi dahulu.");'; echo 'window.navigate("index.html");'; echo '</script>'; } else { include("sambung.php"); $pass=md5($password);

$query_login=mysql_query("select count(*) as login from admin

where username='$username' and password='$pass'",$sambung) or die(mysql_error()); $row=mysql_fetch_array($query_login); if($row["login"]>="1") { session_register("username"); header("location:admin.php"); } else echo '<script>';

echo 'alert("Username dan Password salah!! Silahkan diulangi lagi.");'; echo 'window.navigate("index.php");';

echo '</script>'; }

(61)

b. Proses Lihat Data

Proses ini memperlihatkan kepada user data-data yang tersimpan dalam database. Salah satu file lihat data adalah ekstra.php. berikut ini adalah skrip program untuk menampilkan data.

<table>

<tr><th>No.</th><th>Kode</th><th>Ekstrakulikuler</th><th>Hari</th> <th>Jam</th><th>Tempat</th><th>Update</th></tr>

<div align="left"><a href="../admin/admin.php?hal=hal_input_ekstra">Input Jadwal</a> |

<a href="../admin/admin.php?hal=cari_ekstra">Cari Jadwal</a> </div> <?php

include"sambung.php";

//Langkah 1: Tentukan batas,cek halaman & posisi data $batas = 10;

$halaman = $_GET['halaman']; if(empty($halaman)){

$posisi=0; $halaman=1; }

else{

$posisi = ($halaman-1) * $batas; }

//Langkah 2: Sesuaikan perintah SQL

$tampil="select * from jadwal_extra limit $posisi,$batas"; $hasil=mysql_query($tampil);

$no=$posisi+1; // Agar angka (penomoran) mengikuti paging while ($data=mysql_fetch_array($hasil)){ echo "<tr><td>$no</td><td>$data[kode]</td><td>$data[ekstra]</td><td>$data[hari]</td> <td>$data[jam]</td><td>$data[tempat]</td><td> <a href=\"admin.php?hal=hal_edit_ekstra&&kode=$data[kode]\">edit</a> | <a href=\"delete_ekstra.php?kode=$data[kode]\" onClick=\"return confirm('Apakah Anda benar-benar akan menghapus

$data[kode]?')\">hapus

</a></td></tr>"; $no++;

}

echo "</table>";

//Langkah 3: Hitung total data dan halaman serta link 1,2,3 ... echo "<br>Halaman : ";

$file="ekstra.php";

$tampil2="select * from jadwal_extra"; $hasil2=mysql_query($tampil2);

$jmldata=mysql_num_rows($hasil2); $jmlhalaman=ceil($jmldata/$batas); for($i=1;$i<=$jmlhalaman;$i++) if ($i != $halaman)

{

echo " <a href=admin.php?hal=jadwal_ekstra&&halaman=$i>$i</A> | "; //index.php?hal=berita&&page=$a

} else {

echo " <b>$i</b> | "; }

(62)

c. Proses Tambah

Proses tambah melibatkan 2 program yaitu form input dan input. Program input data jadwal pelajaran melibatkan 2 program yaitu halaman input jadwal yang disimpan dalam hal_input_jadwal.php dan input_jadwal.php. berikut ini adalah skrip program form input data.

<?

include"sambung.php"; include"cek.php"; ?>

<tr>

<option>senin</option> <option>selasa</option> <option>rabu</option> <option>kamis</option> <option>jumat</option> <option>sabtu</option> </select> </strong></div></td> </tr> <tr>

</tr> <tr>

<span class="style12 style11 style10 style4">Kelas </span></td>

<select name="kode_kelas" size="1" id="kode_kelas"> <? include "sambung.php"; $perintah=mysql_query("select * from kelas"); while($hasil=mysql_fetch_array($perintah)) print"<option value=\"$hasil[kode_kelas]\">$hasil[kode_kelas]</option>"; ?> </select>

</strong> </strong></span> </div></td> </tr>

(63)

<td align="left" valign="middle"><span class="style9">Pelajaran</span></td>

<select name="kode_pel" size="1" id="kode_pel"> <? include "sambung.php"; $perintah=mysql_query("select * from matapelajaran"); while($hasil=mysql_fetch_array($perintah)) print"<option value=\"$hasil[kode_pel]\">$hasil[kode_pel]</option>"; ?> </select> </strong></strong> </strong></span></span></td> </tr> <tr>

<option value="<? print("$nama");?>"><? print("nama");?></option> <? $perintah=mysql_query("select nama from guru"); while($hasil=mysql_fetch_array($perintah)) print"<option value=\"$hasil[nama]\">$hasil[nama]</option>"; ?>

</select> </span></td></tr> <tr align="center" valign="top">

Untuk menginputkan data dibutuhkan program input data, berikut ini adalah skrip program untuk menginputkan data yang diisikan dalam form.

<?

$query = "INSERT INTO jadwal_pelajaran

VALUES ('$no','$hari','$jam','$kode_kelas','$kode_pel','$guru')"; $hasil_mysql = mysql_query($query);

if($query) {echo '<script>';

echo 'alert("Data sudah disimpan");';

echo 'window.navigate("../admin/admin.php?hal=jadwal");'; echo '</script>';

} else

{echo '<script>';

echo 'alert("Data gagal disimpan atau telah ada");'; echo 'window.navigate("../admin/admin.php?hal=jadwal");'; echo '</script>';

(64)

d. Proses Edit

Proses edit melibatkan 2 program yaitu halaman edit dan edit yang disimpan sebagai hal_edit_jadwal.php dan edit_jadwal. Berikut ini adalah skrip program untuk form edit data.

<?

$query = "select * from jadwal_pelajaran where kode='$kode'"; $hasil = mysql_query($query) or die('<script>alert("Tidak dapat mengedit!\n'.mysql_error().'");</script>');

$row = mysql_fetch_array($hasil); $kode=$row['kode']; $hari=$row['hari']; $jam=$row['jam']; $kode_kelas=$row['kode_kelas']; $kode_pel=$row['kode_pel']; $guru=$row['guru'];

print("<input type=hidden name=kode value=$kode>"); ?>

<option value="<? print("$hari");?>"><? print("$hari");?></option> <option>senin</option> <option>selasa</option> <option>rabu</option> <option>kamis</option> <option>jumat</option> <option>sabtu</option> </select> </div></td> </tr> <tr>

</tr> <tr>

<td width="131" align="left" valign="middle" class="style21">Kode Kelas </td>

(65)

?> </select> </div></td>

</tr> <tr>

<td width="131" align="left" valign="middle" class="style21">Kode Pelajaran</td>

<option value="<? print("$kode_pel");?>"><? print("$kode_pel");?></option> <? $perintah=mysql_query("select * from matapelajaran"); while($hasil=mysql_fetch_array($perintah)) print"<option value=\"$hasil[kode_pel]\">$hasil[kode_pel]</option>"; ?> </select> </div> </tr> <tr>

<option value="<? print("$guru");?>"><? print("$guru");?></option> <? $perintah=mysql_query("select nama from guru"); while($hasil=mysql_fetch_array($perintah)) print"<option value=\"$hasil[nama]\">$hasil[nama]</option>"; ?>

</select> </div> </tr>

<tr>

</table> </form>

Form edit data membutuhkan skrip program berikut untuk megedit data yang diinputkan melalui form edit. berikut ini adalah skripnya :

<?

include "sambung.php"; include"cek.php";

$username = $_SESSION['username']; if($simpan)

{

$query = mysql_query("update jadwal_pelajaran set kode='$kode', hari='$hari', jam='$jam', kode_kelas='$kode_kelas', kode_pel='$kode_pel', guru='$guru'

(66)

$hasil_mysql = mysql_query($query); echo '<script>';

echo 'alert("Data sudah disimpan");';

}

elseif($batal) {

echo '<script>';

} ?>

e. Proses Hapus

Proses hapus melibatkan 1 program yaitu delete. Sebagai contoh hapus kritik dan saran disimpan dalam file delete_kritik_saran.php Programnya adalah sebagai berikut :

<?php

include "sambung.php";

$query="DELETE FROM kritik_saran WHERE kodesaran='$kodesaran'"; $hasil = mysql_query($query)

or die('<script>alert("Tidak dapat menghapus !\n'.mysql_error().'");</script>');echo '<script>';

echo 'window.navigate("hal_daftar_kritik_saran.php");'; echo '</script>';

mysql_close($koneksi); ?>

4.2.2. Implementasi Proses dari Sisi Guru

Proses-proses yang terjadi dari sisi admin antara lain adalah proses login dan lihat data.

a. Proses Login

Proses login guru hampir sama dengan login admin, melibatkan form login dan cek login untuk mengecek kebenaran login.

(67)

Proses ini memperlihatkan kepada user data-data yang tersimpan dalam database. Salah satu file lihat data adalah materi.php. berikut ini adalah skrip program untuk melihat data.

<table>

<tr><th>No.</th><th>Tanggal</th>

<th>Kode Kelas</th><th>Kode Pelajaran</th><th>Judul</th> <th>Isi</th><th></th><th>Penulis</th></tr>

<p class="style2">daftar materi |

<a href="../guru/guru.php?hal=upload_materi">upload materi</a> </p> <p> <?php

//Langkah 1: Tentukan batas,cek halaman & posisi data $batas = 5;

$halaman = $_GET['halaman']; if(empty($halaman)){

$posisi=0; $halaman=1; }

else{

$posisi = ($halaman-1) * $batas; }

//Langkah 2: Sesuaikan perintah SQL

$tampil="select * from materi limit $posisi,$batas"; $hasil=mysql_query($tampil);

$no=$posisi+1; // Agar angka (penomoran) mengikuti paging while ($data=mysql_fetch_array($hasil)){ echo "<tr><td>$no</td><td>$data[tanggal]</td> <td>$data[kode_kelas]</td><td>$data[kode_pel]</td> <td>$data[judul]</td><td>$data[isi]</td><td>$data[download]</td><td>$data[penulis]</td> </tr>"; $no++; } echo "</table>";

//Langkah 3: Hitung total data dan halaman serta link 1,2,3 ... echo "<br>Halaman : ";

$file="materi.php";

$tampil2="select * from materi"; $hasil2=mysql_query($tampil2); $jmldata=mysql_num_rows($hasil2); $jmlhalaman=ceil($jmldata/$batas); for($i=1;$i<=$jmlhalaman;$i++) if ($i != $halaman)

{

echo " <a href=admin.php?hal=materi&&halaman=$i>$i</A> | "; //index.php?hal=berita&&page=$a

} else {

echo " <b>$i</b> | "; }

echo "<p>Total materi : <b>$jmldata</b> data</p>"; ?>

4.2.3 Implementasi Proses dari Sisi Siswa

(68)

a. Proses Login

Proses login siswa hampir sama dengan proses login admin dan login guru. Proses login siswa melibatkan 2 program yaitu halaman login dan proses login yang disimpan dalam index.php dan cek_login.php.

b. Proses Lihat Data

Proses lihat buku alamat terlihat pada program buku_alamat.php sebagai berikut :

<p><a href="../siswa/siswa.php?hal=hal_input_buku_alamat">input buku alamat siswa</a> | <a href="../siswa/siswa.php?hal=cari_buku_alamat">cari buku alamat</a> </p>

<?php

include("sambung.php");

$noinduk = $_SESSION['noinduk'];

$numresult = mysql_query("SELECT * FROM buku_alamat_siswa where noinduk='$noinduk'");

$jumlah = mysql_num_rows($numresult); $limit = 3;

if (empty($page)) { $page=1; } $totalpage = ceil($jumlah/$limit); if ($page!=1) {

$prev = $page-1;

echo "<a href=\"siswa.php?hal=buku_alamat&&page=$prev\" class=\"style1 style2\">«</a> ";

}

for ($a=1;$a<=$totalpage;$a++) { if ($a==$page) {

echo("<b class=\"line1 style1 style2\">[$a]</b> "); } else {

echo " <a href=\"siswa.php?hal=buku_alamat&&page=$a\" class=\"style1 style3\">$a</a> ";

} }

if ($page!=$totalpage) { $next = $page + 1;

echo " <a href=\"siswa.php?hal=buku_alamat&&page=$next\" class=\"style1 style2\">»</a> ";

}

$star = ($page - 1) * $limit;

$sql = mysql_query("SELECT * FROM buku_alamat_siswa where noinduk='$noinduk' order by nama

LIMIT $star,$limit");

while($data = mysql_fetch_array($sql)) { ?>

<tr>

<?=$data[nama]?> </div></td>

(69)

<td class="style1 style2 style28">Alamat</td>

<?=$data[alamat]?> </div></td>

</tr> <tr>

</div></td> </tr>

<tr>

<?=$data[hp1]?></td> </tr>

<tr>

<td class="style26 style2 style1 style32"><div align="left"> <?=$data[hp2]?> </div></td> </tr> <? echo "<td> <a href=\"siswa.php?hal=edit_buku_alamat_siswa&&kode=$data[kode]\">edit</a> | <a

href=\"delete_buku_alamat.php?kode=$data[kode]\">hapus</a> </td> </tr>

</table>";?> <?php } ?>

c. Proses Tambah

Proses tambah yang melibatkan user siswa adalah tambah data agenda dan data buku tamu. Berikut ini adalah proses input buku alamat yang melibatkan 2 program yaitu form input dan proses input yang disimpan dalam hal_input_buku_alamat.php dan input_buku_alamat.php. Berikut ini adalah skrip program untuk form input data.

<? include"sambung.php";

include"cek.php"; ?>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<title>Untitled Document</title>

</head> <body>

(70)

<?

$noinduk = $_SESSION['noinduk']; print"<input type=hidden name=noinduk value=\"$noinduk\">";

?>

</tr> <tr>

<td>Alamat</td> <td>:</td>

<tr>