Pengembangan website SMP Katolik ST. Mikail Balikpapan meliput sistem informasi akademik dan content management system menggunakan PHP dan MySQL - USD Repository

(1)

CONTENT MANAGEMENT SYSTEM

MENGGUNAKAN PHP DAN MYSQL

SKRIPSI

Ditujukan Untuk Memenuhi Salah Satu Syarat

Memperoleh Gelar Sarjana Teknik Jurusan Teknik Informatika

Disusun Oleh:

Johanes Gunawan Adinata

005314037

JURUSAN TEKNIK INFORMATIKA

FAKULTAS TEKNIK

UNIVERSITAS SANATA DHARMA

YOGYAKARTA

(2)

WEBSITE DEVELOPMENT OF ST.MIKAIL

BALIKPAPAN CATHOLIC SECONDARY SCHOOL

INCLUDING ACADEMIC INFORMATION SYSTEM

AND CONTENT MANAGEMENT SYSTEM

USING PHP AND MYSQL

MINITHESIS

Presented As a Partial Fulfillment of The Requirement to Obtain

The Sarjana Teknik Degree in Informatics Engineering

Prepared By:

Johanes Gunawan Adinata

005314037

DEPARTMENT OF INFORMATICS ENGINEERING

FACULTY OF ENGINEERING

SANATA DHARMA UNIVERSITY

YOGYAKARTA

2007

(3)

(4)

(5)

(6)

vi

HALAMAN PERSEMBAHAN

Karya ini kupersembahkan untuk :

Almamaterku SMP Katolik St.Mikail Balikpapan

(7)

vii

HALAMAN MOTTO

Saat dirimu berbeban berat, mohon dan menangislah pada

Tuhan. Pasrahkan segala masalahmu padaNya dan kamu akan

takjub akan jawaban yang Ia berikan.

(dr. Yustinus Henry Yogatama)

What You See Is What You Get

- W Y S I W Y G -

(8)

viii

ABSTRAKSI

Website SMP K St.Mikail Balikpapan dikembangkan menggunakan bahasa

pemrograman web PHP dan database MySQL, terdiri dari modul-modul website

dinamis yang ditujukan dan disesuaikan untuk kebutuhan masing-masing pengguna

web.

Secara umum, modul-modul website dibagi menjadi 4 bagian yaitu modul

untuk pengelolaan calon siswa baru, modul-modul Sistem Informasi Akademik,

modul-modul

Content Management System

dan modul untuk pengelolaan alumni.

Terdapat 7 kategori pengguna website yaitu superadmin, admin, guru,

karyawan, siswa-siswi, alumni dan pengunjung umum yang akan memperoleh

fasilitas umum dan fasilitas khusus sesuai dengan peranannya.

(9)

ix

ABSTRACT

Website SMP K St.Mikail Balikpapan is develop using web programming

language PHP and database MySQL, contain of dynamic web applications which is

concern and agree with need of each user.

Generally, modules are divided in four section, they are module for candidate

of new student management, Academic Information System modules, Content

Management System modules and module for alumnus management.

There are seven category of user website, they are superadmin, admin, teachers,

employees, students, alumnus and general user that will get general facility and

specific facility which is agree with user characteristic.

(10)

x

KATA PENGANTAR

Puji syukur kepada Tuhan Yang Maha Esa atas terselesaikannya tugas akhir

yang berjudul “Pengembangan Website SMP Katolik St.Mikail Balikpapan Meliputi

Sistem Informasi Akademik Dan

Content Management System

Menggunakan PHP

Dan MySQL”. Tugas akhir ini disusun sebagai salah satu syarat untuk memperoleh

gelar Sarjana Teknik jurusan Teknik Informatika.

Tentu saja keberhasilan yang dicapai penulis selama ini tidak terlepas dari

dukungan berbagai pihak yang selama ini telah memberikan dukungan baik secara

langsung maupun tidak langsung dalam berbagai bentuk sehingga tugas akhir ini

dapat diselesaikan sesuai dengan harapan. Untuk itu, penulis ingin menyampaikan

ucapan terima kasih yang sebesar-besarnya kepada :

1. Drs. Haris Sriwindono, M.Kom. selaku Dosen Pembimbing penulis, yang selalu

memberikan kepercayaan dan motivasi untuk terus maju dan berkembang.

2. Agnes Maria Polina, S.Kom, M.Sc., selaku Ketua Jurusan Teknik Informatika

Universitas Sanata Dharma dan panitia penguji pada saat ujian pendadaran

penulis..

3. Alb.Agung Hadhiatma, S.T., M.T., dan Cosmas Bramono, S.T., selaku panitia

penguji pada saat ujian pendadaran penulis..

4. Seluruh dosen pengajar Jurusan Teknik Informatka pada khususnya, staf

sekretariat fakultas Teknik, staf BAPSI, staf BAA dan staf AUK pada umumnya.

5. Staf Yayasan Budi Bhakti Karya MASF Balikpapan, Kepala Sekolah, Guru dan

(11)

(12)

xii

DAFTAR ISI

Halaman

HALAMAN JUDUL...

i

HALAMAN PERSETUJUAN ... iii

HALAMAN PENGESAHAN ... iv

2.1.Teknologi Internet... 9

2.1.1.HTTP... 10

2.1.2.WWW ... 11

2.1.3.URL ... 12

2.2.Pengantar HTML ... 13

2.2.1.Struktur Dokumen HTML ... 14

2.2.2.Struktur Tag dan Atribut HTML... 15

2.3.CSS ... 17

2.4.Aplikasi Web Dinamis ... 19

2.5.Model Proses dan Paradigma Rekayasa Perangkat Lunak ... 23

2.5.1.Modified Waterfall Model ... 23

2.5.2.Paradigma Konvensional ... 26

2.6.Diagram Arus Data ... 27

2.7.Entity Relational Diagram ... 29

2.8.Apache Web Server... 32

2.9.PHP ... 33

2.9.1.Dasar-dasar PHP ... 34

2.9.2.Variabel dan Tipe Data ... 35

2.9.3.Konstranta dan Operator ... 37

2.9.4.Fungsi... 40

(13)

xiii

BAB III ANALISA DAN PERANCANGAN SISTEM ... 42

3.1.Analisa Sistem... 42

3.1.1.Gambaran Umum SMP K St.Mikail Balikpapan ... 42

3.1.2.Definisi Sistem ... 43

3.1.3.Kebutuhan Sistem ... 49

3.1.3.1.Sumber Daya Manusia ... 49

3.1.3.2.Kebutuhan Perangkat Keras... 51

3.1.3.3.Kebutuhan Perangkat Lunak ... 52

3.1.4.Logical Design ... 52

3.1.4.1.Diagram Konteks ... 52

3.1.4.2.Diagram Berjenjang ... 54

3.1.4.3.Diagram Arus Data ... 59

3.1.5.Entity Relational Diagram (ER Diagram)... 84

3.2.Perancangan Sistem ... 89

3.2.1.Desain Database ... 89

3.2.1.1.Relasi Antar Tabel... 89

3.2.1.2.Physical Database... 92

3.2.2.Desain Arsitektur Website ... 108

3.2.2.1.Struktur Halaman Web Superadmin ... 108

3.2.2.2.Struktur Halaman Web Admin ... 110

3.2.2.3.Struktur Halaman Web Guru ... 111

3.2.2.4.Struktur Halaman Web Karyawan ... 111

3.2.2.5.Struktur Halaman Web Siswa ... 112

3.2.2.6.Struktur Halaman Web Alumni ... 112

3.2.2.7.Struktur Halaman Web User Umum ... 113

BAB IV IMPLEMENTASI SISTEM ... 114

