Praktikum_WEB

MODULPRAKTIKUMPEMROGRAMANWEB

OLEH :

AMALUDIN ARIFIA, S.Kom

UNIVERSITAS PGRI RONGGOLAWE TUBAN

2010

2011

Teknik Perangkat LunakUniversitas PGRIRonggolaweTuban


OLEH :



2010

2011



OLEH :



2010

2011


MODUL I

Tugas Pendahuluan

1. Apa yang anda ketahui Tentang HTML ?

2. Jelaskan sejarah sejarah singkat perkembangan Internet !

3. Jelaskan perkembangan HTML dan bagaimana perkembangan HTML selanjutnya

4. Dengan menggunakan HTML tampilkan Halaman berikut :Halaman Home.htm

Jika Surabaya diklik maka akan Link ke halaman Surabaya.htmJika Tuban diklik maka akan aka Link ke Halaman Tuban.HTML

Jika Back diklik akan kembali ke halaman Home.html

Web Statis HTML

Bentuk Format Dasar Dokument HTML

<HTML>

<head> <title>judul halaman </title></head>

<body>

Isi document yang akan ditampilkan di browser

</body>

</HTML>

1 Tag - Tag Dasar HTML

Start Tag Kegunaan

<html> Mendefinisikan sebuah dokumen html

<body> Mendefinisikan isi/badan suatu dokumen

<h1>-<h6> Mendefinisikan heading ke 1 s/d heading ke 6

<p> Mendefinisikan sebuah paragraph

<br> Menyisipkan sebuah line break

<hr> Mendefinisikan sebuah garis horizontal

<!--> Mendefinisikan komentar dalam kode sumber HTML

2 Tag untuk Pemformatan Teks

Start Tag Kegunaan

<b> Mendefinisikan teks tebal

<em> Mendefinisikan teks yang dimiringkan

<i> Mendefinisikan teks yang dimiringkan

<sub> Defines subscripted text

<sup> Mendefinisikan teks yang posisinya lebih ke atas

<u> Mendefinisikan teks yang bergaris bawah

<pre> Mendefinisikan teks preformatted

<html>

<head><title> Halaman Pertamaku</title></head><body>

<h1>ini adalah heading 1</h1>

<h2><font color=”blue”>ini adalah heading 2</font></h2>



<h2>ini adalah heading 2 </h2>


<p>ini adalah paragraph akan ditampilkan terus menerus secara otomatis terpengaruh browser anda tidakterpengaruh spasi otomatis akan teratur sendiri<br>ganti baris<br>ganti baris <br>ganti baris.<br>

<hr>

<! Komentar tidak ditampilkan di browser>

</body>

</html>

<html>

<head><title>Pemformatan teks</title></head>

<body bgcolor=”green”>

<h1 align="center"> <font color="red">KOMPUTER</font></h1>

<p>Sebenarnya computer berasal dari bahasa latin yaitu <b>compute</b>

yang artinya menghitung atau <i> to copmpute</i> yang sekarang menjadi<u>

computer</u> dasar kerjanya yaitu sebagai alat hitung, jadi dahulu kalkulator jugatermasuk computer:<br> <br></p>

contoh spesifikasi computer : <br>

<pre>

Prosesor Pentium 4

HDD 20 gb

RAM 512

MOBO Asus </pre><br>

<p> <font color="red" size="4">keterangan tag pre akan <sup>ditampilkan </sup>apaadanya di <sub>browser

<body>

</html>

3. Tag List

Start Tag Kegunaan

<ol> Mendefinisikan sebuah list ordered

<ul> Mendefinisikan sebuah list unordered

<li> Mendefinisikan sebuah item dalam list

<dl> Mendefinisikan sebuah list definisi

<html>

<body><title>List </title>

<h4>List bernomor:</h4>

<ol>

<li>Apel</li>

<li>Pisang</li>

<li>Lemon</li>

<li>Jeruk</li>

</ol>

<h4>List dengan huruf:</h4>

<ol type="A">

<li>Apel</li>

<li>Pisang</li>

<li>Lemon</li>

<li>Jeruk</li>

</ol>

