Rabu, 15 Agustus 2012

Web PHP MySQL dengan Dreamweaver Wizard

Beberapa waktu yang lalu penulis diajari seorang teman untuk membuat web secara kilat, tinggal Drag and Drop menggunakan Dreamweaver. Cukup mengagumkan, sangat efektif untuk membuat web dengan field / kolom database sangat banyak secara kilat. Web yang bisa dibuat tersedia dalam teknologi PHP-MySQL, ASP.NET VB, ASP.NET C#, dan JSP.

Kali ini kita bahas dahulu untuk Web dengan Teknologi PHP-MySQL, dalam hal ini kita gunakan Dreamweaver CS3. Langkahnya sebagai berikut :

1. Buat dahulu New Site, dengan klik Menu Site- New Site


2, Kemudian konfigurasi Site nya seperti di bawah ini :




3. Pilih Server Technology PHP-MySQL


4. Pilih edit and test locally, arahkan ke folder web di htdocs/www


5. Masukkan URL web, Test


6. Test OK.


7. Pilih No


8. Klik Done


9. Akan ditampilkan Dreamweaver dengan setting Site yang sudah kita buat.


10. Buat File Baru, File-New-PHP :


11. Masukkan Nama File :


12. Pada Tab Application sebelah kanan, klik Database, klik + MySQL Connection :


13. Masukkan konfigurasi MySQL seperti di bawah ini :


14. Test, OK, OK Database selesai Dibuat.


15. Test OK


16. Jika telah berhasil, pada Database Tree akan terlihat Nama-nama Tabelnya


17. Di samping Tab Database, klik Tab Binding, klik + Recordser (Query)


18. Kemudian buatlah Recordset Baru, masukkan konfigurasi Tabel Recordsetnya misalnya seperti di bawah ini :


19. Klik Test


20. Klik OK, maka akan terbuat Recordset baru dan pada Halaman PHP tampak ada kode program tambahan.



21. Kemudian untuk menampilkan data pada Recordset tersebut. Pada Toolbar klik Tab Data, pilih Dynamic Table.


22. Pilih Recordset yang telah dibuat, masukkan Banyaknya Data Per Halaman (Pagging), kemudian masukkan konfigurasi Tabel, misalnya di bawah ini, klik OK :


23. Hasilnya akan digenerate Tabel Data pada Tampilan Halaman Web


24. Hasilnya dapat dilihat dengan klik F12 atau di browser ketikkan http://localhost/namaweb.


25. Pada Toolbar Insert, klik Tab Data, pilih Recordset Navigation Bar


26. Silakan pilih Text atau Images, Klik OK


27. Sudah tampak ada tambahan Fasilitas Pagging dan Navigasi.


28. Pada Toolbar Insert, pilih Data, pilih Recordset Navigation Status


 29. Klik OK


 30. Hasilnya akan ditambahkan Nomor Data.


31. Selesai, bisa dicek di http://localhost/namaweb, tampak tampilan tabel data lengkap dengan Navigasi dan Nomor Halaman.


Project contoh selengkapnya dapat didownload disini. Pada Google Docs, klik File Download.

Semoga berguna.