Showing posts with label Belajar Webpro. Show all posts
Showing posts with label Belajar Webpro. Show all posts

Saturday, June 18, 2016

Contoh18 ( Halaman Index Pengunjung) : Webpro

Halaman Index Pengunjung

Buat file untuk halaman home...
simpan dengan nama home.php


Tambahkan gambar dengan cara insert -> image Object -> Image Placeholder



Buat file untuk mengakses halaman ke dalam file index. kita namakan buka_file.php
Script buka_file.php
<!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>
<?php
switch($_GET['page']){
case'':if(!file_exists ("home.php")) die ("File home tidak ada");
include "home.php";
break;
case'artikel':if(!file_exists ("tampilartikel.php")) die ("File berita tidak ada");
include "tampilartikel.php";
break;
case'bukutamu':if(!file_exists ("tambahbukutamu.php")) die ("File buku tamu tidak ada");
include "tambahbukutamu.php";
break;
}
?>
</body>
</html>



Terakhir kita buat tampilan halaman index.php
Sript index.php
<!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>
<table width="100%" border="0" align="center">
<tr>
<td colspan="4" bgcolor="#FF6600" height="80"><div style="font-size:50px">fajaryusuf.com</div></td>
</tr>
<tr bgcolor="#FF8901">
<td width="29%"></td>
<td width="12%"><a href="index.php">HOME</a></td>
<td width="21%"><a href="index.php?page=bukutamu">BUKU TAMU</a></td>
<td width="38%"><a href="index.php?page=artikel">ARTIKEL</a></td>
</tr>
<tr>
<td align="center" bgcolor="#FF0000">INFORMASI</td>
<td colspan="3"></td>
</tr>
<tr>
<td align="center">Contoh Pemrograman WEB 1<br/>
Terimakasih hormat saya fajar yusuf
</td>
<td colspan="3"><?php include "buka_file.php";?></td>
</tr>
<tr bgcolor="#FF6600">
<td colspan="4" align="center">PEMROGRAMAN WEB 1 - Fajaryusuf.com 2016</td>
</tr>
</table>
</body>
</html>



Hasilnya akan seperti berikut :

Halaman utama(index) yang telah kita buat..
Halaman buku tamunya



Yee akhirnya sampai disini kita telah berhasil membuat website informasi. .tinggal kalian lebih perdalam dan permahir lagi...







Jangan lupa like dan share
Jika ada pertanyaan silakan melalui komentar
hormat saya fajaryusuf.com




MATERI WEBPROGRAMMING

Jika anda baru di pemrogramman web silakan belajar dari materi pertama :

Materi ke-1 : Dasar-dasar Web
Materi ke-2 : Pemberian Warna
Materi ke-3 : Membuat Table
Materi ke-4 : Dasar PHP
Materi ke-5 : Tipe Data
Materi ke-6 : Konstanta dan Komentar
Materi ke-7 : Operator
Materi ke-8 : Operator Perbandingan
Materi ke-9 : Operator Logika
Materi ke-10 : Operator String
Materi ke-11 : Form
Materi ke-12 : Input dan Output dalam 1 Form
Materi ke-13 : Percabangan
Materi ke-14 : Pembuatan Database Mysql
Materi ke-15 : Buku Tamu
Materi ke-16 : Buku Tamu Lanjutan
Materi ke-17 : Artikel
Materi ke-18 : Halaman Index Pengunjung

Reviewer: FajarYusuf.Com
ItemReviewed: Contoh18 ( Halaman Index Pengunjung) : Webpro

Contoh17 (Artikel) : Webpro

Artikel

Buat tampilan form untuk halaman tambah artikel. Seperti di bawah ini :

Isi name textfield judul dengan judul, textarea isi artikel dengan isi, dan field file gambar dangan gambar.

Lalu masukkan listing berikut :

<!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>fajaryusuf.com</title>
<style type="text/css">
#form1 table tr td #button2 {
    text-align: center;
}
#form1 table tr td #button {
    text-align: center;
}
</style>
</head>