<h4>List dengan huruf kecil:</h4>

<ol type="a">

<li>Apel</li>

<li>Pisang</li>

<li>Lemon</li>

<li>Jeruk</li>

</ol>

<h4>List dengan angka romawi:</h4>

<ol type="I">

<li>Apel</li>

<li>Pisang</li>

<li>Lemon</li>

<li>Jeruk</li>

</ol>

<h4>List dengan angka romawikecil:</h4>

<ol type="i">

<li>Apel</li>

<li>Pisang</li>

<li>Lemon</li>

<li>Jeruk</li>

</ol>

</body>

</html>

HTML

(LINK, FRAME, DAN TABEL)

Situs web biasanya tidak hanya terdiri atas 1 halaman saja (homepage, halaman awal/pembuka). Bila suatu situs terdiri atas lebih dari 1 halaman, situs tersebut pastimenggunakan hyperlink.

1. Link

Start Tag Kegunaan

<a> Mendefinisikan sebuah anchor

Atribut Target Kegunaan

target="_blank" Memuat dokumen baru ke dalam window baru yang kosong

target="_self"Memuat dokumen baru ke dalam window yang sama dengan anchor(default)

target="_parent"Memuat dokumen baru ke dalam parent frame (bila menggunakanframe)

target="_top"Memuat dokumen baru ke dalam keseluruhan window browser(cara yang umum digunakan untuk keluar dari frame)

HTML



1. Link

Start Tag Kegunaan







HTML



1. Link

Start Tag Kegunaan







2. Frame

Start Tag Kegunaan

<frameset> Mendefinisikan sebuah himpunan frame

<frame> Mendefinisikan sebuah sub window (sebuah frame)

<noframes>Mendefinisikan sebuah bagian noframe untuk browser yang tidakdapat menangani frame

Frameset (horisontal dan vertikal)

<html>

<frameset rows="50%,50%">

<frame src="frame1.htm">

<frameset cols="25%,75%">



</frameset>

</frameset>

</html>

3. Table

Start Tag Kegunaan

<table> Mendefinisikan sebuah table

<th> Mendefinisikan sebuah header table

<tr> Mendefinisikan suatu barisan dalam table

<td> Mendefinisikan suatu sel dalam table

<caption> Mendefinisikan sebuah caption untuk table

<colgroup> Mendefinisikan sekelompok kolom dalam table

<col>Mendefinisikan nilai atribut untuk satu atau lebih kolom dalamsebuah table

<thead> Mendefinisikan suatu head table

<tbody> Mendefinisikan suatu badan tabel

<tfoot> Mendefinisikan suatu footer tabel

<html>

<body>

<p>

Setiap tabel dimulai dengan tag table.

Setiap baris tabel dimulai dengan tag tr.

Setiap data dalam tabel dimulai dengantag td.

</p>

<h4>Satu baris satu kolom denganborder normal:</h4>

<table border="1">

<tr>

<td>100</td>

</tr>

</table>

<h4>Satu baris dan tiga kolom denganborder tebal:</h4>

<table border="8">

<tr>

<td>100</td>

<td>200</td>

<td>300</td>

</tr>

</table>

<h4>Dua baris dan tiga kolom denganborder sangat tebal:</h4>

<table border="15">

<tr>

<td>100</td>

<td>200</td>

<td>300</td>

</tr>

<tr>

<td>400</td>

<td>500</td>

<td>600</td>

</tr>

</table>

<h4>Tabel ini tidak memilikiborder:</h4>

<table border="0">

<tr>

<td>100</td>

<td>200</td>

</tr>

<tr>

<td>300</td>

<td>400</td>

</tr>

</table></body></html>

Tugas Praktikum

1. Dengan menggunakan HTML Buat tampilan dibawah ini:

Keterangan :

Frame terdiri dari 3 bagian

Masing- masing bagian terhubung oleh halaman lain

Jika bagian kiri frame diklik akan menampilkan halaman pada bagian kanan fame.

MODUL II

Tugas Pendahuluan

1. Lakukan semua percobaan Dibawah Tunjukkan Outputnya (image bebas)!!!