4.1.Lingkungan Implementasi ... 114

4.1.1.Perangkat Keras ... 114

4.1.2.Perangkat Lunak ... 115

4.1.3.Konfigurasi File config.php ... 116

4.1.4.File Pendukung ... 117

4.2.Implementasi Program ... 140

4.2.1.Implementasi Superadmin... 141

4.2.2.Implementasi Admin... 166

4.2.3.Implementasi Guru... 270

4.2.4.Implementasi Karyawan... 278

4.2.5.Implementasi Siswa ... 280

4.2.6.Implementasi Alumni... 286

4.2.7.Implementasi User Umum ... 296

BAB V EVALUASI HASIL IMPLEMENTASI ... 330

5.1.Analisa Hasil dan Manfaat ... 330

5.2.Analisa Perangkat Lunak Pengembang Website... 332

5.2.1.Metode Rekayasa Perangkat Lunak ... 332

5.2.2.Perangkat Lunak Pengembang Website... 333

5.3.Evaluasi Program ... 338

(14)

xiv

5.3.2.Kekurangan Website ... 341

BAB VI PENUTUP ... 342

6.1.Kesimpulan ... 342

6.2.Saran ... 343

LAMPIRAN

REVISI

(15)

xv

Gambar 3.2

Diagram Berjenjang Superadmin ... 55

Gambar 3.3

Diagram Berjenjang Superadmin Lanjutan ... 56

Gambar 3.4

Diagram Berjenjang Superadmin lanjutan 2 ... 57

Gambar 3.5

Diagram Berjenjang Admin ... 57

Gambar 3.6

Diagram Berjenjang Guru ... 57

Gambar 3.7

Diagram Berjenjang Karyawan ... 58

Gambar 3.8

Diagram Berjenjang Siswa ... 58

Gambar 3.9

Diagram Berjenjang Alumni ... 58

Gambar 3.10 Diagram Berjenjang User Umum ... 60

Gambar 3.11 Overview Diagram Superadmin ... 61

Gambar 3.12 Level 1 Proses 3 Superadmin ... 59

Gambar 3.27 Level 2 Proses 8.10 Superadmin... 70

Gambar 3.28 Level 2 Proses 8.12 Superadmin... 71

Gambar 3.29 Level 2 Proses 8.13 Superadmin... 72

Gambar 3.30 Level 2 Proses 8.14 Superadmin... 73

(16)

xvi

Gambar 3.37 Level 0 (Overview Diagram) Karyawan ... 78

Gambar 3.38 Level 1 Proses 2 Karyawan ... 78

Gambar 3.51 Entity Relational Diagram... 87

Gambar 3.52 Entity Relational Diagram Lanjutan ... 88

Gambar 3.53 Relasi Tabel ... 89

Gambar 3.54 Relasi Tabel Lanjutan 1 ... 90

Gambar 3.55 Relasi Tabel Lanjutan 2 ... 91

Gambar 3.56 Site Map Superadmin ... 109

Gambar 3.57 Site Map Admin ... 110

Gambar 3.58 Site Map Guru ... 111

Gambar 3.59 Site Map Karyawan ... 111

Gambar 3.60 Site Map Siswa ... 112

Gambar 3.61 Site Map Alumni ... 112

Gambar 3.62 Site Map User Umum ... 113

Gambar 4.1

Status Service Apache & Mysql ... 115

Gambar 4.2a Output gagal koneksi ... 118

Gambar 4.2b Output gagal memilih database ... 118

Gambar 4.3

Output Blok Login ... 123

Gambar 4.4

Ouput Fungsi GetGuru ... 123

Gambar 4.5

Ouput Fungsi GetTgsAjar ... 124

Gambar 4.6

Ouput Fungsi GetStatusPegawai ... 124

Gambar 4.7

Ouput Fungsi GetTingkat... 125

Gambar 4.8

Ouput Fungsi GetKelas ... 125

Gambar 4.9

Ouput Fungsi GetRuang ... 125

Gambar 4.10 Ouput Fungsi GetCatGaleri ... 126

Gambar 4.11 Ouput Fungsi GetCatGaleriAlumni ... 126

Gambar 4.12 Ouput Fungsi GetCatArtikel ... 127

Gambar 4.13 Ouput Fungsi menuKelas ... 127

(17)

xvii

Gambar 4.15 Output fungsi messages ... 130

Gambar 4.16 Output fungsi pengumuman ... 130

Gambar 4.17 Ouput Fungsi displayGrafik ... 131

Gambar 4.18 Output fungsi getArtikel ... 132

Gambar 4.19 Ouput Fungsi getYearAlumni ... 133

Gambar 4.20 Ouput Fungsi pagination ... 133

Gambar 4.21 Ouput Fungsi queryMsg ... 134

Gambar 4.22 Ouput Fungsi pesan_validasi ... 135

Gambar 4.23 Ouput Fungsi ilegalAccess ... 135

Gambar 4.24 Ouput Fungsi errorpsb ... 136

Gambar 4.25 Ouput Fungsi notfound ... 136

Gambar 4.26 Ouput Fungsi errorAlbum ... 137

Gambar 4.27 Ouput Fungsi underconstruction ... 137

Gambar 4.28 Ouput Fungsi frame ... 138

Gambar 4.29 Ouput Fungsi step ... 138

Gambar 4.30 Ouput Fungsi stepSem ... 138

Gambar 4.31 Ouput Fungsi whosonline ... 139

Gambar 4.32 Halaman utama modul Admin ... 142

Gambar 4.33 Preview data ... 142

Gambar 4.34 Form tambah data admin... 144

Gambar 4.35 Form edit data admin ... 147

Gambar 4.36 Konfirmasi hapus data ... 149

Gambar 4.37 Konfirmasi hapus multi data ... 149

Gambar 4.38 Halaman utama modul Database ... 151

Gambar 4.39 Konfirmasi & proses backup database ... 152

Gambar 4.40 Konfirmasi & proses restore database ... 155

Gambar 4.41 Halaman utama modul Group ... 156

Gambar 4.42 Form tambah/edit modul ... 157

Gambar 4.43 Popup icon modul ... 158

Gambar 4.44 Proses aktifasi modul ... 159

Gambar 4.45 Form web config ... 162

Gambar 4.46 Halaman utama Level ... 163

Gambar 4.47 Form konfigurasi PSB ... 164

Gambar 4.48 Form edit account login admin ... 165

Gambar 4.49 Halaman profil sekolah ... 167

Gambar 4.50 Form edit profil sekolah ... 168

Gambar 4.51 Halaman utama modul Bukutamu ... 169

Gambar 4.52 Form tanggapan ... 170

Gambar 4.53 Halaman utama modul Galeri Foto ... 171

Gambar 4.54 Form tambah/edit album foto... 172

Gambar 4.55 Detail album foto ... 175

Gambar 4.56 Form tambah foto ... 177

Gambar 4.57 Form edit foto... 178

Gambar 4.58 Detail foto ... 180

Gambar 4.59 Daftar polling ... 181

(18)

xviii

Gambar 4.61 Form edit polling ... 183

Gambar 4.62 Daftar Artikel ... 185

Gambar 4.63 Form tambah artikel ... 187

Gambar 4.64 Form edit artikel ... 188

Gambar 4.65 Halaman daftar kategori artikel ... 190

Gambar 4.66 Form tambah/edit kategori artikel ... 192

Gambar 4.67 Daftar messages ... 193

Gambar 4.68 Form tambah/edit messages ... 194

Gambar 4.69 Preview messages ... 196

Gambar 4.70 Daftar pengumuman ... 197

Gambar 4.71 Form tambah/edit pengumuman ... 198

Gambar 4.72 Preview pengumuman ... 199

