Materi PHP

PENGERTIAN PHP

• Pengertian PHP

• Hubungan PHP dengan HTML

• Kelebihan PHP


Pengertian PHP
PHP adalah singkatan dari "PHP: Hypertext Preprocessor", yang merupakan
sebuah bahasa scripting yang terpasang pada HTML. Sebagian besar sintaks mirip
dengan bahasa C, Java dan Perl, ditambah beberapa fungsi PHP yang spesifik.
Tujuan utama penggunaan bahasa ini adalah untuk memungkinkan perancang web
menulis halaman web dinamik dengan cepat.
Hubungan PHP dengan HTML
Halaman web biasanya disusun dari kode-kode html yang disimpan dalam


sebuah file berekstensi .html. File html ini dikirimkan oleh server (atau file) ke
browser, kemudian browser menerjemahkan kode-kode tersebut sehingga
menghasilkan suatu tampilan yang indah. Lain halnya dengan program php, program
ini harus diterjemahkan oleh web-server sehingga menghasilkan kode html yang
dikirim ke browser agar dapat ditampilkan. Program ini dapat berdiri sendiri ataupun
disisipkan di antara kode-kode html sehingga dapat langsung ditampilkan bersama

dengan kode-kode html tersebut. Program php dapat ditambahkan dengan mengapit
program tersebut di antara tanda . Tanda-tanda tersebut biasanya disebut
tanda untuk escaping (kabur) dari kode html. File html yang telah dibubuhi program
php harus diganti ekstensi-nya menjadi .php3 atau .php.
PHP merupakan bahasa pemograman web yang bersifat server-side
HTML=embedded scripting, di mana script-nya menyatu dengan HTML dan berada
si server. Artinya adalah sintaks dan perintah-perintah yang kita berikan akan
sepenuhnya dijalankan di server tetapi disertakan HTML biasa. PHP dikenal sebgai
bahasa scripting yang menyatu dengan tag HTML, dieksekusi di server dan
digunakan untuk membuat halaman web yang dinamis seperti ASP (Active Server
Pages) dan JSP (Java Server Pages).
PHP pertama kali dibuat oleh Rasmus Lerdroft, seorang programmer C.
Semula PHP digunakannya untuk menghitung jumlah pengunjung di dalam webnya.
Kemudian ia mengeluarkan Personal Home Page Tools versi 1.0 secara gratis. Versi
ini pertama kali keluar pada tahun 1995. Isinya adalah sekumpulan script PERL yang
dibuatnya untuk membuat halaman webnya menjadi dinamis. Kemudian pada tahun
1996 ia mengeluarkan PHP versi 2.0 yang kemampuannya telah dapat mengakses
database dan dapat terintegrasi dengan HTML.
Pada tahun 1998 tepatnya pada tanggal 6 Juni 1998 keluarlah PHP versi 3.0
yang dikeluarkan oleh Rasmus sendiri bersama kelompok pengembang softwarenya..
Versi terbaru, yaitu PHP 4.0 keluar pada tanggal 22 Mei 2000 merupakan
versi yang lebih lengkap lagi dibandingkan dengan versi sebelumnya. Perubahan
yang paling mendasar pada PHP 4.0 adalah terintegrasinya Zend Engine yang dibuat
oleh Zend Suraski dan Andi Gutmans yang merupakan penyempurnaan dari PHP
scripting engine. Yang lainnya adalah build in HTTP session, tidak lagi menggunakan
library tambahan seperti pada PHP. Tujuan dari bahasa scripting ini adalah untuk
membuat aplikasi-aplikasi yang dijalankan di atas teknologi web. Dalam hal ini,
aplikasi pada umumnya akan memberikan hasil pada web browser, tetapi prosesnya
secara keseluruhan dijalankan web server.
Kelebihan PHP
Ketika e-commerce semakin berkembang, situs-situs yang statispun semakin
ditinggalkan, karena dianggap sudah tidak memenuhi keinginan pasar, padahal situs
tersebut harus tetap dinamis. Pada saat ini bahasa PERL dan CGI sudah jauh
ketinggalan jaman sehingga sebagian besar designer web banyak beralih ke bahasa
server-side scripting yang lebih dinamis seperti PHP.
Seluruh aplikasi berbasis web dapat dibuat dengan PHP. Namun kekuatan
yang paling utama PHP adalah pada konektivitasnya dengan system database di
dalam web. Sistem database yang dapat didukung oleh PHP adalah :

