BUKU AJAR

PEMROGRAMAN WEB MENGGUNAKAN

PHP & MySQL

Medi H Tinambunan, [Link]

Dr. Djubir R. E. Kembuan, [Link]
Sri Wahyuni, [Link]
Alfiansyah Hasibuan, [Link]
Arif Sobirin Wibowo, [Link]

TAHTA MEDIA GROUP

ii
 BUKU AJAR
PEMROGRAMAN WEB MENGGUNAKAN
PHP & MySQL

Penulis:
Medi H Tinambunan, [Link]
Dr. Djubir R. E. Kembuan, [Link]
Sri Wahyuni, [Link]
Alfiansyah Hasibuan, [Link]
Arif Sobirin Wibowo, [Link]

Desain Cover:
Tahta Media

Editor:
Tahta Media

Proofreader:
Tahta Media

Ukuran:
v,73, Uk: 15,5 x 23 cm

ISBN: 978-623-147-215-1

Cetakan Pertama:
November 2023

Hak Cipta 2023, Pada Penulis

Isi diluar tanggung jawab percetakan
Copyright © 2023 by Tahta Media Group
All Right Reserved

Hak cipta dilindungi undang-undang

Dilarang keras menerjemahkan, memfotokopi, atau
memperbanyak sebagian atau seluruh isi buku ini
tanpa izin tertulis dari Penerbit.

PENERBIT TAHTA MEDIA GROUP

(Grup Penerbitan CV TAHTA MEDIA GROUP)
Anggota IKAPI (216/JTE/2021)

iii
 KATA PENGANTAR

Puji dan syukur kami panjatkan kepada Tuhan Yang Maha Esa, karena
atas berkat dan rahmat-Nya buku ajar ini dapat dibuat untuk mata kuliah
Pemrograman WEB dengan menggunakan PHP dan MySQL pada bidang
ilmu komputer dan rumpunnya.
Buku Pemrograman Web menggunakan PHP dan MySQL ini merupakan
buku yang berisikan materi yang dapat digunakan untuk melakukan
pembelajaran teori ataupun praktikum karena dilengkapi dengan lembar
laporan praktikum. Dengan menggunakan buku ini mahasiswa dapat belajar
pemrograman web dengan lebih terstruktur tidak hanya pada praktiknya tapi
secara teoritis mahasiswa juga mampu memahami struktur script yang
dituliskan, selain itu buku ini juga membahas mengenai database, dimana
database merupakan salah satu pondasi penting dalam membangun sebuah
sistem yang lebih kompleks kedepannya. Dengan buku ini diharapkan
mahasiswa mampu menerapkan dan mengembangkan dari setiap materi yang
disajikan dengan penjelasan yang sangat lengkap.
Buku ini masih jauh dari kata sempurna , oleh karena itu tim penulis
sangat mengharapkan kritik dan saran untuk melakukan pengembangan
materi pada buku ini untuk kedepannya, agar buku ini semakin menjadi lebih
baik lagi dan dapat menyelaraskan dengan kebutuhan industri saat ini,
sehingga melalui buku ini mahasiswa dapat mengikuti perkembangan industri
teknologi khususnya pada pengembangan website. Akhir kata tim penulis
mengucapkan Terimakasih.

Tondano, Oktober 2023

Tim Penulis

iv
 DAFTAR ISI

Kata Pengantar............................................................................................... iv
Daftar Isi ......................................................................................................... v
Bab 1 Hypertext Markup Language (HTML) ................................................ 1
1.1 Pengantar HTML ............................................................................ 1
1.2 Penggunaan Tag HTML ................................................................. 7
1.3 Latihan .......................................................................................... 21
1.4 Tugas Praktikum ........................................................................... 21
Bab 2 Hypertext Preprocessor (PHP) ........................................................... 22
2.1 Pengantar PHP .............................................................................. 22
2.2 Instalasi PHP ................................................................................ 23
2.3 Syntax PHP ................................................................................... 25
1.4 Variabel Tipe data dan Operator ................................................... 26
1.5 Lingkup Deklarasi Variabel .......................................................... 31
1.6 Struktur Kontrol dan Perulangan .................................................. 33
1.7 Latihan .......................................................................................... 40
1.8 Tugas Praktikum ........................................................................... 40
Bab 3 Database ............................................................................................. 41
3.1 Pengantar Database ...................................................................... 41
3.2 Konsep Database .......................................................................... 42
3.3 Lingkup Database ......................................................................... 46
3.4 Database Relational ...................................................................... 47
3.5 Perancangan Database .................................................................. 50
3.6 Normalisasi ................................................................................... 52
3.7 Data Definition Language (DDL)................................................. 54
3.8 Data Manipulation Language (DML) ........................................... 64
3.9 Latihan .......................................................................................... 67
3.10 Tugas Praktikum ........................................................................... 68
Form Praktikum ............................................................................................ 69
Daftar Pustaka .............................................................................................. 70
Profil Penulis ................................................................................................ 71

