Tuesday, 17 March 2015

Membuat Program Web Sederhana


Assalamu'alaikum,, Pada pertemuan kali ini,, saya akan memberikan Script Program Web Sederhana,,, script ini tidak akan menampilkan tema (Theme) di Web, tetapi akan menampilkan Sebuah Program Form yaitu Mengisi Form Biodata dengan HTML dan PHP..Baiklah langsung saja ikuti langkah-langkah berikut :

Pertama kalian harus menyiapkan beberapa bahan :
   1. Xampp, jika belum punya download    >disini<
   2. Notepad++, jika belum punya download    >disini<

* Sebelum kalian lanjut ke langkah berikutnya kalian buat folder terlebih dahulu di C:/xampp/htdocs

Kedua kalian buka Notepad++ lalu salin script berikut :


<html>
<head>
<title>Biodata</title>
</head>
<body>
<form action="simpan.php" METHOD="GET">
<marquee scrollamount="1000"> <h1> <font color="red">SILAHKAN</font> <font color="blue">ISI</font> <font color="green">FORM</font> <font color="yellow">BERIKUT</font> </h1> </marquee> <br>
<table border="0">
<tr>
<td>
<table border="0">
<tr>
<td width="100px">Nama  </td><td> <input type="text" name="nama"></td></tr>
<tr>
<td>Umur  </td><td> <input type="text" name="umur"></td></tr>
<tr>
<td>Kelas </td><td> <select name="kelas">
<option value=""></option>
<option value="X TKJ">X TKJ</option>
<option value="X TKR">X TKR</option>
<option value="X AK">X AK</option>
<option value="XI TKJ">XI TKJ</option>
<option value="XI TKR">XI TKR</option>
<option value="XI AK">XI AK</option>
<option value="XII TKJ">XII TKJ</option>
<option value="XII TKR">XII TKR</option>
<option value="XII AK">XII AK</option>
</select></td></tr>
<tr>
<td>Kelamin </td><td> <input type="radio" name="kelamin" value="Laki-Laki">Laki-Laki
<input type="radio" name="kelamin" value="Perempuan">Perempuan </td><tr>
<tr>
<td>Hobi </td><td> <input type="text" name="hobi"></td></tr>
<tr>
<td>No Hp</td><td><input type="text" name="hp"></td></tr>
</table>
</td>
<td>
<table border="0">
<tr>
<td width="100px">E-mail  </td><td> <input type="text" name="email"></td></tr>
<tr>
<td>Facebook</td><td><input type="text" name="fb"></td></tr>
<tr>
<td>Twitter</td><td><input type="text" name="tw"></td></tr>
<tr>
<td>Alamat Blog</td><td><input type="text" name="blog"></td></tr>
</td>
</tr>
</table><br><br>
<input type="submit" value="Simpan">
</form>
</body>
</html>

Simpan dengan nama index.html letakkan di C:/xampp/htdocs/nama folder yang kalian buat
(* jangan lupa ganti Save as type dengan All Files (*.*))


ketiga kalian buat file baru (di Notepad++) dan salin Script berikut :


<html>
<head>
<title>Hasil</title>
</head>

<body>
<?php
$nama=$_GET["nama"];
$umur=$_GET["umur"];
$kelas=$_GET["kelas"];
$kelamin=$_GET["kelamin"];
$hobi=$_GET["hobi"];
$hp=$_GET["hp"];
$email=$_GET["email"];
$fb=$_GET["fb"];
$tw=$_GET["tw"];
$blog=$_GET["blog"];
?>
<h1> Biodata <?php print("$nama") ?> </h1>
<marquee scrollamount="300"><font color="blue">___________________________________________________________________________________</font></marquee>
<br><br>
<table border="0">
<tr>
<td width="100px" height="25">Nama<hr></td>
<td width="100px" height="25">Umur<hr></td>
<td width="100px" height="25">Kelas<hr></td>
<td width="100px" height="25">Kelamin<hr></td>
<td width="100px" height="25">Hobi<hr></td>
<td width="100px" height="25">Nomer Hp<hr></td>
<td width="100px" height="25">Facebook<hr></td>
<td width="100px" height="25">Twitter<hr></td>
<td width="100px" height="25">Blog<hr></td>
</tr>
<tr>
<td><?php print("<b> $nama </b>"); echo("<br>");?></td>
<td><?php print("<b> $umur </b>"); echo("<br>");?></td>
<td><?php print("<b> $kelas </b>"); echo("<br>");?></td>
<td><?php print("<b> $kelamin </b>"); echo("<br>");?></td>
<td><?php print("<b> $hobi </b>"); echo("<br>");?></td>
<td><?php print("<b> $hp </b>"); echo("<br>");?></td>
<td><?php print("<b> $fb </b>"); echo("<br>");?></td>
<td><?php print("<b> $tw </b>"); echo("<br>");?></td>
<td><?php print("<b> $blog </b>"); echo("<br>");?></td>
</tr>
</table>
<br><br><br>
<a href="https://localhost/contoh/"><input type="submit" value="Ulang"></a>
</body>
</html>

Simpan dengan nama simpan.php letakkan di C:/xampp/htdocs/nama folder yang kalian buat
(* jangan lupa ganti Save as type dengan All Files (*.*))

Jika sudah kalian buat Script diatas,, kalian jalankan dengan cara buka aplikasi browser, lalu ketikkan localhost/nama folder yang kalian buat    lalu tekan enter. dan akan muncul seperti gambar berikut :


Jika kalian sudah mengisi FORMnya kemudian klik tombol simpan. dan hasilnya akan seperti ini :



Sampai disini saja pertemuan kita,, Selamat Mencoba !!! Nantikan postingan selanjutnya... Semoga Postingan tentang Membuat Program Web Sederhana dari saya dapat bermanfaat bagi kalian para pembaca..
Wassalamu'alaikum...




No comments:

Post a Comment

Tinggalkan Jejak, dengan Meninggalkan Komentar
Komentar yang baik, akan di tanggapi dengan baik pula,
Berkomentarlah dengan kalimat yang sopan

Social Media

Newbie Blogger
Copyright © 2016 Fajar Amanullah Zaky | Powered By BLOGGER