Gambar 4.73 Halaman utama modul PSB ... 202

Gambar 4.74 Form tambah/edit data calon siswa baru ... 203

Gambar 4.75 Form edit skor tes calon siswa baru ... 206

Gambar 4.76 Daftar guru ... 208

Gambar 4.77 Daftar siswa ... 209

Gambar 4.78 Form tambah/edit data guru atau karyawan ... 210

Gambar 4.79 Form tambah/edit data siswa ... 215

Gambar 4.80 Halaman utama modul Alumni ... 222

Gambar 4.81 Daftar registrasi alumni ... 223

Gambar 4.82 Daftar siswa Kelas III yang lulus ... 223

Gambar 4.83 Form tambah/edit data alumni ... 224

Gambar 4.84 Daftar jadwal tugas mengajar ... 232

Gambar 4.85 Daftar hari ... 233

Gambar 4.86 Daftar ruang ... 233

Gambar 4.87 Form tambah/edit jadwal ... 235

Gambar 4.88 Form edit hari ... 236

Gambar 4.89 Form tambah/edit ruang ... 237

Gambar 4.90 Daftar nilai siswa ... 240

Gambar 4.91 Form edit nilai siswa ... 241

Gambar 4.92 Daftar mata pelajaran ... 243

Gambar 4.93 Form tambah/edit mata pelajaran ... 245

Gambar 4.94 Daftar aspek ... 249

Gambar 4.95 Form tambah/edit aspek ... 249

Gambar 4.96 Daftar tugas mengajar guru... 251

Gambar 4.97 Form tambah tugas mengajar ... 253

Gambar 4.98 Daftar kelas ... 254

Gambar 4.99 Form tambah/edit kelas ... 255

Gambar 4.100 Daftar tahun pelajaran ... 257

Gambar 4.101 Tahap 1 proses pergantian tahun pelajaran ... 259

Gambar 4.102 Tahap 2 proses pergantian tahun pelajaran ... 260

Gambar 4.103 Tahap 3 proses pergantian tahun pelajaran ... 262

Gambar 4.104 Tahap 4 proses pergantian tahun pelajaran ... 264

Gambar 4.105 Daftar semester ... 265

(19)

xix

Gambar 4.107 Tahap 2 proses pergantian semester ... 268

Gambar 4.108 Tahap 3 proses pergantian semester ... 269

Gambar 4.109 Halaman utama guru ... 271

Gambar 4.110 Data profil guru ... 272

Gambar 4.111 Form edit profil ... 273

Gambar 4.112 Form edit data login ... 276

Gambar 4.113 Jadwal mengajar guru ... 277

Gambar 4.114 Daftar nilai siswa ... 278

Gambar 4.115 Halaman utama karyawan ... 279

Gambar 4.116 Halaman utama siswa ... 281

Gambar 4.117 Jadwal pelajaran siswa ... 282

Gambar 4.118 Nilai raport semester siswa ... 285

Gambar 4.119 Daftar foto album alumni ... 286

Gambar 4.120 Form tambah/edit album foto alumni ... 287

Gambar 4.121 Detail album foto alumni ... 288

Gambar 4.122 Form tambah foto alumni ... 292

Gambar 4.123 Form edit foto alumni ... 293

Gambar 4.124 Detail foto alumni ... 296

Gambar 4.125 Halaman utama website ... 297

Gambar 4.126 Halaman profil sekolah ... 298

Gambar 4.127 Halaman utama calon siswa baru ... 299

Gambar 4.128 Informasi pendaftaran calon siwa baru ... 301

Gambar 4.129 Form registrasi calon siwa baru ... 302

Gambar 4.130 Daftar staf pengajar ... 304

Gambar 4.131 Biodata guru ... 306

Gambar 4.132 Daftar karyawan ... 307

Gambar 4.133 Biodata karyawan ... 308

Gambar 4.134 Daftar siswa-siswi per kelas ... 309

Gambar 4.135 Biodata siswa ... 311

Gambar 4.136 Daftar alumni ... 311

Gambar 4.137 Biodata dan album foto alumni ... 313

Gambar 4.138 Detail album alumni ... 314

Gambar 4.139 Form registrasi alumni ... 316

Gambar 4.140 Daftar artikel ... 318

Gambar 4.141 Detail artikel ... 319

Gambar 4.142 Form kirim artikel ... 321

Gambar 4.143 Daftar album foto galeri ... 322

Gambar 4.144 Detail album foto galeri ... 324

Gambar 4.145 Daftar komentar bukutamu ... 326

Gambar 4.146 Form kirim komentar ... 327

Gambar 4.147 Daftar polling ... 328

Gambar 4.148 Detail polling ... 328

Gambar 5.1

Interface Macromedia Dreamweaver MX ... 334

Gambar 5.2

Interface Photoshop 7.0 ... 336

Gambar 5.3

Interface PHPMyAdmin ... 337

(20)

xx

Tabel 3.1

Identifikasi Masukan dan Keluaran ... 53

Tabel 3.2

Tabel admin ... 92

Tabel 3.3

Tabel alumni ... 92

Tabel 3.4

Tabel alumni_foto ... 93

Tabel 3.5

Tabel alumni_foto_album ... 93

Tabel 3.6

Tabel alumni_registrasi ... 93

Tabel 3.7

Tabel artikel ... 94

Tabel 3.24

Tabel modul_admin ... 100

Tabel 3.25

Tabel modul_group ... 101

Tabel 3.26

Tabel nilai_semester ... 101

Tabel 3.27

Tabel nilai_semester_history ... 101

Tabel 3.28

Tabel pengumuman ... 102

Tabel 3.29

Tabel polling ... 102

Tabel 3.30

Tabel polling_item ... 103

Tabel 3.31

Tabel profil_sekolah ... 103

Tabel 3.32

Tabel psb ... 103

Tabel 3.33

Tabel ruang ... 104

Tabel 3.34

Tabel semester ... 104

Tabel 3.35

Tabel session ... 105

Tabel 3.36

Tabel siswa ... 105

Tabel 3.37

Tabel status_pegawai ... 107

(21)

xxi

(22)

1.1.Latar Belakang Masalah

SMP Katolik St.Mikail merupakan salah satu instansi pendidikan swasta

tingkat menengah yang cukup terkenal di kota Balikpapan, Kalimantan Timur.

Peranannya dalam mencerdaskan kehidupan bangsa dengan kegiatan belajar

mengajar baik intra maupun ektra kurikuler dapat disejajarkan dengan

sekolah-sekolah unggulan lainnya. Hal ini ditandai dengan status akreditasi A yang disandang

oleh sekolah serta lulusan dengan nilai Ujian Akhir Nasional (UAN) terbaik di kota

Balikpapan. Selain itu, prestasi akademik dan non akademik juga sering diraih baik

untuk tingkat kotamadya maupun propinsi.

Ketatnya persaingan untuk sekolah-sekolah unggulan tingkat menengah di kota

Balikpapan, menyebabkan minat para calon siswa baru untuk masuk ke SMP Katolik

St.Mikail sedikit mengalami penurunan daripada tahun-tahun sebelumnya. Namun

demikian, pihak sekolah tetap melakukan promosi untuk menjaring calon-calon

siswa baru yang berasal dari dalam maupun luar kota Balikpapan melalui

pengumuman di media cetak, spanduk, brosur dan lain sebagainya. Untuk keperluan

promosi tersebut pihak sekolah membutuhkan anggaran yang tidak sedikit agar

kegiatan promosi dapat berjalan lancar.

Hubungan antara pihak sekolah dengan alumni juga terbina dengan baik, hal

ini dibuktikan dengan inisiatif yang tinggi dari para alumni untuk menyemarakkan