v
 BAB 1
HYPERTEXT MARKUP LANGUAGE (HTML)

Tujuan :
Setelah mempelajari materi ini, maka mahasiswa diharapkan mampu;
1. Mahasiswa mampu memahami struktur HTML.
2. Mahasiswa mampu menjelaskan elemen HTML.
3. Mahasiswa mampu menjelaskan atribut HTML.
4. Mahasiswa mampu merancang halaman HTML dengan menerapkan
struktur, elemen dan atribut HTML.

1.1 PENGANTAR HTML

HTML atau Hypertext Markup Language adalah salah satu script yang
digunakan dalam pengembangan aplikasi berbasis web, HTML digunakan
untuk menampilkan halaman sebuah website. HTML merupakan script yang
bersifat open source artinya semua orang dapat menggunakan secara bebas
dan gratis. Setiap orang yang bekerja sebagai pengembang aplikasi berbasis
website tentunya tidak asing lagi dengan HTML. Dokumen HTML dapat
digunakan dan diedit oleh setiap orang yang memahami cara penggunaan atau
pun masih ditahap pembelajaran. HTML memiliki syntax penulisan dengan
diawali simbol <html> dan diakhiri dengan </html>. Pada awalnya HTML
dikembangkan sebagai subset SGML (Standart Generalized Mark-Up
Language). Karena HTML didedikasikan untuk ditransmisikan melalui
media internet, maka HTML relatif lebih sederhana daripada SGML yang
lebih ditekankan pada format dokumen yang berorientasi pada aplikasi.
a. Struktur HTML
Elemen pada HTML memiliki tag, tag awal dan akhir sebagai
penanda bahwa halaman website tersebut dibangun menggunakan
struktur HTML. File-file HTML merupakan dokumen teks yang diformat
menggunakan HTML, maka untuk melakukan penulisan maupun editing
dokumen HTML dapat menggunakan berbagai macam editor, dalam
pembahasan ini akan dijelaskan menggunakan visual studio code. Pada
HTML setiap pembuka < tentunya diakhiri dengan penutup berupa </
contohnya pada tag pembuka berikut <head> maka diakhiri dengan
</head> atau biasa disebut dengan istilah backslash. Secara umum tag
HTML juga dapat disisipkan pada bahasa pemrograman seperti
Hypertext Preprocessor (PHP). HTML memiliki syntax standart yang

Pemrograman WEB dengan menggunakan PHP dan MySQL | 1

 biasa digunakan untuk membangun sebuah website, berikut ini adalah
syntaxnya;
<html>
<head>
<title> Belajar Web </title>
</head>
<body>
//content
</body>
</html>

Dari script diatas dapat kita lihat setiap ada elemen pembuka < maka
akan diakhiri dengan elemen penutup </ hal ini tentunya menjadi sangat
perlu untuk diperhatikan ketika kita pemula dalam menggunakan tag
elemen pada HTML, biasanya hal ini yang sering menjadi permasalahan
karena kurangnya penutup tag elemen HTML dapat membuat halaman
website kita menjadi berantakan, kita akan membahas setiap tag HTML
pada syntax dasar dari HTML;
1. Secara default HTML membutuhkan script pengenal tag HTML
yang dimulai dengan <html> dan ditutup dengan </html>.
2. Didalam tag <html> terdapat <head> …</head> yang digunakan
untuk pengenalan meta, title atau http_equiv. tag ini disebut juga
dengan tag kepala.
3. Tag <title>..</title> merupakan tag yang digunakan untuk membuat
judul pada halaman sebuah website, jika kita menulisakan <title>
Aplikasi Sekolah </title> maka pada judul halaman website akan
menampilkan seperti gambar berikut ini:

Gambar 1.1 Hasil Perubahan Title pada HTML

4. Tag <body>..</body> atau yang disebut juga tag badan, berisikan
content website kita, apapun yang kita isi didalam tag tersebut akan
ditampilkan kehalaman website kita, misalkan kita sudah

2 | Pemrograman WEB dengan menggunakan PHP dan MySQL

 menyisipkan syntax PHP pada script HTML kita maka dapat kita
tampilkan juga didalam tag <body> hasil dari syntax PHP tersebut.
Perlu untuk diketahui juga bahwa, HTML dapat diproses
menggunakan live server, sehingga apapun yang kita tuliskan pada
lembar kerja dengan ekstensi html dapat langsung diproses pada sisi
client, dalam hal ini web browser.

