Ir. P. Insap Santosa, M.Sc., Ph.D. Pemrograman Web Ir. P. Insap Santosa, M.Sc., Ph.D. insap@mti.ugm.ac.id http://mti.ugm.ac.id/~insap/MyWeb Sesi 1 Matrikulasi S2
Halaman Web (1) Server Web IIS or Apache Klien Sesi 1 Matrikulasi S2
Halaman Web (2) Web page request Berkas PHP Berkas HTML Sesi 1 Matrikulasi S2
Halaman Web (3) Web page request HTML File PHP File SQL Result MySQL Database HTML File PHP File SQL Result SQL Query Sesi 1 Matrikulasi S2
Halaman Web (4) Client-side programming Server-side programming HTML, Javascript, CSS Server-side programming PHP, Perl, ASP, Ruby on Rail, Python, Java, Visual Basic Database MySQL, Microsoft Access, Oracle Sesi 1 Matrikulasi S2
Halaman Web (5) At least you will need: HTML Satu server-side programming language, misalnya PHP Satu server basis data, misalnya MySQL Satu editor teks Any good and FREE package available? YES of course, and it’s XAMPP (http://www.apachefriends.com) And Notepad++ (http://notepad-plus.sourceforge.net/uk/site.htm) Sesi 1 Matrikulasi S2
Client-side Programming HTML: Hyper Text Markup Language Untuk menampilkan informasi di komputer klien Javascript: Untuk menambah tingkat interaktifitas CSS: Untuk mempermudah personalisasi tampilan informasi Sesi 1 Matrikulasi S2
XAMPP (1) XAMPP: sebuah cross platform web server yang terdiri atas: Apache MySQL PHP dan Perl phpMyAdmin: GUI untuk mempermudah pengoperasian MySQL server secara manual FileZilla FTP server Sesi 1 Matrikulasi S2
XAMPP (2) Sesi 1 Matrikulasi S2
XAMPP (3) Sesi 1 Matrikulasi S2
XAMPP (4) Sesi 1 Matrikulasi S2
HTML (1) HTML (Hyper Text Markup Language) berfungsi untuk menampilkan informasi pada sisi klien Mempunyai sekumpulan tag untuk membedakan satu kegunaan dengan kegunaan yang lain Dapat ditulis menggunakan capital letters atau uppercase letters maupun lower case letters Diindentifikasikan dengan ekstensi .htm atau .html Sesi 1 Matrikulasi S2
HTML (2) Struktur Berkas html harus disimpan di direktori htdocs <head> dapat berisi link ke external css meta name internal css </head> <body> isinya halaman web </body> </html> Berkas html harus disimpan di direktori htdocs Sesi 1 Matrikulasi S2
HTML (3) Beberapa tag penting: <font></font> <img> <table> </table>, termasuk <tr></tr> dan <td></td> <a> </a> <form></form> <input></input> Sesi 1 Matrikulasi S2
<font></font> Tag ini digunakan untuk mengubah atribut dari font, misalnya warna, ukuran, dan stylenya <font color=red>Hahahaha</font> Hihihi <font size=3>Hehehehe</font> Hohoho <font style=italic>Miring</font> Tegak Sesi 1 Matrikulasi S2
<img> Tag ini digunakan untuk menampilkan gambar <img src = “contoh.jpg”> Sesi 1 Matrikulasi S2
<table></table> Tag ini digunakan untuk memulai suatu tabel Harus kemudian diikuti dengan <tr></tr> untuk mendefinisikan baris Harus diikuti dengan <td></td> untuk mendefinisikan sel data Sesi 1 Matrikulasi S2
<a></a> Tag ini digunakan untuk membuat link ke bagian lain dari web yang sama, ke web lain yang berbeda, atau untuk mengaktifkan email client secara langsung <a href=www.nba.com>NBA</a> <a href=www.nba.com#score>Score<a> <a href=mailto:insap@mti.ugm.ac.id>Insap</a> Sesi 1 Matrikulasi S2
<form></form> Tag ini digunakan untuk menunjukkan bagian interaktif dari HTML yang biasanya digunakan untuk meminta masukan dari pengguna <form method=post action=satu.php> Sesi 1 Matrikulasi S2
<input></input> Tag ini digunakan untuk menampilkan beberapa jenis antarmuka untuk masukan data <input type=radio name=sekolah></input> <input type=text name=nama></input> Sesi 1 Matrikulasi S2