kegiatan Reuni Emas tahun 2008 dalam kepanitiaan yang akan dibentuk dalam

(23)

beberapa waktu mendatang. Salah satu masalah yang muncul adalah kebutuhan data

yang menyangkut informasi para alumnus saat ini, seperti alamat rumah, nomor

telepon, alamat e-mail, dan sebagainya belum sepenuhnya dapat diatasi, mengingat

data yang disimpan oleh pihak sekolah merupakan informasi terakhir pada saat siswa

dinyatakan lulus dari sekolah. Untuk sementara informasi terbaru mengenai data

alumni yang dibutuhkan hanya diperoleh dari beberapa alumnus yang tergabung

dalam milis groups.alumnirk.yahoo.com.

Di lain pihak, teknologi informasi berkembang dengan pesat. Keterhubungan

global melalui media internet memungkinkan informasi dapat diperoleh kapanpun

dan dimana saja selama akses internet tidak terputus. Salah satu produk teknologi

informasi yang dapat diakses melalui media internet adalah website yang saat ini

mengalami kemajuan pesat dengan berkembangnya beberapa bahasa pemrograman

web seperti PHP, ASP, Perl dan lain sebagainya.

Melalui website, informasi yang disajikan lebih bervariasi meliputi teks,

gambar, suara, video atau gabungan dari beberapa format informasi yang ada.

Disamping itu, dengan menggunakan bahasa pemrograman web dan database

sebagai media penyimpanan data, aplikasi-aplikasi web dinamis dapat dikembangkan

oleh webmaster dan selanjutnya melalui aplikasi-aplikasi tersebut, pengguna dapat

mengelola informasi yang disajikan pada setiap halaman-halaman web.

Selanjutnya dalam penelitian ini, akan dikembangkan website dinamis

menggunakan bahasa pemrograman web PHP dan database MySQL yang meliputi

pengembangan aplikasi-aplikasi web dinamis. Pengembangan aplikasi-aplikasi web

(24)

baru, aplikasi Sistem Informasi Akademik (disingkat menjadi SIA), aplikasi

Content

Management System

(disingkat menjadi CMS) dan aplikasi web untuk pengelolaan

alumni.

Untuk aplikasi SIA meliputi pengelolaan data induk guru, karyawan dan siswa,

pengelolaan mata pelajaran dan aspek penilaian, pengelolaan tugas mengajar guru,

penjadwalan tugas mengajar dengan sistem

moving class

dan penjadwalan guru piket

serta pengelolaan ruang belajar, pengelolaan nilai raport semester siswa, pengelolaan

data kelas beserta guru wali kelas, pengelolaan proses pergantian tahun pelajaran dan

pergantian semester. Sedangkan untuk aplikasi CMS meliputi pengelolaan informasi

umum yang terdiri dari profil sekolah, artikel, galeri foto, bukutamu, pengumuman,

salam pembuka dan polling.

Pengelolaan informasi dilakukan oleh beberapa admin yang ditunjuk oleh

superadmin agar lebih terfokus pada tugas pokok admin untuk mengelola

informasi-informasi yang berhubungan dengan aplikasi-aplikasi web yang menjadi

kewenangannya. Disamping itu, semua elemen sekolah yang meliputi guru,

karyawan siswa serta alumni akan dilibatkan dalam keanggotaan website untuk

memperoleh dan mengelola informasi sesuai dengan perannya masing-masing..

1.2.Rumusan Masalah

Rumusan masalah dalam penelitian ini adalah sebagai berikut:

1. Bagaimana cara mengembangkan aplikasi-aplikasi

1

website dinamis

menggunakan bahasa pemrograman web PHP dan

database

MySQL.

1

(25)

2. Apakah fasilitas yang disediakan dapat memberikan kemudahan kepada

pengguna website untuk berinteraksi baik mengakses informasi seputar sekolah

maupun meng-

update

data yang selanjutnya akan ditampilkan pada website SMP

K St.Mikail Balikpapan

2

.

1.3.Batasan Masalah

Penelitian yang dilakukan oleh penulis menyangkut masalah data yang sangat

besar dan kompleks, selain itu, mengingat juga masalah waktu dan minimnya tenaga

pengembang website dalam penelitian ini. Oleh karena itu, untuk memusatkan

penelitian pada pokok-pokok masalah yang diangkat oleh penulis, maka pembahasan

masalah pada penelitian ini dibatasi pada hal-hal sebagai berikut:

1. Studi kasus yang dilakukan oleh penulis hanya pada lingkup SMP Tomik.

2. Beberapa modul yang dikembangkan seperti nilai siswa, pembagian tugas

mengajar guru, jadwal tugas mengajar, jadwal piket dan wali kelas, mata

pelajaran, aspek penilaian, mengacu pada sistem berlaku di SMP Tomik. Dalam

hal ini, kurikulum yang digunakan oleh sekolah menggunakan sistem semester,

setiap mata pelajaran memiliki beberapa aspek nilai, dan penjadwalan mata

pelajaran disesuaikan dengan tugas mengajar guru dan mengacu pada

penggunaan ruang belajar.

3. Data yang digunakan pada fasilitas profil sekolah adalah sejarah, visi dan misi,

struktur organisasi, kalender akademik, logo yayasan dan denah sekolah.

2

(26)

4. Data yang digunakan untuk identitas pada fasilitas registrasi calon siswa baru,

data guru dan karyawan, data siswa serta data alumni disesuaikan dengan

kebutuhan pada umumnya baik oleh pengunjung website, pemilik identitas yang

bersangkutan dan keperluan oleh pihak sekolah.

5. Data yang digunakan untuk guru, siswa, karyawan, alumni, nilai, jadwal, mata

pelajaran, tugas mengajar, piket guru, wali kelas, dan profil sekolah, mengacu

pada data-data yang diterima oleh penulis dari pihak sekolah.

6. Pada fasilitas polling, alamat IP digunakan untuk mewakili satu suara.

7. Tidak membahas mekanisme permintaan password.

8. Pengiriman email pada beberapa modul hanya memanfaatkan fungsi

mail();

pada PHP dan selanjutnya tidak dibahas mengenai konfigurasi maupun

mekanisme untuk pengiriman email tersebut. Penanganan yang dilakukan jika

pengiriman email tidak berhasil adalah email ditulis pada file email.txt.

9. Keamanan pada fasilitas web hanya dilakukan dengan menyediakan fasilitas

login kepada pengguna tertentu untuk mengakses fasilitas khusus yang ditujukan

untuk pengguna tersebut. Masalah faktor keamanan lainnya tidak dibahas.

10. Data yang tampil pada jadwal hanya data tugas mengajar guru. Untuk data

kegiatan seperti upacara, kerja kelas dan katolisitas tidak ditampilkan.

1.4.Tujuan Penelitian

Tujuan dari penelitian ini adalah mengembangkan website untuk SMP Tomik

dengan membangun modul-modul website untuk kebutuhan sebuah website dinamis

(27)

1.5.Manfaat Penelitian

Beberapa manfaat yang dapat diperoleh dari hasil perancangan website ini

antara lain sebagai berikut:

1. Informasi mengenai sekolah dapat diperoleh kapan dan dimana saja dengan cepat

dan tepat melalui media internet.

2. Website dapat menjadi media promosi dan studi banding yang efektif dan efisien

kepada calon siswa dan sekolah lain terutama yang berasal dari luar daerah.

3. Melalui modul-modul yang dirancang, proses penambahan maupun update data

untuk halaman website membutuhkan waktu yang relatif cepat. Sehingga

informasi yang disajikan lebih

up to date

.

4. Dengan adanya multi admin dengan masing-masing tugas pokoknya, penanganan

