Membuat Jobsheet tentang Cara Membuat Web Dinamis Dengan php Dan MySQL..

Yuliyanti_XMM1

Membuat Jobsheet tentang  Cara Membuat Web Dinamis Dengan php Dan MySQL..

KATA PENGANTAR             Kami panjatka puji serta syukur kehadiran ALLAH SWT.yang telah membarikan taufik dan hidayahnya,sehingga penyusun dapat menyelesaikan jobsheet ini. Penyusun menyadari bahwa belum sempurna karena dilihat dari segi penerapan terbatas pengetahuan dan pengalaman yang menyusun miliki. Karena keterbatasan penyusun, maka laporan ini insyaallah sesuai yang kita kehendaki. Untuk itu kritik dan saran yang membangun penyusun harapkan sebagai bahan masukan untuk menyempurnakan laporan selanjutnya. Atas segala bantuanya dan dorongan yang telah diberikan kepada penyusun, sekali lagi penyusun mengucapkan Terima Kasih,semoga ALLAH SWT membalas dengan berlipat ganda.             Akhir kata semoga. Laporan ini berguna bagi penyusun, Khususnya bagi para pembaca.                                                                                                 Depok, Mei 2013                                                                                                             Penulis              Pembuatan Database di PHPMyAdmin Langkah pertama yang dilakukan adalah mempersiapkan, XAMPP yang anda gunakan dalam keadaan “ON/Aktif” Langkah selanjutnya adalah membuat database di PhpMyAdmin dengan cara membuka  localhost/xammp lalu enter.kemudian pilih menu PhpMyAdmin Jika sudah membuka xammp lalu pilih maka akan keluar tampilan seperti di bawah ini ,pada kolom “ciptakan database baru” masukan nama database yang ingin anda buat, contoh “koran”,setelah memasukan nama database yang ingin di buat lalu klik tombol ciptakan. Setelah menciptakan database yang baru,sekarang kita akan membuat table untuk database koran dengan cara masukan nama table pada kolom “ciptakan table baru pada database koran”,masukan nama tabel “berita” kemudian masukkan jumlah kolom yang  ingin kita buat di tabel database dengan cara memasukkan jumlah kolom  pada kolom “number of fileds”,setelah itu klik tombol “GO” untuk membuat table.  Setelah itu kita mengklik tombol “Go” maka akan keluar tampilan seperti di bawah ini, kita diminta untuk mengisi kolom yang masih kosong,dengan cara mengisi  : Di masing masing  kolom fileds berinama data yaitu :”id_user,judul,content,gambar,username,tanggal” Setelah selesai kemudian klik save yang berada di bawah tabel.  Jika sudah maka anda harus memilih table yang anda buat dengan cara mengklik nama table yang anda buat yang berada di sebelah kiri,dan akan muncul tampilan seperti di bawah,dan kita akan menyisipkan data di table dengan cara memilih menu “sisipkan” yang berada di atas table. selanjutnya akan muncul tampilan seperti gambar di bawah ini, kita akan isi sesuai intruksi yang berada di gambar, khusus pada baris kolom diisi sesuai dengan nama file gambar yang akan dimasukan,setelah selesai klik “go”.

Maka di menu “Browse”akan keluar tampilan seperti gambar di bawah ini, lakukan langkah sisipkan sebanyak 4x dengan nama file gambar yang berbeda-beda.

II         Proses pembuatan PHP di DREAMWEAVER (READ)

Langkah pertama adalah membuat folder baru dan memasukan gambar, dengan cara membuat folder di xampp – htdoc, simpan folder dengan nama koran dan membuat kembali folder baru didalam folder koran untuk tempat menyimpan gambar dan mengganti masing-masing nama gambar dengan nama yang telah dimasukan didatabase.

Selanjutnya buka Adobe Dreamweaver

Tulis nama folder yang akan di buat di column “site name” dan klik “save”.  Buat file pada folder tersebut dengan mengklik kanan pada folder yang sebelumnya dibuat lalu klik “new file”

Di Dreamweamver adalah membuat tampilan wab yang akan kita buat dengan cara membuat table dengan cara insert kemudian pilih table

         

Jika sudah selesai tampil seperti gambar di bawah ini, dan untuk lebih mudah pekerjaan berinama setiap kolom dengan nama yang sama seperti yang di buat di database dan save di folder yang telah di buat di htdoc dan beri nama tampilan berita.

selanjutnya kita akan membuat web menjadi dinamis dengan cara menambahkan script php di dalam table dengan terlebih dahulu membuat file koneksi.php dengan cara ctrl+N,kemudian kita akan membuat koneksi kedatabase dengan script :

Kemudian save difolder yang telah di buat yang berada di htdoc dengan nama file koneksi.php.

Tahap berikutnya kita akan membuat web  menjadi dinamis dengan cara menambahkan script php :

