PERANCANGAN SISTEM INFORMASI SMA NEGERI 5 MEDAN BERBASIS WEB TUGAS AKHIR ADE YULIA SARI

PERANCANGAN SISTEM INFORMASI SMA NEGERI 5 MEDAN BERBASIS WEB

TUGAS AKHIR

ADE YULIA SARI 062406117

DEPARTEMEN MATEMATIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA MEDAN 2009

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.


TUGAS AKHIR Diajukan untuk melengkapi tugas dan memenuhi syarat memperoleh Ahli Madya


DEPARTEMEN MATEMATIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA MEDAN 2009


PERSETUJUAN

Judul Kategori Nama Nomor Induk Mahasiswa Program Studi Departemen Fakultas

: PERANCANGAN SISTEM INFORMASI SMA NEGERI 5 MEDAN BERBASIS WEB : TUGAS AKHIR : ADE YULIA SARI : 062406117 : D3 ILMU KOMPUTER : MATEMATIKA : MATEMATIKA DAN ILMU PENGETAHUAN ALAM (FMIPA) UNIVERSITAS SUMATERA UTARA

Diluluskan di Medan, Juni 2009

Diketahui / Disetujui oleh Departemen Matematika FMIPA USU Ketua,

Pembimbing

Dr. Saib Suwilo, M.Sc NIP 131796149

Dra. Normalina Napitupulu, M.Sc NIP 131831527


PERNYATAAN


TUGAS AKHIR

Saya mengakui bahwa tugas akhir ini adalah hasil kerja saya sendiri, kecuali beberapa kutipan dan ringkasan yang masing-masing disebutkan sumbernya.

Medan,

Mei 2009



ABSTRAK

Perancangan Sistem Informasi SMA Negeri 5 Medan Berbasis Web ini bertujuan untuk mempermudah proses pencarian atau searching data dan informasi untuk seluruh siswa SMA Negeri 5 Medan yang mengalami kesulitan dalam memperoleh data mengenai aktivitas akademik di SMA Negeri 5 Medan tersebut. Fasilitas-fasilitas yang terdapat dalam aplikasi ini berupa penyediaan data dan informasi mengenai berita- berita terbaru, profil agenda kegiatan, dan data- data yang berguna untuk kelangsungan belajar siswa. Pada proses pembuatan aplikasi ini perangkat lunak yang digunakan adalah PHP ( terdiri dari Apache Server dan MySQL ) sebagai bahasa pemrograman dengan mengunakan PHP 5.0, Macromedia Dreamweaver 8 digunakan sebagai editor skrip, Adobe Photoshop CS2 sebagai editor grafis.


DAFTAR ISI

Halaman Persetujuan Pernyataan Penghargaan Abstrak Daftar Isi Daftar Tabel Daftar Gambar Bab 1 Pendahuluan 1.1 Latar Belakang 1.2 Identifikasi Masalah 1.3 Tujuan Masalah 1.4BatasanMasalah 1.5 Metode Penelitian 1.6 Tinjauan Pustaka 1.7SistematikaPenulisan Bab 2 Landasan Teori 2.1 Pengertian Komputer 2.2 Pengertian Sistem 2.3 Pengertian Informasi 2.4 Pengertian Sistem Informasi 2.5 Syarat-Syarat Merancang Sistem Informasi Berbasis Web 2.6 Pengertian Internet 2.7PengertianWeb Server 2.8 HTML (Hypertext Markup Language) 2.8.1 Pendahuluan HTML 2.8.2 Bagian-Bagian HTML 2.9 Pengenalan PHP (Personal Home Page) 2.9.1 Sejarah PHP 2.9.2 Kelebihan dan Kelemahan PHP 2.9.3 Penggabungan Script PHP dan HTML 2.10 Pengenalan MySQL 2.11 Pengenalan CSS (Cascading Style Sheet) 2.12 Pengenalan Macromedia Dreamweaver 8


ii iii iv vii viii xi xiii 1 1 2 3 4 4 5 6 8 8 8 9 10 10 12 15 15 15 16 17 17 18 19 21 23 24

Bab 3 Sekilas Tentang SMA Negeri 5 Medan 3.1 Profil SMA Negeri 5 Medan 3.2 Struktur Organisasi 3.3 Uraian Tugas dan Fungsi Organisasi 3.3.1 Kepala Sekolah 3.3.2 Wakil Kepala Sekolah 3.3.3 Tata Usaha 3.3.4 Komite Sekolah 3.3.5 Bidang Sarana dan Prasarana 3.3.6 Bidang Kurikulum 3.3.7 Bidang Kesiswaan 3.3.8 Bidang Humas (Hubungan Masyarakat) 3.3.9 Guru 3.3.10 Wali Kelas 3.3.11 Guru Pembimbing dan Konseling (BP / BK) 3.4 Visi dan Misi dan Motto Sekolah 3.4.1 Visi Sekolah 3.4.2 Misi Sekolah 3.4.3 Motto Sekolah Bab 4 Perancangan Sistem 4.1 Perancangan Sistem 4.2 Perancangan Struktur Menu Utama 4.3 Perancangan Halaman Website 4.4 Perancangan User Interface 4.4.1 Perancangan Halaman Utama 4.4.2 Perancangan Halaman Admin 4.4.3 Perancangan Halaman Utama Siswa 4.4.2 Perancangan Halaman Utama Guru 4.5 Mempersiapkan Database Bab 5 Implementasi Sistem 5.1 Pengertian Implementasi sistem 5.2 Tujuan Implementasi Sistem 5.3 Lingkungan Implementasi 5.4.1 Halaman Utama 5.4.2 Halaman Utama Tampil Guestbook 5.4.3 Halaman Utama News 5.4.4 Halaman Visi Misi 5.4.5 Halaman Profil 5.4.6 Halaman Utama Siswa 5.4.7 Halaman Absensi Siswa 5.4.8 Halaman Nilai Siswa 5.4.9 Halaman Jadwal Siswa 5.4.10 Halaman Profil Siswa 5.4.11 Halaman Utama Guru Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

25 25 26 27 27 27 28 28 28 29 29 29 30 30 31 31 31 31 32 33 33 34 37 38 39 41 43 45 51 56 56 56 57 58 59 59 60 60 61 61 62 62 63 63

5.4.12 Halaman Absensi Guru 5.4.13 Halaman Jadwal Guru Mengajar 5.4.14 Halaman Profil Guru 5.4.15 HalamanUtama Admin 5.4.16 Halaman Data Kelas 5.4.17 Halaman Created 5.4.18 Halaman Edit Absensi Guru 5.4.19 Halaman Edit Berita 5.4.20 Halaman Input Data Jadwal 5.4.21 Halaman Input Data Guru 5.4.22 Halaman Input Data Nilai Siswa 5.5 Petunjuk Instalasi

64 64 65 65 66 66 67 67 68 68 69 69

Bab 6 Kesimpulan dan Saran 6.1 Kesimpul 6.2 Saran

81 81 82

Daftar Pustaka

83

Lampiran

84


DAFTAR TABEL

Halaman Tabel 4.1 Penjelasan Perancangan Halaman Utama Website

39

Tabel 4.2 Algoritma Umum Halaman Utama Website

40

Tabel 4.3 Penjelasan Perancangan Halaman Admin

42

Tabel 4.4 Algoritma Halaman Utama Admin

42

Tabel 4.5 Penjelasan Perancangan Halaman Utama Siswa

43

Tabel 4.6 Algoritma Umum Halaman Utama Siswa

44

Tabel 4.7 Penjelasan Perancangan Halaman Utama Guru

45

Tabel 4.8 Algoritma Umum Halaman Utama Guru

46

Tabel 4.9 Algoritma Login Admin

47

Tabel 4.10 Algoritma Login Guru

47

Tabel 4.11 Algoritma Login Siswa

48

Tabel 4.12 Algoritma Pengolahan Jadwal

48

Tabel 4.13 Algoritma Pengolahan Absensi Siswa

49

Tabel 4.14 Algoritma Pengolahan Nilai Siswa

49

Tabel 4.15 Algoritma Pengolahan Absensi Guru

50

Tabel 4.16 Jajak

51

Tabel 4.17 Halaman Berita

51

Tabel 4.18 Siswa

52

Tabel 4.19 Absensi Siswa

52

Tabel 4.20 Absensi Guru

52

Tabel 4.21 Guru

53

Tabel 4.22 Mata Pelajaran

53

Tabel 4.23 Nilai

53

Tabel 4.24 Agenda

54

Tabel 4.25 Jadwal

54

Tabel 4.26 Kelas

54


Tabel 4.27 Profil

54

Tabel 4.28 Semester

54

Tabel 4.29 User

55

Tabel 4.30 Buku Tamu

55

Tabel 4.31 Visi Misi

55


DAFTAR GAMBAR

Halaman Gambar 3.1

Struktur Organisasi SMA Negeri 5 Medan

26

Gambar 4.1

Struktur Menu Utama

35

Gambar 4.2

Perancangan Halaman Utama Website

39

Gambar 4.3

Perancangan Halaman Utama Admin

41

Gambar 4.4

Perancangan Halaman Utama Siswa

43

Gambar 4.5

Perancangan Halaman Utama Guru

45

Gambar 5.1

Halaman Utama

58

Gambar 5.2

Halaman Guestbook

59

Gambar 5.3

Halaman News

59

Gambar 5.4

Halaman Visi Misi

60

Gambar 5.5

Halaman Profil

60

Gambar 5.6

Halaman Utama Siswa

61

Gambar 5.7

Halaman Absensi Siswa

61

Gambar 5.8

Halaman Nilai Siswa

62

Gambar 5.9

Halaman Jadwal Siswa

62

Gambar 5.10

Halaman Profil Siswa

63

Gambar 5.11

Halaman Utama Guru

63

Gambar 5.12

Halaman Absensi Guru

64

Gambar 5.13

Halaman Jadwal Guru Mengajar

64

Gambar 5.14

Halaman Profil Guru

65

Gambar 5.15

Halaman Utama Admin

65

Gambar 51.6

Halaman Data Kelas

66

Gambar 5.17

Halaman Created

66

Gambar 5.18

Halaman Edit Absensi Siswa

67

Gambar 5.19

Halaman Edit Berita

67


Gambar 5.20

Halaman Input Data Jadwal

68

Gambar 5.21

Halaman Input Data Guru

68

Gambar 5.22

Halaman Input Data Nilai

69

Gambar 5.23

Pemilihan Instalasi

70

Gambar 5.24

Instalasi Apche Sukses

71

Gambar 5.25

Test PHP

74

Gambar 5.26

Tampilan Halaman Website

80


BAB 1 PENDAHULUAN

1.1 Latar Belakang

Dewasa ini perkembangan teknologi informasi dan teknologi komputer berkembang dengan sangat pesat. Kebutuhan tersebut semakin diminati oleh semua kalangan masyarakat, baik masyarakat awam maupun kaum intelektual. Hal ini berkaitan dengan kegiatan-kegiatan yang sering dilakukan manusia yang biasanya dilakukan secara manual dan tradisional, kini akan semakin lebih cepat dan tepat jika dilakukan dengan bantuan mesin yaitu teknologi komputer. Dengan pemanfaatan teknologi komputer tersebut juga dapat menghemat segala sesuatu, baik itu tenaga, waktu, maupun biaya, sehingga pengeluaran untuk itu dapat ditekan seminimal mungkin.

Sistem Informasi di SMA Negeri 5 Medan khususnya dalam beberapa bidang diantaranya penilaian, penjadwalan, dan absensi siswa masih menggunakan sistem manual,