maintenance content

website yang menyangkut tugas yang banyak dan data

dalam jumlah besar dapat diatasi.

1.6.Metode Penelitian

Metodologi yang digunakan penulis dalam penelitian ini adalah menyangkut 5

tahap dalam proses pengembangan sistem

Modified Waterfall Model

sebagai berikut:

1. Problem Definition

Pendefinisian masalah dilakukan dalam 2 proses sebagai berikut:

a.

Studi Pustaka

Mempelajari teknik pengembangan website dan aplikasinya menggunakan

PHP dan MySQL dari berbagai sumber seperti buku, modul kuliah,

source

(28)

b.

Studi Kasus

Melakukan survei ke SMP Tomik untuk memperoleh informasi dan data-data

yang dibutuhkan dalam perancangan website.

2. Requirement Analysis & Spesification

Berdasarkan data-data yang diperoleh, selanjutnya dilakukan analisis kebutuhan

website, merancang struktur database dan struktur website, mendesain

user interface

(antarmuka / halaman) website.

3. Design & Prototyping

Pada tahap ini dilakukan pembuatan

prototype

HTML yang selanjutnya

digunakan sebagai

template

halaman web untuk modul-modul web yang

membutuhkannya. Selain itu, membuat desain

database

beserta tabel-tabel yang

dibutuhkan.

4. Implementation & Unit Testing

Pada tahap ini dilakukan uji coba aplikasi website dan merevisi

kekurangan-kekurangan yang terdapat baik pada desain halaman maupun proses-proses yang

terjadi pada setiap modul yang dirancang sampai pada hasil yang maksimal.

5. Integration & System Testing

Tahap akhir dalam metodologi penelitian ini adalah proses penggabungan

keseluruhan aplikasi web yang telah dibangun. Selanjutnya dilakukan uji coba pada

(29)

1.7.Sistematika Penulisan

BAB I PENDAHULUAN

Membahas latar belakang, rumusan masalah, batasan masalah, tujuan dan

manfaat penelitian, metode penelitian dan sistematika penulisan.

BAB II LANDASAN TEORI

Berisi dasar teori yang digunakan sebagai acuan dalam penelitian ini.

BAB III ANALISIS DAN PERANCANGAN SISTEM

Berisi tahap analisis dan perancangan website yang meliputi gambaran

umum sekolah, analisis kebutuhan website, pemodelan proses dan

pemodelan data serta perancangan

database

.

BAB IV IMPLEMENTASI SISTEM

Berisi tahap implementasi dan analisa hasil pengembangan modul-modul

website yang telah dirancang berupa hasil

input

dan

output

pada halaman

web.

BAB V EVALUASI HASIL IMPLEMENTASI

Berisi analisa hasil dan manfaat, analisa perangkat lunak pengembang

website yang meliputi metode pengembangan website yang digunakan dan

perangkat-perangkat lunak yang digunakan dalam perancangan website,

serta kelebihan dan kekurangan program.

BAB VI KESIMPULAN DAN SARAN

Berisi kesimpulan yang diperoleh penulis dari hasil penelitian ini serta

(30)

2.1.Teknologi Internet

Secara teknis, internet atau

international networking

merupakan dua komputer

atau lebih yang saling berhubungan membentuk jaringan komputer hingga meliputi

jutaan komputer di dunia (internasional), yang saling berinteraksi dan bertukar

informasi. Sedangkan dari segi ilmu pengetahuan, internet merupakan sebuah

perpustakaan besar yang didalamnya terdapat jutaan (bahkan milyaran) informasi

atau data yang dapat berupa teks, gambar, suara maupun animasi dan lain-lain dalam

bentuk media elektronik (Yuhefizar-2003).

Komunikasi pada jaringan komputer diatur oleh protokol-protokol yang

mempunyai tugas dan fungsi berbeda satu dengan yang lain. TCP/IP (

Transmission

Control Protocol/Internet Protocol

) adalah protokol yang digunakan untuk mengatur

komunikasi dalam jaringan komputer yang meliputi tugas dan fungsi proses transfer

informasi sepanjang jaringan. Protokol TCP bertanggung jawab memecah informasi

ke dalam beberapa paket, sedangkan IP bertanggung jawab dalam menangani

transmisi data yang sebenarnya yaitu mengangkut (mentransfer) paket-paket tersebut

sesuai dengan tujuannya. Kemudian protokol TCP kembali bertugas menyatukan

kembali paket-paket ke dalam urutan yang benar.

Beberapa hal yang menyebabkan jaringan dan Teknologi Internet populer

sebagai media komunikasi data (Wigrantoro&Mirna-2003) :

a.

Distribusi geografis mencakup seluruh dunia.

(31)

b.

Kecepatan operasi sesuai dengan waktu yang sesungguhnya (

real-time speed

).

c.

Akses internet bersifat

universal

, siapapun dapat mengakses internet dengan

jaringan internet.

d.

Implementasinya relatif lebih murah dibandingkan dengan menggunakan

jaringan atau fasilitas lainnya, misalnya menggunakan

Value Added Network

(VAN) sendiri.

e.

Teknologi Internet yang terbuka (

open standard

) sehingga tidak tergantung

kepada satu vendor tertentu. Implementasi Teknologi Internet, TCP/IP, tersedia

di semua

platform

komputer (Microsoft Windows, Apple, UNIX, Linux, dan

lainlainnya).

Teknologi Internet juga memungkinkan konvergensi berbagai aplikasi menjadi

satu. Sebagai contoh, saat ini telah dimungkinkan untuk mengirimkan data, suara,

dan bahkan gambar melalui satu media Internet. Implikasinya adalah penghematan

biaya bagi pihak terkait dalam mendistribusikan informasi dalam bentuk data, teks,

suara dan gambar.

2.1.1.HTTP

Hypertext Transfer Protocol

merupakan suatu protokol yang mengatur

komunikasi antara web server dan browser sebagai

client

. Koneksi web server dan

browser bersifat

stateless

, artinya koneksi dibangun ketika browser mengirimkan

request

ke web server dan pemutusan koneksi ketika browser telah menerima

response

dari web server. Protokol ini bertugas menangani permintaan-permintaan

(32)

Setiap

request

dari browser akan dilayani dan ditangani sebagai satu koneksi yang

terpisah.

Protokol HTTP merupakan suatu protokol sederhana berbasis teks yang

mendukung beberapa metode sebagai berikut (Restyandito-2004):

b.

HEAD : web server hanya mengembalikan

header fields

tanpa data yang

disimpan pada URL dalam

request

.

c.

GET: mengambil data apa saja yang disimpan pada URL dalam

request

.

Parameter dalam

request

harus disimpan dalam URL.

d.

POST : mengambil data apa saja yang disimpan pada URL dalam

request.

parameter untuk

request

disimpan dalam

header fields

khusus.

e.

DELETE : menghapus data pada URL di web server, biasanya tidak diijinkan

karena alasan keamanan.

f.

TRACE, CONNECT, OPTIONS : metode untuk menganalisis dan men-

debug

koneksi, biasanya tidak pernah dipakai oleh pemakai.

2.1.2.WWW

World Wide Web

atau web adalah salah satu dari sekian banyak layanan yang

terdapat di internet. Layanan ini paling banyak digunakan di internet untuk

menyampaikan informasi karena sifatnya mendukung multimedia. Artinya informasi

tidak hanya disampaikan melalui teks, tapi juga gambar, video dan suara.

Pada prinsipnya WWW berkerja dengan menampilkan file-file HTML dari web

server yang diminta oleh web browser. File HTML berisi instruksi-instruksi (tag)

(33)