2. Beri penjelasan pada source yang anda kerjakan

HTML

Menyisipkan gambar

Start Tag Kegunaan

<img> Mendefinisikan sebuah gambar

<map> Mendefinisikan sebuah image map (peta gambar)

<area> Mendefinisikan sebuah area di dalam suatu image map

Insert Image

<html>

<body background="background.jpg">

<h3>Lihatlah, ada gambar latar belakang!</h3>

<p>Baik file gambar dengan format gif maupun jpg dapat digunakan sebagai latar belakangHTML.</p>

<p>Bila gambar yang digunakan lebih kecil dari halaman situs, gambar akan ditampilkan berulang-ulang.</p>

<p>

Sebuah gambar dari folder lokal:

<img src="gambar1.gif" width="144" height="50">

</p>

<p>

Gambar dari folder lain:

<img src="../images/gambar2.gif" width="33" height="32">

</p>

</body>

</html>

Mengatur posisi gambar

<html>

<body>

<p>

Sebuah gambar

<img src ="../images/contoh.gif" align="bottom" width="100" height="50">

di antara teks

</p>

<p>

Sebuah gambar

<img src ="../images/contoh.gif" align="middle" width="100" height="50">

di antara teks

</p>

<p>

Sebuah gambar

<img src ="../images/contoh.gif" align="top" width="100" height="50">

di antara teks

</p>

<p>Perhatikan bahwa default pengaturan adalah bottom (diletakkan di bagian bawah)</p>

<p>

Sebuah gambar

<img src ="../images/contoh.gif" width="100" height="50">

di antara teks

</p>

<p>


Sebuah gambar di depan teks

</p>

<p>

Sebuah gambar di belakang teks


</p>

</body>

</html>

Menampilkan teks alternatif untuk gambar

<html>

<body>

<img src="../images/gambar.gif" alt="Keterangan" width="32" height="32">

<p>

Browser text-only hanya akan menampilkan teks dalam atribut "alt", yaitu Keterangan".

Perhatikan bahwa bilamana Anda membawa pointer mouse di atas gambar tersebut maka teksalternatif akan ditampilkan.

</p>

</body></html>

Latar belakang dengan warna teks yang sesuai

<html>

<body bgcolor="#d0d0d0">

<p>

Paragraf ini terlihat enak dibaca karena menggunakan kombinasi warna latar belakang dan warnateks yang sesuai.

</p>

</body>

</html>

Latar belakang dengan warna teks yang buruk

<html>

<body bgcolor="#ffffff" text="yellow">

<p>

Paragraf ini terlihat tidak nyaman dibaca karena menggunakan kombinasi warna latar belakang danwarna teks yang tidak sesuai.

</p>

</body>

</html>

Tugas Praktikum

1. Buat Halaman web tentang penjualan online ada list harga dan barang, minimal ada 5 halaman

yang saling berhubungan.

MODUL III

Tugas pendahuluan :

1. Apa yang anda ketahui tentang php ?

2. Apa perbedaan clien side dan server side beserta contoh aplikasinya ?

3. Bagaimanakah sejarah php dari php versi awal sampai php versi terbaru ?

4. Tulis syntax singkat php ?

5. Apa kelebihan dan kelemahan php ?

Web Dinamis PHP

Penggunaan Script PHP

Blok scripting PHP selalu dimulai dengan <? Php dan diakhiri dengan?>. Blok scripting PHP dapatditempatkan di manapun dalam dokumen. Pada server dengan dukungan singkatan diaktifkan, Andabisa memulai blok scripting dengan <? dan diakhiri dengan?>. Untuk kompatibilitas maksimal, kamisarankan Anda menggunakan bentuk standar (<?Php)

Sebuah file PHP secara normal berisi tag HTML, seperti file HTML, dan beberapa kode scripting PHP. Dibawah ini, kita memiliki contoh script PHP sederhana yang mengirimkan teks "Hello World" ke browser:

Setiap baris kode PHP harus diakhiri dengan titik koma. titik koma adalah pemisah dan digunakan untukmembedakan satu set instruksi dari yang lain. Ada dua pernyataan dasar untuk teks output dengan PHP:echo dan print. Pada contoh di atas kita telah menggunakan echo pernyataan ke output teks "Hello

