Perancangan Sistem Informasi Berbasis Web Pada Sekolah Menengah Pertama Negeri 8 Tebing Tinggi

PERANCANGAN SISTEM INFORMASI BERBASIS WEB PADA

SEKOLAH MENENGAH PERTAMA NEGERI 8

TEBING TINGGI

TUGAS AKHIR

ATNES PRATIWI BARUS

092406165

PROGRAM STUDI D3 TEKNIK INFORMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SUMATERA UTARA

MEDAN

2012

PERANCANGAN SISTEM INFORMASI BERBASIS WEB PADA

SEKOLAH MENENGAH PERTAMA NEGERI 8

TEBING TINGGI

TUGAS AKHIR

Diajukan untuk melengkapi tugas dan memenuhi syarat mencapai gelar Ahlimadya

ATNES PRATIWI BARUS

092406165

PROGRAM STUDI D3 TEKNIK INFORMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SUMATERA UTARA

PERSETUJUAN

Judul : PERANCANGAN SISTEM INFORMASI BERBASIS WEB PADA SEKOLAH MENENGAH PERTAMA NEGERI 8 TEBING TINGGI

Kategori : TUGAS AKHIR

Nama : ATNES PRATIWI BARUS

Nomor Induk Mahasiswa : 092406165

Program Studi : D3 TEKNIK INFORMATIKA Departemen : MATEMATIKA

Fakultas : MATEMATIKA DAN ILMU PENGETAHUAN ALAM (MIPA) UNIVERSITAS SUMATERA UTARA

Diluluskan di Medan, Juli 2012

Diketahui/ disetujuin oleh Pembimbing I Departemen Matematika FMIPA USU

Ketua,

Prof. Dr. Tulus, M.Si Drs. Sawaluddin, M.IT NIP. 19620901 198803 1 002 NIP. 19591231 199802 1 001

PERNYATAAN

PERANCANGAN SISTEM INFORMASI BERBASIS WEB PADA SEKOLAH MENENGAH PERTAMA NEGERI 8 TEBING TINGGI

TUGAS AKHIR

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

Medan, Mei 2012

ATNES PRATIWI BARUS 092406165

PENGHARGAAN

Puji dan syukur penulis panjatkan kehadirat Tuhan Yang Maha Esa, yang telah melimpahkan karunia-Nya dalam mengerjakan tugas akhir ini. Karena berkat rahmat dan berkat-Nya pula penulis dapat menyelesaikan Tugas akhir dengan judul “PERANCANGAN SISTEM INFORMASI BERBASIS WEB PADA SEKOLAH MENENGAH PERTAMA NEGERI 8 TEBING TINGGI”. Penyusunan dan penulisan Tugas Akhir ini dibuat untuk memenuhi syarat kelulusan bagi setiap mahasiswa jurusan Teknik Informatika Program Studi D3 di FMIPA USU Medan.

Ucapan terima kasih ini saya sampaikan kepada Drs. Sawaluddin, M.IT selaku pembimbing tugas akhir yang telah memberikan bimbingan dan arahan selama ini kepada penulis dalam menyelesaikan tugas akhir. Ucapan terima kasih juga ditujukan kepada Ketua dan Sekertaris Departemen Prof. Dr. Tulus, M.Si, dan Dra. Mardiningsih. M.Si., Dekan dan Pembantu Dekan Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara, semua dosen pada Departemen Matematika FMIPA USU, pegawai FMIPA USU dan semua pegawai SMP Negeri 8 Tebing Tinggi.Akhirnya, tidak terlupakan kepada bapak, ibu dan adik-adik saya yang selau memberikan dukungan dan perhatiannya, juga semua sahabat (Fatmawati, Reza Mahardi, Novri, Melda, Ribka, Yunita, Nellla , Claudia dan Dedy) yang selalu memberikan saran, kritikan dan semangat yang tiada henti untuk menyelesaikan tugas akhir ini. Semoga Tuhan Yang Maha Esa akan membalasnya.