Gambar 2.1 – Konsep dasar web browser dan web server

WWW bekerja merdasarkan pada tiga mekanisme berikut:

Browser mengirim

request

Server mengirimkan

dokumen yang diminta

(

response

)

a.

Protokol standard aturan yang di gunakan untuk berkomunikasi pada jaringan

komputer.

b.

Address

WWW memiliki aturan penamaan alamat web yaitu URL (

Uniform

Resource Locator

) yang di gunakan sebagai standard alamat internet.

c.

HTML digunakan untuk membuat dokumen yang dapat di akses melalui

browser.

2.1.3.URL

Universal Resource Identifier

(URL) merupakan alat yang digunakan untuk

mengidentifikasikan sebuah obyek abstrak atau nyata (link). Sebuah URL

mempunyai tiga bagian dengan contoh sebagai berikut:

“

http://www.usd.ac.id/info/index.html

”

a.

Nama protokol yang dipakai untuk mengakses sumber (contoh:”

http

”).

b.

Nama komputer atau

hostname

yang menyediakan sumber

Contoh:

“

www.usd.ac.id

”

c.

Nama file lengkap dengan

dimana file disimpan

(34)

2.2.Pengantar HTML

HTML (

HyperText Mark up Language

) merupakan suatu metode untuk

mengimplementasikan konsep

hypertext

dalam suatu naskah atau dokumen. HTML

sendiri bukan tergolong pada suatu bahasa pemrograman karena sifatnya yang hanya

memberikan tanda (

marking up

) pada suatu naskah teks dan bukan sebagai program.

Berdasarkan kata-kata penyusunnya HTML dapat diartikan lebih dalam lagi

menjadi (JonMMx 2000):

a.

Hypertext

atau

link

hypertext

adalah kata atau frase yang dapat menunjukkan

hubungan suatu naskah dokumen dengan naskah-naskah lainnya. Jika pengguna

mengklik pada kata atau frase untuk mengikuti link ini maka web browser akan

memindahkan tampilan pada bagian lain dari naskah atau dokumen yang dituju.

b.

Markup

menunjukkan bahwa pada file HTML berisi suatu intruksi tertentu yang

dapat memberikan suatu format pada dokumen yang akan ditampilkan pada

World Wide Web

.

c.

Language

. HTML merupakan kumpulan dari beberapa instruksi yang dapat

digunakan untuk mengubah-ubah format suatu naskah atau dokumen.

Dengan demikian banyak hal yang dapat dilakukan dengan menggunakan

HTML untuk membuat sebuah web yang memberikan tampilan yang baik sesuai

dengan keinginan pemilik web maupun pengembang web, yaitu antara lain:

a.

Menentukan format suatu teks maupun dokumen HTML

b.

Membuat daftar (

list

) dalam bentuk kelompok-kelompok

c.

Membuat link ke dokumen lain atau bagian lain dari dokumen yang sama

(35)

e.

Menampilkan informasi dalam bentuk tabel

f.

Membentuk sebuah dokumen yang terdiri dari gabungan banyak dokumen dalam

bentuk frame.

2.2.1.Struktur Dokumen HTML

Dalam dokumen HTML, seluruh isi dari halaman terletak dalam pasangan tag

<html>…</html>.

Informasi dalam file HTML dibagi menjadi dua bagian, yaitu

Header (tag

<head>…</head>

) yang digunakan untuk menyimpan informasi

administratif dan sebuah Body

(tag

<body>…</body>)

yang digunakan untuk

meletakkan informasi-informasi yang akan ditampilkan.

Berikut ini merupakan struktur umum dokumen HTML:

<HTML>

<HEAD>

Bagian Head

</HEAD>

<BODY>

…Isi dokumen…

</BODY>

</HTML>

Pada bagian

head

, terdapat beberapa tag penting yang dapat digunakan untuk

memberikan informasi-informasi mengenai website namun tidak semua informasi

tersebut akan ditampilkan pada browser. Tag-tag yang dapat disisipkan pada bagian

head antara lain:

a.

Tag

<title>…</title>

, digunakan untuk menyimpan sebuah judul untuk

dokomen web. Judul ini akan ditampilkan pada

Title Bar

Browser. Bentuk

pemakaian tag ini adalah sebagai berikut:

(36)

b.

Tag

<base>

, digunakan untuk menentukan base URL untuk halaman web aktual

secara eksplisit, sehingga base URL bisa berbeda dengan nilai

default

-nya. Tag

ini juga dapat digunakan untuk menentukan frame

default

dalam penyusunan

sebuah halaman web yang terdiri dari beberapa frame. Bentuk pemakaian tag ini

adalah sebagai berikut:

<base href=”http://www.tomik-bpp.sch.id” target=”_blank”>

c.

Tag

<meta>

, digunakan untuk menyimpan informasi tambahan tentang halaman

HTML aktual, misalnya informasi mengenai penulis, kata kunci, dan lain

sebagainya. Tag ini juga dapat digunakan untuk mengalihkan arah halaman web

ke halaman yang lain. Bentuk pemakaian tag ini adalah sebagai berikut:

<meta name=”keyword” content=”sekolah, santo mikail”>

<meta http-equive=”Expires” content=”Wed, 20 Okt 2004”>

**<meta HTTP-equive=”REFRESH” content=”*5; URL=”index2.htm”>**

d.

Tag

<link>

, digunakan untuk mendefinisikan hubungan antara beberapa

halaman HTML. Bentuk pemakaian tag ini adalah sebagai berikut:

<link rel=”next” href=”chapter3.html”>

<link rel=”stylesheet” href=”style.css”>

2.2.2.Struktur Tag dan Atribut HTML

Struktur tag HTML memiliki tiga bagian utama, yaitu:

<Element Atribut = Value>

a.

Element

: nama tag HTML

b.

Atribut

: atribut dari tag HTML yang digunakan

(37)

Sebagai contoh:

<BODY BGCOLOR = Blue>

.

BODY

merupakan element dengan atribut

BGCOLOR

berwarna biru. Hasil yang akan ditampilkan dari penggunaan tag ini adalah

warna biru pada

background

halaman web.

Seperti yang telah diungkapkan sebelumnya, banyak hal yang dapat dilakukan

dalam membuat dokumen HTML dengan menggunakan tag-tag sesuai dengan

bentuk tampilan yang diinginkan.

Berikut ini merupakan beberapa tag-tag HTML secara umum yang dapat

digunakan dalam membuat dokumen HTML:

Tabel 2.1. – Daftar tag-tag HTML

Tag

K E T E R A N G A N

Memberi komentar atau keterangan. Kalimat yang terletak pada tag kontiner

ini tidak akan terlihat pada browser

<a href>

Membuat link ke halaman lain atau ke bagian lain dari halaman tersebut

<a name>

Membuat nama bagian yang didefinisikan pada link pada halaman yang sama

<applet>

Sebagai awal dari Java applets

<area>

Mendefinisikan daerah yang dapat diklik (link) pada image map

<b>

Membuat teks tebal

<basefont>

Membuat atribut teks

default

seperti jenis, ukuran dan warna font

<bgsound>

Memberi (suara latar)

background sound

pada halaman web

<blink>

Membuat teks berkedip

<body>

Tag awal untuk melakukan berbagai pengaturan terhadap text, warna link &

visited

link

<br> Pindah

baris

<caption> Membuat

caption

pada tabel

<center>

Untuk perataan tengah terhadap teks atau gambar

<comment>

Meletakkan komentar pada halaman web tidak tidak akan nampak pada

browser

<div>

Merepresentasikan bagian tertentu dari teks.

<embed>

Menambahkan sound atau file avi ke halaman web

<fn>

Seperti tag <a name>

<font>