1. Oracle
2. MySQL
3. Sybase
4. PostgreSQL
5. dan lainnya

PHP dapat berjalan di berbagai system operasi seperti windows 98/NT,
UNIX/LINUX, solaris maupun macintosh.

SINTAK DASAR PHP

Cara penulisan PHP

Pertama

echo ("tulisankita\n");

?>

Kedua

php echo("tulisankita\n");

?>

Ketiga

<%

echo ("kalau yang ini mirip dengan ASP");

%>

Anda dapat menggunkan salah satu di atas, tapi yang paling sering digunakan biasannya cara pertama dan kedua.

Seperti pada bahasa pemrograman lain Anda pun bisa meletakkan baris komentar pada program Anda. Pada PHP caranya adalah dengan meletakkan komentar tersebut di sebelah kanan tanda // jika komentar satu baris dan di antara /* dan */ jika komentarnya lebih dari satu baris.

/* kalau yang ini adalah komentar
lebih dari satu baris */
echo ("memang mudah"); ?>

TUTORIAL BASIC PHP

Materi Java Script

Pengertian Java Script

  

1.  Memahami tentang struktur javascript
2.  Memahami tentang pemrograman di javascript
3.  Memahami tentang pemakaian obyek dan form

A. Sekilas tentang JavaScript
Javascript adalah bahasa skrip yang ditempelkan pada kode HTML dan diproses di sisi klien.
Dengan adanya bahasa ini, kemampuan dokumen HTML menjadi semakin luas. Sebagai
contoh, dengan menggunakan JavaScript dimungkinkan untuk memvalidasi masukan-
masukan pada formulir sebelum formulir dikirimkan ke server.
Javascript bukanlah bahasa Java dan merupakan dua bahasa yang berbeda. Javascript
diinterpretasikan oleh klien (kodenya bisa  dilihat pada sisi klien), sedangkan kode Java
dikompilasi oleh pemrogram dan hasil kompilasinyalah yang dijalankan oleh klien.

B. Struktur JavaScript
Struktur dari JavaScript adalah sbb :
<SCRIPT LANGUAGE = ”JavaScript”>
<!- -
Penulisan kode javascript
// – - >
</SCRIPT>

Keterangan :
Kode <!- -        // – - > umumnya disertakan dengan tujuan agar sekiranya browser tidak
mengenali JavaScript maka browser akan memperlakukannya sebagai komentar sehingga

tidak ditampilkan pada jendela browser.

C. JavaScript sebagai bahasa berorientasi pada obyek
Properti
Properti adalah atribut dari sebuah objek. Contoh, objek mobil punya properti warna mobil.
Penulisan :
Nama_objek.nama_properti = nilai
window.defaultStatus = ”Selamat Belajar JavaScript”;

Metode
Metode adalah suatu kumpulan kode yang digunakan untuk melakukan sesuatu tindakan
terhadap objek.
Penulisan :
Nama_objek.nama_metode(parameter)
document.write (”Hallo”)

D. Letak JavaScript dalam HTML
Skrip Javascript dalam dokumen HTML dapat diletakkan pada :
1. Bagian Head
2. Bagian Body (jarang digunakan).

BENGKEL INTERNET PENS-ITS
2
LATIHAN – LATIHAN :
A. DASAR-DASAR JAVASCRIPT
1.  Pemakaian alert sebagai property window

2.  Pemakaian metode dalam objek.

3.  Pemakaian prompt