b. Tag Pada HTML

Ketika kita mulai bekerja menggunakan HTML tentunya kita tidak
pernah terlepas dari tag, berikut ini adalah tag HTML yang paling sering
digunakan;
Tabel 1.1 Tag HTML
Tag
No Tag Awal Kegunaan
Akhir
<!DOCTYPE html> </html> Deklarasi bahwa file ini
1
merupakan dokumen html 5
<html> </html> Deklarasi bahwa file ini
2
merupakan dokumen html
<head> </head> Elemen yang digunakan untuk
3 menulis terkait dengan meta
tentang halaman html
<title> </title> Elemen yang digunakan untuk
4 memberikan judul halaman dari
sebuah website
<body> </body> Elemen yang akan digunakan
untuk mengisi paragraf, heading,
5 images, hyperlinks, iframe,
tables, lists dan masih banyak
lagi tag html lainnya
<h1> </h1> Elemen yang digunakan untuk
6 membuat tulisan menjadi lebih
besar
<p> </p> Elemen yang digunakan untuk
7 membuat tulisan berbentuk
paragraf
<!-- --> Elemen komentar yang
8 digunakan sebagai penanda
kegunaan sebuah script

Pemrograman WEB dengan menggunakan PHP dan MySQL | 3

 <b> </b> Elemen yang digunakan untuk
9
memformat teks bold
<hr> Elemen yang digunakan untuk
10
memberikan garis horizontal
<br> </br> Elemen yang digunakan untuk
11 membuat 1 kali enter ke baris
berikutnya
<h1> </h1> Elemen yang digunakan untuk
<h2> </h2> format ukuran teks
<h3> </h3>
12
<h4> </h4>
<h5> </h5>
<h6> </h6>
<img src=””> Elemen yang digunakan untuk
13 menampilkan gambar pada
halaman website
<a href=””> </a> Elemen yang digunakan untuk
14
melakukan link pada url tertentu
<iframe src=””> </iframe> Elemen yang biasanya digunakan
15 untuk menampilkan file berupa
video atau file jenis lainnya

c. Contoh Penggunaan HTML

Untuk dapat menggunakan HTML dalam membangun sebuah
halaman website tentunya kita harus memiliki kode editor, silahakan
diinstal Notepad++, salah satu kode editor yang paling sering digunakan
adalah Visual Basic Code dan Sublime Text, tidak hanya itu saja akan
tetapi masih ada kode editor lain seperti atom dan adobe dreamweaver.
Dalam buku ini akan dibahas bagaimana cara menggunakan visual studio
code dalam membuat halaman website dengan HTML. Pertama kali
silahkan mendownload visual studio code pada link berikut;
[Link] sesuaikan dengan sistem operasi yang
digunakan. Setelah berhasil selanjutnya silahkan diinstal dan kemudian
ketika berhasil diinstal maka akan menampilkan seperti gambar berikut;

4 | Pemrograman WEB dengan menggunakan PHP dan MySQL

 Gambar 1.2 Tampilan Halaman Utama VSC

Setelah halaman tersebut tampil maka selanjutnya kita dapat memulai

pembuatan file dengan memilih file -> new file

Gambar 1.3 Menu File

Pemrograman WEB dengan menggunakan PHP dan MySQL | 5

 Setelah berhasil membuat file maka akan tampil halaman dialog seperti
gambar dibawah ini maka buatkan halaman baru dengan nama
[Link], simpan file tersebut pada folder yang anda inginkan;

Gambar 1.4 Penamaan File HTML

Setelah berhasil membuat file maka selanjutnya pilih folder untuk tempat
penyimpanan file HTML seperti gambar dibawah ini;

Gambar 1.5 Folder Penyimpanan File

Setelah pemilihan folder jangan lupa untuk membuat ekstensi nama file
dengan nama_file.html, karena jika tidak ada ekstensi tersebut maka file
tersebut tidak dapat dikenali sebagai file HTML. Setelah selesai

6 | Pemrograman WEB dengan menggunakan PHP dan MySQL

 penyimpanan maka selanjutnya file tersebut sudah dapat kita gunakan
untuk mengelola syntax HTML.

Gambar 1.6 Halaman Kerja HTML

1.2 PENGGUNAAN TAG HTML