sehingga mempersulit

dalam pencarian data.

mengakibatkan berkurangnya kinerja

Hal tersebut

dapat

SMA Negeri 5 Medan ini. Oleh sebab itu

penulis tertarik membuat tugas akhir dengan judul ”Perancangan Sistem Informasi SMA Negeri 5 Medan Berbasis Web ” . Perancangan Sistem Informasi SMA Negeri 5 Medan Berbasis Web ini berisi data dan informasi mengenai SMA Negeri 5 Medan yang terdiri dari data guru, data siswa, nilai, mata pelajaran, absensi, berita – berita mengenai kegiatan sekolah dan Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

mengenai perkembangan dunia pendidikan yang ada, serta jadwal pengajaran. Aplikasi ini dirancang oleh sistem operasi Windows XP SP2 yang didukung oleh software Web Server Apache, web scripting PHP dan MySQL sebagai Database server. Selain itu, aplikasi web ini juga didukung bahasa pemrograman web lainnya seperti HTML (Hypertext Markup Language), CSS (Cascading Style Sheets) serta menggunakan Website editor Macromedia Dreamweaver 8 sebagai aplikasi perancangan layout.

Administrator dalam aplikasi ini adalah anggota Tata Usaha yang diberi wewenang untuk mengatur jalannya aplikasi ini. Misalnya mengatur hak akses user. Pengguna / user yang kami maksud dalam aplikasi ini adalah siswa- siswi SMA Negeri 5 Medan yang diberi hak akses oleh administrator, hak akses yang diberikan oleh administrator adalah hanya untuk melihat data nilai, data jadwal, dan data absensi siswa- siswi tersebut.

Sehingga dapat mendukung peningkatan produktifitas dan

peningkatan kinerja SMA Negeri 5 Medan.

1.2 Identifikasi Masalah

Berdasarkan latar belakang di atas ada beberapa masalah yang melatar belakangi pembuatan aplikasi ini, diantaranya :

a. Pengelolaan data nilai, data jadwal, dan data absensi masih menggunakan sistem manual.


b. Masih kurangnya prediksi data nilai, data jadwal, dan data absensi siswa yang dapat membantu dalam pengolahan data akademik secara cepat, akurat dan terpercaya.

c. Laporan data hasil penilaian, absensi siswa, dan jadwal mata pelajaran yang masih manual.

1.3 Tujuan Masalah

Ada beberapa tujuan yang ingin dicapai setelah dibuatnya aplikasi ini yaitu:

a. Pengelolaan data nilai, data jadwal, dan data absensi menjadi sistematis.

b. Memberikan pengolahan data akademik secara cepat, akurat, dan terpercaya.

c. Memberikan hasil Laporan data hasil penilaian, absensi siswa, dan jadwal mata pelajaran menjadi lebih cepat dalam penyampaian laporan kepada pihak Kepala Sekolah.

1.4 Batasan Masalah


Dalam merancang Sistem Informasi ini terdapat beberapa batasan,yaitu:

a. Aplikasi Sistem Akademik ini merupakan aplikasi yang cukup sederhana, sehingga tidak terlalu banyak fitur di dalamnya.

b. Aplikasi ini hanya mengatur data nilai siswa, data absensi, dan data penjadwalan.

c. Aplikasi ini hanya khusus digunakan oleh kalangan sekolah saja termasuk siswa- siswi.

1.5 Metode Penelitian

Metode penelitian yang digunakan dalam penelitian ini terdiri dari 2 macam, yaitu :

1. Studi Pustaka

Studi pustaka dilakukan dengan cara mempelajari teori-teori literature dan buku-buku yang berkaitan dengan Tugas Akhir penulis.

2. Studi Lapangan

a. Interview (wawancara)

Yaitu pengumpulan data dengan cara mengadakan wawancara secara langsung kepada pihak yang terkait. Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

b. Observasi (pengamatan)

Yaitu teknik pengumpulan data secara langsung dilapangan sehingga memperoleh data yang lebih akurat dan keterangan yang cukup jelas.

1.6 Tinjauan Pustaka

Dalam pembuatan tugas akhir ini penulis mengunakan empat buku yang menjadi acuan dalam pembuatan tugas akhir, yaitu:

1. Peranginangin,Kasiman. 2006. Aplikasi Web dengan PHP dan MySQL. Yogyakarta:Penerbit Andi.

Dimana dalam buku ini menjadi acuan dalam pembuatan program yang menggunakan bahasa script PHP dalam pengembangan Web pada dokumen HTML.

2. Jogiyanto. 2005. Analisis dan Desain. Yogyakarta: Penerbit Andi. Buku ini menjadi tuntunan penulis dalam pembuatan sistem penulisan pada tugas akhir.

3. Kadir, Abdul. 1998. Basis Data. Yogyakarta : Penerbit Andi.


Buku ini menjadi acuan penulis dalam pembuatan database.

4. Selain ketiga buku di atas, penulis juga menggunakan beberapa pendukung lainnya yang menjadi referensi dalam pembuatan tugas akhir ini.

1.7 Sistematika Penulisan

Sistematika penulisan tugas akhir ini terdiri dari :

BAB 1

PENDAHULUAN

Bab ini berisikan mengenai latar belakang masalah, identifikasi masalah, tujuan masalah, batasan masalah, metode penelitian, tinjauan pustaka, dan sistematika penulisan.

BAB 2

LANDASAN TEORI

Pada bab ini diuraikan teori yang mendukung perancangan aplikasi ini.

BAB 3

GAMBARAN SEKILAS SMA NEGERI 5 MEDAN

Bab ini berisikan tentang profil SMA Negeri 5 Medan, struktur organisasi SMA Negeri 5 Medan, uraian tugas dan fungsi organisasi, serta visi, misi dan motto SMA Negeri 5 Medan.


BAB 4

PERANCANGAN SISTEM

Di dalam bab akan dijelaskan tentang penentuan

bentuk dari

kebutuhan aplikasi pada saat membangun maupun pada saat implementasi.

BAB 5

IMPLEMENTASI SISTEM

Bab ini menguraikan tentang definisi, tujuan, dan langkah-langkah dalam implementasi sistem juga disertai dengan komponen-komponen kebutuhan sistem.

BAB 6

KESIMPULAN DAN SARAN

Berisi pencapaian tujuan dari aplikasi yang dibuat. Saran berisi halhal yang dirasakan masih belum sempurna.

BAB 2

LANDASAN TEORI Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

2.1 Pengertian Komputer

Kata komputer berasal dari bahasa Inggris yaitu “to compute” yang artinya menghitung. Bila ditinjau dari asal kata maka komputer adalah alat hitung atau mesin hitung. Tentu saja orang berpandangan komputer sama dengan kalkulator. Pandangan ini tentunya salah karena komputer bukanlah kalkulator.

Menurut buku Computer Today (Donald H.Sanders), ”Komputer adalah sistem elektronik untuk memanipulasi data yang cepat dan tepat serta dirancang dan diorganisasikan supaya secara otomatis menerima dan menyimpan data input, memprosesnya dan menghasilkan output dibawah pengawasan suatu langkah instruksiinstruksi program yang tersimpan di memori”.

2.2 Pengertian Sistem

Fatansyah (Basis data 1999, hal 9), ”Sistem merupakan suatu tatanan yang terdiri atas sejumlah komponen fungsional (dengan satuan fungsi atau tugas khusus) yang saling berhubungan secara bersama-sama yang bertujuan untuk memenuhi suatu proses atau pekerjaan tertentu” .


Jogiyanto H.M (Pengenalan Komputer, 2000, hal 683), ” Sistem adalah suatu kesatuan yang terdiri dari dua atau lebih komponen atau subsistem yang saling berinteraksi untuk mencapai suatu tujuan” .

Dari beberapa uraian diatas mengenai defenisi sistem, penulis dapat menyimpulkan pengertian dari sistem yang berkaitan dengan judul, yaitu ”Sistem adalah suatu cara yang dibuat sedemikian rupa yang terdiri dari dua elemen atau lebih yang saling berhubungan untuk mengatasi masalah atau kendala-kendala yang terjadi dengan tujuan yang diinginkan.

2.3 Pengertian Informasi

Informasi didefenisikan sebagai sesuatu yang nyata atau setengah nyata yang dapat mengurangi derajat ketidakpastian tentang suatu keadaan atau kejadian (Analisi, Design, dan Implementasi Sistem Informasi, Henry C.Lucas Jr, Erlangga).

Jogiyanto H.M (Analisis Dan Desain Sitem Informasi Pendekatan Terstruktur Teori Dan Praktek Aplikasi Bisnis, 1989, hal 8), ”Informasi adalah data yang diolah menjadi bentuk yang lebih berguna dan lebih berarti menerimanya.

2.4 Pengertian Sistem Informasi


bagi yang

Sistem informasi adalah suau cara tertentu untuk menyediakan informasi yang dibutuhkan oleh organisasi untuk beroperasi dengan cara yang sukses dan untuk organisasi bisnis dengan cara yang menguntungkan. Dalam beberapa permasalahan sistem informasi selalu dititikberatkan kepada dan bagaimana dalam menghasilkan sebuah informasi dan saran apa yang harus dilengkapi sebagai pendukung yang handal. Perlu diperhatikan bahwa informasi yang digunakan di dalam suatu sistem informasi pada umumnya dapat digunakan.

Jogiyanto H.M (Analisa Dan Desain Sistem Informasi Pendekatan Terstruktur Teori Dan Praktek Aplikasi Bisnis, 1989, hal 11), ” Sistem Informasi adalah suatu sistem di dalam suatu organisasi yang mempertemukan kebutuhan pengolahan transaksi harian, bersifat manajerial dan kegiatan strategi dan suatu organisasi dan menyediakan pihak luar tertentu dengan laporan-laporan yang diperlukan” .

2.5 Syarat-Syarat Merancang Sistem Informasi Berbasis Web

Adapun syarat- syarat agar terbentuknya sebuah website adalah;

1. Tersedianya Web Server Baik web statis ataupun dinamis, jika ingin bisa online di internet, maka syarat pertama haruslah memiliki server, baik berupa hardware maupun software. Untuk hardware yaitu seperangkat komputer yang selalu terhubung online dengan internet. Untuk software, selain operating system, harus disediakan juga Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

software untuk web server itu sendiri. Untuk saat ini web server yang menjadi favorit adalah Apache.

2. Tersedianya Software Pemrograman Web Berbasis Server. Jika ingin membuat web, berarti harus tersedia sebuah bahasa pemrograman web selain HTML, baik itu client side maupun server side. Untuk yang client side, memiliki kekurangan yaitu instruksi program bisa terlihat oleh pengguna internet. Sedangkan server side lebih aman karena instruksi programnya tidak terlihat oleh user. Yang terlihat adalah seperti HTML biasa. Contoh bahasa pemrograman web yang favorit adalah PHP.

3. Tersedianya Database. Database merupakan software yang digunakan untuk menyimpan dan memanajemen data. Jika memiliki data yang sedikit, mungkin masih bisa memakai file biasa sebagai media penyimpanannya. Tapi jika datanya sudah sangat banyak, tanpa database akan sangat rumit. Database dapat menyimpan berjuta-juta data, dan dapat diakses dengan sangat cepat. Contoh database yang bisa dipakai untuk membuat web adalah Oracle, MsSQLServer, MySQL dan masih banyak lagi yang lain. Saat ini database yang menjadi favorit adalah MySQL.

2.6 Pengertian Internet


