PEMROGRAMAN WEB LANJUT -
PERTEMUAN 1
1.1 Web Statis dan Web Dinamis
Web Statis merupakan jenis Website yang mana penggunanya tidak bisa merubah
kontent dari Web tersebut secara langsung menggunakan Browser. Interaksi yang terjadi
antara pengguna (client) dan server hanyalah seputar pemrosesan link saja.
Jenis Web seperti ini menggunakan Client Side Script yang mana script-script yang dapat
dimengerti oleh komputer Client saja (Browser) seperti HTML, JavasScript, DHTML, CSS,
dan lain sebagainya.
Web Dinamis merupakan jenis Website dengan interaksi yang terjadi antara
pengguna dan server sangat kompleks. Di mana seseorang (Client) dapat mengubah Content
dari halaman tertentu dengan menggunakan Browser. Request yang dikirimkan oleh
pengguna dapat diproses oleh server untuk kemudian ditampilkan dalam isi yang berbeda-
beda menurut alur programnya.
1.2 Web Server
Web server adalah program aplikasi yang memiliki fungsi sebagai tempat
menyimpan dokumen-dokumen web. Jadi semua dokumen web baik yang ditulis
menggunakan client side scripting maupun server side scripting tersimpan di dalam direktori
utama web server (document root).
Beberapa Web Sever yang banyak digunakan di internet antara lain :
1. Apache Web Server (http://www.apache.org)
2. Internet Information Service, IIS (http://www.microsoft.com/iis)
3. Xitami Web Server (http://www.xitami.com)
4. Sun Java System Web Server
(http://www.sun.com/software/products/web_srvr/home_web_srvr.xml)
1.3 Server Side Scripting
Server Side Scripting merupakan sebuah teknologi scripting atau pemrograman web
dimana script (program) dikompilasi atau diterjemahkan di server. Dengan server side
scripting, memungkinkan untuk menghasilkan halaman web yang dinamis.
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 1
PEMROGRAMAN WEB LANJUT -
Beberapa contoh Server Side Scripting (Programming) :
1. ASP (Active Server Page) (http://www.asp.net/)
2. ColdFusion (http://www.macromedia.com/software/coldfusion)
3. Java Server Pages (http://java.sun.com/products/jsp/)
4. Perl (http://www.perl.org)
5. Phyton (http://www.python.org)
6. PHP (http://www.php.net)
Beberapa keistimewaan PHP antara lain :
Cepat
Free
Mudah dipelajari
Multi-platform
Dukungan technical-support
Banyaknya komunitas PHP
Aman
1.4 Xampp
Xampp merupakan paket PHP dan MySQL berbasis open source, yang dapat
digunakan sebagai tool pembantu pengembangan aplikasi berbasis PHP.
Setiap web server memiliki struktur direktori kerja (webroot atau document root)
yang berbeda. Direktori ini difungsikan untuk menyimpan seluruh file aplikasi web, termasuk
dokumen PHP. Dalam paket xampp yang di instal, tersedia sebuah folder kerja dengan nama
htdocs. Untuk mengakses aplikasi web anda dengan mengetik alamat di browser
http://localhost/nama-folder, http://127.0.0.1/nama-folder atau menggunakan nomor IP
Address komputer anda, contoh: http://192.168.1.3/nama-folder.
1.5 Instalasi Apache , PHP, dan MySQL dengan Memanfaatkan Xampp
Proses instalasi Apache, PHP dan MySQL seringkali menjadi kendala terutama bagi
pemula yang baru belajar pemrograman web dengan PHP. Hal tersebut disebabkan karena
software tersebut harus diinstall dan dikonfigurasikan satu per satu. Bagi belum mengerti
benar, tentu sering mengalami kesulitan, apalagi bagi kita yang belajar secara mandiri.
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 2
PEMROGRAMAN WEB LANJUT -
Namun jangan berkecil hati, saat ini banyak tersedia aplikasi paket yang menyatukan
ketiga software tersebut (Apache, PHP dan MySQL) ke dalam satu installer. Proses
instalasinya pun dapat dilakukan dengan mudah dan cepat, hanya perlu next, next, and finish.
Beberapa aplikasi paket tersebut antara lain:
1. XAMPP (versi Windows) dan LAMPP (versi Linux) http://www.apachefriends.org
2. WAMP Server http://www.wampserver.com
3. APPServ http://www.appservnetwork.com/
4. PHPTriad http://sourceforge.net/projects/phptriad/
Untuk memulai instalasi XAMPP di windows terlebih dahulu anda download Xampp
di http://www.apachefriends.org. Anda tinggal mengekstraknya. Untuk contoh di modul ini
menggunakan Xampp versi 1.7.3.
1. Klick ganda pada xampp-win32-1.7.3.exe untuk di windows. Akan muncul tampilan
selamat datang xampp seperti gambar berikut.
Gambar 1.1 Tampilan Selamat Datang
2. Pilih folder XAMPP di folder C:\. Kemudian klik Next. Anda akan menjumpai tampilan
proses installasi seperti gambar berikut.
Gambar 1.2 Tampilan Proses Installasi
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 3
PEMROGRAMAN WEB LANJUT -
3. Anda akan menjumpai tampilan penambahan shortcut pada startmenu atau desktop
seperti gambar berikut.
Gambar 1.3 Tampilan Penambahan Shortcuts
4. Anda akan menjumpai tampilan paths pada xampp, seperti gambar berikut.
Gambar 1.4 Tampilan Paths Pada Xampp
5. Anda akan menjumpai tampilan pembuatan xampp portable seperti gambar berikut.
Gambar 1.5 Tampilan Pembuatan Portable
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 4
PEMROGRAMAN WEB LANJUT -
6. Anda akan menjumpai tampilan XAMPP sudah siap digunakan seperti gambar berikut.
Gambar 1.6 Tampilan XAMPP Sudah Siap Digunakan
7. Anda akan menjumpai tampilan lisensi dari XAMPP seperti gambar berikut.
Gambar 1.7 Tampilan Lisensi XAMPP
8. Anda akan menjumpai tampilan pilihan setup XAMPP 1.7.3 seperti gambar berikut.
Gambar 1.8 Tampilan Pilihan Setup XAMPP
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 5
PEMROGRAMAN WEB LANJUT -
9. Anda akan menjumpai tampilan control panel dari XAMPP seperti gambar berikut.
1.9 Tampilan Control Panel XAMPP
10. Untuk memastikan bahwa XAMPP beserta PHP, Apache dan MySQL berjalan dengan
baik, bukalah browser kesayangan anda. Disini menggunakan windows Internet Explorer
dan ketikkan URL sebagai berikut: http://localhost
Jika semua sudah berjalan dengan baik, maka akan ditampilkan gambar berikut.
1.10 Tampilan Web Browser localhost
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 6
PEMROGRAMAN WEB LANJUT -
Untuk konfigurasi documentroot pada xampp mudah sekali tapi sebelumnya anda
harus mengetahui apa itu documentroot. Documentroot merupakan lokasi/folder untuk
menyimpan file PHP / web agar bisa dipanggil/dijalankan oleh webserver. Pada contoh ini,
lokasi documentroot berada di c:/xampp/htdocs/. Berarti jika anda ingin agar file bisa
dijalankan melalui webserver, letakkan file anda di folder tersebut. Akan tetapi lokasi
documentroot bisa kita pindahkan ke tempat lain sesuai dengan keinginan. Misalnya saja kita
bisa pindahkan ke drive D atau E .
Untuk setting webroot / documentroot pada Xampp ikuti langkah-langkah berikut:
1. Buka file C:/xampp/apache/conf/httpd.conf menggunakan notepad
2. Cari kata documentroot di dalam file tersebut.
3. Kita akan menemukan 1 baris sebagai berikut.
4. Ganti c:/xampp/htdocs dengan folder lain sesuai keinginan (catatan : folder harus sudah
ada). Di contoh ini saya ingin menggunakan D:/pwl sebagai documentroot.
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 7
PEMROGRAMAN WEB LANJUT -
5. Ganti 1 baris tersebut menjadi D:/pwl
6. Beberapa baris di bawah settingan tersebut terdapat tulisan , ganti C:/xampp/htdocs
dengan D:/pwl
7. Save file tersebut dan buka kembali XAMPP Control Panel. Restart Apache dengan
mengklik Stop dan Start kembali. Sekarang semua file PHP harus disimpan di D:/pwl/
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 8
PEMROGRAMAN WEB LANJUT -
1.6 Struktur Dasar PHP
1.6.1 Definisi PHP
Menurut dokumen resmi PHP, PHP merupakan singkatan dari “PHP: Hypertext
Preprocessor”. Ia merupakan bahasa berbentuk skrip yang ditempatkan dalam server dan
diproses di server. Hasilnya yang dikirimkan ke klien, tempat pemakai menggunakan
browser. PHP adalah bahasa server-side scripting yang menyatu dengan HTML untuk
membuat halaman web yang dinamik. Maksud dari server-side scripting adalah sintaks dan
perintah-perintah yang kita berikan akan sepenuhnya dijalankan di server tetapi disertakan
pada dokumen HTML biasa.
PHP bersifat bebas dipakai. Anda tidak perlu membayar apapun untuk menggunakan
perangkat lunak ini alias free. Anda dapat mendownloadnya melalui situs
http://www.php.net. PHP tersedia dalam bentuk kode biner maupun kode sumber yang
lengkap.
1.6.2 Skema Aplikasi Web
Aplikasi web dinamis berbasiskan pada konsep arsitektur client - server, dimana
server menangani apa yang dimininta oleh client, kemudian mengirimkan kembali hasilnya
dalam bentuk HTML.
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 9
PEMROGRAMAN WEB LANJUT -
Skema aplikasi web pada gambar diatas dapat dijelaskan sebagai berikut:
A. Client (web browser) meminta sebuah halaman pada sebuah website.
B. Web server mencari halaman yang diminta, dan setelah ditemukan, memberikan
halaman tersebut ke application server (PHP Interpreter).
C. Application server mem-parse (membaca) dan memproses halaman tersebut.
D. Application server mengirimkan halaman yang telah diproses kembali ke web
server.
E. Web server mengirimkan kembali halaman yang telah diproses kepada web
browser dalam bentuk HTML.
1.6.3 Mari Mengenal PHP
Tahukah Anda, PHP itu.....
1. Merupakan singkatan recursive dari PHP : Hypertext Prepocessor
2. Pertama kali dibuat oleh Rasmus Lerdorf pada tahun 1994.
3. Harus ditulis di antara tag :
a. Standart Style c. JavaScript Style
<?php <script language ="php">
echo "Standart Style"; echo "JavaScript Style";
?> </script>
b. Short Style d. ASP Style
<? <%
echo "Short Style"; echo "ASP Style";
?> %>
4. Setiap satu statement (perintah) biasanya diakhiri dengan titik-koma (;)
5. CASE SENSITIVE untuk nama identifier yang dibuat oleh user (berupa variable,
konstanta, fungsi dll), namun TIDAK CASE SENSITIVE untuk identifier built-in dari
PHP. Jadi :
$nama ≠ $Nama ≠ $NAMA
hitungLuas() ≠ HitungLuas()
echo = ECHO
while = WHILE
6. Mudah dipelajari.
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 10
PEMROGRAMAN WEB LANJUT -
Berbeda dengan bahasa banyak bahasa pemrograman web pada umumnya, skrip
program PHP dapat langsung ditanamkan / disisipkan didalam HTML. Jika skrip PHP
ditemukan dalam sebuah dokumen web, PHP Interpreter akan memproses skrip PHP dan
hanya akan mengirimkan hasil berupa HTML ke browser client.
1.6.4 Format Penulisan PHP
Ada 2 cara aturan penulisan skrip PHP yaitu:
1. Embedded Script
Dengan cara meletakkan tag PHP diantara tag-tag HTML. Contoh:
<html>
<head>
<title>Embedded Script</title>
</head>
<body>
<?php echo "Pemrograman Web"; ?>
</body>
</html>
2. Non Embedded Script
Dengan cara meletakkan skrip HTML di dalam skrip PHP. Contoh:
<?php
echo "<html>";
?>
1.6.5 Mencetak String
Dalam PHP, string adalah rangkaian karakter, seperti “Once upon a time” atau
“Doremifasolasido” bahkan “111211211”. Ketika PHP membaca dan memproses sebuah
kode program dan mengirimkan output ke web browser, setiap data yang ditampilkan akan
dianggap sebagai sebuah string. Terdapat dua fungsi yang umum digunakan untuk mencetak
sebuah string. Yaitu print dan echo.
Untuk mencetak sebuah string digunakan sepasang karakter single quoted ( ' ) atau
double quoted ( “ ) yang mengapit string tersebut.
Beberapa macam perintah untuk menampilkan nilai suatu variabel atau mencetaknya
ke layar browser yaitu:
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 11
PEMROGRAMAN WEB LANJUT -
1. echo, contohnya:
echo "$data";
echo $data;
echo "nilai";
echo $data."status";
2. print, contohnya:
print ("$data");
print ($data);
print ("nilai");
print ($data."status");
3. printf, contohnya:
printf ("%s",$data);
printf ("%s status", $data);
Perintah echo & print mempunyai fungsi sama, yaitu sama-sama untuk menampilkan
barik kode/tulisan ke browser. Perbedaan dari perintah tersebut adalah sebagai berikut:
1. echo tidak mengembalikan nilai apapun setelah dijalankan (no return value).
Sedangkan print akan mengembalikan nilai true atau false ketika selesai dijalankan
berdasarkan sukses tidaknya perintah tsb dijalankan.
2. echo lebih cepat 20% prosesnya dari print.
1.6.6 Komentar di PHP
Perintah yang tidak akan dieksekusi di PHP. Penggunaan komentar sangat dianjurkan
untuk memberi penjelasan/keterangan pada kode-kode program PHP yang diketikkan dalam
sebuah dokumen web. Ada dua cara penggunaan komentar di PHP yaitu :
Komentar satu baris, menggunakan tanda garis miring double/double slash [ // ] dan
hash [ # ]
Komentar lebih dari satu baris, menggunakan tanda [ /* ] dan di akhiri dengan [ */ ]
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 12
PEMROGRAMAN WEB LANJUT -
1.6.7 Contoh Menampilkan Hello PHP
1. Ketikan perintah ini pada notepad++ atau sublime text.
<!DOCTYPE html>
<html>
<head>
<title>Program PHP Pertamaku</title>
</head>
<body>
<?php
//Komentar 1 Baris dan
#lanjut komentar
echo "Hello, Ini Program PHP Pertamaku";
/*
Ini Komentar
Banyak Baris
*/
?>
</body>
</html>
2. Simpan dengan nama hello.php dan letakkan di documentroot komputer Anda. Misal,
nama folder anda php.
3. Buka Browser lalu ketikan http://localhost/php/hello.php
4. Lihat hasilnya di browser.
1.6.8 Karakter Escape
Karakter escape adalah bagian dari syntax bahasa pemrograman. Biasa dimulai
dengan karakter backslash ( \ ) dan diikuti oleh metakarakter tertentu yang disebut
sebagai escape sequences.
Escape sequences memiliki 2 fungsi :
a. Mengkodekan entitas syntax, yaitu perintah untuk menampilkan data khusus yang tidak
dapat langsung diwakili oleh alfabet.
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 13
PEMROGRAMAN WEB LANJUT -
b. Pengutip karakter, yaitu untuk mewakili karakter yang tidak dapat diketik dalam konteks
saat ini, atau akan memiliki interpretasi yang tidak diinginkan.
Escape sequences yang bekerja pada double quoted ( “ ) adalah sebagai berikut:
Escape sequences Representasi Karakter
\n Ganti baris
\r Carriage return
\t Tab
\\ Backslash
\$ Tanda dolar
\” Double quote
\{ Left brace
\} Right brace
\[ Left bracket
\] Right bracket
\0 atau \777 Octal value
\x0 atau \xff Hexa value
Terdapat dua escape sequences yang dapat bekerja pada single quoted adalah \', yang
menempatkan tanda kutip tunggal dalam string yang dikutip tunggal, dan \\, yang
menempatkan sebuah backslash dalam string single quoted.
Contoh penggunaan karakter escape :
File : lat_01.php
<!DOCTYPE html>
<html>
<head>
<title>Karakter Escape</title>
<head>
<body>
<pre>
<?php
echo "Mencetak string dengan menggunakan echo.\n";
print "Mencetak string dengan menggunakan print.";
?>
</pre>
</body>
</html>
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 14
PEMROGRAMAN WEB LANJUT -
File : lat_02.php
<!DOCTYPE html>
<html>
<head>
<title>Escape Sequences</title>
<head>
<body>
<?php
echo 'Terdapat 2 escape sequences yang dapat bekerja
pada single quoted adalah \'';
print 'dan \\';
?>
</body>
</html>
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 15
PEMROGRAMAN WEB LANJUT -
Referensi
Arief, M. R. 2011. Pemrograman Web Dinamis menggunakan PHP dan MySQL.
Yogyakarta: Andi Offset.
Solichin, Achmad. Modul Pemrograman Web dengan PHP dan MySQL.
Rajif Agung Yunmar, S.Kom. 2011. Modul Pemrograman PHP Basic. STMIK AMIKOM
Yogyakarta
Pemrograman Web Lanjut – D3 Manajemen Informatika
UNIVERSITAS AMIKOM YOGYAKARTA 16