ABSTRAK

Kajian ini bertujuan untuk membangun suatu sistem informasi data siswa, guru dan pegawai dari suatu sekolah yang berada di Tebing Tinggi. Sistem ini dikembangkan menggunakan bahasa pemograman Adobe Photoshop, Macromedia Dreamweaver 8. XAMPP Versi 1.7.0 , CSS3 Menu dan browser Mozila Firefox. Sistem ini bekerja memasukkan dan menyimpan data serta menampilkan info dari sekolah tersebut . Sehingga masyarakat luas akan lebih mudah mengetahui informasi yang akan disajikan oleh pihak sekolah .

DAFTAR ISI

Halaman

Persetujuan ii

Pernyataan iii

Penghargaan iv

Abstrak v

Daftar Isi vi

Daftar Tabel viii

Daftar Gambar ix

BAB 1 PENDAHULUAN

1.1 Latar Belakang 1

1.2 Identifikasi Masalah 3

1.3 Ruang Lingkup Masalah 4

1.4 Maksud dan Tujuan 4

1.5 Metode Penelitian 5

1.6 Sistematika Penulisan 7

BAB 2 TINJAUAN TEORI

2.1 Data dan Informasi

2.1.1 Pengertian Data 9

2.1.2 Pengertian Informasi 10 2.2 Sistem dan Sistem Informasi

2.2.1 Pengertian Sistem 10 2.2.2 Pengertian Sistem Informasi 11 2.3 Pengenalan HTML

2.3.1 Apa Itu Dokumen HTML 11 2.3.2 Bagian-Bagian HTML 12 2.4 Pengenalan PHP

2.4.1 Apa Itu PHP? 13

2.4.2 Sejarah Singkat PHP 14

2.4.3 Memulai PHP 15

2.5 Penggabungan Script HTML dan PHP 15

2.6 Pengenalan MySQL 17

2.7 Mengenal Macromedia Dreamweaver 17 2.7.1 Memulai Macromedia Dreamweaver 18 2.7.2 Komponen Ruang Kerja 21

3.3.1 Visi 26

3.3.2 Misi 27

3.4 Struktur Organisasi SMP Negeri Tebing Tinggi

3.4.1 Tugas dan Fungsi Kepala Sekolah 29 3.4.2 Tugas dan Fungsi Wakil Kepala Sekolah 32 3.4.3 Tugas Urusan Kurikulum 32 3.4.4 Tugas Urusan Kesiswaan 33 3.4.5 Tugas Urusan Sarana dan Prasarana 34 3.4.6 Tugas dan Fungsi Guru Pembimbing (BP /

BK)

34

BAB 4 PERANCANGAN SISTEM

4.1 Analisis Masalah 39

4.2 Perancangan 40

4.3 Simbol-Simbol Dasar 41

4.3.1 Flowchart Direction Symbols 41 4.3.2 Processing Symbols 42 4.3.3 Input-Output Symbols 44

4.4 Data Flow Diagram 45

4.5 Perancangan Database 48

BAB 5 IMPLEMENTASI SISTEM

5.1 Pengertian Implementasi Sistem 66 5.2 Tujuan Implementasi Sistem 66

5.3 Spesifikasi Sistem 67

5.3.1 Perangkat Keras ( Hardware) 67 5.3.2 Perangkat Lunak ( Software ) 67

5.3.3 Brainware 71

5.4 Pengujian Sistem 72

BAB 6 KESIMPULAN DAN SARAN

6.1 Kesimpulan 76

6.2 Saran 77

Daftar Pustaka Lampiran Listing Program

DAFTAR TABEL

Tabel 4.1 Tabel Flowchart Direction Symbols 42 Tabel 4.2 Tabel Processing Symbols 43 Tabel 4.3 Tabel Input – Output Symbols 44