<HTML>
<HEAD>
<TITLE>Alert Box</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = “JavaScript”>
<!–
window.alert(“Ini merupakan pesan untuk Anda”);
//–>
</SCRIPT>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>Skrip JavaScript</TITLE>
</HEAD>
<BODY>
Percobaan memakai JavaScript:<BR>
<SCRIPT LANGUAGE = “JavaScript”>
<!–
document.write(“Selamat Mencoba JavaScript<BR>”);
document.write(“Semoga sukses!”);
//–>
</SCRIPT>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>Pemasukan Data</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = “JavaScript”>
<!–
var nama = prompt(“Siapa nama Anda?”,”Masukkan nama anda”);
document.write(“Hai, ” + nama);
//–>
</SCRIPT>
</BODY>
</HTML> BENGKEL INTERNET PENS-ITS
3
4. Pembuatan fungsi dan cara pemanggilannya

B. DASAR-DASAR PEMROGRAMAN DI JAVASCRIPT
1.  Operasi dasar aritmatika

<HTML>
<HEAD>
<TITLE>Contoh Program Javascript</TITLE>
</HEAD>
<SCRIPT language=”Javascript”>
function pesan(){
alert (“memanggil javascript lewat body onload”)
}
</SCRIPT>
<BODY onload=pesan()>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>Contoh Program Javascript</TITLE>
</HEAD>
<SCRIPT language=”Javascript”>
function test (val1,val2)
{
document.write(“<br>”+”Perkalian : val1*val2 “+”<br>”)
document.write(val1*val2)
document.write(“<br>”+”Pembagian : val1/val2 “+”<br>”)
document.write(val1/val2)
document.write(“<br>”+”Penjumlahan : val1+val2 “+”<br>”)
document.write(val1+val2)
document.write(“<br>”+”Pengurangan : val1-val2 “+”<br>”)
document.write(val1-val2)
document.write(“<br>”+”Modulus : val1%val2 “+”<br>”)
document.write(val1%val2)
}
</SCRIPT>
<BODY>
<input type=”button” name=”button1″ value=”arithmetic”
onclick=test(9,4)>
</BODY>
</HTML> BENGKEL INTERNET PENS-ITS
4
2. Operasi relational

3. Seleksi kondisi (if..else)

<HTML>
<HEAD>
<TITLE>Contoh Program Javascript</TITLE>
</HEAD>
<SCRIPT language=”Javascript”>
function test () {
val1=window.prompt(“Nilai I :”)
val2=window.prompt(“Nilai II :”)
document.write(“<br>”+”val1==val2″+”<br>”)
document.write(val1==val2)
document.write(“<br>”+”val1!=val2″+”<br>”)
document.write(val1!=val2)
document.write(“<br>”+”val1&gtval2″+”<br>”)
document.write(val1>val2)
document.write(“<br>”+”val1&ltval2″+”<br>”)
document.write(val1<val2) }
</SCRIPT>
<BODY>
<input type=”button” name=”button1″ value=”relational”
onclick=test()>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>Contoh if-else</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = “JavaScript”>
<!–
var nilai = prompt(“Nilai (0-100): “, 0);
var hasil = “”;
if (nilai >= 60)
hasil = “Lulus”;
else
hasil = “Tidak Lulus”;
document.write(“Hasil: ” + hasil);
//–>
</SCRIPT>
</BODY>
</HTML> BENGKEL INTERNET PENS-ITS
5
4. Penggunaan operator switch untuk seleksi kondisi

5.   Pemakaian looping < for >

<HTML>
<HEAD>
<TITLE>Contoh Program Javascript</TITLE>
</HEAD>
<SCRIPT language=”Javascript”>
function test ()
{
val1=window.prompt(“Input Nilai (1-5):”)
switch (val1)
{
case “1″ :
document.write(“bilangan satu”)
break
case “2″ :
document.write(“bilangan dua”)
break
case “3″ :
document.write(“bilangan tiga”)
break
case “4″ :
document.write(“bilangan empat”)
break
case “5″ :
document.write(“bilangan lima”)
break
default :
document.write(“bilangan lainnya”)
}
}
</SCRIPT>
<BODY>
<input type=”button” name=”button1″ value=”switch”
onclick=test()>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>Contoh Program Javascript</TITLE>
</HEAD>
<BODY>
<SCRIPT language=”Javascript”>
<!–
for (x=0;x<=10;x++)
document.write(x+”<br>”)
// –>
</SCRIPT>
</BODY>
</HTML> BENGKEL INTERNET PENS-ITS
6
6.   Pemakaian looping < do..while >