Sebelumnya sudah dibahas mengenai tag HTML yang sering kita
gunakan pada pemrograman website, selanjutnya akan kita praktekkan pada
lembar kerja yang sebelumnya sudah kita buat yaitu [Link];
a. Format Dokumen HTML
Pada penjelasan sebelumnya sudah dijelaskan beberapa elemen
yang dapat digunakan untuk format dokumen, berikut ini contoh
penggunaan pada html;
Contoh Penggunaan Font H1 sampai H6:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Pemrograman WEB Menggunakan PHP & MySQL</title>
</head>
<body>
<h1>Pemrograman WEB Menggunakan PHP & MySQL</h1>
<h2>Pemrograman WEB Menggunakan PHP & MySQL</h2>
<h3>Pemrograman WEB Menggunakan PHP & MySQL</h3>
<h4>Pemrograman WEB Menggunakan PHP & MySQL</h4>
<h5>Pemrograman WEB Menggunakan PHP & MySQL</h5>
</body>
</html>

Pemrograman WEB dengan menggunakan PHP dan MySQL | 7

 Gambar 1.7 Penggunaan Heading

Selanjut dalam memformat dokumen pada halaman HTML ada juga

menggunakan paragraf, bold, break, komentar, garis horizontal, dan PRE,
berikut ini adalah contoh penggunaannya;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Pemrograman WEB Menggunakan PHP & MySQL</title>
</head>
<body>
<p>Ini adalah halaman yang digunakan untuk menguji paragraf</p>
<b>ini pengujian bold</b>
<!-- ini pengujian blok komentar -->

<!-- dibawah ini pengujian garis -->

<p>ini penggunaan break <br> pada halaman HTML</p>
<!-- ini penggunaan garis horizontal pada HTML -->
<hr>
<!-- ini penggunaan <PRE> pada HTML -->
<pre>
foreach($a as $value){
echo "selamat anda mulai belajar pemrograman WEB";
}
</pre>

</body>
</html>

8 | Pemrograman WEB dengan menggunakan PHP dan MySQL

 Gambar 1.8 Format Dokumen HTML

Selain format HTML diatas ada juga format lainnya yang dapat anda
gunakan, berikut rangkumannya:

Tabel 1.2 Format Dokumen HTML

No Tag Awal Tag Akhir Keterangan
1 <i> </i> Elemen yang digunakan untuk
membuat huruf miring
2 <u> </u> Elemen yang digunakan untuk
membuat garis bawah pada huruf
3 <tt> </tt> Elemen yang digunakan untuk
membuat teks berbentuk huruf
mesin ketik
5  Elemen yang digunakan untuk
menampilkan superscript
6  Elemen yang digunakan untuk
menampilkan subscript
7 <small> </small> Elemen yang digunakan untuk
menampilkan teks dengan ukuran
kecil
8 <big> </big> Elemen yang digunakan untuk
menampilkan teks dengan ukuran
besar
9 <strike> </strike> Elemen yang digunakan untuk
menampilkan garis ditengah teks
10 <blockquote> </blockquote> Elemen yang digunakan untuk
membuat paragraf menjorok
kedalam.

Pemrograman WEB dengan menggunakan PHP dan MySQL | 9

 11 <font> </font> Elemen yang digunakan untuk
dapat mengatur jenis, ukuran dan
warna pada sebuah teks dengan
menambahkan elemen face, size
dan color

b. Penggunaan List
Selain melakukan format dokumen kita juga dapat melakukan
pembuatan list pada halaman HTML, berikut ini contohnya;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Pemrograman WEB Menggunakan PHP & MySQL</title>
</head>
<body>
<ul>
<li>Nama : Medi Tinambunan</li>
<li>Pekerjaan : Dosen</li>
<li>Program Studi : Teknik Informatika</li>
</ul>
<ol>
<li>Nama : Medi Tinambunan</li>
<li>Pekerjaan : Dosen</li>
<li>Program Studi : Teknik Informatika</li>
</ol>

</body>
</html>

10 | Pemrograman WEB dengan menggunakan PHP dan MySQL

 Gambar 1.10 Penggunaan Bulet List dan Angka

c. Penggunaan Karakter Khusus ISO 8859-1

Terkadang dalam suatu dokumen HTML ingin ditampilkan
karakter- karakter tertentu, misalnya tanda lebih besar, lebih kecil dan
lain-lain. Berikut ada karakter khusus ISO Latin -1 dan ISO 8859-1 yang
sering digunakan pada halaman HTML;

Tabel 1.3 Karakter Khusus ISO Latin-1

capital A, grave small i,

&Agrave; &iuml;
À accent ï diæresis/umlaut

small a, grave capital Eth,

&agrave; à &ETH; Ð
accent Icelandic

capital A, acute
&Aacute; Á &eth; ð small eth, Icelandic
accent

small a, acute
&aacute; á &Ntilde; Ñ capital N, tilde
accent

capital A,
&Acirc; Â &ntilde; ñ small n, tilde
circumflex

Pemrograman WEB dengan menggunakan PHP dan MySQL | 11

 small a,
&acirc; â &Ograve; Ò capital O, grave accent
circumflex