Tabel 4.4 Tabel Absen Siswa 48

Tabel 4.5 Tabel Agenda 50

Tabel 4.6 Tabel Berita 51

Tabel 4.7 Tabel Guru 52

Tabel 4.8 Tabel Kategori 53

Tabel 4.9 Tabel Kondisi Siswa 53

Tabel 4.10 Tabel Modul 54

Tabel 4.11 Tabel Shoutbox 55

Tabel 4.12 Tabel Siswa 55

Tabel 4.13 Tabel Statistik 57

Tabel 4.14 Tabel Nilai 57

DAFTAR GAMBAR

Gambar 2.1 Jendela Kerja Macromedia Dreamweaver 8 19

Gambar 2.2 Menu Insert Bar 19

Gambar 2.3 Tampilan Document Toolbar 20 Gambar 2.4 Tampilan Property Inspector 21 Gambar 2.5 Tampilan Menu Dreamweaver 8 22

Gambar 3.1 Struktur Organisasi 28

Gambar 4.1 DFD Diagram Konteks 46

Gambar 4.2 Data Flow Diagram Level Nol 47

Gambar 4.3 Flowchart Halaman Utama 59

Gambar 4.4 Flowchart Halaman Profil 59 Gambar 4.5 Flowchart Halaman Guru/ Pegawai 60

Gambar 4.6 Flowchart Halaman Siswa 60

Gambar 4.7 Flowchart Halaman Fitur 61

Gambar 4.8 Flowchart Lanjut Halaman Utama 61 Gambar 4.9 Flowchart Login Ke Halamaan Admin 62 Gambar 4.10 Flowchart Halamaan Data Guru/Pegawai 63 Gambar 4.11 Flowchart Halamaan Data Siswa 63 Gambar 4.12 Flowchart Halamaan Kondisi Siswa 64 Gambar 4.13 Flowchart Halaman Nilai Siswa 64 Gambar 4.14 Flowchart Halaman Absen Siswa 65 Gambar 5.1 Tampilan Windows 7 Ultimate 68 Gambar 5.2 Tampilan Microsoft Word 2007 68 Gambar 5.3 Tampilan Control Panel XAMPP Versi 1.7.0 69 Gambar 5.4 Tampilan Halaman XAMPP versi 1.7.0 69 Gambar 5.5 Tampilan Macromedia Dreamweaver 8 70

Gambar 5.6 Tampilan CSS3 Menu 71

Gambar 5.7 Tampilan Halaman HOME 72

Gambar 5.8 Tampilan Halaman Login Admin 73 Gambar 5.9 Tampilan Halaman Input Data Guru 73 Gambar 5.10 Tampilan Halaman Input Data Siswa 74 Gambar 5.11 Tampilan Halaman Input Data Kondisi Siswa 74 Gambar 5.12 Tampilan Halaman Input Data Nilai Siswa 75 Gambar 5.13 Tampilan Halaman Input Data Absen Siswa 75

PENGHARGAAN

Puji dan syukur penulis panjatkan kehadirat Tuhan Yang Maha Esa, yang telah melimpahkan karunia-Nya dalam mengerjakan tugas akhir ini. Karena berkat rahmat dan berkat-Nya pula penulis dapat menyelesaikan Tugas akhir dengan judul

“PERANCANGAN SISTEM INFORMASI BERBASIS WEB PADA SEKOLAH

MENENGAH PERTAMA NEGERI 8 TEBING TINGGI”. Penyusunan dan penulisan Tugas Akhir ini dibuat untuk memenuhi syarat kelulusan bagi setiap mahasiswa jurusan Teknik Informatika Program Studi D3 di FMIPA USU Medan.