<? Php?>

<html><body>

<? Phpecho "Hello World";?>

</ Body></ Html>

World". Catatan: File ini harus memiliki ekstensi php.. Jika file tersebut memiliki ekstensi. Html, kodePHP tidak akan dieksekusi.

Komentar dalam PHP

Dalam PHP, kita menggunakan / / untuk membuat komentar baris tunggal atau / * dan * / untukmembuat blok komentar yang besar.

Tugas Praktikum :

1. Gunakan notepad atau editor yang lain sebagai editor php !

a. Dengan menggunakan perintah print atau echo tampilkan halaman web sebagai berikut

<html><body>

<? Php/ / Ini adalah komentar

/ *Ini adalahkomentarblok* /?></ Body></ Html>

b. Tabel

c. Garis dan Tulisan

2. Tulislah langkah membuat program php sampai menampilkan di Browser.

MODUL IV

Tugas Pendahuluan

1. Sebutkan jenis komentar dalam php !2. Ada berapa type data dalam php sebutkan dan jelaskan !3. Buatlah script php yang menyatakan variable dan penggunaanya ,mengetahui tanggal sekarang

beserta outputnya ( Satu halaman )!4. Apa yang dimaksud dengan konstanta ? berikan contoh program dan outputnya !5. Sebutkan dan jelaskan fungsi-funsgi yang ada pada string !

Variabel dalam PHP

Variabel digunakan untuk menyimpan informasi Variabel digunakan untuk menyimpan nilai-nilai, seperti

teks, nomor string atau array. Ketika variabel dideklarasikan, dapat digunakan berulang-ulang dalam

naskah anda. Semua variabel dalam PHP dimulai dengan tanda simbol $. Cara yang benar

mendeklarasikan variabel di PHP:

$Var_name=nilai;

Beginer PHP programmer sering lupa tanda $ pada awal variabel. Dalam hal ini tidak akan bekerja. Mari

kita mencoba menciptakan sebuah variabel yang berisi string, dan variabel yang berisi nomor:

Dalam PHP, variabel tidak perlu dideklarasikan sebelum menambahkan sebuah nilai. Dalam contoh di

atas, Anda melihat bahwa Anda tidak perlu memberitahu PHP yang tipe data variabel tersebut. PHP

secara otomatis mengkonversi variabel dengan jenis data yang benar, tergantung pada nilainya. Dalam

bahasa pemrograman sangat mengetik, Anda harus menyatakan (mendefinisikan) jenis dan nama variabel

sebelum menggunakannya. Dalam PHP, variabel dinyatakan secara otomatis saat Anda menggunakannya.

Aturan untuk penamaan Variabel

• Nama variabel harus dimulai dengan huruf atau underscore "_"

• Nama variabel hanya dapat berisi karakter alfanumerik dan garis bawah (a-z, A-Z, 0-9, dan _ )

<? Php$Txt = "Hello World!";$X =16 ;?>

• Nama variabel tidak boleh berisi spasi. Jika nama variabel lebih dari satu kata, itu harus dipisahkan

dengan sebuah garis bawah ($my_string), atau dengan kapitalisasi ($myString) Variabel String di PHP

Variabel string digunakan untuk nilai-nilai yang mengandung karakter. Setelah kita membuat sebuah

string kita bisa memanipulasinya. string dapat digunakan secara langsung dalam fungsi atau dapat

disimpan dalam variabel.

Di bawah ini, script PHP memberikan teks "Hello World" ke variabel string bernama $txt

Output dari kode di atas akan menjadi:

Hello World

Output :

<? Php$Txt = "Hello World";echo $txt;?>

<?php

$angka="469.80";

echo"angkanya adalah : $angka <br> ";

settype($angka,"Double");

print("type Double = $angka<br>");

settype($angka,"Integer");

print("type integer = $angka<br>");

?>

<html>

<head>

<title>Mendapatkan Variabel dalam HTML</title>

</head>

<body><form name="form1" method="post" action="post.php">