&Atilde; Ã capital A, tilde &ograve; ò small o, grave accent

&atilde; ã small a, tilde &Oacute; Ó capital O, acute accent

small a,
&auml; ä &Ocirc; Ô capital O, circumflex
diæresis/umlaut

&Aring; Å capital A, ring &ocirc; ô small o, circumflex

&aring; å small a, ring &Otilde; Õ capital O, tilde

capital AE
&AElig; Æ &otilde; õ small o, tilde
ligature

capital O,
&aelig; æ small ae ligature &Ouml; Ö
diæresis/umlaut

&Ccedil; Ç capital C, cedilla &ouml; ö small o, diæresis/umlaut

&ccedil; ç small c, cedilla &Oslash; Ø capital O, slash

12 | Pemrograman WEB dengan menggunakan PHP dan MySQL

 capital E, grave
&Egrave; È &oslash; ø small o, slash
accent

small e, grave
&egrave; è &Ugrave; Ù capital U, grave accent
accent

capital E, acute
&Eacute; É &ugrave; ù small u, grave accent
accent

small e, acute
&eacute; &Uacute; capital U, acute accent
é accent Ú

capital E,
&Ecirc; Ê &uacute; ú small u, acute accent
circumflex

small e,
&ecirc; ê &Ucirc; Û capital U, circumflex
circumflex

capital E,
&Euml; Ë &ucirc; û small u, circumflex
diæresis/umlaut

small e, capital U,
&euml; ë &Uuml; Ü
diæresis/umlaut diæresis/umlaut

capital I, grave
&Igrave; Ì &uuml; ü small u, diæresis/umlaut
accent

small i, grave
&igrave; ì &Yacute; Ý capital Y, acute accent
accent

Pemrograman WEB dengan menggunakan PHP dan MySQL | 13

 capital I, acute
&Iacute; Í &yacute; ý small y, acute accent
accent

small i, acute
&iacute; í &THORN; Þ capital Thorn, Icelandic
accent

capital I,
&Icirc; Î &thorn; þ small thorn, Icelandic
circumflex

small i,
&icirc; î &szlig; ß small sharp s, German sz
circumflex

capital I,
&Iuml; Ï &yuml; ÿ small y, diæresis/umlaut
diæresis/umlaut

Tabel 1.4 Karakter ISO 8859-1

&#160 &nbsp; non-breaking space
&#161 &iexcl; ¡ inverted exclamation mark
&#162 &cent; ¢ cent sign
&#163 &pound; £ pound sign
&#164 &curren; ¤ general currency sign
&#165 &yen; ¥ yen sign
&#166 &brvbar; ¦ broken (vertical) bar
&#167 &sect; § section sign
&#168 &uml; ¨ umlaut/dieresis
&#169 &copy; © copyright sign
&#170 &ordf; ª ordinal indicator, fem
&#171 &laquo; « angle quotation mark, left

14 | Pemrograman WEB dengan menggunakan PHP dan MySQL

&#172 &not; ¬ not sign
&#173 &shy; soft hyphen
&#174 &reg; ® registered sign
&#175 &macr; ¯ macron
&#177 &deg; ° degree sign
&#177 &plusmn; ± plus-or-minus sign
&#178 &sup2 ² superscript two
&#179 &sup3 ³ superscript three
&#180 &acute; ´ Acute accent
&#181 &micro; µ micro sign
&#182 &para; ¶ pilcrow (paragraph sign)
&#183 &middot; · middle dot
&#184 &cedil; ¸ cedilla
&#185 &sup1; ¹ superscript one
&#186 &ordm; º ordinal indicator, male
&#187 raquo; » angle quotation mark, right
&#188 &frac14; ¼ fraction one-quarter
&#189 &frac12; ½ fraction one-half
&#190 &frac34; ¾ fraction three-quarters
&#191 &iquest; ¿ inverted question mark
&#215 &times; × multiply sign
&#247 &div; ÷ division sign

Pemrograman WEB dengan menggunakan PHP dan MySQL | 15

d. Penggunaan Tabel
HTML juga menyediakan tag untuk membuat tabel, berikut ini
adalah tag yang kita gunakan untuk membuat table;
1. <table> … </table> digunakan untuk mendefenisikan sebuah tabel
2. <tr> … </tr> digunakan untuk mendefenisikan sebuah baris pada
tabel
3. <th> … </th> digunakan untuk mendefenisikan judul tiap kolom atau
baris pada sebuah tabel
4. <td>…</td> digunakan untuk mendefenisikan isi tiap kolom