Ucapan terima kasih ini saya sampaikan kepada Drs. Sawaluddin, M.IT selaku pembimbing tugas akhir yang telah memberikan bimbingan dan arahan selama ini kepada penulis dalam menyelesaikan tugas akhir. Ucapan terima kasih juga ditujukan kepada Ketua dan Sekertaris Departemen Prof. Dr. Tulus, M.Si, dan Dra. Mardiningsih. M.Si., Dekan dan Pembantu Dekan Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara, semua dosen pada Departemen Matematika FMIPA USU, pegawai FMIPA USU dan semua pegawai SMP Negeri 8 Tebing Tinggi.Akhirnya, tidak terlupakan kepada bapak, ibu dan adik-adik saya yang selau memberikan dukungan dan perhatiannya, juga semua sahabat (Fatmawati, Reza Mahardi, Novri, Melda, Ribka, Yunita, Nellla , Claudia dan Dedy) yang selalu memberikan saran, kritikan dan semangat yang tiada henti untuk menyelesaikan tugas akhir ini. Semoga Tuhan Yang Maha Esa akan membalasnya.

ABSTRAK

Kajian ini bertujuan untuk membangun suatu sistem informasi data siswa, guru dan pegawai dari suatu sekolah yang berada di Tebing Tinggi. Sistem ini dikembangkan menggunakan bahasa pemograman Adobe Photoshop, Macromedia Dreamweaver 8. XAMPP Versi 1.7.0 , CSS3 Menu dan browser Mozila Firefox. Sistem ini bekerja memasukkan dan menyimpan data serta menampilkan info dari sekolah tersebut . Sehingga masyarakat luas akan lebih mudah mengetahui informasi yang akan disajikan oleh pihak sekolah .

DAFTAR ISI

Halaman

Persetujuan ii

Pernyataan iii

Penghargaan iv

Abstrak v

Daftar Isi vi

Daftar Tabel viii

Daftar Gambar ix

BAB 1 PENDAHULUAN

1.1 Latar Belakang 1

1.2 Identifikasi Masalah 3

1.3 Ruang Lingkup Masalah 4

1.4 Maksud dan Tujuan 4

1.5 Metode Penelitian 5

1.6 Sistematika Penulisan 7

BAB 2 TINJAUAN TEORI

2.1 Data dan Informasi

2.1.1 Pengertian Data 9

2.1.2 Pengertian Informasi 10 2.2 Sistem dan Sistem Informasi

2.2.1 Pengertian Sistem 10 2.2.2 Pengertian Sistem Informasi 11 2.3 Pengenalan HTML

2.3.1 Apa Itu Dokumen HTML 11 2.3.2 Bagian-Bagian HTML 12 2.4 Pengenalan PHP

2.4.1 Apa Itu PHP? 13

2.4.2 Sejarah Singkat PHP 14

2.4.3 Memulai PHP 15

2.5 Penggabungan Script HTML dan PHP 15

2.6 Pengenalan MySQL 17

2.7 Mengenal Macromedia Dreamweaver 17 2.7.1 Memulai Macromedia Dreamweaver 18 2.7.2 Komponen Ruang Kerja 21

BAB 3 TENTANG SMP NEGERI 8 TEBING TINGGI

3.1 Gambar Umum SMP Negeri 8 24

3.2 Tujuan Sekolah 25

3.3.1 Visi 26

3.3.2 Misi 27

3.4 Struktur Organisasi SMP Negeri Tebing Tinggi

3.4.1 Tugas dan Fungsi Kepala Sekolah 29 3.4.2 Tugas dan Fungsi Wakil Kepala Sekolah 32 3.4.3 Tugas Urusan Kurikulum 32 3.4.4 Tugas Urusan Kesiswaan 33 3.4.5 Tugas Urusan Sarana dan Prasarana 34 3.4.6 Tugas dan Fungsi Guru Pembimbing (BP /

BK)

34

BAB 4 PERANCANGAN SISTEM

4.1 Analisis Masalah 39

4.2 Perancangan 40

4.3 Simbol-Simbol Dasar 41