<table width="35%" border="0" align="center">

<tr>

<td colspan="2" bgcolor="#00FF00"> <div align="center">MasukkanUser And

Password</div></td>

</tr>

<tr bgcolor="#FF0000">

<td width="24%" height="38">USER</td>

<td> <input type="text" name="user"> </td>

</tr>

<tr>

<td height="40">PASSWORD</td>

<td> <input type="password" name="pswt" > </td>

</tr>

<tr bgcolor="#CCCCCC">

<td colspan="2">

<input type="submit" name="Submit2" value="Submit">

<input type="reset" name="Reset" value="Reset"> </td>

</tr>

</table>

</form>

</body>

</html>

Variabel melalui HTML (Get dan Post )

Script dengan method Post

Keterangan : objek harus berada pada form dan penamaan objek harus diperhatikan

Script dengan mengambil variable html :

Output : post.php

Tugas Praktikum

1. Dengan menggunakan php buat program untuk menmpilkan halaman dibawah ini, memanfaatkanfungsi String untuk mengmbil sebagian string :

<?php

echo"<body bgcolor=#CCCCCC>";

echo"<font size = 4 color = red>Selamat Datang<BR> Yang Anda kirimkan :<br></font>";

echo" Nama anda $_POST[user]<BR> PasswordAnda $_POST[pswt]";

?>

Buat halaman questioner untuk mengirimkan data mahasiswa yang berkaitan dengan Fakultas dan ProdiTPL Tampilkan hasil yang anda insertkan !contoh :

Data_question.php

MODUL V

Tugas Pendahuluan

1. Apa perbedaan antara Konstanta dan variable2. Berapa Jenis Operator yang ada pada PHP jelaskan3. Apakah perbedaan perbedaan struktur kondisi if, if else dan if than else !4. Dengan Memakai Wile tampilkan halaman browser sbb:

5. Buatlah file PHP untuk melakukan operasi penjumlahan. Tampilan awal adalah sebagai berikut :

Setelah dipilih tombol ”Hitung”, maka tampilannya menjadi seperti berikut:

Operator dan

Struktur Kontrol dalam PHP

OperatorAritmatika

Operator Description Example Result

+ Addition x=2x+2

4

- Subtraction x=25-x

3

* Multiplication x=4x*5

20

/ Division 15/55/2

32.5

% Modulus (division remainder) 5%210%810%2

120

++ Increment x=5x++

x=6

-- Decrement x=5x--

x=4

Penugasan

Operator Example Is The Same As

= x=y X=y

+= x+=y X=x+y

-= x-=y X=x-y

*= x*=y X=x*y

/= x/=y X=x/y

.= x.=y X=x.y

%= x%=y X=x%y

Perbandingan

Operator Description Example

== is equal to 5==8 returns false

!= is not equal 5!=8 returns true

<> is not equal 5<>8 returns true

> is greater than 5>8 returns false

< is less than 5<8 returns true

>= is greater than or equal to 5>=8 returns false

<= is less than or equal to 5<=8 returns true

Operator Logika

Operator Description Example

&& And x=6y=3

(x < 10 && y > 1) returns true

|| Or x=6y=3

(x==5 || y==5) returns false

! Not x=6y=3

!(x==y) returns true

Struktur Kontrol

Pada dasarnya, program merupakan serangkaian pernyataan-pernyataan. Aliran kontrol, sepertiyang tersirat dari namanya, mengontrol bagaimana pernyataan-pernyataan tersebut dijalankan.Biasanya aliran kontrol dibuat berdasarkan serangkaian kondisi yang ada.

Pernyataan if

Pernyataan if biasa digunakan untuk mengambil keputusan berdasarkan suatu kondisi. PHPmemiliki tiga macam bentuk if, yaitu if saja, if-else, dan if-elseif. Pada contoh berikut, kondisiyang diujikan adalah “$a bernilai 10 ”.

if ($a == "10") {

// jalankan suatu kode

}

