CHAPTER 1

1. INSTALASI DAN KONFIGURASI WEB SERVER

Sebelum anda menginstall Web Server terlebih dahulu anda siapkan softwarenya yang telah kami sediakan didalam CD buku ini. Perhatikan gambar dibawah ini :

Gambar 1.1Master xampp web server

klik dua kali xampp-win32-1.5.3-installer atau klik satu kali lalu tekan enter maka akan melakukan instalasi web server pada komputer anda dan akan terlihat seperti gambar berikut ini :

Gambar 1.2Instalasi Awal Dari Xampp

Selanjutnya tunggu hingga 100% hingga tampil gambar seperti dibawah ini :

Gambar 1.3Pemilihan Bahasa Pada Instalasi Xampp

Selanjutnya pilih OK, dan akan tampil gambar seperti di bawah ini :

Gambar 1.4Instalasi Xampp Pada Menu Selamat Datang

Selanjutnya klik Next, dan akan tampil lagi gambar seperti di bawah ini :

Gambar 1.5Menentukan Lokasi Instalasi Xampp

Selanjutnya klik Install, dan akan tampil gambar seperti di bawah ini :

Gambar 1.6Proses Instalasi Xampp

Tunggu hingga selesai dan akan tampil gambar seperti dibawah ini :

Gambar 1.7Proses Instalasi Xampp

Selanjutnya biarkan saja sampai keluar gambar seperti di bawah ini :

Gambar 1.8Proses Instalasi Sudah Selesai

Selanjutnya klik Finish, tunggu maka akan tampil gambar seperti di bawah ini :

Gambar 1.9Apakah Service Xampp

Selanjutnya klik Yes, dan berikutnya akan tampil gambar seperti dibawah ini :

Gambar 1.10Proses Instalasi Setting Port

Selanjutnya biarkan saja hingga tampil gambar seperti berikut :

Gambar 1.11Proses Service Apache

Selanjutnya klik Yes, dan akan melakukan proses selanjutnya seperti gambar dibawah ini :

Gambar 1.12Apache Port 80 di Block

Selanjutnya klik OK, dan akan melakukan proses berikutnya seperti gambar di bawah ini :

Gambar 1.13Proses Service MySQL

Selanjutnya akan tampil gambar seperti berikut ini :

Gambar 1.14Proses Service MySQL

Selanjutnya akan tampil gambar seperti dibawah ini :

Gambar 1.15MySQL Service Port 3306

Selanjutnya Klik OK dan selanjutnya akan tampil gambar seperti berikut ini :

Gambar 1.16Install FileZilla FTP Service

Selanjutnya klik Yes, dan akan tampil gambar seperti berikut ini :

Gambar 1.17Proses Service Xampp

Selanjutnya biarkan saja hingga tampil gambar seperti berikut ini :

Gambar 1.18Install Service

Selanjutnya klik Yes, dan akan tampil lagi gambar seperti berikut ini :

Gambar 1.19Autostart Service

Selanjutnya klik Yes, dan akan tampil lagi gambar seperti berikut ini :

Gambar 1.20Start Server

Selanjutnya klik Yes, dan akan tampil lagi gambar seperti berikut ini :

Gambar 1.21Configurasi Instalasi Xampp

Selanjutnya klik Yes dan klik Finish, ini adalah akhir dari instalasi web server dengan menggunakan xampp, untuk memastikan apakah xampp sudah terinstall silahkan anda lihat folder di C://Program Files/xampp/

Demikianlah proses instalasi web server dengan menggunakan xampp yang nantinya akan dijadikan sebagai tempat penyimpanan file-file program php.

2. INSTALASI DAN KONFIGURASI DREAMWEAVER CS4

Sebelum anda menginstall Text Editor Dreamweaver CS4 terlebih dahulu anda siapkan softwarenya yang telah kami sediakan didalam CD buku ini. Perhatikan gambar dibawah ini :

Gambar 1.22Folder Master Dreamweaver CS4

Klik dua kali pada folder DreamweaverCS4 sehingga akan tampil gambar seperti berikut ini :

Gambar 1.23Master Software Dreamweaver CS4

Selanjutnya klik dua kali atau klik satu kali dan tekan enter pada master software DreamweaverCS4, maka akan tampil proses gambar seperti dibawah ini sebagai proses awal instalasi Dreamweaver CS4

Gambar 1.24Proses Awal Instalasi dan Penentuan Folder Instalasi

Selanjutnya klik Install untuk melakukan proses instalasi pada drive C:\Adobe Dreamweaver CS4Maka akan tampil seperti gambar dibawah ini :

Gambar 1.25Proses Instalasi Dreamweaver CS4

Tunggu hingga Instalation progress selesai, selanjutnya akan keluar gambar seperti dibawah ini :

Gambar 1.26Proses Checking System Profile

Selanjutnya akan keluar gambar seperti ini :

Gambar 1.27Proses Instalasi Untuk Memasukkan CD Key nya