4.3.1 Flowchart Direction Symbols 41 4.3.2 Processing Symbols 42 4.3.3 Input-Output Symbols 44

4.4 Data Flow Diagram 45

4.5 Perancangan Database 48

BAB 5 IMPLEMENTASI SISTEM

5.1 Pengertian Implementasi Sistem 66 5.2 Tujuan Implementasi Sistem 66

5.3 Spesifikasi Sistem 67

5.3.1 Perangkat Keras ( Hardware) 67 5.3.2 Perangkat Lunak ( Software ) 67

5.3.3 Brainware 71

5.4 Pengujian Sistem 72

BAB 6 KESIMPULAN DAN SARAN

6.1 Kesimpulan 76

6.2 Saran 77

Daftar Pustaka Lampiran Listing Program

DAFTAR TABEL

Tabel 4.1 Tabel Flowchart Direction Symbols 42 Tabel 4.2 Tabel Processing Symbols 43 Tabel 4.3 Tabel Input – Output Symbols 44

Tabel 4.4 Tabel Absen Siswa 48

Tabel 4.5 Tabel Agenda 50

Tabel 4.6 Tabel Berita 51

Tabel 4.7 Tabel Guru 52

Tabel 4.8 Tabel Kategori 53

Tabel 4.9 Tabel Kondisi Siswa 53

Tabel 4.10 Tabel Modul 54

Tabel 4.11 Tabel Shoutbox 55

Tabel 4.12 Tabel Siswa 55

Tabel 4.13 Tabel Statistik 57

Tabel 4.14 Tabel Nilai 57

DAFTAR GAMBAR

Gambar 2.1 Jendela Kerja Macromedia Dreamweaver 8 19

Gambar 2.2 Menu Insert Bar 19

Gambar 2.3 Tampilan Document Toolbar 20 Gambar 2.4 Tampilan Property Inspector 21 Gambar 2.5 Tampilan Menu Dreamweaver 8 22

Gambar 3.1 Struktur Organisasi 28

Gambar 4.1 DFD Diagram Konteks 46

Gambar 4.2 Data Flow Diagram Level Nol 47

Gambar 4.3 Flowchart Halaman Utama 59

Gambar 4.4 Flowchart Halaman Profil 59 Gambar 4.5 Flowchart Halaman Guru/ Pegawai 60

Gambar 4.6 Flowchart Halaman Siswa 60

Gambar 4.7 Flowchart Halaman Fitur 61

Gambar 4.8 Flowchart Lanjut Halaman Utama 61 Gambar 4.9 Flowchart Login Ke Halamaan Admin 62 Gambar 4.10 Flowchart Halamaan Data Guru/Pegawai 63 Gambar 4.11 Flowchart Halamaan Data Siswa 63 Gambar 4.12 Flowchart Halamaan Kondisi Siswa 64 Gambar 4.13 Flowchart Halaman Nilai Siswa 64 Gambar 4.14 Flowchart Halaman Absen Siswa 65 Gambar 5.1 Tampilan Windows 7 Ultimate 68 Gambar 5.2 Tampilan Microsoft Word 2007 68 Gambar 5.3 Tampilan Control Panel XAMPP Versi 1.7.0 69 Gambar 5.4 Tampilan Halaman XAMPP versi 1.7.0 69 Gambar 5.5 Tampilan Macromedia Dreamweaver 8 70

Gambar 5.6 Tampilan CSS3 Menu 71

Gambar 5.7 Tampilan Halaman HOME 72

Gambar 5.8 Tampilan Halaman Login Admin 73 Gambar 5.9 Tampilan Halaman Input Data Guru 73 Gambar 5.10 Tampilan Halaman Input Data Siswa 74 Gambar 5.11 Tampilan Halaman Input Data Kondisi Siswa 74 Gambar 5.12 Tampilan Halaman Input Data Nilai Siswa 75 Gambar 5.13 Tampilan Halaman Input Data Absen Siswa 75