7.  Pemakaian looping < while >

<HTML>
<HEAD>
<TITLE>Contoh Program Javascript</TITLE>
</HEAD>
<BODY>
<SCRIPT language=”Javascript”>
<!–
var x=0
do{
document.write(x+”<br>”)
x++;
}
while (x<=10)
// –>
</SCRIPT>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>Contoh Program Javascript</TITLE>
</HEAD>
<BODY>
<SCRIPT language=”Javascript”>
<!–
var x=0
while (x<=10){
document.write(x+”<br>”)
x++;
}
// –>
</SCRIPT>
</BODY>
</HTML> BENGKEL INTERNET PENS-ITS
7
C.  PEMBUATAN FORM
1.  Form input :

2.  Form button :

<html>
<head> </head>
<SCRIPT language=”Javascript”>
function test () {
var val1=document.kirim.T1.value
if (val1%2==0)
document.kirim.T2.value=”bilangan genap”
else
document.kirim.T2.value=”bilangan ganjil”
}
</SCRIPT>
<body>
<form method=”POST” name=”kirim”>
<p>BIL <input type=”text” name=”T1″ size=”20″>
MERUPAKAN BIL <input type=”text” name=”T2″ size=”20″>
</p>
<p><input type=”button” value=”TEBAK” name=”B1″ onclick=test()>
</p>
</form>
</body>
</html>
<HTML>
<HEAD>
<TITLE>Objek document</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = “JavaScript”>
<!–
function ubahWarnaLB(warna) {
document.bgColor = warna;
}
function ubahWarnaLD(warna) {
document.fgColor = warna;
}
//–>
</SCRIPT>
<H1>TES</H1>
<FORM>
<INPUT TYPE = “BUTTON”
VALUE = “Latar Belakang Hijau”
onClick = “ubahWarnaLB(‘GREEN’)”>
<INPUT TYPE = “BUTTON”
VALUE = “Latar Belakang Putih”
onClick = “ubahWarnaLB(‘WHITE’)”>
<INPUT TYPE = “BUTTON”
VALUE = “Teks Kuning”
onClick = “ubahWarnaLD(‘YELLOW’)”>
<INPUT TYPE = “BUTTON”
VALUE = “Teks Biru”
onClick = “ubahWarnaLD(‘BLUE’)”>
</FORM> BENGKEL INTERNET PENS-ITS
8

TUGAS :
1.
Buat halaman html untuk mengkonversi nilai angka menjadi nilai huruf dengan
menggunakan javascript (contoh seperti C.1.)

Konversi :
0-40 =E
41-55=D
56-60=C
61-65=BC
66-70=B
71-80=AB
81-100=A

2.
Buat halaman html untuk menampilkan aplikasi program kalkulator sederhana dengan
menggunakan javascript.

Contoh tampilan :

Bil 1 dan Bil 2 merupakan text box, dapat diisi angka, bila tombol + atau – atau x atau /
ditekan, maka akan keluar bilangan pada text box hasil, dimana bilangan ini merupakan
operasi arithmetic sesuai dengan tombol yang ditekan.

<SCRIPT LANGUAGE = “JavaScript”>
<!–
document.write(“Dimodifikasi terakhir pada ” +
document.lastModified);
//–>
</SCRIPT>

</BODY>

</HTML>

MATERI HTML 5

HTML5 ini adalah standar baru dari HTML, yang dikembangkan oleh World Wide Web Consortium (W3C) dan Web Hypertext Aplikasi Teknologi Working Group (WHATWG). ebagaimana pendahulu sebelumnya yaitu: HTML 4.01 dan XTHML 1.1, HTML5 adalah sebuah standar untuk menstrukturkan dan menampilkan isi pada World Wide Web. Standar ini memperkenalkan fitur baru seperti memutar video serta drag and drop, Sebelumnya fitur ini bergantung pada plugins pihak ketiga di penjelajah web seperti Adobe Flash dan Microsoft Silverlight.
Nah, untuk itu ada beberapa aturan yang harus kamu pelajari saat belajar HTML5, yaitu :