<body>
<form action="simpanartikel.php" method="post" enctype="multipart/form-data" name="form1" id="form1">
  <table width="444" height="264" border="1">
    <tr>
      <td colspan="2" bgcolor="#FF99CC"><center><h2>TAMBAH ARTIKEL</h2></center></td>
    </tr>
    <tr>
      <td width="115" height="23">Judul</td>
      <td width="313"><label for="judul"></label>
      <input type="text" name="judul" id="judul" /></td>
    </tr>
    <tr>
      <td height="105">Isi Artikel</td>
      <td><label for="isi"></label>
      <textarea name="isi" id="isi" cols="45" rows="5"></textarea></td>
    </tr>
    <tr>
      <td height="23">Gambar</td>
      <td><label for="gambar"></label>
      <input type="file" name="gambar" id="gambar" /></td>
    </tr>
    <tr>
      <td colspan="2"><input type="submit" name="button" id="button" value="Simpan" />
      <input type="reset" name="button2" id="button2" value="Batal" /></td>
    </tr>
  </table>
</form>
</body>
</html>

Simpan dengan nama tambahartikel.php



Buat script untuk penyimpanan artikel.
Halaman simpanartikel.php
Scriptnya seperti berikut :
<!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>
<?
$koneksi=mysql_connect("localhost","root","")or die(mysql_error());
mysql_select_db("db_berita");
$a=$_POST['judul'];
$b=$_POST['isi'];
$c=$_FILES['gambar']['name'];
$perintah="insert into artikel values('','$a','$b','$c')";
$simpan=mysql_query($perintah,$koneksi);
if($simpan)
echo "DATA BERHASIL DISIMPAN<br>";
else
echo "gagal";
?>
<a href="tambahartikel.php">Kembali ke tambah artikel</a>||<a href="tampilartikel.php">Lihat Artikel</a>
</body>
</html>


Sekarang Kita coba jalankan di browser

Isi judul artikelnya, masukkan isinya dan tambahkan gambar..

Jika berhasil akan muncul seperti dibawah ini



Buat file untuk menampilkan data yang ada di tabel artikel. Simpan dengan nama tampilartikel.php

Scriptnya seperti berikut :
<!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>
<?
$koneksi=mysql_connect("localhost","root","")or die(mysql_error());
mysql_select_db("db_berita");
$a=$_POST['judul'];
$b=$_POST['isi'];
$c=$_FILES['gambar']['name'];
$perintah="insert into artikel values('','$a','$b','$c')";
copy($_FILES['gambar']['tmp_name'],"Gambar/".$c);
$simpan=mysql_query($perintah,$koneksi);
if($simpan)
echo "DATA BERHASIL DISIMPAN<br>";
else
echo "gagal";
?>
<a href="tambahartikel.php">Kembali ke tambah artikel</a>||<a href="tampilartikel.php">Lihat Artikel</a>
</body>
</html>



Kita coba jalankan di browser dan hasilnya akan seperti ini :








Jangan lupa Like dan Share
jika ada pertanyaan silakan berkomentar
hormat saya fajaryusuf.com




MATERI WEBPROGRAMMING

Jika anda baru di pemrogramman web silakan belajar dari materi pertama :

Materi ke-1 : Dasar-dasar Web
Materi ke-2 : Pemberian Warna
Materi ke-3 : Membuat Table
Materi ke-4 : Dasar PHP
Materi ke-5 : Tipe Data
Materi ke-6 : Konstanta dan Komentar
Materi ke-7 : Operator
Materi ke-8 : Operator Perbandingan
Materi ke-9 : Operator Logika
Materi ke-10 : Operator String
Materi ke-11 : Form
Materi ke-12 : Input dan Output dalam 1 Form
Materi ke-13 : Percabangan
Materi ke-14 : Pembuatan Database Mysql
Materi ke-15 : Buku Tamu
Materi ke-16 : Buku Tamu Lanjutan
Materi ke-17 : Artikel
Materi ke-18 : Halaman Index Pengunjung

Reviewer: FajarYusuf.Com
ItemReviewed: Contoh17 (Artikel) : Webpro

Contoh16 ( Buku Tamu Lanjutan) : Webpro

Buku Tamu Lanjutan

Sekarang kita buat file untuk mengedit dan menghapus buku tamu ...

Buat tampilan editbukutamu.php seperti dibawah ini :