Mengganti jenis, ukuran, warna huruf yang akan digunakan utk teks

<form> Mendefinisikan

input

form

<frame> Mendefinisikan

frame

<frameset>

Mendefinisikan attribut halaman yang akan menggunakan frame

<h1>...<h6> Ukuran

font

<head>

Mendefinisikan head document.

<hr>

Membuat garis horisontal

<html>

Berarti dokumen html

(38)

Tag

K E T E R A N G A N

<li>

Membuat

bullet point

atau baris baru pada list (berpasangan dengan tag

<dir>, <menu>, <ol> and <ul> )

<map>

Mendefinisikan client-side map

<marquee> Membuat scrolling teks (teks berjalan) - hanya pada MS IE

<nobr>

Mencegah ganti baris pada teks atau

images

<ol>

Mendefinisikan awal dan akhir list

<p> Ganti

paragraf

<pre>

Membuat teks dengan ukuran huruf yg sama

<script> Mendefinisikan

awal

script

<table> Membuat

tabel

<td>

Kolom pada tabel

<title> Mendefinisikan

title

<tr>

Baris pada tabel

<u>

Membuat teks bergaris bawah

2.3.CSS

Pada dasarnya, setiap dokumen HTML disusun menggunakan tag-tag HTML

yang memiliki atribut-atribut khusus menurut tag yang digunakan, dimana atribut

tersebut berfungsi untuk menentukan format tampilan dari dokumen HTML tersebut.

Untuk membentuk tampilan yang sama pada setiap dokumen HTML sehingga

tampilan website akan lebih konsisten, maka diperlukan pengaturan atribut-atribut

dari tag yang digunakan dalam setiap pembuatan sebuah dokumen. Dengan

penggunaan CSS,

style

tampilan dan struktur informasi dapat dipisahkan sehingga

akan menghemat waktu dan tenaga dalam pembuatan dokumen HTML dalam jumlah

yang banyak.

CSS (

Cascading Style Sheets

) digunakan dalam dokumen HTML untuk

menciptakan suatu kumpulan

style

yang dapat digunakan untuk memperluas

kemampuan HTML dalam mengatur tampilan dokumen HTML tersebut. Pengaturan

style

menggunakan CSS tidak terbatas pada sebuah dokumen saja melainkan

style

yang sama dapat digunakan pada seluruh dokumen HTML yang menyusun sebuah

(39)

tersebut akan berlaku untuk setiap tag HTML yang digunakan dan telah didefinisikan

dalam CSS. Format penulisan style CSS adalah sebagai berikut:

<STYLE>

nama_tag { properti_1: nilai_1;

properti_n: nilai_n;

}

</STYLE>

Nilai untuk nama properti tidak boleh ditulis dalam tanda petik seperti yang biasa

dilakukan pada penulisan nilai untuk atribut pada tag HTML. Nilai properti bersifat

case sensitive

, artinya huruf kapital dan kecil dibedakan. Pada CSS nama properti

selalu menggunakan huruf kecil.

Berdasarkan sifatnya, CSS dibagi menjadi dua bagian yaitu internal dan

eksternal. CSS Internal adalah format

style

yang terdapat dokumen HTML, letaknya

di dalam pasangan tag

<head>…</head>

. Sedangkan CSS eksternal adalah format

style

yang terpisah dengan dokumen HTML dan merupakan file dengan ekstensi

*.css yang dapat di link ke dokumen HTML dengan menggunakan tag

<link>.

Letaknya sama dengan CSS internal tetapi dibedakan cara penulisan dan

pemanggilan file CSS tersebut. Untuk melihat lebih jelas perbedaan antara kedua

CSS tersebut dapat dilihat pada contoh a dan b berikut:

a.

CSS Internal

<HTML>

<HEAD>

<TITLE>CSS Internal</TITLE>

<STYLE TYPE = “text/CSS”>

<!— H1 { font-size: 14pt; font-style: italic; color: green; } -->

</STYLE>

</HEAD>

<BODY>

<H1>CSS

Internal</H1>

Ini adalah contoh CSS Internal!

</BODY>

(40)

b.

CSS Eksternal

File style.css berisi format style untuk tag H1 sebagai berikut:

H1 { font-size: 14pt; font-style: italic; color: green; }

Selanjutnya file style.css ini dapat di link ke dokumen HTML dengan cara

menggunakan tag

<link>

pada dokumen HTML tersebut dan letaknya di dalam

pasangan tag

<head>…</head>

sebagai berikut:

<HTML>

<HEAD>

<TITLE>CSS Internal</TITLE>

<LINK REL=”stylesheet” TYPE=”text/CSS” HREF=”style.css”>

</HEAD>

<BODY>

<H1>CSS Internal</H1>

Ini adalah contoh CSS Internal!

</BODY>

</HTML>

2.4.Aplikasi Web Dinamis

Penggunaan HTML untuk membuat sebuah website yang dapat memberikan

informasi berupa teks, gambar dan suara telah banyak dimanfaatkan oleh para

pengembang web dalam menghasilkan website dengan tampilan yang sangat

bervariasi. Akan tetapi penggunaan HTML saja menjadi tidak effisien ketika

pengembang web dihadapkan dengan banyaknya jumlah informasi yang harus

ditampilkan dalam sebuah web. Dengan kata lain, HTML lebih bersifat statis dimana

terjadi proses pembuatan dokumen HTML berulang-ulang dalam proses

update

informasi web.

Berangkat dari permasalahan tersebut, saat ini telah berkembang teknologi web

dinamis yang memberikan manfaat lebih banyak dalam pengembangan sebuah

(41)

permintaan pengguna. Munculnya bahasa pemrograman web seperti CGI, ASP, PHP

dan lain sebagainya memungkinkan para

developer

web untuk membangun

aplikasi-aplikasi web yang dinamis. Dengan mengandalkan kemampuan yang dimiliki oleh

web server, maka informasi berupa data-data dapat diperoleh langsung dari

database

dan kemudian ditampilkan pada halaman web.

Beberapa aplikasi web dinamis yang telah berkembang saat ini adalah sebagai

berikut:

a.

Content Management System

CMS (

Content Management System

) adalah sebuah sistem yang memberikan

kemudahan kepada pengguna web baik pemilik web maupun pengunjung dalam

mengelola dan mengadakan perubahan terhadap isi sebuah website. Perubahan

yang dapat dilakukan oleh pengguna web sangat beragam antara lain

(Kemas-2003):

1. Manajemen data

Merupakan fungsi utama CMS adalah manajemen data. Informasi yang telah

ditampilkan atau belum diorganisasi dapat disimpan secara baik. Pada suatu

waktu tertentu informasi tersebut dapat dipergunakan kembali sesuai dengan

kebutuhan.

2. Mengatur siklus hidup website

Beberapa CMS memberikan fasilitas kepada para penggunanya untuk

mengelola bagian atau isi mana saja yang akan ditampilkan, masa atau waktu

penampilan dan lokasi penampilan di halaman website. Bagian atau isi

(42)

3. Mendukung web templating dan standarisasi

Setiap halaman website yang dihasilkan berasal dari

template

yang telah

disediakan oleh CMS. Selain dapat menjaga konsistensi dari tampilan secara

keseluruhan, para penulis dan editor dapat berkonsentrasi secara penuh dalam

melaksanakan tugasnya dalam menyediakan isi website.

4. Personalisasi website

Pada saat bagian atau isi ditempatkan ke dalam CMS, bagian atau isi tersebut

dapat ditampilkan sesuai dengan keinginan dan kebutuhan penggunanya.

CMS dapat memisahkan antara desain dan isi yang menyebabkan proses

personalisasi dapat berjalan dengan mudah.