Setelah nilai $a dievaluasi, jika ternyata variabel tersebut bernilai 10 (berarti kondisiterpenuhi/benar), maka kode yang terdapat di dalam kurung kurawal akan dijalankan. Namun,jika ternyata variabel tersebut bernilai selain 10 (berarti kondisi tidak terpenuhi/salah), makakode di dalam kurung kurawal akan diabaikan dan eksekusi program akan berlanjut ke kodeberikutnya.

Untuk memberikan serangkaian pernyataan alternatif dimana nilai $a tidak harus memenuhikondisi bernilai 10, tambahkan sebuah pernyataan else pada aliran kontrol tersebut. Dengandemikian bagian dari pernyataan yang lainnya akan dijalankan saat kondisi tidak terpenuhi.

if ($a == "10") {

echo "a bernilai 10";

} else {

echo "a tidak bernilai 10";

}

Pernyataan elseif dapat ditambahkan pada struktur untuk mengevaluasi sebuah kondisi alternatifsebelum sampai pada pernyataan else yang terakhir. Sebagai contohnya, pada struktur berikut inipertama-tama mengevaluasi apakah $a bernilai 10. Jika kondisi if tersebut tidak terpenuhi(salah), maka pernyataan elseif akan dievaluasi. Jika kondisi tersebut terpenuhi (benar), makakode yang terdapat di dalam kurung kurawal akan dijalankan. Jika ternyata pernyataan kondisitersebut masih belum benar, maka eksekusi program akan berlanjut hingga kepada pernyataanelse yang terakhir.

if ($a == "10") {

echo "a bernilai 10";

} elseif ($b == "8") {

echo "b bernilai 8";

} else {

echo "a tidak bernilai 10 and b tidak bernilai 8.";

}

Pernyataan while

Tidak seperti struktur if, dimana setiap kondisi dievaluasi sekali dan sebuah aksi dilakukanberdasarkan pada nilai benar atau salahnya, pernyataan while akan me-loop hingga kondisinyasalah. Dengan kata lain, while loop berlanjut selama kondisinya terpenuhi/benar. Jika kondisitidak terpenuhi maka perintah dalam while sama sekali tidak di jalankan. Berbeda dengan While,Do..While akan menjalankan perintah dalam while minimal 1 kali.

Sebagai contoh, while loop berikut ini, nilai variabel $a akan dicetak pada layar danditambahkan satu selama nilai $a lebih kecil dari atau sama dengan 5.

$a = 0 // menentukan sebuah nilai permulaan

while ($a <= "5") {

echo "a sama dengan $a<br>";

$a++;

}

Berikut ini merupakan keluaran dari while loop tersebut :

a sama dengan 0

a sama dengan 1

a sama dengan 2

a sama dengan 3

a sama dengan 4

a sama dengan 5

Pernyataan for

Seperti halnya while loop, for loop mengevaluasi serangkaian pernyataan kondisi padapermulaan tiap-tiap loop. Berikut ini merupakan syntax dari for loop :

for (expr1; expr2; expr3) {

// kode untuk dieksekusi

}

Pada permulaan setiap loop, ekspresi pertama dievaluasi, diikuti dengan ekspresi kedua. Jikaekspresi kedua terpenuhi, maka loop akan berlanjut dengan pengeksekusian kode lalumengevaluasi ekspresi ketiga. Namun, jika ekspresi kedua tidak terpenuhi, maka loop tidak akanberlanjut dan ekspresi ketiga tidak akan pernah dievaluasi.

Marilah kita ambil contoh yang telah digunakan pada while loop, lalu menulisnya kembalidengan menggunakan sebuah for loop.

for ($a = 0; $a <= "5"; $a++) {

echo "a sama dengan $a<br>";

}

Keluaran yang diperoleh akan sama saja dengan keluaran yang dihasilkan pada penggunaanwhile loop sebelumnya.

Pernyataan switch

Pernyataan switch merupakan sebuah cara sederhana untuk menampilkan tugas-tugas yang dapatdilakukan dengan pernyataan dasar if. Tujuan dari pernyataan switch adalah memungkinkan

pihak pengembang untuk menempatkan sebuah blok kode pada masing-masing kasus (case)yang berbeda. Berikut ini merupakan bentuk umum dari pernyataan switch :