Selanjutnya buka pada CD program buku ini pada direktory Dreamweaver CS4 seperti dibawah ini :

Gambar 1.28Master Software Dreamweaver CS4

Klik Direktory Crack maka akan tampil seperti gambar dibawah ini :

Gambar 1.29Master Crack Dreamweaver CS4

Selanjutnya klik keygen untuk membuka CD key Dreamweaver CS4, copy kan hasil dari program keygen ke dalam Dreamweaver CS4 seperti gambar dibawah ini :

Gambar 1.30Proses Memasukan CD key ke Instalasi Dreamweaver CS4

Selanjutnya klik Nextmaka akan muncul gambar seperti berikut ini :

Gambar 1.31Gambar Proses Instalasi licesnse

Selanjutnya klik Acceptmaka akan keluar gambar seperti dibawah ini :

Gambar 1.32Proses Instalasi Options

Selanjutnya klik Installmaka proses install Dreamweaver CS4 sedang berjalan seperti pada gambar dibawah ini :

Gambar 1.33Proses Instalasi Dreamweaver CS4

Selanjutnya akan tampil gambar seperti dibawah ini :

Gambar 1.34Register pada Instalasi Dreamweaver CS4

Klik Register Laterdan selanjutnya akan tampil gambar seperti dibawah ini yang manandakan proses installasi Dreamweaver CS4 selesai

Gambar 1.35Akhir Instalasi Dreamweaver CS4

Klik Exit untuk mengakhiri installasi Dreamweaver CS4

3. PEMBUATAN VIRTUAL DIRECTORY

Virtual directory adalah sebuah tempat dimana tempat penyimpanan file-file program PHP yang simpan pada webserver. Istilah lain virtual directory adalah folder dimana tempat penyimpanan program berada. Dalam contoh latihan ini kita akan membuat sebuah folder dengan nama akademik yang berada pada web server yaitu c://Program Files/xampp/htdocs/

Dalam proses pembuatan virtual directory atau folder ini langkah-langkahnya sama seperti anda membuat folder pada sistem operasi windows baik itu windows xp atau windows 7. Untuk lebih jelasnya mari kita coba untuk membuat virtual directory dengan nama akademik, dengan langkah-langkahnya adalah sebagai berikut :

Aktifkan windows Explorer seperti gambar dibawah ini :

Gambar 1.36Windows Explorer

Klik Open Windows Explorer, lalu arahkan ke C://Program Files/xampp/htdocs/ seperti terlihat pada gambar dibawah ini :

Gambar 1.37Folder htdocs sebagai tempat penyimpanan file-file program php

Selanjutnya buat folder akademik dengan cara :klik New folder pada menu bar disamping Burnatau dengan klik sebelah kanan mouse pada folder htdocs seperti gambar dibawah ini :

Gambar 1.38Pembuatan Folder Akademik

Selanjutnya Klik Folderlalu ganti namanya dengan akademik, maka hasilnya akan seperti berikut ini :

Gambar 1.39Hasil Pembuatan Directory akademik

Selanjutnya buka folder akademik yang berada pada C://Program Files/xampp/htdocs dan buatkan lagi directory images sebagai folder tambahan untuk mengumpulkan file-file yang berektension gambar-gambar yang nantinya akan dipakai sebagai alat atau design pada halaman web program php. Maka langkah langkahnya adalah sebagai berikut :

klik C://Program FilesKlik xamppKlik htdocsKlik akademik

sehingga akan tampil seperti gambar dibawah ini :

Gambar 1.40Folder akademik

Selanjutnya buat folder images dengan cara :klik New folder pada menu bar disamping Share withatau dengan klik sebelah kanan mouse pada folder akademik seperti gambar dibawah ini :

Gambar 1.41Pembuatan Folder Images Sebagai Tempat Penyimpanan File Gambar

Selanjutnya ketik atau ganti nama New Folder dengan images dan hasilnya akan tampak seperti berikut ini :

Gambar 1.42Hasil Akhir Pembuatan Folder Images

Demikinlah proses pembuatan virtual directory atau folder dimana hal hal ini adalah sangat penting karena nantinya seluruh file-file yang berkaitan dengan penyimpanan file-file program akan disimpan pada folder C://Program Files/xampp/htdocs/akademik/.

Adapun mengenai folder untuk databasenya adalah tersimpan pada folder C://Program Files/xampp/mysql/data/

Jadi kalau disimpulkan tempat untuk penyimpanan file-file program php adalah C://Program Files/xampp/htdocs/ sedangkan untuk penyimpanan databasenya adalah C://Program Files/xampp/mysql/data/

Untuk program php file-filenya terlihat pada gambar dibawah ini :

Gambar 3.43Gambar Hasil Akhir folder akademik

Sedangkan untuk databasenya akan terlihat seperti gambar dibawah ini :

Gambar 1.44Folder Tempat Penyimpanan Databasenya