|
|
May 23
2013
|
|
|
Membuat Jobsheet tentang Cara Membuat Web Dinamis Dengan php Dan
MySQL..
oleh: Bayu Kurniawan
|
Cara Membuat Web
Dinamis Dengan php Dan MySQL
|
|
Kata
Pengantar
Assallamu’alaikum Wr.Wb
Puji serta syukur marilah kita
panjatkan puji serta syukur ke hadirat Tuhan Yang Maha Esa. Atas taufik dan
hidayahnya, saya dapat menyelesaikan penyusunan JobSheet mengenai Cara Membuat Web Dinamis, dengan harapan saya dapt mengerti lebih
jauh tentang Web Dinamis.
JobSheet
ini disusun berdasarkan langkah-langkah yang telah saya pelajari di kelas 10
semester II dari mengenia tentang kodingan dan membuat data base di MySQL.
Saya
menyadari bahwa penyusunan JobSheet ini masih memiliki kekurangan. Oleh sebab
itu, kritik dan saran yang membangun dari berbagai pihak, akan kami teroma
dengan senang hati, demi penyempurnaan JobSheet
tentang Cara Membuat Design Web.
Wassallamu’alaikum Wr.Wb
Depok,23
Mei 2013
Penyusun
A. Bahan yang digunakan
a.
Laptop
b.
Aplikasi XAMPP (aplikasi agar kita dapat masuk
ke localhost)
c.
Adobe Dreamweaver atau agar kita dapat menkoding
atau menginclude data-data ke database.
B. Langkah-langkah untuk mebuat Web
Dinamis.
a.
Membuat Database/Creat
Buka web browser untuk membuka
localhost, lalu buka “localhost/phpmyadmin”
pada halaman browser yang anda buka.
1.
selanjutnya buat seperti gambar di biwah ini untuk
membuat database baru. Lalu klik Go
2.
Lalu isi semua kolom yang ada pada gambar
dibawah ini. Lalu klik “Go” lalu otomatis akan di save.
3.
Otomatis akan keluar gambar dan di save dengan
nama di bawah ini.
4.
Lalu klik berita yang
sudah diberit tanda kotak untuk melihat database.
5.
Setelah klik insert untuk membuat enteri baru.
6.
Lalu akan muncul gambar diatas. Lalu isi topik
apa yang kita ingin isi dan klik “Go” .
7.
setelah klik “Go”
maka akan keluar tampilan seperti dibawah ini.
8.
Jika sudah seperti gambar di atas lalu klik
“berita” untuk melihat hasilnya, dan ini hasil yang tadi di buat!
Kalau sudah seperti step di atas
anda sudah mempunyai data di database.
C. Membuat save pada database
- Langkah pertama
yaitu buka aplikasi Adobe Dreamweaver
- Langkah
selanjutnya yaitu membuat kodingan di Adobe Dreamweaver
Anda
harus membuat file di dalam folder, dan membuat folder dixampp/htdocs
1. Pertama
buka lah aplikasi Adobe Dreamweaver versi berapa saja.
2. Lalu
buat kodingan untuk membuat koneksi. Contoh kodingan diwah ini
Cara membuat koding
untuk koneksi
<?php
//untuk membuuat koneksi di data bese mysql host : localhost
mysql_connect("localhost","root","");
//database yang di gunakan berita
mysql_select_db("berita");
?>
Jika sudah selesai lalu save di
“XAMPP/htdocs/sekolah/admin”.
Setelah membuat koneksi.php selanjutnya membuat kodingan tampiltable.php ini adalah contoh kodingan dari tampiltable.php. lalu save “XAMPP/htdocs/sekolah/admin”.
Setelah membuat koneksi.php selanjutnya membuat kodingan tampiltable.php ini adalah contoh kodingan dari tampiltable.php. lalu save “XAMPP/htdocs/sekolah/admin”.
Cara membuat kodingan untuk membuat tampiltable.php
Cara membuat kodingan
tampiltable.php ini adalah contoh kodingan.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<p>
<?php
//memanggil file koneksi.php
include("../koneksi.php");
$baca=mysql_query("SELECT * FROM berita");
$tampung=mysql_fetch_array($baca);
?>
<?php do { ?>
<table width="795" height="80"
border="1">
<tr>
<td
width="46"> </td>
<td
width="89"> </td>
<td
width="120">idinformasi</td>
<td
width="95">judul</td>
<td
width="166">content</td>
<td
width="74">gambar</td>
<td
width="74">tanggal</td>
<td
width="79">user</td>
</tr>
<tr>
<td>edit</td>
<td><a
href="deletecontent.php?delete=<?php echo $tampung
["id_berita"];?>">delete</a></td>
<td> </td>
<td><?php
echo $tampung['Judul'];?></td>
<td><?php
echo $tampung['Content'];?></td>
<td><img
src="<?php echo $tampung['Gambar'];?>" width="296"
height="217" /></td>
<td><?php
echo $tampung['Tanggal'];?></td>
<td><?php
echo $tampung['User'];?></td>
</tr>
<?php } while
($tampung=mysql_fetch_array($baca)); ?>
</table>
</body>
</html>
Atau seperti gambar di bawah ini
Lalu save di
“XAMPP/htdocs/sekolah/admin”. Jika sudah di save lalu buka web browser untuk
melihat hasil dari kodingan tadi, jika berhasil semua maka akan keluar gambar
seperti gambar di bawah ini.
Nb: contoh hasil di atas telah
melewatkan proses lupping jadi hasilnya bisa menjadi banyak.
Cara membuat koding deletecontent.php
Jika sudah berhasil lalu buat
kodingan tentang deletecontent.php ini contoh dari kodingannya.
<?php
include("../koneksi.php");
$acuandelet=$_GET['delet'];
$perintah=mysql_query("delet berita where
id_berita=$acuandelet");
if($perintah){
echo
"data berhasil hapus";
}else { echo
"data gagal di hapus"; }
?>
Atau lebih tepat seperti gambar di bawah ini.
lalu save di
“XAMPP/htdocs/sekolah/admin”.dan buka web browser lalu klik delete untuk
mencoba apa berhasil atau tidak jika berhasil maka akan keluar gambar seperti
dibawah ini.
Cara membuat kodingan proses_simpan_content.php
Selanjutnya adalah membuat kodingan
proses_simpan_content.php, ini adalah contoh ketikan kodingan
<?php
include("../koneksi.php");
$judul=$_POST['judul'];
$content=$_POST['content'];
$gambar=$_FILES['file_upload']['name'];
$user=$_POST['user'];
$tanggal=$_POST['tanggal'];
print_r($_POST);
echo $gambar;
$simpan=mysql_query("insert into berita
values('','$judul','$content','$gambar','$user','$tanggal')");
if($simpan) {
echo
"data berhasil simpan";
} else { echo "data gagal simpan"; }
?>
Atau contoh gambar pada Dreamweaver
Setelah
itu lalu save di folder “XAMPP/htdocs/sekolah/admin”.
Cara membuat kodingan
forminputcontent.php
Ini adalah tahap terakhir dimana
saya akan membuat kodingan tentang forminputcontent.php, ini adalah contoh
darikodingannya
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8" />
<title>Untitled
Document</title>
</head>
<body>
<form
action="proses_simpan_content.php" method="post"
enctype="multipart/form-data" name="form1"
id="form1">
<table width="109%" border="0">
<tr>
<td colspan="2">Form
Input Content</td>
</tr>
<tr>
<td>judul</td>
<td><label
for="judul"></label>
<input type="text"
name="judul" id="judul" /></td>
</tr>
<tr>
<td>content</td>
<td><label
for="content"></label>
<textarea name="content"
id="content" cols="50"
rows="5"></textarea></td>
</tr>
<tr>
<td>gambar</td>
<td><label
for="file_upload"></label>
<input type="file"
name="file_upload" id="file_upload" /></td>
</tr>
<tr>
<td>tanggal</td>
<td><label
for="tanggal"></label>
<input type="text"
name="tanggal" id="tanggal" /> <label
for="user"></label></td>
</tr>
<tr>
<td>user</td>
<td><input type="text"
name="user" id="user" /></td>
</tr>
<tr>
<td> </td>
<td><input
type="submit" name="btn_simpan" id="btn_simpan"
value="Simpan" /></td>
</tr>
</table>
</form>
</body>
</html>
Lebih jelas gambar di bawah ini.
Setelah
selesai lalu save kembali di
“XAMPP/htdocs/sekolah/admin”. Setelah di save lalu buka browser dan ketik
localhost/sekolah/admin/forminputcontent.php dan jika berhasil maka akan keluar
seperti ini.
Jika sudah keluar gambar seperti di atas maka klik simpan untuk melihat berhasil atau tidak dalam menyimpan,jika berhasil maka akan muncul gambar seperti di bawah ini,
Jika ada bacaan di atas berarti sudah berhasil di simpan.
-Selesai-
-Selesai-
thanks atas postingannya, bener2 sangat membantu, terimakasih terimakasih :)
BalasHapuskayaknya masih banyak errornya setelah diterapin. tapi thanks infonya btw :)
BalasHapusvisit: http://race94.blogspot.com