switch($variable) {

[case <constant>:]

/* kode akan dijalankan jika $variable = 1 */

[break;]

[case <constant>:]

/* kode akan dijalankan jika $variable = 2 */

[break;]

...kasus tambahan

[default:]

/* kode akan dijalankan jika tdk ada kasus yg cocok */

}

Konstanta case tidak terbatas pada nilai integer sebagaimana pada bahasa lainnya seperti C. PadaPHP, nilai konstanta dapat pula menggunakan string dan floating point number. Di dalampenggunaannya, pernyataan switch menyediakan sebuah variabel tunggal yang nilainya akandibandingkan dengan nilai variabel – nilai variabel yang terdapat pada masing-masingpernyataan kasus (case) secara individual. Pada kenyataannya, pernyataan switch serupa denganserangkaian pernyataan if.

Tugas Praktikum

1. Tampilkan halaman dibawah ini

2. Tampilkan halaman web sebagai berikut

3. apa hasil Script_color.php, Operator apa yang digunakan dan berikan koment pada scriptnya !

<html>

<head><title>conntoh penggunaan if</title>

<font size="12"><B>Contoh penggunaan If</b><Hr><br>

<form method="Post" action="if.php">

<select name="mood">

<option value="0">Senang</option>

<option value="1">sedih</option>

<option value="2">Marah</option>

</select><input type="submit" value ="Mod saya !"></form>

<?php

if($_POST["mood"]==0)

{

echo"Saya lagi <font color=blue>seneng</font>";

}

elseif($_POST["mood"]==1)

{

echo"Saya lagi <font color=yellow>sedih</font>";

}

else

{

echo"Saya lagi <font color =red>marah</font>";

}

?>

</html>

Script_color.php

MODUL VI

Tugas Pendahuluan

1. Apa yang dimaksud dengan Entitas, Atribut, Field, Record, Data, dan Dantum ?2. Apa yang dimaksud dengan DBMS (Data Base Manajemen Sistem) ?3. Sebutkan software DBMS yang anda ketahui ?4. Buat Database dengan Nama Kampus :

Buat table Mahasiswa Tampilkan Seluruh Mahasiswa tersebut Tampilkan Nama mahasiswa yang mengandung huruf ‘a’

MYSQLOperasi Dasar Mysql

Masuk ke mysql :

1. Masuk ke folder ..\Xampp\mysql\bin2. Ketik pada command prompt mysql –u root

Pastikan mysql dalam keadaan running.

3. Untuk melihat database pada mysql ketik show databases;

4. Untuk memilih database ketik use [databases];5. Untuk melihat table yang ada pada database ketik show tables;6. Untuk melihat desain view table ketik describe [table];

Lihat gambar :

Membuat Database BaruCreate database nama_database;

Create table

Masuk terlebih dahulu ke database yang dibuat dengan Sintak use [database];

create table nama_tabel ( Field1 Tipedata, Field2 Tipedata dst …..PRIMARY KEY (Unique Field) );

Insert Tabel

Insert into nama_tabel values (‘Field1’,’Field2’, ……);Melihat seluruh isi table select * from nama_tabel ;

Request dengan Where :

Menampilkan data dengan field Agama islam saja

Update

update nama_tabel set Field1=values , Field2=values ….Where klause ;

Hapus

Delete from nama_tabel where klausa

Sebelum dihapus

Delete from karyawan where id_peg=’K0005’;

Setelah dihapus

Tugas Praktikum

1. Buat DataBase dengan nama Dataku2. Buat tabel buku_telepon (Fieldnya dirancang sendiri) data diisi minimal 20 record

Tampilkan nama,nomor_telepon dengan nomor jenis ‘simpati’ Tampilkan nama, nomor_telepon dengan nomor jenis ‘XL’ Tampilkan nama, nomor_telepon, alamat yang jenis kelaminya ‘Wanita’

3. Edit salah satu record yang ada .4. Hapus record dengan Kriteria nomer_telepon = ‘IM3’

MODUL VII

Tugas Pendahuluan