Internet adalah metode untuk menghubungkan berbagai komputer ke dalam satu jaringan komputer global, melalui protokol yang disebut Transmission Control Protocol/ Internet Protokol (TCP / IP). Protokol adalah suatu petunjuk yang menunjukkan pekerjaan yang akan pengguna lakukan dengan internet, apakah akan mengakses situs web melakukan transfer file, mengirim email dan sebagainya.

Sejarah Internet

Sejarah internet dimulai pada 1969 ketika Departemen Pertahanan Amerika memutuskan untuk mengadakan riset tentang bagaimana caranya menghubungkan sejumlah komputer sehingga membentuk jaringan organik. Program riset ini dikenal dengan nama ARPANET. Pada 1970, sudah lebih dari 10 komputer yang berhasil dihubungkan satu sama lain sehingga mereka bisa saling berkomunikasi dan membentuk sebuah jaringan.

Tahun 1972, Roy Tomlinson berhasil menyempurnakan program e-mail yang ia ciptakan setahun yang lalu untuk ARPANET. Program e-mail ini begitu mudah, sehingga langsung menjadi populer. Pada tahun yang sama, icon @ juga diperkenalkan sebagai lambang penting yang menunjukan "at" atau "pada". Tahun 1973, jaringan komputer ARPANET mulai dikembangkan meluas ke luar Amerika Serikat. Komputer University College di London merupakan komputer pertama yang ada di luar Amerika yang menjadi anggota jaringan ARPANET. Pada tahun yang sama, dua orang ahli komputer yakni Vinton Cerf dan Bob Kahn mempresentasikan Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

sebuah gagasan yang lebih besar, yang menjadi cikal bakal pemikiran internet. Ide ini dipresentasikan untuk pertama kalinya di Universitas Sussex. Hari bersejarah berikutnya adalah tanggal 26 Maret 1976, ketika Ratu Inggris berhasil mengirimkan email dari Royal Signals and Radar Establishment di Malvern. Setahun kemudian, sudah lebih dari 100 komputer yang bergabung di ARPANET membentuk sebuah jaringan atau network. Pada 1979, Tom Truscott, Jim Ellis dan Steve Bellovin, menciptakan newsgroups pertama yang diberi nama USENET. Tahun 1981 France Telecom menciptakan gebrakan dengan meluncurkan telpon televisi pertama, di mana orang bisa saling menelpon sambil berhubungan dengan video link. Karena komputer yang membentuk jaringan semakin hari semakin banyak, maka dibutuhkan sebuah protokol resmi yang diakui oleh semua jaringan.

Pada tahun 1982 dibentuk Transmission Control Protocol atau TCP dan Internet Protocol atau IP yang kini kita kenal semua. Sementara itu di Eropa muncul jaringan komputer tandingan yang dikenal dengan Eunet, yang menyediakan jasa jaringan komputer di negara-negara Belanda, Inggris, Denmark dan Swedia. Jaringan Eunet menyediakan jasa e-mail dan newsgroup USENET. Untuk menyeragamkan alamat di jaringan komputer yang ada, maka pada tahun 1984 diperkenalkan sistem nama domain, yang kini kita kenal dengan DNS atau Domain Name System. Komputer yang tersambung dengan jaringan yang ada sudah melebihi 1000 komputer lebih. Setahun kemudian alamat anggota jaringan mulai menggunakan alamat dengan akhiran .com.. Sistem alamat yang serba praktis ini langsung menggelumbungkan


jumlah komputer yang tersambung dengan jaringan. Pada 1987 jumlah komputer yang tersambung ke jaringan melonjak 10 kali lipat menjadi 10.000 lebih.

Tahun 1988, antar sesama komputer sudah mulai dapat mengobrol atau chatting, karena Jarko Oikarinen dari Finland berhasil menemukan dan sekaligus memperkenalkan IRC atau Internet Relay Chat. Setahun kemudian, jumlah komputer yang saling berhubungan kembali melonjak 10 kali lipat dalam setahun. Tak kurang dari 100.000 komputer kini membentuk sebuah jaringan. Tahun 1990 adalah tahun yang paling bersejarah, ketika Tim Berners Lee menemukan program editor dan browser yang bisa menjelajah antara satu komputer dengan komputer lainnya, yang membentuk jaringan itu. Program inilah yang disebut www, atau World Wide Web.

Tahun 1992, komputer yang saling tersambung membentuk jaringan sudah melampaui sejuta komputer, dan di tahun yang sama muncul istilah "surfing the internet". Tahun 1994, situs internet telah tumbuh menjadi 3.000 alamat halaman, dan untuk pertama kalinya virtual-shopping atau e-retail muncul di internet. Dunia langsung berubah. Di tahun yang sama Yahoo! Didirikan, yang juga sekaligus tahun kelahiran Netscape Navigator 1.0.

Setahun kemudian internet sudah menjadi jalur di mana suara, gambar, bisa streaming sekaligus. Tahun 1996 transaksi perdagangan di internet sudah mencapai satu milyar dollar AS. Tahun 1997 situs internet sudah melewati 1,2 juta. Nama domain business.com mencapai rekor penjualan 150.000 dollar AS. Tahun 1998, situs internet tumbuh menjadi 4,2 juta, dan nama domain yang terdaftar sudah melewati Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

angka dua juta. Tahun 1999 nama domain business.com terjual kembali 7,5 juta dollar AS. Tahun 2000 situs internet sudah melewati 21,1 juta.

2.7 Pengertian Web Server

Web server adalah perangkat lunak server yang berfungsi menerima permintaan HTTP atau HTTPS dari client yang dikenal dengan nama web browser dan akan mengirim kembali hasilnya dalam bentuk halaman – halaman web yang umumnya berbentuk dokomen HTML. Salah satu web server yang banyak dipakai adalah Apache. Apache merupakan web server antara platform yang dapat berjalan di beberapa flatfrom seperti Linux dan Windows.

2.8 HTML (HyperText Markup Language)

2.8.1 Pendahuluan HTML

HTML atau yang memiliki kepanjangan Hypertext Markup Language adalah script dimana kita bisa menampilkan informasi dan daya kreasi kita lewat internet. HTML sendiri adalah suatu dokumen teks biasa yang mudah dimengerti dibanding bahasa pemrograman lainnya, dan karena bentuknya itu maka HTML dapat dibaca oleh berbagai platform seperti :Windows, Linux, Macintosh. Kata “Markup Language“ pada HTML menunjukkan fasilitas yang berupa tanda tertentu dalam skrip HTML


dimana kita bisa mengatur judul, garis, tabel, gambar, dan lain-lain dengan perintah yang telah ditentukan pada elemen HTML.

2.8.2 Bagian-Bagian HTML

HTML terdiri dari beberapa bagian yang fungsinya sebagai penanda suatu kelompok perintah tertentu, misalnya kelompok perintah form yang ditandai dengan kode
, judul dengan dan sebagainya. Untuk lebih lanjut mengenai bagianbagian HTML perhatikan skema dibawah ini :<br /> <br /> <html> <head> <title>… … isi dari halaman web …

Keterangan:

1. Dokumen HTML selalu diawali dengan tanda tag pembuka dan diakhiri dengan tag penutup .


2. Pada elemen head , dapat kita sisipkan kode-kode untuk menuliskan keterangan tentang dokumen HTML, atau dapat juga kita sisipkan scripts-scripts pemograman web seperti JavaScript, VBScripts, atau CSS untuk menambah daya tarik pada situs yang kita buat agar lebih menarik dan dinamis.

3. Elemen berisi tag-tag untuk isi atau layout tampilan pada situs, seperti : , ,
, ,
. Tag adalah kode-kode yang digunakan untuk mem_setting dokumen HTML. Secara garis besar bentuk umum tag adalah sebagai berikut : TEKS.Namun ada juga tag yang tidak perlu ada tag penutup seperti
,
, , dan lain-lain sebagainya.

2.9 Pengenalan PHP (Personal Home Page)

2.9.1 Sejarah PHP

Hypertex

Preprocessor (PHP) adalah skrip yang berjalan pada server side yang

ditambahkan dalam HTML. PHP itu sendiri merupakan singkatan dari Personal Home Page Tools. Skrip ini akan membuat suatu aplikasi yang dapat diintegrasikan kedalam HTML sehingga suatu halaman HTML tidak lagi bersifat statis, namun menjadi bersifat dinamis. Sifat server side membuat pengerjaan skrip tersebut dikerjakan di


server sedangkan yang dikirimkan kepada browser adalah hasil proses dari skrip tersebut yang sudah berbentuk HTML.

PHP dibuat pada tahun 1994 oleh Rasmus Lerdof. Tetapi dikembangkan oleh orang lain dan setelah melalui tiga kali karya penulisan, akhirnya PHP menjadi bahasa pemograman Web. PHP adalah sebuah produk yang berbentuk open source, sehingga source code-code dari PHP dapat digunakan, diganti, diedit tanpa harus membayar atau dikenakan biaya.

2.9.2 Kelebihan dan Kelemahan PHP

Kelebihan PHP sebagai bahasa server-side adalah :

1. Bahasa pemrograman PHP adalah sebuah bahasa script yang tidak melakukan sebuah kompilasi dalam penggunaanya.

2. Web Server yang mendukung php dapat ditemukan dimana - mana dari mulai IIS sampai dengan apache, dengan configurasi yang relatif mudah.

3. Dapat digunakan di berbagai mesin (linux, unix, windows) dan dapat dijalankan secara runtime melalui console serta juga dapat menjalankan perintah-perintah sistem.


Adapun Kelemahan PHP adalah :

1.

Tidak ideal untuk pengembangan skala besar.

2.

Tidak bisa memisahkan antara tampilan dengan logik dengan baik (walau penggunaan template dapat memperbaikinya).

3.

PHP memiliki kelemahan security tertentu apabila programmer tidak jeli dalam melakukan pemrograman dan kurang memperhatikan isu dan konfigurasi PHP.

2.9.3 Penggabungan Script PHP dan HTML

Bahasa pemrograman PHP dapat digabungkan dengan HTML dengan terlebih dahulu memberikan tanda tag buka dilanjutkan tanda tanya ( ). Ada dua tipe penggabungan antara PHP dan HTML yaitu:

1. Embedded Script Yakni penulisan tag PHP di sela-sela tag HTML. Dengan cara ini, penulisan tag PHP digunakan untuk mengapit bagian-bagian tertentu dalam dokumen yang memerlukan script PHP untuk proses di dalam server. Embedded Script menempatkan sebagai bagian dari script HTML.


Contoh penulisan Embedded Script dapat dilihat di bawah ini : Testing

2. Non Embedded Script Yakni cara penulisan tag PHP dibagian paling awal dan paling akhir dokumen. Dengan cara ini, penulisan tag PHP digunakan untuk mengawali dan mengakhiri keseluruhan bagian dalam sebuah dokumen. Non Embedded Script menempatkan script HTML sebagai bagian dari script PHP. Contoh Penulisan Non Embedded Script dapat dilihat dibawah ini : ’; echo ’’; echo ‘Testing’; echo ‘ ’; echo ‘Halo Dunia’;


echo ‘’; echo ’’; ?>

2.10 Pengenalan MySQL

MySQL adalah sebuah aplikasi Relational Database Managemen Server (RDBMS). Dengan menggunakan MySQL server, maka data dapat diakses oleh banyak pemakai secara bersamaan. MySQL menggunakan bahasa SQL ( structure Query Language ) yaitu bahasa pemrograman standar yang digunakan untuk mengakses server database.