<?php

Include “koneksi.php”;

$baca=mysql_query(“select * form berita”);

$tampung=mysql_fetch_array($baca);

?>

Kemudian tambahkan script php di colom judul,dengan menghapus judul dan ganti dengan script php sebagai berikut ini.

 <?php echo $tampung[‘judul’]; ?>

dan copykan script di atas ke dalam content,username,tanggal dan merubah nama judul yang berada di dalam kurung bricat menjadi nama yang di copykan.

Khusus untuk gambar pertama pilih tampilan desain kemudian di kolom gambar hapus text gambar kemudian masukan gambar dengan cara pilih menu insert – image kemudian pilih folder gambar dan pilih gambar yang di inginkan,agar tidak terlalu besar ubah panjang dan lebar dengan ukuran w=400 h=300 yang berada propert.

      III Membuat perintah delete dengan script php.

Langkah pertama yang di lakukan adalah membuat folder “admin ” di dalam folder koran yang sebelumnya sudah dibuat.

Selanjutnya membuat file baru di dreamweaver dengan cara ctrl+N, kemudian pilih php lalu create.

Kemudian kita akan membuat tampilan admin yang berfungsi sebagai tempat mengoprasikan web bagi admin,dengan cara yang  sama yaitu dengan membuat table seperti yang sebelumya hanya bedanya pada tampilan admin menggunakan rows : 2 dan columns : 8

Di tujukan agar tampilan sama seperti tampilan table pada database,dan berinama yang sama pada table seperti judul,content,gambar dll.

Langkah selanjutnya adalah dengan mengcopy script php dari file tampilanberita.

php yang sudah di buat yaitu :

<?php

include ("../koneksi.php");

$baca=mysql_query("select * from berita");

$tampung=mysql_fetch_array($baca);

?>

Pada include koneksi harus di tambahkan ../ karena koneksi berada di luar folder admin.

..........

         IV Membuat create dengan form dan proses menyimpan di database.

Pertama buat folder baru di dalam folder koran dengan nama form kemudian save.

selanjutnya membuat form input untuk memasukan data dengan cara klik menu form yang berada di atas kemudian klik form.

Setelah itu kita membuat table dengan rows : 7 dan columns : 2

Dan ketikan form input data,judul,content,gambar dll di dalam tamble.

 Setelah itu pada baris ke-2 kolom judul untuk type input menggunakan text field dengan cara memilih menu “insert – form – text field”

selanjutnya akan keluar tampilan seperti gambar berikut ini, pada kedua kolom diisi sesuai nama baris kolom pertama

Lakukan cara yang sama pada kolom kedua di baris content,username dan tanggal,

Khusus pada kolom ke-2 baris gambar tidak menggunakan text field melainkan file field.

Kemudian untuk kolom ke-2 baris content merubah type text dari single text menjadi multi text yang beradaa di properti.

Setelah itu maka langkah selanjutnya adalah membuat tombol untuk menyimpan,dengan cara pada kolom ke-2 baris trakhir klik menu “insert – form – button”

Ketikan simpan pada table ID,dan ubah value mejadi simpan.

Kemudian pada tampilan code pada script form action sisipkan file proses.php, yang bertujuan untuk meyimpan data ke database.

Setelah selesai save di dalam folder form dengan nama forminput.php.

Langkah selanjutya adalah membuat file baru untuk proses menyimpan data ke database denga cara membuat file baru di dreamweaver ,kemudian hapus semua code yang ada,dan ketikan script php berikut :

<?php

include "../koneksi.php";

$judul=$_POST['judul'];

$content=$_POST['content'];

$gambar=$_FILES[gambar']['name'];

$username=$_POST['username'];

$tanggal=$_POST['tanggal'];

?>

Setelah selesai lalu ketik script php seperti berikut ini : $perintah=mysql_query(“ “);

Untuk mempermudahnya adalah dengan membuka database yang telah dibuat dan pilih menu sisipkan seperti yang pernah dibuat hanya saja pada setiap kolom di ketik sesuai nama kolom dan menambahkan variabel ($) 

Kemudian klik “Go” maka akan keluar tampilan seperti gambar berikut dan muncul script, script itulah yang harus dicopy semua.

Setelah selesai dicopy selanjutnya adalah hanya tinggal paste didalam kurung

$perintah=mysql_query(“paste”);

Selanjutnya ketikan script php dibawah berikut ini :

if($perintah){

                echo "data yang anda masukan sudah tersimpan";

                }else

                {

                echo "maaf data anda gagal di simpan ";

                                }

Bertujuan untuk mengecek apakah data masuk apa tidak.

Setelah selesai simpan file di dalam folder form dengan nama proses.php, kemudian buka localhost/Koran/form dan pilih menu forminput untuk menginput data ke database.

Masukan data yang diinginka kemudian klik simpan.

SELESAI.....