1. Bagaimanakah sintaq sql untuk tambah data, edit, hapus, juga menampilkan data2. Apa perbedaan menggunakan method get dan post3. Lakukan semua percobaan diatas . . . .

Hasil dan scriptnya di Print out !!!

Databasemysql phpmyadmin

http://localhost//phpmyadmin

Create database TOKO_ONLINE

http://localhost//

Buat table dan banyaknya field

Isikan field yang dbutuhkan

Tabel barang sudah terbentuk

Browse : Menampilkan record data

Structure : Menampilkan Struktur View dari table tersebut

SQL : Jika ingin menggunakan sintak sql untuk operasi database

Search : Pencarian record.

Insert : Insert data

Export : Export data ke extention yang lain.

Import : Import data dari extention lain ke mysql.

DST ………..

Koneksi

PHP Mysql

Untuk koneksi mysql dengan PHP

Menggunakan perintah :

mysql_connect(Server,User,Password);

Untuk Koneksi Database menggunakan :

mysql_select_db(‘data_base’);

Untuk perintah request dari mysql menggunakan :

mysql_query(“Sintaks_sql”);

Untuk menampung hasil queri menggunakan :

mysql_fetch_array();

Perhatikan Sintax dibawah ini !!!

Hasil:

Fakultas tidak ditampilkan Karena case sensitive seharusnya $hasil[FAKULTAS], sesuai denganfield yang ada pada table mahasiswa

Tambahkan sintak membuat table pada Script supaya tampilanya menjadi lebih Jelas

Hasil:

Pakai include() untuk penghematan sintaks php

File konek.php

File Tampil_include.php

Hasil

File koneksi cukup dipanggil dengan include(‘Koneksi.php’); jika halaman yang kita koneksikandengan mysql banyak, kita tidak perlu mengetik ulang skrip koneksi tersebut .

Tambah Data

Script :

Semua objek yang akan dieksekusi terletak di <form></form> dengan menggunakan methodPOST yang nanti inputan tersebut akan dikirim ke halaman exe_tambah.php <input name =nama_objek> berfungsi sebagai objek untuk menginputkan data tertentu, supaya terlihat hasilnyascript header(‘location: …..’) akan manampilkan halaman Tampil_include.php yang berisi queriuntuk menampilkan data .

Exe_tambah.php

Tugas Praktikum1. Buat halaman web tentang suatu produk. Halaman terdiri dari table inputan yang

terkoneksi dengan database. field terdiri dari kde_barang, nama_barang, Harga,nama_suplier, dll …!! Lakukan tambah data dan tampilkan data tersebut.

2. Export data ke bentuk text.

MODUL VIII

Tugas Pendahuluan

1. Apa yang dimaksud dengan ERD, Relation, Primary key, Foreign key dalam Databasedan bagaimana Notasinya.

2. Buat suatu database tentang penjulan suatu produk, minimal ada 3 tabel.

Connect PHP

Mysql UPDATE, DELETE

Tugas Pendahuluan

1. Apa yang dimaksud dengan ERD, Relation, Primary key, Foreign key dalam Databasedan bagaimana Notasinya.

2. Buat suatu database tentang penjulan suatu produk, minimal ada 3 tabel.Rancang Juga DFD nya !

Edit

Buat halaman edit data

Edit.php

Tampilkan data data mahasiswa dan tambahkan link untuk edit data dengan method ‘get’ lihat<a href=halaman_edit.php?NPM=$hsil[NPM]>Edit</a> akan menghubungkan dengan

halaman_edit.php dan menyimpan nilai dari NPM, yang nantinya akan digunakan padahalaman_edit.php

Hasil :

Halaman_edit.php

Hasil:

Akan diedit menjadi :

Setelah edit di klik akan menghuungkan halaman exe_edit.php

Exe_edit.php

Hasil edit.php

NPM 460302031 telah berhasil di edit.

Delete

Tambahkan script < a href=delet_mhs.php?NPM=$hasil[NPM] >

Script delet_mhs.php

Hasil:

Tugas Praktikum1. Buat suatu table dengan operasi database insert,update dan delete !!

Praktikum_WEB

Documents

Transcript of Praktikum_WEB