Tiap database memiliki tabel-tabel, tiap table memiliki field-field. Umumnya informasi tersimpan dalam tabel-tabel yang secara logis merupakan struktur-struktur dimensi terdiri atas baris dan kolom. Field-field tersebut dapat berupa data seperti int, real, char, date, time, dan lainnya.

MySQL memiliki keunggulan, diantaranya :

a. Bekerja pada berbagai plat form ( tersedia berbagai versi untuk berbagai sistem operasi ).

b. Pengaksesan database dapat dilakukan dengan mudah.

c. Memiliki jenis kolom yang cukup banyak sehingga memudahkan konfigurasi sistem database.


d. Mendukung record yang memiliki kolom dengan panjang tetap atau panjang bervariasi, dan masih banyak keunggulan lainnya.

e. MySQL dan PHP saling terintegrasi , maksudnya adalah pembuatan data base dengan menggunakan sintak PHP dapat dibuat. Sedangkan input yang dimasukkan melalui aplikasi web yang menggunakan skrip server side seperti PHP dapat langsung dimasukkan ke data base MySQL yang ada di server dan tentunya web tersebut berada di sebuah web server.

Pemakaian Dasar SQL

Pemakaian dasar SQL adalah sebagai berikut:

1. Mendefinisikan Tabel CREATE TABLE NAMA_TABLE (DEFINISI_TABLE); Contoh: CREATE TABLE MAHASISWA ( NAMA VARCHAR(20), ALAMAT VARCHAR(255), PASSWORD VARCHAR(10) );