Script editbukutamu.php
<!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>
<?php
$koneksi=mysql_connect("localhost","root","")or die(mysql_error());
mysql_select_db("db_berita");
$tampil="SELECT * FROM buku_tamu WHERE id='".$_GET['id']."'";
$query=mysql_query($tampil)or die("gagal".mysql_error());
$row=mysql_fetch_array($query);
$a=$row['Id'];
$b=$row['Nama'];
$c=$row['Email'];
$d=$row['Pesan'];
?>
<form id="form1" name="form1" method="post" action="updatebukutamu.php?id=<?=$a;?>">
  <table width="392" border="1">
    <tr>
      <td colspan="2" bgcolor="#FFFF66">EDIT BUKU TAMU</td>
    </tr>
    <tr>
      <td width="98">Id Buku Tamu</td>
      <td width="278"><label for="textfield2"></label><?php echo $a; ?></td>
    </tr>
    <tr>
      <td height="45">Nama</td>
      <td><label for="Nama"></label>
      <input type="text" name="Nama" id="Nama" value="<?php echo $b;?>" /></td>
    </tr>
    <tr>
      <td>Email</td>
      <td><input type="text" name="Email" id="Email" value="<?php echo $c;?>" /></td>
    </tr>
    <tr>
      <td height="88">Pesan</td>
      <td><label for="Pesan"></label>
      <textarea name="Pesan" id="Pesan" cols="45" rows="5"><?php echo $d; ?></textarea></td>
    </tr>
    <tr>
      <td height="23">&nbsp;</td>
      <td><input type="submit" name="button" id="button" value="UPDATE" />
      <input type="submit" name="button2" id="button2" value="CANCEL" /></td>
    </tr>
  </table>
</form>
</body>
</html>

Penjelasan singkat :
Id buku tamu di ambil dari tampilbukutamu.php karna id sebagai kunci tamu maka id di kirim dengan get sehingga diedit buku tamu id dipanggil kembali bersama nilai nama email dan pesan yang sesuai dengan id tersebut..


Sekarang kita buat updatebukutamu.php
Scriptnya seperti berikut :
<!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>
<?php
$koneksi=mysql_connect("localhost","root","")or die(mysql_error());
mysql_select_db("db_berita");
$b=$_POST['Nama'];
$c=$_POST['Email'];
$d=$_POST['Pesan'];
$ubah="update buku_tamu set Nama='$b',Email='$c',Pesan='$d' where Id='".$_GET['id']."'";
$update=mysql_query($ubah,$koneksi);
if($update)
echo "<meta http-equiv='refreh' content='0 url=tampilbukutamu.php'>";
else
echo"gagal update";
?>
<body>
</body>
</html>

Penjelasan singkat :
hampir sama seperti script simpanbukutamu.php tapi querynya berbeda.. dan juga untuk where idnya memakai where Id='".$_GET['id']."'"; , karena kita mengirim nilai id melalui action di editbukutamu.


dan sekarang kita akan buat hapusbukutamu.php
Scriptnya seperti berikut :
<!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>
<?
$koneksi=mysql_connect("localhost","root","")or die(mysql_error());
mysql_select_db("db_berita");
$a=$_GET['id'];
$qry=mysql_query("DELETE FROM buku_tamu WHERE id='$a'");
if($qry)
echo"<meta http-equiv='refresh' content='0 url=tampilbukutamu.php'>";
else
echo"gagal";
?>
</body>
</html>



Silakan kalian coba jalankan dari tampilbukutamu.php dan cobalah mengedit data dan menghapus data.



Jangan Lupa Like dan Share
jika ada pertanyaan silakan berkomentar
hormat saya fajaryusuf.com





Reviewer: FajarYusuf.Com
ItemReviewed: Contoh16 ( Buku Tamu Lanjutan) : Webpro

Saturday, June 11, 2016

Contoh15 ( Buku Tamu) : Webpro

Buku Tamu

Sekarang buatlah Form input buku tamu, caranya dengan menggunakan dreamweaver ,klik icon dreamweaver pada startprogram atau desktop kalian.
pilih file new - lalu php



Pilih tampilan desaign lalu insert- fom-form

Lalu akan muncul garis putus-putus warna merah itulah yang disebut form dalam web 

lalu pilih file insert lagi dan pilih table, isi baris(row) dan kolom(columns) seperti berikut

Tablepun telah terbuat lalu marge kolom atas dan bawah , dengan cara blok dua kolom atas lalu klik kanan table-marge

Lalukan juga marge pada dua kolom bawah lalu kita buat table seperti ini 
Masukkan textfield pada samping kolom nama dan email dengan cara insert-form-textfield , dan di samping kolom pesan masukkan text area dengan cara insert-form-textarea , jika ada pilihan pilih saja ok . setelah itu masukkan namenya klik pada objek textfield samping nama dan masukan namenya nama .

