BAB III PEMBAHASAN MASALAH Pada bab ini, penulis akan menjelaskan tentang masalah pokok, yaitu bagaimana cara membuat situs “Sylphid Cyber Games” dengan menggunakan teknologi PHP. Situs ini terdiri dari halaman-halaman yang dibuat dengan menggunakan pemrogaman HTML untuk membuat tampilan, dan kode-kode PHP pada halaman request, response, password dan view. Sehingga situs ini menjadi lebih dinamis dan interaktif. Pembahasan ini penulis pisahkan menjadi beberapa bagian, bagian pertama akan menjelaskan tentang struktur navigasi situs, bagian kedua akan menjelaskan tentang rancangan tampilan situs, bagian ketiga akan menjelaskan tentang database, dan bagian keempat akan menjelaskan bagaimana cara menyimpan halaman situs. Selain itu, penulis juga akan menjelaskan bagaimana cara menghubungkan situs kedalam database, dan cara menampilkan situs yang telah dibuat kedalam browser. 3.1
Struktur Navigasi Struktur navigasi digunakan untuk menggambarkan secara garis besar isi dari
keseluruhan situs tersebut, dan untuk menggambarkan bagaimana hubungan dari halaman-halaman situs tersebut. Untuk situs ini, penulis menggunakan struktur navigasi komposit (campuran) yang bisa dilihat pada gambar berikut :
31
32
Gambar 3.1 Struktur navigasi situs “Sylphid Cyber Games”
33
3.2
Rancangan Tampilan Situs Situs ini memiliki beberapa halaman yang dapat memberikan informasi bagi
para pengunjung. Dalam rancangan situs “Sylphid Cyber Games” ini, penulis memberikan
gambaran dan penjelasan dari tiap-tiap halaman situs. Berikut ini
merupakan rancangan tampilan situs “Sylphid Cyber Games”. 3.2.1
Rancangan Halaman Indeks Halaman indeks adalah halaman depan dari situs ini, halaman ini juga disebut
sebagai halaman pembuka, karena pada saat pertama kali situs ini dibuka maka halaman inilah yang akan tampil pertama kali sebelum halaman yang lainnya. Pada halaman ini terdapat navigasi dan keterangan singkat tentang halaman-halaman selanjutnya yang dapat dikunjungi.
Gambar 3.2 Rancangan halaman index.php 3.2.2 Rancangan Halaman Artikel Halaman ini memiliki link-link yang dapat di klik dan berisikan tentang berita, tips-tips dan strategi dalam bermain game online.
34
Gambar 3.3 Rancangan halaman artikel.php Apabila salah satu dari link artikel tersebut di klik, maka akan muncul sebuah halaman yang berisikan tentang detil dari artikel tersebut, yang bisa dilihat seperti pada gambar berikut :
Gambar 3.4 Rancangan halaman detil artikel
35
3.2.3
Rancangan Halaman Event Pada halaman ini, penulis menjelaskan tentang event yang diadakan oleh
“Sylphid Cyber Games”, dimana pada halaman ini pengunjung dapat mengetahui event apa yang diadakan oleh “Sylphid Cyber Games”. Selain itu, pengunjung juga dapat melakukan pendaftaran untuk mengikuti event yang diadakan.
Gambar 3.5 Rancangan halaman event.php Apabila link “Daftar” di klik, maka akan muncul sebuah halaman baru yang penulis beri nama
event_daftar.php,
dimana halaman ini terdapat form yang dapat diisi
oleh para pengunjung untuk mendaftarkan diri pada event tersebut, yang bisa dilihat seperti pada gambar berikut ini :
36
Gambar 3.6 Rancangan halaman event_daftar.php Setelah pengunjung selesai mengisi form dan meng-klik tombol “Daftar”, selanjutnya akan muncul sebuah halaman baru yang penulis beri nama event_konfirmasi.php
yang berisikan tentang konfirmasi pendaftaran.
Gambar 3.7 Rancangan halaman event_konfirmasi.php
37
Dan apabila link “Lihat Peserta” di klik, maka akan muncul halaman yang penulis beri nama
event_peserta.php
yang berisikan data-data para peserta yang sudah
mendaftarkan diri untuk mengikuti event tersebut.
Gambar 3.8 Rancangan halaman event_peserta.php 3.2.4
Rancangan Halaman Guest Book Halaman ini merupakan halaman yang berisikan komentar-komentar dari para
pengunjung yang mengunjungi situs ini. Halaman ini juga berfungsi sebagai sarana interaksi bagi para pengunjung. Selain itu, para pengunjung juga dapat mengisi guest book dan memberikan komentarnya tentang situs ini.
38
Gambar 3.9 Rancangan halaman gbook.php Pengunjung dapat mengisi guest book dengan meng-klik link “Isi Guest Book”, selanjutnya akan muncul halaman baru yang penulis beri nama halaman ini berisikan form yang dapat diisi oleh pengunjung.
Gambar 3.10 Rancangan halaman gbook_isi.php
gbook_isi.php,
39
3.2.5
Rancangan Halaman Lokasi Halaman ini dapat disebut juga sebagai halaman “Contact Us” atau “About
Us”, karena pada halaman ini terdapat penjelasan tentang rental game online “Sylphid Cyber Games”, berupa alamat, peta lokasi, e-mail, dan nomor telepon yang dapat dihubungi.
Gambar 3.11 Rancangan halaman lokasi.php 3.2.6
Rancangan Halaman Admin Selain halaman-halaman diatas, penulis juga membuat beberapa halaman
khusus yang hanya dapat diakses oleh seorang administrator. Untuk dapat mengakses halaman ini, seorang administrator diharuskan mengisi username dan password yang telah terdaftar didalam database. Jika username dan password benar, maka administrator tersebut dapat mengubah isi / konten dari situs ini.
40
Gambar 3.12 Rancangan halaman login administrator Setelah berhasil login, selanjutnya akan muncul halaman baru yang penulis beri nama
admin_index.php,
halaman ini merupakan halaman selamat datang bagi
administrator yang bisa dilihat seperti pada gambar berikut ini :
Gambar 3.13 Rancangan halaman admin_index.php
41
3.2.7
Rancangan Halaman Admin Artikel Pada halaman ini, administrator dapat menambah, mengubah dan menghapus
artikel yang terdapat pada situs ini.
Gambar 3.14 Rancangan halaman admin_artikel.php 3.2.8
Rancangan Halaman Admin Event Pada halaman ini, administrator dapat mengubah event yang diadakan oleh
“Sylphid Cyber Games”.
Gambar 3.15 Rancangan halaman admin_event.php
42
3.2.9
Rancangan Halaman Admin Peserta Pada halaman ini, administrator dapat mengubah atau menghapus data peserta
yang mengikuti event yang diadakan oleh “Sylphid Cyber Games”.
Gambar 3.16 Rancangan halaman admin_psrta.php 3.2.10 Rancangan Halaman Admin Guest Book Pada halaman ini, administrator dapat menghapus guest book yang terdapat didalam situs ini.
Gambar 3.17 Rancangan halaman admin_gbook.php
43
3.3
Spesifikasi Rancangan Database Hubungan antara objek PHP dengan MySQL harus sesuai dengan data yang
terdapat didalam database, karena jika tidak sesuai, hal ini akan mengakibatkan tidak tampilnya hasil yang diinginkan pada output dan hanya akan keluar pesan mysql_error.
Oleh karena itu, dalam pembuatan database harus dipisahkan antara satu tabel dengan tabel yang lainnya. Hal ini bertujuan agar tidak terjadi salah pembacaan record database pada browser. Untuk situs ini penulis membuat database dengan nama “sylphid”, yang didalamnya berisikan lima tabel yaitu tabel administrator, tabel artikel, tabel event, tabel guest book dan tabel peserta event. Langkah-langkah untuk membuat database situs ini adalah sebagai berikut : 1. Jalankan MySQL dan ketikkan query seperti dibawah ini : CREATE DATABASE sylphid;
2. Setelah database dibuat, selanjutnya adalah memilih database “sylphid” tersebut dengan mengetikkan query : USE sylphid;
3. Langkah selanjutnya adalah membuat tabel-tabelnya, untuk tabel yang pertama, penulis membuat tabel administrator, ketikkan query berikut untuk membuat tabel administrator : CREATE TABLE `administrator` ( `id` tinyint(3) NOT NULL auto_increment, `usr` varchar(20) NOT NULL, `pwd` varchar(50) NOT NULL, PRIMARY KEY (`id`) );
44
Tampilannya akan terlihat seperti gambar berikut :
Gambar 3.18 Rancangan tabel administrator 4. Selanjutnya membuat tabel artikel, ketikkan query berikut untuk membuat tabel artikel : CREATE TABLE `artikel` ( `id` tinyint(4) NOT NULL auto_increment, `judul` blob NOT NULL, `isi` blob NOT NULL, PRIMARY KEY (`id`) );
Tampilannya akan terlihat seperti gambar berikut :
Gambar 3.19 Rancangan tabel artikel 5. Setelah itu buat tabel event, ketikkan query berikut untuk membuat tabel event : CREATE TABLE `event` ( `id` tinyint(4) NOT NULL auto_increment, `tanggal` varchar(25) NOT NULL, `event` varchar(50) NOT NULL, `byk_agg` int(15) NOT NULL default '0', `juara1` varchar(20) NOT NULL default '0', `juara2` varchar(20) NOT NULL default '0', `juara3` varchar(20) NOT NULL default '0',
45
`htm` int(20) NOT NULL default '0', PRIMARY KEY (`id`));
Tampilannya akan terlihat seperti gambar berikut :
Gambar 3.20 Rancangan tabel event 6. Lalu buat tabel guest book, ketikkan query berikut untuk membuat tabel guest book : CREATE TABLE `gbook` ( `id` tinyint(3) NOT NULL auto_increment, `tgl` date NOT NULL default '0000-00-00', `nama` varchar(30) NOT NULL, `alamat` text NOT NULL, `email` tinytext NOT NULL, `komen` text NOT NULL, PRIMARY KEY (`id`) );
Tampilannya akan terlihat seperti gambar berikut :
Gambar 3.21 Rancangan tabel guest book
46
7. Dan untuk yang terakhir, buat tabel peserta event, ketikkan query berikut untuk membuat tabel peserta event : CREATE TABLE `psrta_event` ( `id` int(3) NOT NULL auto_increment, `nama_tim` varchar(20) NOT NULL, `alamat` varchar(50) NOT NULL, `nama_agg` varchar(50) NOT NULL, `no_tlp` varchar(13) NOT NULL, PRIMARY KEY (`id`) );
Tampilannya akan terlihat seperti gambar berikut :
Gambar 3.22 Rancangan tabel peserta event 3.4
Pembuatan Letak Direktori Penyimpanan Sebelum membuat halaman-halaman situs “Sylphid Cyber Games” ini,
penulis membuat sebuah direktori dengan nama “scg” didalam direktori “htdocs” (atau direktori “www” jika direktori “htdocs” tidak ada) didalam direktori Apache untuk menyimpan seluruh halaman-halaman situs yang telah dibuat. Kemudian buatlah tiga buah direktori lagi didalam direktori “scg” dengan nama direktori “admin” untuk menyimpan seluruh halaman administrator, direktori “deco” untuk menyimpan gambar-gambar pendukung, dan direktori “scripts” untuk menyimpan script-script pendukung. Untuk lebih jelasnya, perhatikan gambar 3.25 dan 3.26 berikut ini :
47
Gambar 3.25 Lokasi direktori “scg”
Gambar 3.26 Lokasi direktori “admin”, “deco”, dan “scripts”
48
3.5
Cara Mengkoneksikan Halaman Situs Kedalam Database Berikut ini penulis akan menjelaskan bagaimana cara mengkoneksikan
halaman situs yang telah dibuat kedalam database : 1. Jalankan Adobe Dreamweaver CS3 2. Pilih PHP pada dialog Create New Document 3. Lalu pilih Code pada Document Bar, kemudian ketikkan script berikut :
4. Lalu simpan dengan nama
dbconnector.php
didalam direktori “scripts” yang
berada didalam direktori “scg” yang telah dibuat sebelumnya.
Gambar 3.27 Lokasi penyimpanan script dbconnector.php
49
3.6
Cara Menampilkan Halaman Situs Kedalam Browser Untuk menampilkan halaman situs yang telah dibuat kedalam browser,
lakukan langkah-langkah berikut : 1. Pastikan Apache dan MySQL telah berjalan 2. Buka internet browser seperti Windows Internet Explorer atau Mozilla Firefox 3. Ketikkan alamat berikut pada address bar : http://localhost/scg/ Tampilannya akan terlihat seperti pada gambar berikut ini :
Gambar 3.28 Tampilan situs “Sylphid Cyber Games” pada browser
50
3.7
Spesifikasi Perangkat Keras Dan Perangkat Lunak Yang Digunakan Perangkat keras yang digunakan sangat menentukan jalannya perangkat lunak
dan aplikasi yang dijalankan, bila perangkat keras yang digunakan kurang memadai, maka hasil yang diperoleh menjadi kurang baik. Oleh karena itu, penulis menampilkan konfigurasi sistem yang penulis gunakan : -
Prosesor AMD Phenom II X4 810, 2.6GHz, soket AM3
-
Motherboard GIGABYTE GA-MA790FXT-UD5P
-
Memori G Skill F3-1440CL9D-4GBGT1 DDR3 PC16000 Dual-Channel, 4Gb
-
VGA ATi Radeon Revolution 700 Deluxe 2Gb 512Bit DDR5
-
Harddisk Western Digital Caviar 320Gb SATA-II
-
DVD-RW Philips 20x SATA, (Untuk instalasi Adobe Dreamweaver CS3)
-
Monitor LCD BenQ 17" G700AD
-
Keyboard Razer Lycosa dan Mouse laser Razer Copperhead Dan perangkat lunak yang penulis gunakan adalah :
-
Microsoft Windows XP SP3
-
Adobe Dreamweaver CS3
-
Apache 2.2.11
-
MySQL 5.1.30 Community