Berikut ini adalah contoh penggunaan tabel pada HTML;

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Pemrograman WEB Menggunakan PHP & MySQL</title>
</head>
<body>
<!-- contoh penggunaan Table -->
<table border="1">
<tr>
<th>Judul kolom 1</th>
<th>Judul kolom 2</th>
<th>Judul kolom 3</th>
</tr>
<tr>
<td>isi dari kolom 1 baris 1 </td>
<td>isi dari kolom 2 baris 1 </td>
<td>isi dari kolom 3 baris 1 </td>
</tr>
<tr>
<td>isi dari kolom 1 baris 2 </td>
<td>isi dari kolom 2 baris 2 </td>
<td>isi dari kolom 3 baris 2 </td>
</tr>
</table>
</body>
</html>

16 | Pemrograman WEB dengan menggunakan PHP dan MySQL

Berikut adalah hasil dari script tabel diatas;

Gambar 1.12 Penggunaan Tabel

Selain menggunakan tabel seperti bentuk diatas, dalam penggunaan tabel
ada juga yang dinamakan dengan colspan dan rowspan, colspan
digunakan untuk menggabungkan kolom sedangkan rowspan digunakan
untuk menggabungkan baris, berikut ini adalah contohnya;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Pemrograman WEB Menggunakan PHP & MySQL</title>
</head>
<body>
<!-- contoh penggunaan Table -->
<table border="1">
<tr>
<th>Judul kolom 1</th>
<th>Judul kolom 2</th>
<th>Judul kolom 3</th>
</tr>
<tr>
<td colspan="2">Ini digunakan untuk menggabungkan 2
column </td>
<td rowspan="2">ini digunakan untuk menggabungkan 2 rows
</td>
</tr>
<tr>
<td>isi dari kolom 1 baris 2 </td>
<td>isi dari kolom 2 baris 2 </td>
</tr>
</table>
</body>
</html>

Pemrograman WEB dengan menggunakan PHP dan MySQL | 17

 Berikut ini adalah hasil dari script diatas

Gambar 1.12 Penggunaan Rowspan dan Colspan

Selain tag yang digunakan tersebut diatas, tag table juga memiliki
atribut tambahan lainnya, berikut ini adalah atribut yang sering
digunakan pada elemen table;
Table 1.5 Atribut pada <table>
ATRIBUT KETERANGAN
ALIGN Posisi horizontal tabel
BACKGROUND Menentukan gambar latar belakang
BGCOLOR tabel
Menentukan warna latar belakang tabel
BORDER Menentukan tebal bingkai tabel
BORDERCOLOR Menentukan warna bingkai tabel
BORDERCOLORLIGHT Menentukan warna depan bingkai tabel
BORDERCOLORDARK Menentukan warna bayangan bingkai
tabel
CELLSPACING Menentukan jarak spasi antar sel
CELLPADDING Menentukan jarak isi sel dengan bingkai
HEIGHT Menentukan tinggi tabel
WIDTH Menentukan lebar tabel
VALIGN Menentukan posisi vertikal teks dalam
sel
Table 1.6 Atribut pada <td>
ATRIBUT KETERANGAN
ALIGN Posisi horizontal teks dalam sel
BACKGROUND Menentukan gambar latar belakang sel
BGCOLOR Menentukan warna latar belakang sel
BORDER Menentukan tebal bingkai sel
BORDERCOLOR Menentukan warna bingkai sel

18 | Pemrograman WEB dengan menggunakan PHP dan MySQL

 BORDERCOLORLIGHT Menentukan warna depan bingkai sel
BORDERCOLORDARK Menentukan warna bayangan bingkai sel
COLSPAN Menentukan jumlah kolom yang digabung
HEIGHT Menentukan tinggi sel
NOWRAP Menentukan teks agar tetap satu baris
ROWSPAN Menentukan lebar tabel
VALIGN Menentukan posisi vertikal teks dalam sel

e. Penggunaan Form
Form adalah sebuah daftar isian. Daftar isian ini untuk
meminta informasi dari user untuk kemudian diolah. Umumnya
pengolahan form dilakukan pada server dengan menggunakan
skrip yang bersifat server-side. Dalam pengelolaan FORM nantinya
kita akan sering bertemu dengan tag sebagai berikut;
1. <input> digunakan untuk menampilkan sebuah inputan
2. <textarea> digunakan untuk menampilkan sebuah inputan
dengan ukuran lebih besar dari pada <input>
3. <select> digunakan untuk menampilkan data berupa pilihan
4. <button> digunakan untuk menampilkan sebuah tombol
5. <label> digunakan untuk menampilkan sebuah teks pada
halaman HTML
Selanjutnya akan dijelaskan satu persatu cara penggunaan dan tampilan
dari masing-masing komponen yang ada pada sebuah form;
<input>
Merupakan komponen yang digunakan untuk meminta informasi dari
user, berbentuk kotak teks, tag ini tidak membutuhkan elemen penutup,
ada beberapa atribut yang digunakan pada elemen ini, sebagai berikut;