isi name textfield email dengan email ,dan text area pesan dengan pesan .
Setelah itu masukkan 2 tombol(button) pada baris paling akhir dengan cara insert-form-button, setting name dan value 2 button tersebut ,button pertama isi value = kirim name=submit, button 2 value=batal name=reset




Pilih tampilan code, lalu isi form action untuk mengarah ke simpanbukutamu.php , lalu percatnik juga header buku tamu dengan h2 dan font juga color, tambahkan juga link bacaan(a href) setelah button.


Lalu simpan dengan nama tambahbukutamu.php

Membuat file simpanbukutamu.php
pilih new file - php
Lalu masukkan listing berikut :

<!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>
<?php
$koneksi=mysql_connect("localhost","root","")or die(mysql_error());
mysql_select_db("db_berita");
$a=$_POST['nama'];
$b=$_POST['email'];
$c=$_POST['pesan'];
$perintah="insert into buku_tamu value('','$a','$b','$c')";
$simpan=mysql_query($perintah,$koneksi);
if($simpan)
echo"<meta http-equiv='refresh' content='0 url=tambahbukutamu.php?Data Telah Tersimpan'>";
else
echo"gagal";
?>
<body>
</body>
</html>

lalu simpan dengan nama simpanbukutamu.php

Sekarang coba kita jalankan untuk mengecek apa tambahbukutamu.php tersambung dengan simpanbukutamu.php menggunakan database

jalankan filenya dan input nama sampai pesan

Jika benar tersambung akan ada peringatan diurl bahwa data tersimpan


dan kita cek di database pun databasenya masuk




Buat file untuk menampilkan data yang sudah tersimpan ke dalam tabel buku_tamu. seperti dibawah ini


Isi listing codenya seperti ini :

<!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>
<?php
$koneksi=mysql_connect("localhost","root","")or die(mysql_error());
mysql_select_db("db_berita");
$tampil="SELECT *FROM buku_tamu ORDER BY id";
$query=mysql_query($tampil)or die("gagal".mysql_error());
$jumlah=mysql_num_rows($query)
?>
<table width="522" height="102" border="1">
  <tr>
    <td colspan="6"><center>DATA BUKU TAMU</center></td>
  </tr>
  <tr>
    <td width="62" bgcolor="#00FFFF">No</td>
    <td width="107" bgcolor="#00FFFF">Nama</td>
    <td width="96" bgcolor="#00FFFF">Email</td>
    <td width="104" bgcolor="#00FFFF">Pesan</td>
    <td colspan="2" bgcolor="#00FFFF">Action</td>
  </tr>
  <?php
  while ($row=mysql_fetch_array($query))
  {
      $a=$row['Id'];
      $b=$row['Nama'];
      $c=$row['Email'];
      $d=$row['Pesan'];
      ?>
  <tr align="center">
    <td><?php echo $a;?></td>
    <td><?php echo $b;?></td>
    <td><?php echo $c;?></td>
    <td><?php echo $d;?></td>
    <td width="65"><a href="hapusbukutamu.php?id=<?=$a?>" onclick="return confirm('Anda Yakin Ingin Menghapus Item Ini?');">HAPUS</a></td>
    <td width="48"><a href="editbukutamu.php?id=<?=$a;?>">EDIT</a></td>
  </tr>
  <?PHP }?>
  <tr>
    <td colspan="6">Jumlah Record : <?php echo $jumlah;?></td>
  </tr>
</table>
</body>
</html>


Simpan dengan nama tampilbukutamu.php

Sekarang kita coba jalankan tampilan tampilbukutamu.php dibrowser , hasilnya akan seperti ini :



Postingan yang akan datang akan melanjutkan postingan ini.....









Jika ada pertanyaan silakan berkomentar.

Jangan Lupa like dan share.

Belajar Pemrograman di fajaryusuf.com aja. :)

Reviewer: FajarYusuf.Com
ItemReviewed: Contoh15 ( Buku Tamu) : Webpro

Friday, June 3, 2016

Contoh14 (Pembuatan Database Mysql) : Webpro

Pembuatan Database Mysql

PENGERTIAN DATABASE