2. Menyimpan data INSERT INTO NAMA_TABLE (DAFTAR_FIELD) VALUES (DAFTAR_NILAI); Contoh: INSERT INTO MAHASISWA (NAMA, ALAMAT, PASSWORD) VALUES ('ade, 'jl. Ar. Gg. Seto no. 12', '20216');


3. Mengambil data SELECT DAFTAR_FIELD FROM NAMA_TABLE KONDISI; Contoh: SELECT NAMA FROM MAHASISWA;

4. Mengubah data UPDATE NAMA_TABEL SET DATA_FIELD_LAMA WHERE DATA_FIELD_BARU; Contoh:UPDATE MAHASISWA SET nama = 'ade' WHERE nama = 'delia';

5. Menghapus data DELETE FROM NAMA_TABLE KONDISI Contoh: DELETE FROM MAHASISWA WHERE NAMA='ade';

2.11 Pengenalan CSS (Cascading Style Sheet)

Sebagai pelengkap pada HTML. Dan tugas utama CSS adalah adalah menetapkan aturan tampilan/style yang akan digunakan pada sebuah website. CSS dapat mengubah besar kecilnya text, mengganti warna background pada sebuah halaman, atau dapat pula mengubah warna border pada tabel, dan masih banyak lagi hal yang dapat dilakukan oleh CSS. Singkatnya, CSS digunakan untuk mengatur susunan tampilan pada halaman HTML.


2.12 Pengenalan Macromedia Dreamweaver 8

Macromedia Dreamweaver adalah sebuah editor HTML profesional untuk mendesain secara visual dan mengelola situs Web maupaun halaman Web.Saat ini Dreamweaver merupakan software utama yang digunakan oleh web desainer maupun web programmer dalam membangun suatu situs web. Dreamweaver memberikan kemudahan bagi penggunanya dalam menentukan ruang kerja yang diinginkan.Tipe ruang kerja ditentukan berdasarkan kebutuhan maupun kebiasaan pemakainya. Ruang kerja, fasilitas dan kemampuan Dreamweaver mampu meningkatkan produktivitas dan efektifitas dalam desaian maupun dalam membangun sebuah situs web (Isak Rickyanto, 2002).

Macromedia Dreamweaver 8 telah mengalami banyak perbaikan dan peningkatan dari versi sebelumnya, yang mana user interface yang lebih baik dari versi 4, kerena adanya peningkatan kemampuan toolbar sehingga dapat memakai toolbar yang sudah ada atau menambahkan fungsi baru.


BAB 3

SEKILAS TENTANG SMA NEGERI 5 MEDAN

3.1 Profil SMA Negeri 5 Medan

SMA Negeri 5 Medan berada di Jalan Pelajar No.17 Medan. Sekolah ini didirikan pada tahun 1963. Seperti sekolah-sekolah lain pada umumnya memiliki ruang kelas untuk kegiatan belajar mengajar siswa-siswanya serta dukungan laboratorium untuk pelaksanaan praktikum. Untuk pelaksanaan kegiatan olah raga sekolah ini sudah dilengkapi dengan lapangan basket, lapangan volley dan lapangan futsal, serta lapangan untuk lompat jauh. Untuk mendukung kegiatan siswa dalam belajar terdapat perpustakaan, laboratorium komputer, laboratorium bahasa dan laboratorium IPA serta fasilitas lainnya untuk menunjang kegiatan belajar siswa dengan tidak mengesampingkan moral dan ahlak siswa dengan adanya tempat ibadah seperti mushola dan kegiatan-kegiatan keagamaan seperti pesantren kilat dan kebangkitan rohani yang diharapkan mampu meningkatkan akhlak dan moral siswa.


3.2 Struktur Organisasi

Komite Sekolah H. Firdaus Nasution

Kepala Sekolah Drs. Salmi Effendi, M.Pd

Tata Usaha Drs. L. Hasibuan

Bidang Kurikulum Drs. M. Nainggolan

Bidang SAR / PRA H. Nilam Cahaya, Spd

Bidang Kesiswaan Drs. H. Simamora

Wali Kelas

BP / BK Kood. P. Siahaan

Siswa / i

Gambar 3.1 Struktur Organisasi SMA Negeri 5 Medan


Bidang HUMAS Drs. Zulkifli Lbs

3.3 Uraian Tugas dan Fungsi Organisasi

3.3.1 Kepala Sekolah

Kepala Sekolah berfungsi dan bertugas sebagai edukator, manejer, administrator, supervisor serta pemimpin / Leader inovator.

3.3.2 Wakil Kepala Sekolah

Wakil Kepala Sekolah bertugas membantu Kepala Sekolah dalam kegiatan:

1. Menyusun kurikulum. 2. Mengatur segala program kesiswaan. 3. Merencanakan kebutuhan sarana dan prasarana. 4. Mengatur dan mengembangkan hubungan dengan masyarakat. 5. Mengatur dan mengawasi penyelenggaraan program pendidikan. 6. Mengatur mutasi siswa. 7. Menyusun program kegiatan ekstrakurikuler. 8. Mengatur penyusunan bahan pengajaran dan pengembangan kurikulum.


3.3.3 Tata Usaha

Kepala Tata Usaha mempunyai tugas melaksanakan ketatausahaan sekolah dan bertanggung jawab kepada kepala sekolah dalam kegiatan-kegiatan sebagai berikut:

1. Penyusunan program kerja tata usaha sekolah. 2. Pengolahan keuangan sekolah. 3. Penyusunan administrasi perlengkapan sekolah. 4. Penyusunan laporan pelaksanaan kegiatan pengurusan ketatausahaan secara umum.

3.3.4 Komite Sekolah

Membantu sekolah dalam hal:

1. Peningkatan kegiatan sekolah. 2. Peningkatan kesejahteraan guru dan pegawai.

3.3.5 Bidang Sarana dan Prasarana

Tugas yang dilakukan disini adalah:

1. Pembangunan sarana dan prasarana.


2. Pengawasan dalam hal sarana dan prasarana yang ada. 3.3.6 Bidang Kurikulum

Membantu Kepala Sekolah dalam hal:

1. Pelaksanaan kur ikulum. 2. Pemberian tugas guru. 3. Mengawas jadwal pelaksanaan KBM. 4. Administrasi kurikulum dan penelitian. 5. Konsultasi dengan Kepala Sekolah.

3.3.7 Bidang Kesiswaan

Membantu Kepala Sekolah dalam bidang:

1. Pembinaan disiplin sekolah. 2. Koordinator pembinaan siswa. 3. Koordinator pelaksana kegiatan intra / ekstrakulikuler. 4. Koordinator kegiatan sekolah.

3.3.8 Bidang Humas (Hubungan Masyarakat)

Membantu Kepala Sekolah dalam hal:


1. Hubungan sekolah, masyarakat , dan pemerintah. 2. Hubungan sekolah dengan perguruan tinggi. 3. Penelusuran tamatan. 4. Penelitian 5. Konsultasi dengan Kepala Sekolah.

3.3.9 Guru

Guru bertanggung jawab kepada kepala sekolah dan mempunyai tugas melaksanakan kegiatan proses belajar mengajar secara efektif dan efisien.

3.3.10 Wali Kelas

Membantu kepala sekolah dalam kegiatan:

1. Pengelolaan kelas. 2. Penyelenggaraan administrasi kelas. 3. Pembuatan catatan khusus tentang siswa. 4. Penyusunan statistik bulanan siswa. 5. Penyusunan nilai siswa.


3.3.11 Guru Pembimbing dan Konseling (BP / BK)

Bertugas

membantu

Kepala

Sekolah

dalam

penyusunan

dan

pelaksanaan

pembimbingan dan konseling di sekolah.

3.4 Visi, Misi, dan Motto Sekolah

3.4.1 Visi Sekolah

Mempersiapkan lulusan sebagai calon pemimpin yang memiliki wawasan iman dan taqwa (IMTAK) serta IPTEK yang handal, berbudi pekerti luhur, daya juang kuat, integritas tinggi, berwawasan lingkungan mandiri serta mempunyai kemampuan intelektual (IQ), kemampuan emosional (EQ) dan kemampuan spiritual (SQ) yang tinggi serta kepribadian utuh dan kokoh.

3.4.2 Misi Sekolah

1. Mewujudkan kultur lingkungan belajar yang aman, tentram, nyaman dan kondisif. 2. Menyiapkan para lulusan terampil dan mampu berkomunikasi bahasa inggris dan mengoperasikan komputer secara maksimal. 3. Mewujudkan sekolah yang efektif, yang memiliki profil kuat, mandiri, kreatif, krisis dan inofatif.


4. Menyiapkan lulusan yang potensial, sehingga mampu meraih kursi di perguruan tinggi negeri yang favorit sesuai dengan apa yang didambakan oleh setiap siswa. 5. Memepersiapkan lulusan yang memiliki skil (keterampilan) bagi yang ingin terjun ke dunia kerja.

3.4.3 Motto Sekolah

R

: Rapi

E

: Elok

F

: Familiar

O

: Orangnya

R

: Ramah

M

: Menyenangkan

A

: Aman

S

: Serasi

I

: Indah


BAB 4 PERANCANGAN SISTEM

4.1 Perancangan Sistem

Tahap perancangan merupakan tahap awal yang dilakukan penulis dalam membangun situs web. Pada tahap ini penulis akan menjabarkan awal perancangan sistem, diagram alur, tujuan dan isi yang akan dibangun. Situs ini sendiri dirancang dengan menggunakan PHP sebagai bahasa pemogramannya, MySQL sebagai databasenya serta Dreamweaver 8 sebagai media untuk membuat layoutn dari situs yang telah dirancang.

Sebelum membangun sebuah situs, ada beberapa pertanyaan sebagai identifikasi awal yang perlu dilakukan,antara lain:

1. Website apa yang akan dibuat? 2. Siapa saja pengunjung yang diharapkan berkunjung ke website tersebut? 3. Kegiatan apa saja yang dapat pengunjung lakukan didalam website tersebut? 4. Apa target yang ingin dicapai dari pembuatan website tersebut?


Dengan menjawab pertanyaan-pertanyaan di atas, maka akan semakin memperjelas dan mempermudah dalam membangun situs website tersebut. Sesuai dengan website yang akan dibuat, maka jawaban untuk pertanyaan-pertanyaan di atas sebagai berikut:

1. Situs akan dibuat adalah sistem informasi berbasis web yang menyediakan segala informasi-informasi tentang sekolah tersebut, artikel mengenai pendidikan dan kegiatan yang dilakukan sekolah.

2. Pengunjung dari website tersebut diharapkan adalah para siswa siswi, guru, pegawai dan alumni dari SMA Negeri 5 Medan serta masyarakat luas yang ingin tahu mengenai segala sesuatu tentang sekolah ini.

3. Aktivitas yang akan dijumpai di dalam situs tersebut adalah pengunjung dapat mengetahui segala informasi mengenai SMA Negeri 5 Medan, informasi tentang dunia pendidikan ataupun berita terkini, mengetahui nilai siswa.data siswa,serta informasi penting lainnya.

4. Target yang ingin dicapai dari situs tersebut adalah dapat memberikan kemudahan bagi para siswa dalam memperoleh informasi yang dibutuhkan serta dapat membantu sekolah dalam mempromosikan sekolahnya.


4.2 Perancangan Struktur Menu Utama

Tahap selanjutnya adalah pembuatan struktur menu yamg meliputi dari situs tersebut, sebagai gambaran yang menampilkan struktur hirarki dan isi halaman perhalaman dan membantu dalam menggambarkan isi dari setiap halaman dan link atau navigasi antara halaman-halaman didalam situs website tersebut.

Adapun bentuk struktur menu utama dari situs sekolah yang penulis buat ditunjukkan pada gambar dibawah ini:

Sistem web Sma Negeri 5 Medan

Menu Pengunjung

Menu Administrator

Menu Siswa

Menu Guru

Akses guestbook

Lihat data siswa dan data guru

Tambah data siswa dan data guru

Lihat absensi

Lihat absensi

Lihat guestbook

Lihat absen siswa dan absen guru

Tambah absen siswa dan absen guru

Lihat nilai

Lihat nilai

Lihat news

Lihat data kelas

Tambah data kelas

Lihat jadwal

Lihat jadwal

Lihat visi misi

Lihat data nilai

Tambah data nilai

Lihat Profil

Lihat Profil

Lihat profil

Lihat data jadwal

Tambah data jadwal

Lihat data profil

Tambah data profil

Lihat data agenda

Tambah data agenda

Lihat data visi dan misi

Tambah data visi dan misi

Lihat data berita

Tambah data berita


Gambar 4.1 Struktur Menu Utama

Struktur menu untuk aplikasi ini meliputi 4 user yaitu : Administrator, Pengunjung, Guru, dan Siswa, masing – masing user tersebut memiliki tugas sebagai berikut :

a. Administrator mempunyai tugas untuk mengelola nilai siswa, jadwal dan absensi siswa dan guru, tidak hanya itu admin juga dapat melihat apakah sistem yang di buat dapat berjalan dengan ketentuan.

b. Pengunjung yang penulis maksud disini selain para siswa-siswi dan juga guru tapi juga terdapat pengunjung umum yang hannya dapat memperoleh informasi yang disajikan pada website tersebut.Pengunjung umum hannya dapat melihat isi dari website tersebut tanpa dapat mengubah,menambah, dan menghapus isi dari website tersebut.

c. Guru mempunyai tugas memberikan nilai kepada siswa, mengabsen siswa, memberikan penilaian ujian siswa. Data- data ini diberikan kepada tata usaha untuk diinputkan kedalam database yang nantinya berguna untuk siswa untuk melihat data- data tersebut

d. Siswa dapat melihat data nilai siswa yang telah diberikan guru kepada tata usaha (yang berperan sebagai admin), melihat data absensi siswa, melihat


profil siswa dan melihat jadwal pelajaran yang akan dilaksanakan seharihari.

4.3 Perancangan Halaman Website

Adapun halaman - halaman yang dibangun oleh penulis adalah:

a. Halaman index merupakan halaman yang pertama kali muncul pada saat website dibuka. Halaman ini berisikan artikel dan link-link menuju halaman berikutnya.

b. Halaman home merupakan halaman yang berisikan tentang kata sambutan dari pihak sekolah serta link-link menuju halaman berikutnya.

c. Halaman profil merupakan halaman yang berisikan tentang sejarah singkat dan motto SMA Negeri 5 Medan.

d. Halaman berita merupakan halaman yang berisikan informasi, diantaranya mengenai pendidikan ataupun berita terkini.

e. Halaman visi misi merupakan halaman berisikan tentang visi dan misi SMA Negeri 5 Medan.

f. Halaman Guestbook merupakan halaman dikhususkan bagi pengunjung yang ingin memberikan komentar mengenai situs website tersebut.


g. Halaman admin merupakan halaman yang hanya dapat diakses oleh admin yang mempunyai tugas untuk mengola nilai siswa, jadwal, absensi, dan tidak hanya itu admin juga dapat melihat apakah sistem yang di buat dapat berjalan dengan ketentuan atau tidak.

h. Halaman Guru merupakan halaman yang hannya diakses oleh guru yang memiliki username dan password, dan disini guru mempunyai tugas memberikan nilai kepada siswa, mengabsen siswa, memberikan penilaian ujian siswa. Data- data ini diberikan kepada tata usaha atau yang berperan untuk diinputkan kedalam database yang nantinya berguna untuk siswa untuk melihat data- data tersebut.

i.

Halaman Siswa hannya dapat diakses oleh siswa yang memiliki username dan password. Halaman ini siswa dapat melihat data nilai siswa yang telah diberikan guru kepada tata usaha tersebut, melihat data absensi siswa, melihat profil siswa dan melihat jadwal pelajaran yang akan dilaksanakan seharihari.

4.4 Perancangan User Interface

Tampilan utama situs ini dirancang dengan bantuan software dreamweaver 8. Perancangan tampilan utama pada situs ini dibagi menjadi dua bagian yaitu header dan isi halaman. Header adalah merupakan dari halaman yang terletak pada bagian


atas yang berisikan logo, sedangkan bagian isi adalah bagian terpenting karena merupakan tempat menampilkan informasi yang akan disampaikan.

4.4.1 Perancangan Halaman Utama Website

Logo

Header

Administrator Guestbook Home News Guestbook

NNNN

Sumber Inspirasi

VisiNews dan Misi Profil Visi dan Misi Profil

Login

HALAMAN UTAMA

Agenda Kegiatan

Gambar Polling

Pengunjung FOOTER

Gambar 4.2 Perancangan Halaman Utama Website

a. Penjelasan Rancangan Halaman Utama Website

Tabel 4.1 Penjelasan Peancangan Halaman Utama Website Item Logo Menu Link

Keterangan Bagian yang berisi bagian gambar dan logo tutwuri handayani Button yang apabila di klik akan mengelink ke website yang


dituju Button yang apabila di klik akan mengelink ke halaman home pada web Button yang apabila di klik akan mengelink ke halaman guestbook

Home Guestbook

Tabel 4.1 Penjelasan Perancangan Halaman Utama Website (Sambungan)

News Visi dan Misi Profil Gambar Pengunjung Halaman Utama Login Sumber inspirasi Agenda kegiatan Polling Footer

Button yang apabila di klik akan mengelink ke halaman berita Button yang apabila di klik akan mengelink ke halaman visi misi Text box yang berisi informasi mengenai profil SMA Negeri 5 Medan Bagian gambar sekolah, laboraturium komputer dan perpustakaan. Text yang bertuliskan jumlah pengunjung dan pengunjung ke berapa. Text yang menampilkan menu- menu utama yang berada di tengah- tengah web ini Bagian untuk masuk sebagai admin, guru, dan siswa. Text yang menampilkan inspirasi- inspirasi mengenai sumber acuan kehidupan Berisi agenda kegiatan yang akan diadakan oleh SMA Negeri 5 Medan. Berisi polling yang memuat seberapa besar web ini. Teks yang berisi copyrigth pembuat web

b. Algoritma Umum Halaman Utama Website

Tabel 4.2 Algoritma Umum Halaman Utama Website

Proses Guestbook

Data in Data guestbook

Data out Informasi Data guestbook

Logika Proses If (login=halaman utama)and (pilihan=guestbook) then Tampilan halaman guestbook


News

Data news

Informasi data news If (login=halaman utama) and (pilihan=news) then Tampilan halaman news

Tabel 4.2 Algoritma Umum Halaman Utama Website (Sambungan)

Visi dan Misi

Data Visi dan Misi

Informasi Visi dan Misi

Profil

Data profil

Informasi profil

If (login=halaman utama) and (pilihan=visi dan misi) then Tampilan halaman visi dan misi If (login=halaman utama) and(pilihan=profil) then Tampilan halaman profil

4.4.2 Perancangan Halaman Utama Admin


HEADER Tulisan berjalan

Menu Utama >> M Lihat Tabel >>

mmkmkm MENU UTAMA ADMINISTRATOR

MM >> Tambah Data

Nasihat

Created By Ade Yulia Sari

Gambar 4. 3 Perancangan Halaman Utama Admin

a. Penjelasan Peancangan Halaman Utama Admin

Tabel 4.3 Penjelasan Perancangan Halaman Utama Admin

Item Header Lihat tabel Tambah data

Menu utama Tulisan berjalan Logout

Keterangan Bagian yang berisi bagian nama dan logo sma negeri 5 medan Button yang apabila di klik akan mengelink ke halaman lihat tabel, terdapat beberapa menu di lihat tabel ini Button yang apabila di klik akan mengelink ke halaman tambah data, didalamnya terdapat beberapa menu untuk tambah data Button yang apabila di klik akan mengelink ke halaman home admin Teks yang berisi tulisan berjalan. Button yang apabila di klik akan keluar dari halaman Admin dan akan kembali kemenu utama


b. Algoritma Umum Halaman Utama Admin

Tabel 4.4 Algoritma Halaman Utama Admin

Proses Lihat table

Data in - Hak akses admin - Lihat tabel

Data out -Data lihat table

Tambah data

-Hak akses admin - Tambah Data

-Informasi Pengolahan tambah data

Logika Proses If (login=admin) and (pilihan= lihat tabel) then Tampilan halaman Lihat tabel If (login=admin) and(pilihan=tambah data) then Tampilan halaman tambah data

4.4.3 Perancangan Halaman Utama Siswa


HEADER Tulisan berjalan Menu LOGOUT Menu

M

mmkmkm MENU UTAMA SISWA

Home MM Absensi Nilai Jadwal P

Created By Ade Yulia Sari Profil Gambar 4.4 Perancangan Halaman Utama Siswa

a. Penjelasan Perancangan Halaman Utama Siswa

Tabel 4.5 Penjelasan Perancangan Halaman Utama Siswa

Item Header Logout Home Absensi Nilai Jadwal Profil

Keterangan Bagian yang berisi bagian nama dan logo sma negeri 5 medan Button yang apabila di klik akan keluar dari halaman siswa dan akan kembali ke menu utama Button yang apabila di klik akan mengelink ke halaman utama siswa Button yang apabila di klik akan mengelink ke halaman absensi siswa Button yang apabila di klik akan mengelink ke halama nilai siswa Button yang apabila di klik akan mengelink ke halama jadwal mata pelajaran siswa Button yang apabila di klik akan mengelink ke halama profil siswa

b. Algoritma Umum Halaman Utama Siswa Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Tabel 4.6 Algoritma Umum Halaman Utama Siswa

Proses

Data in

Data out

Logika Proses

Absensi

-Hak akses admin - lihat absensi

- informasi Pengolahan data absensi

If (login=guru) and (pilihan= lihat tabel) then Tampilan halaman Lihat absensi

Nilai

-Hak akses admin - lihat nilai

-informasi Pengolahan data nilai

If (login= guru) and (pilihan=tambah data) then Tampilan halaman lihat nilai

Jadwal

-Hak akses admin - lihat jadwal

-informasi Pengolahan data jadwal pelajaran

If (login= guru) and (pilihan=tambah data) then Tampilan halaman lihat jadwal pelajaran

Profil

-Hak akses admin - lihat profil

-informasi Pengolahan data profil

If (login= guru) and (pilihan=tambah data) then Tampilan halaman lihat profil

4.4.4 Perancangan Halaman Utama Guru


Header Tulisan berjalan Menu LOGOUT Menu Home Absensi Nilai

Tabel 4.6 Algoritma Umum halaman guru HALAMAN UTAMA GURU Created By Ade Yulia Sari

Jadwal Profil

Created By Ade Yulia Sari

Gambar 4.5 Perancangan Halaman Utama Guru

a. Penjelasan Perancangan Halaman Utama Guru

Tabel 4.7 Penjelasan Perancangan Halaman Utama Guru

Item Header Logout Home Absensi Nilai Jadwal Profil

Keterangan Bagian yang berisi bagian nama dan logo sma negeri 5 medan Button yang apabila di klik akan keluar dari halaman guru dan akan kembali ke menu utama Button yang apabila di klik akan mengelink ke halaman utama guru Button yang apabila di klik akan mengelink ke halama absensi guru Button yang apabila di klik akan mengelink ke halama nilai guru Button yang apabila di klik akan mengelink ke halaman jadwal mata pelajaran siswa Button yang apabila di klik akan mengelink ke halaman profil siswa

b. Algoritma Umum Halaman Utama Guru


Tabel 4.8 Algoritma Umum Halaman Utama Guru

Proses

Data in

Data out

Absensi

-Hak akses admin - lihat absensi

- informasi Pengolahan data absensi

Nilai

-Hak akses admin - lihat nilai

-informasi Pengolahan data nilai

Jadwal

-Hak akses admin - lihat jadwal

-informasi Pengolahan data jadwal pelajaran

Profil

-Hak akses admin - lihat profil

-informasi Pengolahan data profil

Logika Proses If (login=guru) and (pilihan= lihat tabel) then Tampilan halaman Lihat absensi If (login= guru) and (pilihan=tambah data) then Tampilan halaman lihat nilai If (login= guru) and (pilihan=tambah data) then Tampilan halaman lihat jadwal pelajaran If (login= guru) and (pilihan=tambah data) then Tampilan halaman lihat profil

Tabel 4.9 Algoritma Login Admin Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Nama Modul Login Administrator

Algoritma

Deskripsi Sistem melakukan validasi atas user yang masuk ke dalam sistem dengan mencocokkan id dan password dari inputan dengan id dan password serta hak akses pada database Mulai Masukkan id dan password Identifikasi id dan password If id dan password valid then Masuk ke halaman administrator Else Muncul pesan “Login Gagal,username dan password tidak benar” Kembali ke halaman login Endif Selesai

Tabel 4.10 Algoritma Login Guru

Nama Modul Login Guru

Algoritma

Deskripsi Sistem melakukan validasi atas user yang masuk ke dalam sistem dengan mencocokkan id dan password dari inputan dengan id dan password serta hak akses pada database Mulai Masukkan id dan password Identifikasi id dan password If id dan password valid then Masuk ke halaman guru Else Muncul pesan “Login Gagal,username dan password tidak benar” Kembali ke halaman login Endif Selesai

Tabel 4.11 Algoritma Login Siswa Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Nama Modul Login Siswa

Algoritma

Deskripsi Sistem melakukan validasi atas user yang masuk ke dalam sistem dengan mencocokkan id dan password dari inputan dengan id dan password serta hak akses pada database Mulai Masukkan id dan password Identifikasi id dan password If id dan password valid then Masuk ke halaman siswa Else Muncul pesan “Login Gagal,username dan password tidak benar” Kembali ke halaman login Endif Selesai

Tabel 4.12 Algoritma Pengolahan Jadwal Nama Modul Pengolahan Data User

Algoritma

Deskripsi Dalam proses ini Administrator dapat melakukan penambahan, pengubahan, dan penghapusan data mengenai user. Mulai Masukkan id dan password Identifikasi id dan password If id dan password valid then Masuk ke halaman Administrator Pilih menu Tambah data Klik link jadwal Masukkan id kelas, nama mata pelajaran,nama guru,hari, jam,id semester If input valid then Muncul pesan “input data berhasil” Kembali ke halaman Daftar User endif Else Kembali ke halaman admin Endif

Tabel 4.13 Algoritma Pengolahan Absensi Siswa Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Nama Modul Pengolahan Absensi Siswa

Algoritma

Deskripsi Dalam proses ini admin dapat melakukan penambahan, pengubahan, dan penghapusan data mengenai absensi siswa. Mulai Masukkan id dan password Identifikasi id dan password If id dan password valid then Masuk ke halaman Absensi siswa Pilih menu Tambah data Klik link data absensi siswa Masukkan nis,tahun, hari, id kelas, semester, id matpel, keterangan. If input valid then Muncul pesan “input data berhasil” Kembali ke halaman Daftar Absensi siswa endif Else Kembali ke halaman admin Endif Selesai

Tabel 4.14 Algoritma Pengolahan Nilai Siswa

Nama Modul Pengolahan Nilai siswa

Deskripsi Dalam proses ini admin dapat melakukan penambahan, pengubahan, dan penghapusan data mengenai nilai siswa. Algoritma Mulai Masukkan id dan password Identifikasi id dan password If id dan password valid then Masuk ke halaman Administrator Pilih menu Daftar Tambah data Klik link data nilai Masukkan nis, id matpel, id semester, tahun, uas, uts, uh. If input valid then Muncul pesan “input data Tabel 4.14 Algoritma Pengolahan Nilai Siswa (Sambungan) Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

berhasil” Kembali ke halaman Daftar nilai siswa endif Else Kembali ke halaman admin Endif Selesai

Tabel 4.15 Algoritma Pengolahan Absensi Guru

Nama Modul Pengolahan Absensi Guru

Algoritma

Deskripsi Dalam proses ini admin dapat melakukan penambahan, pengubahan, dan penghapusan data mengenai absensi guru Mulai Masukkan id dan password Identifikasi id dan password If id dan password valid then Masuk ke halaman Absensi siswa Pilih menu Tambah data Klik link data absensi guru Masukkan nis,tahun, hari, id kelas, semester, id matpel, keterangan. If input valid then Muncul pesan “input data berhasil” Kembali ke halaman Daftar Absensi guru endif Else Kembali ke halaman admin Endif Selesai


4.5 Mempersiapkan Database Server

Pada tahapan ini dipersiapkan tempat untuk menampung data di server, data tersebut nantinya akan diproses oleh program yang kita buat pada tahap pemrograman, baik penambahan, pengeditan, panghapusan dan menampilkan isi database ke halaman website. Database terdiri atas tabel-tabel yang dibuat dengan menggunakan program MySQL.

Adapun database yang dibuat oleh penulis adalah database db_proyek dengan tabel-tabel sebagai berikut:

Tabel 4.16 Jajak Nama Field NO TOPIK PIL1 PIL2 PIL3 VOTE1 VOTE2 VOTE3

Type VARCHAR VARCHAR VARCHAR VARCHAR VARCHAR CHAR CHAR CHAR

Size 5 25 2 2 2 2 2 2

Keterangan Primary key

Tabel 4.17 Halaman Berita

Nama Field ID_BERITA JUDUL_BERITA DETAIL_BERITA TANGGAL

Type INTEGER VARCHAR TEXT DATE AND TIME

Size 5 100

Keterangan primary key

Tabel 4.18 Siswa Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Nama Field

Type

NIS ID_KELAS USER_NAME AGAMA JENIS_KELAMIN TAHUN_MASUK TEMPAT_LAHIR TGL_LAHIR KOTA CONTACT ALAMAT ID_SEMESTER PHOTO

Size

VARCHAR VARCHAR VARCHAR VARCHAR CHAR VARCHAR VARCHAR VARCHAR VARCHAR VARCHAR VARCHAR INT VARCHAR

10 10 30 15 2 5 50 50 25 15 50 4 100


Tabel 4.19 Absen Siswa

Nama Field NIS TAHUN HARI ID_KELAS SEMESTER ID_MATPEL

Type VARCHAR VARCHAR VARCHAR VARCHAR INT VARCHAR

Size 8 4 8 5 1 8

TANGGAL KETERANGAN

DATE VARCHAR

15


Foreign Key Foreign Key

Tabel 4.20 Absen Guru

Nama Field NIP TAHUN KELAS SEMESTER ID_MATPEL TANGGAL KETERANGAN

Type VARCHAR VARCHAR VARCHAR VARCHAR VARCHAR DATE VARCHAR Tabel 4.21

Size 12 12 12 12 4

Keterangan primary key Foreign Key Foreign Key

12 Guru


Nama Field NIP USER_NAME AGAMA JENIS_KELAMIN TAHUN_MASUK KOTA CONTACT GOLONGAN ALAMAT PHOTO

Type VARCHAR VARCHAR VARCHAR CHAR VARCHAR VARCHAR VARCHAR VARCHAR VARCHAR IMAGE

Size 6 30 15 2 7 15 16 20 50 100


Tabel 4.22 Mata Pelajaran

Nama Field Type ID_MATPEL CHAR NAMA_MATPEL VARCHAR

Size 5 25


Tabel 4.23 Nilai

Nama Field NIS ID_MATPEL ID_SEMESTER TAHUN UAS UTS NH NILAI NM

Type VARCHAR VARCHAR CHAR VARCHAR VARCHAR VARCHAR VARCHAR VARCHAR CHAR

Size 8 8 2 4 4 4 4 4 1

Keterangan Primary key Foreign Key Foreign Key

Tabel 4.24 Agenda


Nama Field ID_AGENDA ISI_AGENDA TANGGAL

Type INT VARCHAR VARCHAR

Size 11 100 20


Tabel 4.25 Jadwal Nama Field ID_KELAS ID_MATPEL NIP HARI JAM SEMESTER

Type VARCHAR VARCHAR VARCHAR VARCHAR VARCHAR VARCHAR

Size 8 8 8 8 10 4

Keterangan Primary key Primary key

Tebel 4.26 Kelas Nama Field Type ID_KELAS CHAR NAMA_KELAS VARCHAR

Size 5 25


Tabel 4.27 Profil

Nama Field ID_PROFIL ISI_PROFIL

Type INT TEXT

Size 11


Tabel 4.28 Semester

Nama Field ID_SEMESTER SEMESTER

Type INT VARCHAR

Size 11 4


Tabel 4.29 User


Nama Field ID_USER KETERANGAN PASSWORD

Type VARCHAR VARCHAR VARCHAR

Size 10 10 10


Tabel 4.30 Buku Tamu

Nama Field

Type

Size

NO NAMA

INTEGER VARCHAR

410 50

EMAIL

VARCHAR

25

ISI

TEXT

TGL

DATE TIME

Keterangan Primary key Nama pengisi buku tamu Alamt email dari pengisi buku tamu Komentar dari pengisi buku tamu Tanggal pengisian buku tamu

Tabel 4.31 Visi Misi

Nama Field ID_VISI_MISI TAHUN VISI MISI STATUS

Type VARCHAR YEAR VARCHAR VARCHAR VARCHAR

Size 10


500 500 100

BAB 5 Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

IMPLEMENTASI SISTEM

5.1 Pengertian Implementasi Sistem

Implementasi sistem adalah prosedur-prosedur yang dilakukan dalam menyelesaikan desain sistem yang telah disetujui seperti menginstall sistem, menguji sistem yang dibuat dan memulai sistem baru atau sistem yang diperbaiki.

5.2 Tujuan Implementasi Sistem

Adapun tujuan dari implementasi sistem ini adalah sebagai berikut:

1. Menyelesaikan desain sistem yang telah disetujui sebelumnya. 2. Memastikan bahwa pemakai (user) dapat mengoperasikan sistem baru 3. Menguji apakah sistem baru tersebut sesuai dengan pemakai (user). 4. Memastikan bahwa konversi ke sistem baru berjalan yaitu dengan membuat rencana, mengontrol dan melakukan instalasi baru secara benar.

5.3 Lingkungan Implementasi


Dalam operasionalnya aplikasi ini menggunakan perangkat lunak, perangkat keras dan antarmuka komunikasi sebagai berikut :

a. Perangkat Lunak (software) meliputi:

1. Sistem Operasi

: Windows XP SP.2

2. Editor Teks

: Macromedia Dreamweaver 8

3. Editor Grafik

: Adobe Photoshop CS2

4. Server side script language

: PHP 5.0

5. Web Server

: Apache 2.0

6. Database server

: MySQL versi 5

7. Client Application

: Mozilla Firefox 3.0/ Internet Explorer

b. Kebutuhan Perangkat Keras

1. Prosesor

:

Pentium Dual Core Inside (1.60 GHz)

2. Memori

:

1024 MB

3. Monitor

:

Plug and Play 14”

4. Keyboard

:

Standar

5. Mouse

:

Standar

6. Printer

:

Canon IP 1700

5.4 Tampilan User Interface


5.4.1 Halaman Utama Website

Gambar 5.1 Halaman Utama Website

Pada halaman utama terdapat beberapa menu diantaranya yaitu : Home, Guestbook, News, Visi dan Misi, Profil, Login, Polling, Menu link Website. Sebelum kita menggunakan aplikasi ini terlebih dahulu kita mengakses hak kita, klil menu login di klik akan menampilkan halaman yang dituju misalnya siswa atau guru.

5.4.2 Halaman Guestbook


Gambar 5.2 Halaman Guestbook

5.4.3 Halaman News

Gambar 5.3 Halaman News 5.4.4 Halaman Visi Misi


Gambar 5.4 Halaman Visi Misi 5.4.5 Halaman Profil

Gambar 5.5 Halaman Profil 5.4.6 Halaman Utama Siswa


Gambar 5.6 Halaman Utama Siswa

5.4.7 Halaman Absensi siswa

Gambar 5.7 Halaman Absensi Siswa


5.4.8 Halaman Nilai Siswa

Gambar 5.8 Halaman Nilai Siswa

5.4.9 Halaman Jadwal Siswa

Gambar 5.9 Halaman Jadwal Siswa

5.4.10 Halaman Profil Siswa Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.10 Halaman Profil Siswa

5.4.11 Halaman Utama Guru

Gambar 5.11 Halaman Utama Guru

5.4.12 Halaman Absensi Guru Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.12 Halaman Absensi Guru

5.4.13 Halaman Jadwal Guru Mengajar

Gambar 5.13 Halaman Jadwal Guru Mengajar

5.4.14 Halaman Profil Guru Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.14 Halaman Profil Guru

5.4.15 Halaman Utama Admin

Gambar 5.15 Halaman Utama Admin

5.4.16 Halaman Data Kelas Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.16 Halaman Data Kelas

5.4.16 Halaman Created

Gambar 5.17 Halaman Created 5.4.18 Halaman Edit Absensi Guru


Gambar 5.18 Halaman Edit Absensi Guru

5.4.19 Halaman Edit Berita

Gambar 5.19 Halaman Edit Berita

5.4.20 Halaman Input Data Jadwal Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.20 Halaman Input Data Jadwal

5.4.21 Halaman Input Data Guru

5..21 Halaman Input DataGuru

5.4.22 Halaman Input Data Nilai Siswa Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.22 Halaman Input Data Nilai Siswa

5.5 Petunjuk Instalasi

Sistem Infromasi SMA Negeri 5 Medan adalah sistem informasi berbasis web, sehingga untuk pemakaiannya hampir sama dengan aplikasi-aplikasi berbasis web lainnya. Berikut adalah petunjuk pemakaiannya :

1. Instalasi Web Server a. Instalasi apache 2.2.4 Lakukan Double pada installer Apache, maka akan tampil jendela seperti berikut : •

Kemudian pilih Next >

•

Tampilan selanjutnya adalah License Agrement, kemudian pilih I accept the terms the license agrement, kemudian klik Next >


•

Pada tampilan berikutnya merupakan keterangan mengenai licensi Apache, kemudian klik Next >

•

Berikutnya ada beberapa baris yang harus diisi

Gambar 5.23 Pemilihan Instalasi

Kemudian klik Next > •

Tahap selanjutnya kita diminta untuk memilih tipe atau cara menginstall Apache, untuk saat ini kita pilih Typical saja. Kemudian klik Next >.

•

Pada Tahapan selanjutnya kemana program apache akan kita install. Disini kita tidak akan melakukan perubahan tempat penginstallan, Kemudian klik Next >

•

Setelah pengaturan selesai saatnya proses instalasinya, klik tombol Install.

•

maka akan tampil jendela yang menandakan proses installasi apache telah selesai. Klik Finish.


•

Untuk menguji apakah Apache telah terinstall dengan benar, bukalah internet explorer. Pada baris isian alamat, ketikkan http://localhost atau http://127.0.0.1, dan kemudian tekan ENTER.

•

Apabila muncul seperti tampilan dibawah yang anda dapatkan maka apache telah terinstall dengan baik.

Gambar 5.24 Instalasi Apache Sukses

b. Instalasi PHP 5.2.0

•

Double click file installer PHP, maka akan tampilan Welcome dari PHP, Klik Next >

•

Selanjutnya beri tanda centang pada pernyataan I accept the terms in the license Agreement. Kemudian klik Next.

•

Pada pilihan tempat dimana PHP akan diinstall, Klik Next untuk memilih trempat default dari installasi PHP.

•

Pilih web server sesuai dengan apache yang diinstall, yaitu Apache 2.2.x Module. Klik Next.


•

Pada tampilan ini kita harus memilih tempat dimana kita akan menyimpan konfigurasi dari PHP ke Apache, yaitu di C:\Program Files\Apache Software Foundation\Apache2.2, Klik Ok.

•

Disini terlihat beberapa icon yang akan diinstall, pada bagian ini kita akan mengaktifkan beberapa icon sebagai konfigurasi dari PHP, Adapun icon-icon tersebut adalah :

1. Fileinfo

4. MySQL

2. GD2

5. PDO \ MySQL

3. Mhash

6. Extras

•

Setelah mengakiftkan semuanya, Klik Next

•

Kemudian akan muncul jendela yang menyatakan bahwa php siap untuk diinstall, klik Install.

•

Pada saat dalam

penginstallan, akan muncul kotak dialog yang

meminta konfigurasi dari apache, pilih Yes, Setelah sukses kemudian klik Ok . c. Konfigurasi Apache dan PHP •

Cari file Php.ini di folder C:\php, buka file tersebut dengan text editor seperti notepad, ketikkan pada bagian doc_root C:\Apache\htdocs (Untuk memudahkan pencarian gunakan bantuan find dengan menekan tombol Ctrl + F pada keyboard, kemudian ketikkan doc_root)


•

Setelah mengakiftkan semuanya, Klik Next

•

Kemudian akan muncul jendela yang menyatakan bahwa php siap untuk diinstall, klik Install.

•

Pada saat dalam

penginstallan, akan muncul kotak dialog yang

meminta konfigurasi dari apache, pilih Yes, Setelah sukses kemudian klik Ok •

Penginstallan selesai. Kemudian klik Finish.

•

Pada Apache Service Monitor klik restart untuk mereset ulang setingan yang ada pada file httpd.conf yang diperlukan Apache.

•

Kemudian Restart komputer untuk mereset konfigurasi kedua software tersebut.

d. Test PHP

•

Sekarang untuk mengetest apakah file PHP bisa ditampilkan di browser, buka notepad kemudian ketikkan script berikut ini :

•

Simpan file tersebut di dalam root server di folder C:\Apache\htdocs\ dengan nama “test.php”

•

Buka

Internet

Explorer,

kemudian

ketik

pada

adress,

http://localhost/test.php, maka akan tampil informasi mengenai PHP. Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.25 Test PHP

e. Instalasi MySQL •

Double click file installer dari MySQL 5.1, maka akan muncul jendela Welcome. Kemudian klik Next >

•

Untuk tipe installasi untuk proyek ini pilih Typical saja sudah cukup, Klik Next >.

•

Berikutnya akan mucul tampilan Setup MySql yang memberitahukan tipe dan letak dimana Installasi berada, klik Install untuk memulai instalasinya.

•

Tahap

selanjutnya

pilih

Skip

Sign-Up.

Klik

melanjutkannya.


Next>

untuk

•

Sampai tahap ini MySql sudah terinstall, namun belum terkonfigurasi, untuk itu aktifkan pilihan Configure the MySQL Server now, untuk memulai konfigurasi klik Finish.

•

Segera akan tampil jendela Welcome to the MySQL Server Instance Configuration Wizard 1.0.8, klik Next >.

•

Pilih Detailed Configuration untuk tipe konfigurasinya, klik Next >.

•

Pilih Develover Machine sebagai tipe server, klik Next >.

•

Pilih Mutifunctional Database sebagai tata cara penggunaan database yang dipilih, klik Next >.

•

Pada tahap selanjutnya biarkan saja seperti seperti apa yang disarankan oleh MySql sebagai defaultnya, klik Next >.

•

Tampilan berikutnya, ada tiga pilihan jumlah maksimum koneksi yang diijinkan

pada

server

MySQL

Anda

:

Decission

Support

(DSS)/OLAP, Online Transaction Processing (OLTP), atau Manual Setting. Untuk proyek kali ini pilih saja Decission Support (DSS)/OLAP, klik Next >. •

Bagi Anda yang terhubung dengan komputer jaringan, aktifkan pilihan Enable TCP/IP Networking. Ada tambahan pilihan Enable Strict Mode. Aktifkan saja pilihan ini sesuai dengan yang disarankan oleh sistem. Pilih port number 3306. Lanjutkan dengan menekan tombol Next >.

•

Pilihan berikutnya mengenai jenis karakter yang Anda gunakan. Pilih saja karakter standar (Standard Character Set). Kemudian klik Next>


•

Tampilan berikutnya, Aktifkan pilihan Install as Windows Service dan

Launch

the

MySQL

Server

automatically

.

Dengan

mengaktifkan pilihan ini, maka Anda dapat menjalankan atau memanggil program MySQL langsung dari DOS/Command Prompt. Jangan lupa untuk memilih tipe MySQL yang kita gunakan yaitu : MySQL 5.1 •

Tampilan berikutnya, mengenai masalah keamanan server MySQL. Dalam proyek ini kami tidak menggunakan password dalam penggunaan program MySQL jadi kita akan akan mematikan pilihan Modify Security Setting, Lanjutkan dengan menekan tombol Next >.

•

Bila Anda telah yakin untuk melanjutkan, klik pada tombol Execute. Dan tunggu beberapa saat hingga proses eksekusi selesai.

•

Bila tidak ada masalah apapun, maka selesailah keseluruhan proses instalasi dan setting pada program MySQL 5.1 ini.

f. Konfigurasi PHP dan MySQL •

Carilah file php.ini di dalam folder C:\PHP

•

Bukalah file php.ini dengan menggunakan program teks editor seperti Notepad, Carilah baris perintah "register_globals = off " dan kemudian ubah baris tersebut menjadi: register_globals = On

•

Carilah baris perintah "magic_quotes_gpc = Off " dan kemudian ubah baris tersebut menjadi: magic_quotes_gpc = On


•

Carilah baris perintah " register_long_arrays = Off " dan kemudian ubah baris tersebut menjadi: register_long_arrays = On

•

Carilah

baris

perintah

"extension_dir"

dan

baris

tersebut

ubah(sesuaikan dengan nama folder di bawah php, tempat menyimpan file-file extension yang berakhiran. dll) menjadi : extension_dir = "C:\Program Files\php\extension" •

Kemudian simpan dan tutup file.ini.

•

Sampai di sini langkah pengubahan konfigurasi PHP dianggap selesai.

•

Selanjutnya kita lakukan pengujian atas hasil pengubahan konfigurasi Apache 2.2.3 dan PHP 5.2.0.

g. Mengkonfigurasi Apache, MySQL, dan PHP

1. Buka file httpd.conf yang berada di folder conf pada Apache. Kemudian tambahkan file yang bercetak tebal berikut di akhir baris file httpd.conf : ……. ……. ……. # #

ServerAdmin [email protected]

#

DocumentRoot /www/docs/dummy-host.example.com

#

ServerName dummy-host.example.com


#

ErrorLog logs/dummy-host.example.com-error_log

#

CustomLog logs/dummy-host.example.com-access_log

common # ScriptAlias /php/ "c:/php/" AddType application/x-httpd-php .php # For PHP 5 Action application/x-httpd-php "/php/php-cgi.exe"

2. Buka file php.ini di folder C:\WINDOWS

dengan menggunakan

notepad dan lakukan beberapa perubahan sebagai berikut: ……… ……… ……… ; You should do your best to write your scripts so that they do not require ; register_globals to be on; Using form variables as globals can easily lead ; to possible security problems, if the code is not very well thought of. register_globals = On ……… ………


……… ; Directory in which the loadable extensions (modules reside. extension_dir = "c:\PHP\ext" … … ;extension=php_filepro.dll extension=php_gd2.dll (hilangkan tanda ; di depan kalimat) ;extension=php_gettext.dll ;extension=php_ifx.dll ;extension=php_imap.dll ;extension=php_interbase.dll ;extension=php_ldap.dll ;extension=php_mcrypt.dll ;extension=php_mhash.dll ;extension=php_mime_magic.dll ;extension=php_ming.dll ;extension=php_mssql.dll ;extension=php_msql.dll extension=php_mysql.dll

(hilangkan tanda ; di depan kalimat)

;extension=php_mysqli.dll

3. Mengatur MySQL dengan cara Klik Start > Programs > MySQL > MySQL Server 5.0 > MySQL Instance Config Wizard.

4. Pilih Standard Configuration, Klik Next sampai ke Security Options.

5. Konfigurasi Apache 2.0, MySQL 5.0 dan PHP 5.1.2 telah berhasil dan dapat dipergunakan. Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

2. Copy Folder Aplikasi dan Database Copy folder SMAN5 ke folder C:\Apache group\Apache2\htdocs dan copy folder db_proyek ke C:\MySQL\MySQL Server 5.0 \data.

3. Mengakses Homepage

Untuk masuk ke dalam Sistem Informasi SMA Negeri 5 Medan, maka kita harus menjalankan browser terlebih dahulu. Untuk pemilihan browser kita dapat menggunakan Internet Explorer atau Mozilla Firefox, dan browser lainnya. Adapun langkah untuk menjalankannya pada browser adalah buka mozilla firefox ,setelah terbuka lalu kita masukan alamat home page pada address bar, yaitu http://localhost/ SMAN 5 Medan lalu klik tombol go atau tekan enter dan Jika berhasil akan tampil seperti berikut ini:

Gambar 5.26 Tampilan Website Utam


BAB 6

KESIMPULAN DAN SARAN

6.1. Kesimpulan

Setelah melakukan analisis sistem secara langsung di SMA Negeri 5 Medan, sistem informasi yang ada belum bisa membantu pekerjaan tata usaha (yang berperan sebagai admin), dimana dalam proses pengolahan data akademik tersebut masih menggunakan sistem manual. Untuk itu diperlukan adanya suatu perancangan aplikasi sistem informasi akademik yang terkomputerisasi dengan baik sehingga dapat memudahkan pekerjaan tata uaha dalam pengolahan data akademik.

Adapun hasil yang dapat dicapai dengan adanya Perancangan Sistem Informasi SMA Negeri 5 Medan Berbasis Web ini diantaranya sebagai berikut:

1. Membantu pengelolaan data nilai, data jadwal, dan data absesnsi menjadi sistematis.

2. Memberikan hasil laporan data hasil penilaian, absensi siswa, dan jadwal mata pelajaran.


3. Pelajaran menjadi lebih cepat dalam penyampaian laporan kepada pihak Kepala Sekolah setelah menggunakan sistem informasi akademik ini.

4. Website merupakan sarana informasi online yang dapat diakses oleh siapapun.

5. Dalam membangun sebuah website tidak harus terhubung dengan internet. Internet diperlukan pada saat upload file dan pengaksesan website.

6. Website yang baik adalah website yang selalu meng-update informasinya dengan segala yang baru

7. Layout/header yang bagus dan menarik dapat menambah daya tarik website sehingga banyak dikunjungi para pengunjung.

6.2. Saran

1. Senantiasa menjaga dan memperbaharui website agar pengunjung tidak merasa bosan dan mendapatkan informasi-informasi yang up-to-date.

2. Pemeliharaan keamanan terhadap data-data pada server perlu diperhatikan dan dijaga agar data-data pada server tidak bisa diakses oleh orang yang tidak berhak mengaksesnya.


DAFTAR PUSTAKA

Kadir, Abdul. 1998. Basis Data. Yogyakarta : Andi.

Mutmainah, Siti, Lukmanul Hakim. 2003. Membuat Grafik Web yang Menarik dengan Photoshop. Jakarta : PT Elex Media Komputindo.

Peranginangin, Kasiman. 2006. Aplikasi Web dengan PHP dan MySQL. Yogyakarta: Andi.

MADCOMS. 2004. Aplikasi Manajemen Database Pendidikan Berbasis Web dengan PHP dan MySQL. Madiun : Andi.

MADCOMS. 2004. Aplikasi Program PHP dan MySQL Untuk Membuat Website Interaktif. Madiun : Andi.

MADCOMS. 2004. Membuat Aplikasi Database Karyawan Online Berbasis Web dengan PHP dan MySQL. Madiun : Andi.

MADCOMS. 2006. Seri Panduan Lengkap Macromedia Dreamweaver. Madiun : Andi.


L A M P I R A N Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

LISTING PROGRAM 1

db_connect.php

2. switch.php
= "home.php"; break; = "login_admin.php";break; = "input_data_siswa.php";break; = "simpan_data_siswa.php";break; ="input_data_guru.php";break; ="input_absen_siswa.php";break; ="input_data_pelajaran.php";break; ="input_kelas.php";break; ="browse_nilai.php";break; ="export.php";break; ="simpan_data_guru.php";break; ="simpan_data_pelajaran.php";break; ="lihat_nilai.php";break; ="simpan_data_kelas.php";break; ="simpan_data_absen_siswa.php";break; ="input_absen_guru.php";break; ="simpan_absen_guru.php";break; ="input_user.php";break;


$page ="simpan_data_user.php";break; case"20"; $page ="input_nilai.php"; break; case"21"; $page ="input_visi_misi.php";break; case"22"; $page ="simpan_visi_misi.php";break; case"23"; $page ="lihat_visi_misi.php";break; case"24"; $page="edit_visi_misi.php";break; case"25"; $page="lihat_kelas.php";break; case"26"; $page="lihat_data_guru.php";break; case"27"; $page="simpan_absen_siswa.php";break; case"28"; $page="tambah_peta.php";break; case"29"; $page="simpan_peta.php";break; case"30"; $page="hapus_visi_misi.php";break; case"31"; $page="edit_kelas.php";break; case"32"; $page="simpan_kelas.php";break; case"33"; $page="edit_data_guru.php";break; case"34"; $page="input_profil.php";break; case"35"; $page="simpan_profil.php";break; case"36"; $page="lihat_profil.php";break; case"37"; $page="agenda.php";break; case"38"; $page="hapus_agenda.php";break; case"39"; $page="input_agenda.php";break; case"40"; $page="simpan_agenda.php";break; case"41"; $page="hapus_profil.php";break; case"42"; $page="lihat_peta.php";break; case"43"; $page="hapus_peta.php";break; case"44"; $page="input_berita.php";break; case"45"; $page="simpan_berita.php";break; case"46"; $page="lihat_berita.php";break; case"47"; Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

$page="hapus_berita.php";break; case"48"; $page="edit_berita.php";break; case"49"; $page="lihat_agenda.php";break; case"50"; $page="cari_siswa.php";break; case"51"; $page="tampil_siswa.php";break; case"52"; $page="simpan_nilai.php";break; case"53"; $page="lihat_absen_guru.php";break; case"54"; $page="hapus_absen_guru.php";break; case"55"; $page="hapus_data_guru.php";break; case"56"; $page="input_data_jadwal.php";break; case"57"; $page="simpan_data_jadwal.php";break; case"58"; $page="lihat_data_jadwal.php";break; case"59"; $page="cari_jadwal_guru.php";break; case"60"; $page="lihat_absen_siswa.php";break; case"61"; $page="tampil_jadwal.php";break; case"62"; $page="cari_data_guru.php";break; case"63"; $page="tampil_guru.php";break; case "64"; $page="lihat_absen_siswa_perorangan.php";break; case"65"; $page="lihat_nilai_siswa_perorangan.php";break; case"67"; $page="hapus_absensi_siswa.php";break; case"68"; $page="input_data_guru.php";break; case"69"; $page="simpan_edit_guru.php";break; case"70"; $page="edit_absen_siswa.php";break; case"71"; $page="simpan_edit_absen_siswa.php";break; } ?> 3. index.php


<meta http-equiv="Content-Type" content="text/html; charset=iso-88591">Sistem Informasi Sma Negeri 5 Medan

<script language="JavaScript" src="content_data/mm_menu.js"><style type="text/css">

Nis
Tahun	<select name="tahun">
Kelas	<select name="kelasa">

No	Nama	Matpel	<strong>uas	<strong>Uts	<strong>Uh	<strong>Nilai	<strong>Huruf

NIS	<SELECT name="nis" size=1>
TAHUN	<select name="tahun">
KELAS	<select name="kelas" size=1>
SEMESTER	<select name="semester" size=1>
MATPEL	<select name="id_matpel" size=1>
TANGGAL
KETERANGAN	<select name="keterangan">

PERANCANGAN SISTEM INFORMASI SMA NEGERI 5 MEDAN BERBASIS WEB TUGAS AKHIR ADE YULIA SARI

Recommend Documents