ESTUDA WEB UJA MACROMEDIA DREAMWEAVER 8

Transkripsi

1 Lankah-lankah dalam pembuatan web Lankah pertama buatlah sebua folder baru pada data C---program file----pilih xampp-- -pilih htdocs ----lalu buatlah folder baru dalam folder htdocs tersebut dengan nama folder latihan.. Lalu lankah berikutnya bukalah program Macromedia Dreamweaver seperti pada gambar brikut: Setela muncul seperti gambar diatas klik pada PHP, maka akan muncul sperti pada gambar berikut, Setelah itu klik di Site ---new site maka akan muncul sperti pada gambar berikut,

2 Setelah muncul seperti ini ketiklah nama folder yang tadi telah di buat pada kotak diatas Dengan nama folder latihan2 Lalu klik next----

3 Pada radio button pilih yes lalu server nya pilih PHP MySQL seperti pada gambar di atas lalu klik next maka akan muncul seperti gambar berikut. Pada gambar diatas radio button nya pilih pilih Edit locally lalu yang di bawahnya where on your computer itu sudah otomatis terpilih jadi lansung klik next----maka akan muncul seperti gambar berikut,

4 Pada gambar diatas pada kotak what folder on your server select folder yamg tadi sudah di buat yakni latihan2 sperti pada gambar diatas, lalu klik next-----maka akan muncul seperti pada gambar berikut, Pada gambar di atas isilah nama folder pada kotak what URL seperti pada gambar diatas nama foldernya latihan2 lalu klik pada Test URL jika sukses maka akan muncul pesan successful seperti pada gambar diatas---lalu klik next---seterus nya klik next saja sampai muncul seperi gambar berikut, Tampil seperti gambar diatas klik Done-----maka akan muncul seperti gambar berikut,

5 Lankah berikut nya mendesain halaman index web untuk mendesain halaman pertama masukan layer terlebih dahulu, klik insert ---layout object lalu klik pada layer sperti gambar dibawah ini--- Setelah klik layer maka akan muncul seperti gambar dibawah ini,

6 Untuk memasukan gambar kedam layer tersebut klik di dalam kotak layer tersebut lau pilih insert klik pada image seperti pada gambar berikut, Setelah klik image maka akan muncul gambar seperti gambar berikut,

7 Jika sudah muncul seperti ini cari gambar yang ingin di masukan lalu klik ok---maka akan tampil seperti gambar berikut, Lankah berukutnya membua table menu----- Untuk membuat menu masukan terlebih dahulu satu layer lalu klik di dalam layer tersebut lalu klik pada insert lalu klik table seperti pada gambar berikut, Setelah klik table maka akan muncul seperti gambar berikut,

8 Pada kotak rows di isi 4 karena kita ingin membuat 4 menu seperti menu, home, profile, gallery, setelah itu klik ok maka akan muncul seperti gambar berikut, Pada table tersebut isikan menu, home, profile, gallery, seperti pada gambar berikut,

9 Lankah selanjutnya menyimpan halaman web tersebut, untuk menyimpan klik file--- klik save as isikan nama filinya INDEX lalu type filenya pilih PHP,seperti pada gambar berikut, Lankah memmbuat halaman baru, Untuk membuat halaman baru klik---file---klik----new lalu klik create maka akan muncul seperti gambar berikut,

10 Setela klik create maka akan muncul seperti gambar berikut, Akan muncul layar kosong seperti ini maka akan di simpan dengan nama file profile, didalam halaman baru tersebut kita akan mendesain profil Lankah berikutnya kita akan melakukan Link antara halaman,untuk melakukan Link antara halaman caranya blok terlebih dahulu menu mana yang akan di link lalu cari halaman yang akan di Link lalu apply contoh pada gambar berikut----

11 Setelah blok menu tersebut lalu pilih Link pada gambar berikut---- Setelah pilih link maka akan muncul seperti gambar berikut-----

12 Setelah muncul seperti ini maka pilih halam yang akan di link. Lankah berikut cara-cara membuat data base dengan xampp----- Cara membuka xampp buka terlebih dahulu internet explorer lalu ketik pada address bar internet explorer lalu tekan enter maka akan muncul seperti gambar berikut,---

13 Setelah muncul seperti gambar diatas maka klik pada php Myadmin akan tampil seperti gambar berikut, Setelah muncul tampilan seperti diatas maka kita akan membuat database, untuk membuat database isikan nama database pada kotak create database disini kita akan memeberi nama database dengan nama buku_tamu lalu klik create maka akan tampil seperti gambar berikut,------

14 Setelah muncul tampilan seperti diatas maka kita diminta untuk mengisi nama table dan field nya, disini kita mengisi nama tabelnya identitas dan ada 4 field,---setelah isi maka klik pada button Go maka akan tampil seperti pada gambar berikut,----- setelah muncul tampilan seperti diatas maka kita akan mengisi field-field nya dengan nama, alamat, , komentar, setelah mengisinya maka klik pada button save maka akan tampil seperti gambar beriktu,-----

15 Setelah isi semua field-fieldnya maka klik pada save akan tampil seperti gambar beriktu, Setelah save tutup saja xampp nya

16 Lankah berikutnya kita melakukan koneksi database Malakukan koneksi database pada web yang tadi kita sudah mendesainnya, klik pada database yang ada di application sebelah kanan lalu klik--- pada tanda ples lalu klik pada MySQL connection,---seperti gambar berikut, Setelah klik MySQL connection maka akan tampil seperti gambar berikut,----- Setelah tampil seperti gambar diatas maka isikan kotak-kotaknya seperti gambar berikut ini,

17 Setelah isi semuanya klik ok. Setelah itu klik pada Bindings yang ada pada application sebelah kanan atas lalu pili recordset,---seperti pada gambar berikut,----- Setelah pilih recordset maka akan tampil seperti gambar berikut,----- Setelah tampil seperti diatas isikan kotak seperti gambar berikut,----

18 Setelah melakukan koneksi kita akan membuat halaman baru untuk meletakan formform database yang tadi sudah kita buat, berikut kita buat halaman baru seperti biasa yang sudah dijelaskan diatas, Berikut lankah membuat formnya klik insert,----aplication object,---insert record, insert record from wizard,------seperti pada gambar berikut, Setelah klik maka akan muncul seperti gambar berikut,

19 Setelah tampil seperti diatas maka isikan kotak-kotak seperti pada gambar berikut,---- Setelah itu klik ok maka akan tampil seperti gambar beriktu,-----

20 Setelah itu coba jalankan,untuk menjalankan klik pada preview Maka akan tampil seperti gambar berikut,

21 Berikut kita membuat Dynamic tabelnya Seperti biasa buat terlebih dahulu halaman simpan dengan nama daftar,------setelah itu pilih insert,----aplication object, dynamic data,------dynamic table,----seperti gambar berikut, Setelah klik pada dynamic table maka akan tampil seperti gambar beriktu,-----

22 Setelah itu klik ok maka akan tampil seperti berikut ini, Setelah itu save all dan jalankan di internet explorer, Good Luck