• Fitur baru harus didasarkan pada HTML, CSS, DOM, dan JavaScript
• Mengurangi kebutuhan untuk plugin eksternal (seperti Flash)
• Lebih baik penanganan kesalahan
• Lebih banyak penggunaakn markup untuk mengganti scripting.
• HTML5 harus independen
• Proses development-nya harus terlihat untuk umum (visible)

Dalam HTML5 hanya ada satu <DOCTYPE> deklarasi, dan sangat sederhana, yaitu :
<!DOCTYPE html>

Dengan belajar HTML5 sebenarnya kamu akan mendapat banyakmanfaat. Misalnya kita akan mempelajari bahwa HTML 5 menyederhanakan banyak praktek coding yang digunakan dalam versi sebelumnya dari HTML.

Fitur baru dalam HTML5 :

• Unsur kanvas untuk menggambar
• Video dan elemen audio untuk media pemutaran
• Dukungan yang lebih baik untuk penyimpanan secara offline
• Elemen konten yang lebih spesifik, seperti artikel, footer, header, nav, section
• Bentuk kontrol form seperti kalender, tanggal, waktu, email, url, search.

Beberapa browser sudah mendukung HTML5 seperti safari, chrome, firefox, dan opera. Kabarnya IE9 ( Internet Explorer ) akan mendukung beberapa fitur dari HTML5.

Pembuatan HTML5 juga di karenakan Standard HTML4 yang dijumpai banyak memiliki kelemahan untuk mendukung aplikasi web yang interaktif. Akibat hal ini banyak orang menambahkan fitur baru baik disisi aplikasi web ataupun disisi browser. Solusi ini dikenal dengan plugin dan salah satunya adalah Flash dan Silverlight.

Semakin menjamurnya plugin didalam aplikasi atau browser membuat aplikasi web ini susah untuk menembus banyak browser. Hal ini dikarenakan setiap plugin mempunyai cara yang berbeda-beda, sebagai contoh kita ingin memasang plugin flash untuk sharing video maka pada halaman web kita harus ditulis sebagai berikut

<object type="application/x-shockwave-flash" width="400" height="220" wmode="transparent" data="flvplayer.swf?file=movies/holiday.flv">
<param name="movie" value="flvplayer.swf?file=movies/holiday.flv" />
<param name="wmode" value="transparent" />
</object>

Contoh diatas menggunakan plugin Flash dari Adobe untuk menjalankan aplikasi web pada browser maka lain caranya bila kita menggunakan Silverlight. Teknologi Silverlight dikembangkan oleh Microsoft. Contoh penggunaan Silverlight pada halaman web dapat dilihat pada HTML dibawah ini

<object width="300" height="300" data="data:application/x-silverlight-2," type="application/x-silverlight-2" >
<param name="source" value="SilverlightApplication1.xap"/>
</object>

HTML5 ini dibuat menyederhanakan kompleksitas penggunaan media video dengan standard baru yaitu penggunaan tag <video>. Dengan fitur baru ini maka kita cukup menulis script untuk menjalankan file video sebagai berikut

<video src=tutorialku.mp4>
</video>

Isu bagaimana menjalankan file video pada aplikasi web merupakan salah satu contoh bagaimana HTML4 tidak dapat mencakup masalah ini dan masih banyak lagi isu pada HTML4. Oleh karena itu, kita sudah saatnya memanfaatkan HTML5 sebagai standard aplikasi web kita.

Apakah Browser Saya Support HTML5?

Bagaimana caranya untuk menguji apakah browser yang anda install itu sudah support HTML5 atau tidak dan seberapa banyak fitur HTML5 yang disupport? Caranya cukup mudah, pertama-tama pastikan komputer anda sudah terhubung dengan internet dan arahkan ke alamat web sebagai berikut:

http://html5test.com

Dari data yang ada pada website itu browser Maxthon 3.4.1 merupakan browser terbaik dalam hal mendukung bahasa HTML5 dengan 422 total skor diikuti kemudian dengan google Chrome 20 dengan 414 total skor kemudian berturut-turut Opera 12.00 dengan 385, Firefox 13 dengan 345, Safari 5.1 dengan 317 dan Internet Explorer 9 dengan 138 point