Tabel 1.7 Atribut <input>

ATRIBUT KETERANGAN
Name Mendefinisikan nama dari objek input. Atribut ini
harus dituliskan kecuali untuk tipe submit dan clear

Size Menentukan ukuran kotak teks

Maxlength Menentukan jumlah maksimum karakter yang dapat

Pemrograman WEB dengan menggunakan PHP dan MySQL | 19

 Value Untuk kotak teks, menentukan teks yang tertulis.
Untuk check box atauradio, menentukan nilai item
yang dipilih. Untuk Submit dan Reset, menentukan
teks yang tertulis pada tombol
Required Digunakan untuk melakukan validasi inputan wajib
untuk diisi, sehingga ketika inputan tidak diisi maka
akan muncul pesan error
Type Jenis yang digunakan pada input

<textarea>
Merupakan atribut yang digunakan unuk membuat sebuah kotak teks
dengan multi baris. Berikut ini adalah atribut yang digunakan pada
textarea;
Tabel 1.8 Atribut <textarea>
ATRIBUT KETERANGAN
Name Mendefinisikan nama objek textarea
Rows Menentukan jumlah baris textarea
Cols Menentukan lebar textarea

<button>
Merupakan atribut yang digunakan untuk membuat sebuah tombol yang
dapat digunakan untuk mengirimkan aksi pada form, berikut ini adalah
atribut yang digunakan didalam button;

Tabel 1.9 Atribut <button>

ATRIBUT KETERANGAN
Name Mendefinisikan nama objek button
Type Digunakan untuk mendefenisikan jenis dari button
tersebut apakah submit atau reset

<select>
Merupakan atribut yang digunakan untuk membuat sebuah daftar pilihan,
pada tag select ini juga terdapat <option> kemudian pada option juga
memiliki atribute value dan selected, berikut ini adalah atribut yang ada
pada select;

20 | Pemrograman WEB dengan menggunakan PHP dan MySQL

 Tabel 1.10 Atribut <select>
ATRIBUT KETERANGAN
Name Mendefinisikan nama dari objek select
Size Menentukan berapa pilhan yang akan ditampilkan. Jika
atribut ini tidak disertakan atau diberi nilai 1, pilihan
akan ditampilkan sebagai drop- down list. Jika diberi
nilai 2 atau lebih, pilihan akan ditampilkan sebagai
scroll box. Jika nilai SIZE lebih besar dari jumlah
pilihan yang ada pada <SELECT>, pilihan kosong akan
ditambahkan. Jika user memilih pilihan ini maka
nilainya adalah kosong.

Multiple Mengizinkan untuk memilih lebih dari satu

<label>
Merupakan atribut yang digunakan untuk memberikan keterangan pada
sebuah form, untuk menggunakan tag ini anda cukup menuliskan <label>
Berikut ini data yang digunakan </label>

1.3 LATIHAN
Kerjakan soal ini lampirkan script dan hasil screenshoot pada soal berikut ini;
1. Tuliskan penggunaan berbagai bentuk Heading!
2. Buat sebuah tabel dengan jumlah kolom 10 dengan baris 10!
3. Dari soal no 1 silahkan terapkan colspan 4 dan rowspan 3!
4. Tuliskan contoh penggunaan image, link dan iframe!
5. Buat sebuah form berisikan biodata dengan menggunakan elemen input,
textarea, button, select!

1.4 TUGAS PRAKTIKUM

Buatlah sebuah website sederhana yang terdiri dari beberapa halaman
yaitu; halaman utama, halaman galeri, halaman biodata, halaman buku tamu
dengan menggunakan visual studio code!

Pemrograman WEB dengan menggunakan PHP dan MySQL | 21

 DAFTAR PUSTAKA

Date, C.J. 2000, An Introduction to Database System, Addison Wesley

Publishing Company, Vol. 7, New York.
Elmasri dan Navathe. 2007. Fundamentals of Database Systems, Fifth Edition.
Boston: Pearson Education, Inc. Addison Wesley
Elmasri, Ramez; Navathe, Shamkant B., 2001, Fundamentals of Database
Systems, The Benjamin/ Cummings Publishing Company, Inc.,
California.
Fatansyah. 2012. Basis Data. Bandung:Informatika
Indrajani. 2015. Database Design. Jakarta: Elex Media Komputindo
Kadir, Abdul. 2008. Belajar Database menggunakan MySQL. Yogyakarta :
Andi Offset
Mardiani, Eri, Rahmansyah, Nur, dkk. 2016. Aplikasi Penggajian
Menggunakan Visual
Basic, MySQL, dan Data Report. Jakarta: Elex Media Komputindo
Nugroho, Bunafit. 2015. Aplikasi Pemrograman Web Dinamsi dengan PHP
dan MySQL. Yogyakarta: Gava Media.
Puspitasari, Dwi. 2016. Normalisasi Tabel pada Basis Data Relasional.
Prosiding Sentia. Vol 8. A.341-344.
Shalahudin, M. 2010. Modul Pembelajaran Struktur Data. Bandung:Modula.