5. Akuntabilitas

Karena CMS mendukung alur kerja dan hak akses yang jelas kepada

penggunanya, data atau informasi yang disampaikan dapat dipertanggung-

jawabkan dengan baik. setiap penulis ataupun editor memiliki tugas

masing-masing dengan hak akses yang berbeda-beda. Dengan demikian setiap

perubahan yang terjadi di website dapat ditelusuri dan diperbaiki seperlunya

dengan segera.

Dalam penggunaan CMS tidak dibutuhkan pengetehuan tentang bahasa

pemrograman tertentu, karena semua proses berjalan dengan cepat dan otomatis

(WYSIWYG –

What You See Is What You Get

).

b.

User Authentification

Beberapa website yang berkembang saat ini memberikan beberapa fasilitas

(43)

tambahan pada website tersebut, pengunjung terlebih dahulu melakukan proses

pendaftaran menjadi member website dengan mengisi formulir pendaftaran pada

halaman web. Setelah menjadi member pada website, maka pengunjung dapat

menggunakan fasilitas tambahan pada website dengan melakukan proses login.

User Authentification

merupakan aplikasi web dinamis untuk melakukan proses

autentifikasi

account

yang dimiliki oleh

user

yang menjadi

member

. Proses

autentifikasi melibatkan

username

dan

password

yang di-

input

-kan user pada

form login.

c.

Guestbook

Salah satu bentuk interaksi yang dapat diberikan oleh pengunjung website adalah

dengan memberikan komentar-komentar baik yang berhubungan dengan website

itu sendiri atau masalah yang lain. Data pengunjung yang telah memberikan

komentar kemudian disimpan dalam database dan ditampilkan pada halaman

web.

d.

Polling

Polling atau jajak pendapat adalah fasilitas website yang bertujuan untuk

melakukan survei terhadap minat pengunjung. Bentuknya berupa sebuah

pertanyaan yang memiliki beberapa alternatif jawaban untuk dipilih oleh

pengunjung. Hasil dari survei tersebut dapat ditampilkan dalam bentuk

(44)

2.5.Model Proses dan Paradigma Rekayasa Perangkat Lunak

Model proses perangkat lunak merupakan deskripsi yang disederhanakan dari

proses perangkat lunak yang dipresentasikan dengan sudut pandang tertentu Model

proses mencakup kegiatan yang merupakan bagian dari proses perangkat lunak,

produk perangkat lunak dan peran orang yang terlibat pada rekayasa perangkat lunak

(Ian-2003).

Dengan kata lain model proses rekayasa perangkat lunak mengacu kepada

kerangka bagi jalur yang harus dilalui aktivitas-aktivitas pengembang. Beberapa

aktivitas-aktivitas yang dilalui pada umumnya adalah definisi masalah, analisis dan

spesifikasi kebutuhan, perancangan sistem, implementasi, pengujian, operasi dan

pemeliharaan.

Dari aktivitas-aktivitas tersebut kemudian muncul beberapa paradigma, seperti

Paradigma Konvensional, Paradigma Berorientasi Objek, Paradigma Metode Formal,

Paragidma Cleanroom, dan Paradigma Berbasis Komponen yang lebih mengacu

kepada cara pandang spesifik dalam usaha pencarian solusi yang menyangkut

konseptualisasi permasalahan dan solusi.

2.5.1.Modified Waterfall Model

Salah satu kelemahan yang terdapat pada pendekatan

waterfall

adalah

aktivitas-aktivitas yang dilakukan memakan waktu yang cukup lama sehingga proses

pengembangan perangkat lunak menjadi lebih lamban.

Modified Waterfall Model

adalah hasil modifikasi dari pendekatan

waterfall

yang dikemukakan oleh Powel

(45)

spesification

dilakukan berulang kali sampai hasil sudah tidak berubah lagi. Ilustrasi

dari

model modified waterfall

yang akan diterapkan dalam perancangan website ini

ditunjukan pada gambar 2.2.

Gambar 2.2 – Modified Waterfall Model

a.

Problem Definition

Proses dimulai dengan mendefinisikan permasalahan dan latar belakang dari

website yang akan dikerjakan. Dalam pendefinisian masalah digunakan

pertanyaan berikut yang dapat membantu (“

W question”

):

−

“

Why

”: mengapa website diperlukan, tujuan website adalah apa?

−

“

From Whom

”: untuk siapa website dibuat? (klasifikasi pemakai)

−

“

What

”: data atau informasi apa saja yang akan dipresentasikan. Untuk

presentasi data tersebut, masih ada data yang harus dikumpulkan dulu atau

(46)

b.

Requirement Analysis & Spesification

Dalam analisis kebutuhan, perancang menganalisa kebutuhan baik perangkat

keras dan perangkat lunak yang diperlukan untuk mencapai tujuan. Pada tahap ini

harus ditentukan teknologi yang akan dipakai, seperti kemampuan perangkat

keras, ukuran memori RAM, ukuran hard disk, sistem operasi pada web server,

bahasa pemrograman untuk aplikasi web dinamis, jika diinginkan

Database

Management System

,

design tool

untuk desain halaman web dan seterusnya.

Selanjutnya membuat spesifikasi semua halaman web yang meliputi penentuan

content

atau informasi yang akan ditampilkan pada halaman web.

c.

Design & Prototyping

Pada tahap ini akan ditentukan desain untuk website. Selain desain secara

abstrak, juga akan ditulis sebuah

prototype

konkret untuk halaman web yang

dirancang.

Tahap-tahap desain dapat dibagi menjadi tiga bagian sebagai berikut:

-

Desain visual: menentukan tampilan halaman web, seperti letak baner,

navigasi, menu, logo dan sebagainya.

-

Desain teknologi: mendefinisikan prosedur-prosedur yang diperlukan dan

interface antara prosedur tersebut (hanya diperlukan kalau sebuah website

dinamis dirancang).

-

Desain struktur informasi atau dokumen menentukan bagaimana informasi

bisa dicocokkan dengan struktur halaman. Seringkali informasi disimpan

dalam dokumen yang cukup panjang sehingga pengguna akan melakukan

(47)

informasi dipecah menjadi bagian kecil ke dalam beberapa halaman web dan

dihubungkan dengan link antar halaman tersebut.

d.

Implementation & Unit Testing

Tahap ke empat adalah proses implementasi semua halaman web meliputi

rangkaian program PHP yang menyusun halaman-halaman web tersebut. Setelah

itu dilakukan uji coba terhadap kemampuan halaman web tersebut.

e.

Integration & System Testing

Integrasi adalah proses penggabungan semua halaman web ke dalam sebuah

website secara keseluruhan. Setelah penggabungan, dilakukan pengujian kembali

terhadap website secara menyeluruh seperti pengecekan

broken link

(link tanpa

tujuan).

f.

Release Operation & Maintenance

Tahap akhir adalah proses

upload

semua halaman web ke web server yang sudah

siap dan pengoperasian website pada internet. Untuk proses maintenace

diperlukan seorang administrator web yang bertugas dalam pemeriharaan

website, seperti

maintenance

isi halaman web,

backup database

, pengecekan

broken link

, koneksi

database

dan lain sebagainya.

2.5.2.Paradigma Konvensional

Paradigma Konvensional mengacu kepada dekomposisi yang berdasar

algoritma atau fungsional. Paradigma ini meliputi seluruh aktivitas atau tahap proses

(48)

pemrograman terstruktur, perancangan terstruktur, analisis terstruktur dan

sebagainya.

Analisis terstruktur adalah suatu proses analisis yang dilakukan dalam satu

tahapan-tahapan tersetntu secara terurut yang dimulai dari survei sistem, identifikasi