Matakuliah Pemrograman Web membahas dasar-dasar pembuatan halaman web statis menggunakan HTML, penggunaan database MySQL dan koneksinya, serta pembuatan web dinamis menggunakan PHP. Matakuliah ini mengajarkan mahasiswa tentang struktur dasar HTML, pengenalan tag-tag HTML, dan penggunaan bahasa PHP beserta database MySQL untuk membuat website dinamis.
2. KONTRAK PERKULIAHAN
Nama Matakuliah : Pemrograman Web
Kode Matakuliah : MI501
Jumlah SKS : 2 SKS
Penilaian :
Ujian Akhir Semester 30%
Ujian Tengah Semester 30%
Kehadiran 10%
Tugas 20%
Latihan + Quiz 10%
Bentuk Tugas :
Soft copy (file) – perorangan
Hard copy (cetak) – kelompok
Deskripsi Matakuliah :
Matakuliah ini berisi materi pemrograman berbasis web. Dimulai dari dasar-
dasar pemrograman web, yaitu pembuatan halaman web yang bersifat statis.
Kemudian dilanjutkan penggunaan database MySQL, koneksi database. Pada
bagian akhir dibahas tentang pembuatan web dinamis menggunakan script
php pada IDE dreamweaver.
3. CAPAIAN PEMBELAJARAN
Mahasiswa mampu memahami struktur perkuliahan, garis besar tugas, UTS dan UAS
Mampu memahami definisi perancangan dan pemrograman web.
Mahasiswa mampu memahami dan menggunakan struktur dasar HTML, serta memahami bahasa
pemrograman PHP dengan menggunakan database MySQL
Mampu memahami pengenalan HTML seperti Font, paragraph, hyperlink, dan heading.
4. XAMPP?
XAMPP merupakan aplikasi cross platform: Apache, MySQL, PHP dan Perl.
XAMPP juga memberikan solusi sederhana dan cukup ringan dijalankan, memungkinkan pembuat
web server lokal untuk melakukan pengetesan website.
XAMPP dapat dijalankan pada Mac dan Linux serta Windows.
XAMPP berguna untuk menjalankan script PHP pada localhost atau komputer tanpa harus ada
koneksi internet.
Tujuannya untuk menjalankan atau melakukan pengetesan sebuah website supaya lebih cepat
ketika diakses jika dibandingkan dengan cara online.
5. XAMPP : Komponen
Apache versi 2.4.29 adalah aplikasi web server default;
MariaDB versi 10.1.30 adalah sistem manajemen database;
PHP versi 7.2.1 adalah server side scripting untuk membuat aplikasi berbasis web;
phpMyAdmin versi 4.7.4 adalah tool untuk menggunakan MySQL berbasis web;
OpenSSL versi 1.1.0g adalah implementasi open-source dari dua protokol keamanan populer, yaitu
SSL dan TSL ;
XAMPP Control Panel versi 3.2.2 adalah kontrol panel sederhana untuk mengatur komponen
berbeda pada XAMPP;
6. XAMPP : Komponen
Webalizer versi 2.23-04 adalah sebuah tool analitik untuk user log dan metrik penggunaan;
Mercury Mail Transport System versi 4.63 adalah email server open source;
FileZilla FTP Server versi 0.9.41 berfungsi untuk melakukan transfer file;
Tomcat versi 7.0.56 adalah java servlet freeware untuk aplikasi Java;
Strawberry Perl 7.0.56 Portable berfungsi untuk melakukan distribusi Perl.
7. HTML : DASAR
HTML (Hypertext Markup Language) merupakan bahasa pemrograman web
yang digunakan untuk membuat halaman situs.
Untuk belajar HTML sebaiknya sintaksnya diketikkan di Notepad atau
software text editor lainnya.
Untuk menyimpan file HTML, caranya tentukan dahulu folder tempat menyimpan, beri nama file
dengan diakhir titik (.) html
Tag HTML terbagi menjadi 2 : tag HTML dengan penutup dan tag HTML tanpa penutup.
8. Tag HTML tanpa Penutup : <BR>
HTML elemen <br> menunjukkan sebuah line break (garis baru)
Elemen <br> sebaiknya digunakan hanya untuk garis baru yang benar-benar
merupakan bagian dari sebuah konten, seperti digunakan pada baris syair, puisi
dan alamat.
Contoh :
<body>
Ini baris pertama <br>
Ini baris kedua
</body>
9. Tag HTML tanpa Penutup : <HR>
Tag <hr> fungsinya untuk membuat garis horizontal (horizontal row)
Contoh :
<body>
Hari ini pertemuan pertama
<hr>
Akan membahas tentang
</body>
10. Tag HTML tanpa Penutup : <IMG>
Tag <img> fungsinya untuk menampilkan gambar.
Contoh :
<body>
<img src=“foto.jpg”>
Gambar diatas adalah . . .
</body>
11. Perhatikan Perintah Berikut!
Untuk jenis tag HTML yang berikutnya yaitu tag HTML dengan penutup, akan
diawali dari tag untuk text formating karena tag ini yang paling banyak digunakan
dalam pemrograman web, tag untuk pembuatan tabel dan tag untuk membuat
formulir.
Contoh :
<hr width=“50%”>
Tag Atribut
Keterangan :
hr pada perintah tersebut disebut sebagai tag,
sedangkan width disebut dengan atribut.
Atribut merupakan perintah yang menyertai
tag
12. Tag HTML dengan Penutup :
<b>…</b> | <i>…</i> | <u>…</u>
Tag <b> . . . </b> digunakan untuk menebalkan teks (bold)
Contoh :
<body>
<hr>
Tulisan ini tidak tebal <br>
<b> Tulisan ini tebal </b>
</body>
13. Tag HTML dengan Penutup :
<b>…</b> | <i>…</i> | <u>…</u>
Tag <i> . . . </i> digunakan untuk membuat tulisan miring (italic)
Contoh :
<body>
<hr>
Tulisan ini tidak miring <br>
<i> Tulisan ini miring </i>
</body>
14. Tag HTML dengan Penutup :
<b>…</b> | <i>…</i> | <u>…</u>
Tag <u> . . . </u> digunakan untuk membuat teks bergaris bawah (underline)
Contoh :
<body>
<hr>
Tulisan ini tidak bergaris bawah <br>
<u> Tulisan ini bergaris bawah </u>
</body>
15. Tag HTML dengan Penutup :
<font>…</font>
Tag ini berguna untuk mengganti tampilan teks default. Digunakan untuk
mengatur atau mengubah jenis huruf, ukuran huruf dan warna huruf. Tag yang
digunakan adalah FONT, dengan atribut FACE, SIZE dan COLOR.
Contoh :
<body>
Tulisan ini standar <br>
<font face=“calibri” size=“3” color=“blue”>
Tulisan ini akab berwarna biru dengan ukuran 3
</font>
</body>
16. Tag HTML dengan Penutup :
<pre>…</pre>
Teks yang ditulis didalam <pre> elemen atau preformat (preformatted text),
memiliki struktur berdasarkan ketetapan tifografi, artinya teks ditulis apa adanya
sesuai format yang ditulis didalam file (dokumen HTML)
Contoh :
<pre>
Pre ditulis dengan pola teks
Seperti ini..
Hasilnya pun akan tetap sama
Baik spasi maupun garis baru
Akan apa adanya
</pre>