70 | Daftar Pustaka
 PROFIL PENULIS

Medi Hermanto Tinambunan, [Link]

Penulis lahir di kota Medan. Telah
menyelesaikan pendidikan SD Negeri Asahan
kabupaten simalungun, kemudian
menyelesaikan pendidikan SMP Negeri di
Kota Pematang Siantar, dan menyelesaikan
pendidikan SMA Swasta Assisi Batu
Kabupaten Simalungun. Penulis
menyelesaikan pendidikan di perguruan tinggi
jenjang diploma 3 di AMIK Tunas Bangsa pada
tahun 2015, program Sarjana pada tahun 2016
di STMIK Triguna Dharma kota medan. Pada
tahun 2020 penulis menyelesaikan pendidikan
program magister diprogram studi teknik informatika universitas Sumatera
Utara. Saat ini penulis sebagai tenaga pengajar di Program Studi Teknik
Informatika Fakultas Teknik di Universitas Negeri Manado.

Dr. Djubir R. E. Kembuan, [Link]

Penulis saat ini aktif sebagai Tenaga Pengajar di
program studi Pendidikan Teknik Bangungan,
Fakultas Teknik Universitas Negeri Manado.

Profil Penulis | 71
 Sri Wahyuni, [Link] [Link]
Penulis lahir pada tanggal 15 Juni 1982 di
Medan. Penulis menempuh pendidikan di SD
Swasta Taman Harapan Medan (1989-1994),
SMP Swasta UISU Medan (1994 - 1997),
SMK Negeri 3 Medan (1997 – 2000). Penulis
melanjutkan studinya Strata 1 (S1) Fakultas
Ilmu Komputer dan Program Studi Sistem
Komputer di Universitas Pancabudi Medan
(2015-2017) . Kemudian penulis melanjutkan
studi Strata 2 (S2) pada Fakultas Ilmu
Komputer dan Teknologi Informasi dan
Program Studi Teknik Informatika di
Universitas Sumatera Utara (USU) Medan
(2017 – 2020). Penulis mengajar pada suatu Perguruan Tinggi Swasta di
Universitas Dharmawangsa di Program Studi Sistem Informasi (SI). Adapun
bidang minat yang diambil penulis adalah Pemrograman WEB 1 dan 2,
Visual Basic, Aplikasi Komputer, Animasi dan Statistik. Penulis dapat
dihubungi melalui surat elektronik
sriwahyuni15jun@[Link]

Alfiansyah Hasibuan, [Link], [Link]

Penulis lahir di Nagan Raya. Menyelesaikan
pendidikan Tingkat SD, SMP, SMA negeri
dikecamatan Darul Makmur. Untuk pendidikan
tinggi, penulis menyelesaikan Program Diploma 3
pada tahun 2011 dan Sarjana pada tahun 2012 di
Sekolah Tinggi Manajemen Informatika dan
Komputer LOGIKA di kota medan Sumatera Utara,
dan menyelesaikan program magister pada tahun
2019 di Program Studi Teknik Informatika
Universitas Sumatera Utara. Saat ini penulis
sebagai tenaga pengajar di Program Studi Teknik Informatika Fakultas Teknik
di Universitas Negeri Manado.

72 | Profil Penulis
 Arif Sobirin Wibowo, [Link]
Arif Sobirin Wibowo, seorang pria keturunan
jawa yang lahir di Banyumas pada tanggal 16
Agustus 1992. Saat ini berprofesi sebagai Dosen
bidang ilmu sosial dan kewargananegaraan di
Universitas Negeri Manado. Memulai karir
sebagai sebagai seorang guru di sebuah
SMP/MTs swasta di Banyumas Jawa Tengah
setelah sebelumnya menempuh Pendidikan
Strata 1 di Universitas Negeri Yogyakarta
Program Studi PPKn dilanjutkan dengan
Magister Pendidikan di Universitas Negeri
Surabaya. Memiliki kuriositas yang tinggi
terhadap research mengenai ilmu sosial dan kewarganegaraan yang
harapannya bisa memperoleh beasiswa untuk studi Doktoral di bidang ilmu
sosial khususnya Pendidikan Kewarganegaraan.

Profil Penulis | 73