MySQL adalah sebuah software database. Database merupakan sebuah tempat penyimpanan data yang jenisnya beraneka ragam. MySQL merupakan tipe data relasional yang artinya MySQL menyimpan datanya dalam bentuk tabeltabel yang saling berhubungan.
Keuntungan menyimpan data di database adalah kemudahannya dalam penyimpanan dan menampilkan data karena dalam bentuk tabel. Untuk melakukan pengolahan terhadap tabel, kita dapat menggunakan perintah SQL.
MENGENAL MYSQL 
Salah satu fitur unggulan PHP adalah kemudahannya untuk diintegarasikan dengan database. Di PHP, sangat mudah mengoneksikan diri dengan database. Database paling lazim yang digunakan untuk dipadukan dengan PHP adalah MySQL.
Fungsi-fungsi dalam mysql diantaranya adalah :
  • MYSQL-CONNECT() : Menghubungkan ke server mysql. Fungsi ini merupakan fungsi awal yang akan dijalankan sebelum melakukan fungsi-fungsi lain. Bentuk umum penulisan : Mysql_connect(host,user,password); 
  • MYSQL_CREATE_DB() : Fungsi yang sangat jarang di gunakan karena pada umumnya setiap programmer web, lebih cenderung dalam membuat database pada console atau phpmyadmin pada browser. Fungsi ini untuk membuat database baru. Bentuk umum penulisan : Mysql_create_db(nama_database) ; 
  • MYSQL_SELECT_DB() :Fungsi ini untuk mengaktifkan database yang telah tersedia pada mysql server. Bentuk umum penulisan : Mysql_select_db(nama_database) ;
  • MYSQL_QUERY() : Fungsi ini untuk memasukkan perintah-perintah SQL. Bentuk umum penulisan : Mysql_query(perintah-perintah SQL) ; 
  • MYSQL_NUM_ROWS() : Fungsi ini untuk mengetahui berapa jumlah record terkini. Fungsi ini berguna apabila akan membuat tabel yang bercorak. Bentuk umum penulisan : Mysql_num_rows(variabel) ; 
  • MYSQL_FETCH_ROW() : Fungsi ini untuk mengambil data per record atau per baris dalam suatu tabel, berdasarkan sistem urutan nomor index field. Bentuk umum penulisan : Mysql_fetch_rows(variabel) ; 
  • MYSQL_FETCH_ARRAY() : Fungsi ini memiliki fungsi yang sama dengan mysql_fetch_row() yaitu mengambil data perrecord. Yang membedakan adalah jika mysql_fetch_row() mengambil data berdasarkan nomor urut index sedangkan fungsi ini adalah nama fieldnya. Bentuk umum penulisan : Mysql_fetch_rows(variabel) ;

Membuat Database MySQL Menggunakan

PHPMyAdmin 
Buka browser kemudian ketikkan alamat URL : http://localhost/phpmyadmin.(pastikan xampp sudah menjalankan apache dan mysql) halaman ini bisa diakses menggunakan webserver local.


Untuk membuat database baru. Klik tab database. Kemudian ketikkan nama database di kolom “Create Database”. Nama database : db_berita


Setelah membuat database, langkah berikutnya adalah pembuatan tabel. Buat tabel dengan nama tabel “artikel” di kolom Create Table dan number of columns : 4. Jika sudah diinput, klik tombol GO


Mengisi Data
Isikan data untuk struktur tabel artikel sebagai berikut :

buat idartikel menjadi primary key dan auto increment.

Buat tabel baru di dalam database db_berita dengan nama “buku_tamu”. Struktur tabel sebagai berikut :



Di Post selanjutnya database db_berita ini akan kita pakai untuk pembelajaran selanjutnya.






Reviewer: FajarYusuf.Com
ItemReviewed: Contoh14 (Pembuatan Database Mysql) : Webpro

TENTANG SITUS

SITUS INI ADALAH SITUS PEMBELAJARAN PEMROGRAMAN DAN JUGA PEMAHAMAN TERHADAP TEKNOLOGI KOMPUTER. KALIAN BISA MENGIKUTI PEMBELAJARAN PEMROGRAMAN DENGAN BERTAHAP PADA MATERI YANG SUDAH SAYA SEDIAKAN, JIKA ADA MATERI YANG MEMBINGUNGKAN SILAKAN LAKUKAN KOMENTAR PADA MATERI YANG ANDA TANYAKAN ATAU KALIAN BISA MENGHUBUNGI SAYA DIHALAMAN KONTAK.