Skripsi Dini Nur Fhadillah 062014106385

IMPLEMENTASI REGEX PADA PEMBERIAN
KOMENTAR KODE PROGRAM HTML
SKRIPSI
Disusun Oleh :
DINI NUR FHADILLAH
06.2014.1.06385
JURUSAN TEKNIK INFORMATIKA

FAKULTAS TEKNIK ELEKTRO DAN TEKNOLOGI INFORMASI
INSTITUT TEKNOLOGI ADHI TAMA SURABAYA
2022
IMPLEMENTASI REGEX PADA PEMBERIAN
KOMENTAR KODE PROGRAM HTML
SKRIPSI
Diajukan Guna Memenuhi Persyaratan

Untuk Memperoleh Gelar Sarjana Komputer
Pada
Jurusan Teknik Informatika
Fakultas Teknik Elektro dan Teknologi Informasi
Institut Teknologi Adhi Tama Surabaya
Surabaya __ Februari 2022
Mengetahui / Menyetujui,
Jurusan Teknik Informatika Dosen Pembimbing

Ketua,
Andy Rachman, S.T., M.Kom., Andy Rachman, S.T., M.Kom.,

NIP. 011125 NIP. 011125
ii
LEMBAR PENGESAHAN
SKRIPSI
Judul : Implementasi Regex Pada Pemberian Komentar Kode Program

HTML
Oleh : Dini Nur Fhadilah
NPM : 06.2014.1.06385
Telah dinyatakan lulus sidang skripsi pada:

Hari : Senin
Tanggal : 21 Februari 2022
Tempat : Ruangan A202
Menyetujui,
Dosen Penguji 1 Dosen Pembimbing 1
Dian Puspita Hapsari, S.Kom., M.Kom., Andy Rachman, S.T., M.Kom.,

NIP. 153076 NIP. 011125
Dosen Penguji 2
Septiyawan Rosetya W., S.Kom., M.Kom.,

NIP. 173132
Dosen Penguji 3
Rahmi Rizkiana Putri, S.ST., M.Kom.,

NIP. 173133
Dosen Penguji 4
Andy Rachman, S.T., M.Kom.,

NIP. 011125
Mengetahui,
Ketua Jurusan Teknik Informatika
Andy Rachman, S.T., M.Kom.,

NIP. 011125
iii
SURAT PERNYATAAN
Dengan ini saya menyatakan dalam skripsi ini tidak terdapat karya yang
pernah diajukan untuk memperoleh gelar kesarjanaan di suatu Perguruan Tinggi,
dan sepanjang pengetahuan saya juga tidak terdapat karya / pendapat yang pernah
ditulis oleh orang lain, kecuali yang secara tertulis diacu dalam naskah ini dan
disebutkan dalam Daftar Acuan / Daftar Pustaka.
Apabila ditemukan suatu jiplakan / plagiat, maka saya bersedia menerima
akibat berupa sanksi akademis dan sanksi lain yang diberikan oleh yang berwenang
sesuai ketentuan, peraturan dan perundang-undangan yang berlaku.
Surabaya, 21 Februari 2022

Yang membuat pernyataan
Dini Nur Fhadilah

NPM: 06.2014.1.06385
iv
IMPLEMENTASI REGEX PADA PEMBERIAN KOMENTAR
KODE PROGRAM HTML
Dini Nur Fhadillah, NPM: 06.2014.1.06385

Andy Rachman, S.T., M.Kom., NIP: 011125
Jurusan Teknik Informatika, Fakultas Teknik Elektro dan Teknologi Informasi
dillaendel23@gmail.com
Abstrak
Perkembangan teknologi dan dunia digital di masa sekarang menjadi semakin pesat.
Salah satu contoh penggunaan teknologi yang sering dijumpai adalah program
berbasis website. Website dibagi menjadi beberapa jenis yaitu website statis,
dinamis dan interaktif. Pada bahasa pemrograman apapun, struktur program yang
teratur atau terstruktur menjadi salah satu hal yang penting dalam pembuatan
program. Selain struktur program, pemberian komentar pada program merupakan
hal yang wajib bagi programmer untuk memudahkan fungsi-fungsi yang digunakan
dalam pembuatan program. Komentar yang diletakan atau disimpan pada program
berguna untuk melacak alur pada program jika terdapat kesalahan atau error saat
dijalankan. Regular expression (regex) adalah notasi yang digunakan untuk
mendeskripsikan pola dari kata yang ingin dicari. Kemampuan regex untuk
mengenali pola tersebut akan diaplikasikan untuk mengenali pola bahasa
pemrograman dalam tujuan memberi komentar pada kode sumber. Peneliti
menerapkan regex kedalam HTML yang digunakan untuk memisahkan antara
komentar dengan bukan komentar, serta menambahkan komentar baru. Dari hasil
skala likert total skor yaitu 70% termasuk kategori setuju, baik atau suka. Maka
dapat disimpulkan bahwa responde setuju menerapkan regex kedalam HTML.
Kata kunci: Website, Komentar, HTML, Regex
v
vi
KATA PENGANTAR
Puji syukur atas kehadirat Tuhan Yang Maha Esa untuk setiap berkat dan
rahmat-Nya, sehingga penulisan Skripsi yang berJudul “IMPLEMENTASI
REGEX PADA PEMBERIAN KOMENTAR KODE PROGRAM HTML”
dapat terselesaikan dengan baik dan tepat waktu. Penulisan dan penyusunan Skripsi
ini tentunya tidak lepas dari bantuan dan dukungan dari pihak lain. Oleh karena itu
ucapan terimakasih berikut ditujukan kepada:
1. Tuhan Yang Maha Esa
2. Kedua orang tua,adik-adik dan keluarga besar yang selalu
memberikan doa dan dukungan selama masa studi
3. Andy Rachman, S.T., M.Kom. selaku Ketua Jurusan Teknik
Informatika dan selaku dosen pembimbing yang selalu memberikan
bimbingan, arahan dan dukungan
4. Semua bantuan dari seluruh pihak yang tidak dapat disebutkan satu-
persatu
Akhir kata, dengan harapan yang tinggi semoga penelitian ini dapat
bermanfaat bagi pembaca dan penulis.
Surabaya, Februari 2022
Penulis
vii
DAFTAR ISI
LEMBAR JUDUL .......................................................................................... i
LEMBAR PENGESAHAN BUKU SKRIPSI .............................................. ii
LEMBAR PENGESAHAN SIDANG SKRIPSI .......................................... iii
SURAT PERNYATAAN ............................................................................... iiiv
ABSTRAK ...................................................................................................... v
ABSTRACT .................................................................................................... vi
KATA PENGANTAR .................................................................................... vii
DAFTAR ISI ................................................................................................... viii
DAFTAR GAMBAR ...................................................................................... xi
DAFTAR TABEL .......................................................................................... xii
BAB I PENDAHULUAN
1.1 Latar Belakang ....................................................................... 1
1.2 Rumusan Masalah .................................................................. 4
1.3 Tujuan .................................................................................... 5
1.4 Batasan Masalah..................................................................... 5
1.5 Manfaat Penelitian ................................................................. 6
1.6 Metodologi Penelitian ............................................................ 6
1.7 Sistematika Penelitian ............................................................ 6
viii
BAB II LANDASAN TEORI
2.1 HTML (Hypertext Markup Language) .................................. 8
2.1.1 Dasar - dasar HTML .................................................. 8
2.1.2 Struktur Dasar HTML ................................................ 9
2.2 Regular Expression (Regex) .................................................. 15
2.2.1 Wildcard ..................................................................... 18
2.2.2 Meta Character .......................................................... 18
2.2.3 Character Classes ...................................................... 24
2.3 Contoh HTML........................................................................ 25
2.4 PHP (Hypertext Preprocessor) .............................................. 26
2.5 Skala Likert ............................................................................ 27
BAB III ANALISIS DAN PERANCANGAN SISTEM
3.1 Gambaran Umum ................................................................... 29
3.2 Rancangan Sistem .................................................................. 29
3.2.1 Sequence Diagram Sistem ......................................... 31
3.2.2 Mockup Sistem ........................................................... 32
3.2.3 Pengujian Skala Likert ............................................... 33
BAB IV IMPLEMENTASI DAN PEMBAHASAN
4.1 Perangkat Uji Coba ................................................................ 38
4.2 Program Aplikasi ................................................................... 38
ix
4.3 Skenario Pengujian Sistem..................................................... 39
4.4 Pembahasan Antarmuka ......................................................... 40
4.4.1 Proses Submit ............................................................. 41
4.4.2 Proses Unduh Hasil Pemberian Komentar Otomatis . 42
4.5 Pengujian Sistem .................................................................... 44
BAB V PENUTUP
5.1 Kesimpulan ............................................................................ 55
5.2 Saran ....................................................................................... 55
DAFTAR PUSTAKA ..................................................................................... 57
LAMPIRAN
x
DAFTAR GAMBAR
Gambar 2.1 Contoh Title Pada Tab Browser ................................................... 9
Gambar 2.2 Contoh Properti Dokumen ........................................................... 15
Gambar 2.3 Contoh kode HTML dalam membuat paragraf ............................ 26
Gambar 2.4 Contoh Struktur dasar HTML ...................................................... 26
Gambar 3.1 Flowchart Keseluruhan Sistem .................................................... 30
Gambar 3.2 Sequence Diagram Sistem ........................................................... 31
Gambar 3 3 Mockup Sistem ............................................................................. 32
Gambar 4.1 Tampilan Pada Sistem .................................................................. 40
Gambar 4.2 Proses Submit ............................................................................... 41
Gambar 4.3 Proses Unduh Hasil Pemberian Komentar ................................... 42
Gambar 4.4 File yang diUpload ....................................................................... 43
Gambar 4.5 File yang Di Unduh ...................................................................... 43
xi
DAFTAR TABEL
Tabel 2.1 Tag Utama ........................................................................................ 10
Tabel 2.2 Modifikasi Teks ............................................................................... 11
Tabel 2.3 Font .................................................................................................. 12
Tabel 2.4 Link .................................................................................................. 12
Tabel 2.5 Gambar ............................................................................................. 12
Tabel 2.6 Formatting ........................................................................................ 13
Tabel 2.7 Tabel................................................................................................. 13
Tabel 2.8 Form ................................................................................................. 14
Tabel 2.9 Shorthand Classes ............................................................................ 24
Tabel 2.10 POSIX Character Classes .............................................................. 25
Tabel 2.11 Unicode Character Classes ........................................................... 25
Tabel 3.1 Skala Likert Pengujian Sistem ......................................................... 35
Tabel 4.1 Skala Likert Pengujian Sistem Dari Responden 1 ........................... 44
Tabel 4.6 Presentase Nilai Pengujian Sistem ................................................... 48
xii
BAB I
PENDAHULUAN
1.1 Latar Belakang
Perkembangan teknologi dan dunia digital di masa sekarang menjadi semakin
pesat. Kini teknologi tidak hanya menjadi kebutuhan dalam kehidupan sehari-hari
masyarakat namun dalam keseharian tidak lagi bisa terlepas dari teknologi.
Awalnya bidang teknologi informasi banyak dimanfaatkan untuk kepentingan
massal, baik negara, perusahaan, maupun lembaga. Akan tetapi sekarang telah
masuk ke ranah kepentingan personal atau individu juga banyak menggunakan
teknologi.
Berbagai macam program juga telah dikembangkan untuk memenuhi
kebutuhan masyarakat, baik untuk memudahkan pekerjaan maupun hanya sekedar
untuk hiburan. Program yang dibuat juga sangat beragam mulai dari fungsinya,
maupun juga platform yang digunakan. Program saat ini dapat dibagi berdasarkan
platformnya, yaitu program desktop. Program website, dan program mobile.
Salah satu contoh penggunaan teknologi yang sering dijumpai adalah
program berbasis website. Website menjadi kebutuhan yang diprioritaskan karena
memudahkan pemilik usaha, pegawai dan pengguna biasa untuk mencari
dan memanajemen informasi yang didapat. Website merupakan kumpulan halaman
pada suatu domain yang dibuat dengan tujuan dan maksud tertentu.
Website dibagi menjadi beberapa jenis yaitu website statis, dinamis dan
interaktif. Website juga digolongkan menjadi beberapa kegunaan berdasarkan
1
2
kontennya, sedangkan dalam pembuatan website umumnya menggunakan bahasa
pemrograman HyperText Markup Language (HTML), Cascading Style Sheet
(CSS), Hypertext Preprocessor (PHP). HTML merupakan salah satu bahasa
pemrograman yang sering dijumpai dalam pembuatan web. Pembuatan file yang
berekstensi HTML ini menjadi program yang dijalankan di browser (web page).
Ekstensi dokumen/file HTML ini dapat berupa *.htm atau *.html, file tersebut
bersifat multiplatform yaitu dapat berjalan pada sistem operasi apapun.
Struktur HTML berupa tag yang digunakan untuk menentukan tampilan yang
dapat beruba gambar atau teks yang nantinya akan dijalankan pada browser. Tag
merupakan kode yang digunakan untuk me-mark up kode ASCII menjadi file
HTML berdasarkan kebutuhan program yang akan dijalankan. Dalam hal ini
HTML merupakan salah satu komponen penting dalam pembuatan program
berbasis website. Selain itu hal yang menjadi fokus utama dalam mengembangkan
program adalah perawatan program agar bisa digunakan dalam jangka waktu yang
lama. Perawatan program biasanya dilakukan diantaranya adalah untuk
memperbaiki kesalahan, meningkatkan design, meningkatkan implementasi,
adanya perubahan yang disebabkan oleh perubahan yang terjadi pada perangkat
keras, dan lain sebagainya.
Pada bahasa pemrograman apapun, struktur koding yang teratur atau
terstruktur menjadi salah satu hal yang penting dalam pembuatan program karena
koding dapat di-reuse atau digunakan kembali tanpa harus memulai dari awal,
sehingga dapat mengurangi waktu pengembangan program. Selain untuk tujuan
penggunaan kembali program, keteraturan struktur program juga sangat berguna

3
untuk proses perawatan program, seperti memperbaiki kesalahan yang ada dalam
program, meningkatkan implementasi program, meningkatkan design program,
menambah fitur baru, atau perubahan lain yang perlu dilakukan untuk pengalaman
penggunaan program yang lebih baik.
Selain struktur program, pemberian komentar pada program merupakan hal
yang wajib bagi developer atau programmer untuk memudahkan dokumentasi
program atau fungsi-fungsi yang digunakan dalam pembuatan program. Komentar
yang diletakan atau disimpan pada program berguna untuk men-tracking atau
melacak alur pada program jika terdapat kesalahan atau error saat dijalankan.
Dengan adanya komentar juga dapat memudahkan pengembang lain dalam
memahami alur program sehingga tugas memperbaiki kesalahan atau tugas
perubahan lainnya dapat didelegasikan kepada orang lain selain pengembang
pertama.
Regular expression (regex) adalah notasi yang digunakan untuk
mendeskripsikan pola dari kata yang ingin dicari. Biasanya pola tersebut digunakan
untuk pencarian kata dengan pola tertentu, atau untuk mengganti beberapa karakter
yang memiliki suatu pola. Terkadang juga digunakan untuk memeriksa suatu
masukan(inputan) agar memenuhi pola sesuai yang ditetapkan, seperti inputan data
email yang harus memenuhi pola sesuai pola email. kemampuan regex untuk
mengenali pola tersebut akan diaplikasikan untuk mengenali pola bahasa
pemrograman dalam tujuan memberi komentar pada kode sumber.
Pada penelitian sebelumnya pembuatan komentar program semi otomatis
dilakukan untuk program dengan bahasa Java (Andy, 2017). Dalam penelitian
4
tersebut, peneliti berhasil membuat komentar otomatis pada program dengan
Bahasa pemrograman Java menggunakan regular expression (regex). Dalam
penelitian sebelumnya regex digunakan untuk memberikan komentar pada setiap
file berbahasa pemrograman Java.
Komentar tersebut membantu programmer untuk membaca dan mengerti
lebih jelas kegunaan setiap fungsi atau class yang ada pada file tersebut.
Berdasarkan penelitian tersebut penulis mengusulkan penambahan komentar
otomatis untuk program berbasis web yang menggunakan bahasa pemrograman
HTML. Perbedaaan kedua bahasa pemrograman tersebut terletak pada struktur
bahasanya seperti cara atau aturan dalam menampilkan teks atau pada proses
lainnya. Dalam hal ini kegunaan regex pada HTML memiliki tujuan yang sama
dengan penelitian sebelumnya yaitu memudahkan pembacaan file berbahasa
HTML.
1.2 Rumusan Masalah
Dari latar belakang yang telah diuraikan, dapat ditarik beberapa rumusan
masalah sebagai berikut:
1. Bagaimana memisahkan antara komentar dan yang bukan komentar pada
Bahasa pemrograman HTML menggunakan regular expression?
2. Bagaimana menambahkan komentar baru pada program berbahasa HTML
menggunakan regular expression?
3. Bagaimana mengimplementasikan regex pada bahasa pemrograman
HTML?
5
1.3 Tujuan
Adapun tujuan dari pembuatan penelitian ini yaitu:
1. Memisahkan antara komentar dan yang bukan komentar pada Bahasa
perograman HTML.
2. Memberikan komentar tambahan secara otomatis pada program berbahasa
HTML agar memudahkan untuk dokumentasi program sehingga akan
sangat membantu jika akan melakukan perubahan atau perbaikan di masa
yang akan datang.
3. Memberikan informasi terkait penggunaan tag pada HTML untuk
memudahkan pemahaman dalam pembuatan sebuah website.
1.4 Batasan Masalah
Dalam perancangan dan pembuatan penelitian ini, terdapat beberapa batasan
masalah, antara lain:
1. Aplikasi yang digunakan pada usulan penelitian skripsi adalah Bahasa
pemrograman HTML.
2. Regex digunakan untuk pemisah komentar dan non komentar.
3. Implementasi regex pada bahasa pemrograman HTML.
4. Data yang digunakan menggunakan format HTML.
5. Data diambil dari repository Github dengan format file .htm / .html
sebanyak 20 data.
6. Bahasa pemrograman yang digunakan adalah PHP (Hypertext
Preprocessor).
6
1.5 Manfaat Penelitian
Manfaat yang diharapkan dari penelitian ini adalah untuk memudahkan
pengembang untuk memahami alur program dan kegunaan setiap bagiannya
sehingga bisa lebih mudah melakukan perawatan terhadap program dan juga
pengembangan implementasi program.
1.6 Metodologi Penelitian
Adapun metode yang digunakan penulis dalam penelitian tugas akhir ini
sebagai berikut:
1. Studi literatur dan pustaka, yaitu pencarian jurnal ilmiah dan sumber
lainnya. Kemudian merangkum dan mempelajari literatur yang beriakitan
dengan penelitian.
2. Konsultasi dengan dosen pembimbing mengenai skenario pengerjaan
penelitian
3. Melakukan perancangan dan implementasi model dari skenario yang sudah
disusun.
4. Melakukan analisis dan mencoba untuk memecahkan permasalahan yang
muncul kemudian merumuskan pemecahan masalah yang ada.
5. Melakukan proses implementasi pengkodean program dalam aplikasi
komputer menggunakan bahasa pemrograman yang sudah ditentukan.
6. Pengujian aplikasi yang sudah dibuat.
1.7 Sistematika Penelitian
Sistematika penulisan Skripsi ini meliputi beberapa bab dengan sistematika
penulisan sebagai berikut:

7
BAB I : PENDAHULUAN
Pada bab ini menjelaskan tentang latar belakang, perumusan masalah,
batasan masalah, tujuan penelitian, manfaat penelitian, metodologi
penelitian, dan sistematika penulisan
BAB II : LANDASAN TEORI
Pada bab ini menjelaskan tentang teori penunjang dan teori sistem yang
ada pada pembahasan penelitian.
BAB III : PERANCANGAN SISTEM
Pada bab ini menjelaskan tentang metodologi penelitian dan perancangan
sistem yang akan dibuat.
BAB IV : IMPLEMENTASI DAN PEMBAHASAN
Pada bab ini menjelaskan tentang implementasi dan pengujian dari
perancangan sistem yang telah ditentukan sebelumnya.
BAB V : PENUTUP
Pada bab ini menjelaskan tentang kesimpulan dan saran berdasarkan
hasil dari penelitian skripsi.

BAB II
LANDASAN TEORI
2.1 HTML (Hypertext Markup Language)
Hypertext Markup Language atau biasa disingkat dengan HTML merupakan
suatu bahasa yang menggunakan tanda tertentu atau biasa disebut dengan tag untuk
menyatakan kode yang ditafsirkan oleh browser agar kode pada halaman tersebut
dapat ditampilkan secara benar.
2.1.1 Dasar - dasar HTML
HTTP (Hypertext Transfer Protocol) merupakan protokol yang digunakan
untuk mentransfer data antara web browser ke web server. Protokol ini mentransfer
dokumen yang ditulis atau berformat HTML. HTML disebut Markup Language
karena HTML berfungsi untuk memformat file dokumen teks biasa untuk bisa
ditampilkan pada web browser.
Untuk menampilkan sesuatu teks pada web browser dibutuhkan bantuan
tanda-tanda yang sudah ditentukan pada format HTML. Untuk melakukan hal
tersebut maka perlu menambahkan elemen atau yang sering disebut dengan tag.
Elemen HTML ini biasanya berupa tag yang saling berpasangan atau biasa disebut
tag pembuka dan tag penutup namun ada juga tag HTML yang tidak memiliki
pasangan seperti tag <img>.
Tag ditandai dengan simbol ‘<’ dan ‘>’, sedangkan pasangan dari tag atau
penutup tag ditandai dengan tanda ‘/’. Contohnya <p></p> dalam hal ini <p>
8
9
adalah sebuah elemen dari HTML dimana <p> merupakan tag pembuka dan </p>
tag penutup, biasanya pada suatu elemen terdapat atribut yang digunakan untuk
mengatur elemen tersebut. Salah satu atribut pada tag <p></p> adalah style dan
cara penggunaannya adalah sebagai berikut <p style=’color:red’;></p>.
Tag pada HTML ini penulisannya tidak terpengaruh oleh besar kecilnya huruf yang
digunakan atau tidak case sensitive.
2.1.2 Struktur Dasar HTML
File HTML dapat berekstensi .htm atau .html dimana file tersebut dapat
dibaca atau di edit menggunakan text editor seperti notepad, sublime dan lain-lain.
Untuk menjalankan atau mencoba file HTML dapat langsung dibuka dengan web
browser apa saja seperti chrome, mozilla dan lain-lain. Struktur HTML diawali
dengan sebuah tag <html> dan ditutup dengan </html>. Di Dalam tag awalan
file HTML terdapat 2 bagian besar dan penting yaitu tag <head></head> dan
tag <body></body>.
Tag <head></head> merupakan header dari halaman HTML dan tidak
ditampilkan pada jendela web browser. Salah satu tag pada bagian ini adalah tag
<title></title> yang digunakan untuk menampilkan judul pada title bar
(judul) jendela web browser (tab browser).
Gambar 2.1 Contoh Title Pada Tab Browser
Seperti yang ditunjukan pada Gambar 2.1 tag <title> </title> akan
terlihat pada tab browser untuk memudahkan user melihat judul dari isi website
10
yang sedang di gunakan, selain tag <title></title> terdapat juga tag
<meta>, <script></script> dan lain-lain. Bagian kedua adalah tag
<body></body> dimana tag yang berada di dalam bagian tag ini akan
ditampilkan pada jendela web browser nantinya. Pada bagian ini semua jenis
informasi berupa teks, gambar, link dan lain sebagainya dengan bermacam format
akan muncul pada jendela web browser dan dapat dibaca oleh user.
Terdapat beberapa macam kategori pada tag menurut Rio Astamal yaitu
sebagai berikut:
a. Tag Utama
Tag utama ini merupakan tag dasar yang pasti ada di HTML, seperti
yang ditunjukan pada Tabel 2.1 berikut ini
Tabel 2.1 Tag Utama

Tag Atribut Deskripsi
<html></html> Baris paling atas dari
setiap file HTML
(Pembuka dari file
HTML).
<head></head> Informasi umum dari
sebuah halaman web
(bagian pertama dari
sebuah file HTML).
<title></title> Judul pada halaman web.
Terdapat pada bagian tag
head (muncul pada tab
browser).
11
<body></body> Background, Settingan atribut untuk

color, sound, font, seluruh dokumen
link, margin dan (muncul pada halaman
lain-lain. web dan dapat dibaca
oleh user).
b. Modifikasi Teks
Modifikasi teks berkaitan dengan penggunaan penulisan teks pada
HTML seperti ukuran pada judul, format tulisan seperti yang ada di
microsoft word. Modifikasi teks ini ditunjukan pada Tabel 2.2 berikut ini.
Tabel 2.2 Modifikasi Teks

Tag Deskripsi Contoh
<i></i> Tulisan akan menjadi miring Tulisan
<u></u> Tulisan akan memiliki garis Tulisan
bawah (underline)
<b></b> Tulisan akan menjadi tebal Tulisan
<h1></h1> - Tulisan akan menjadi berubah Header 1
<h6></h6> ukuran (semakin besar angka
maka akan semakin kecil tulisan Header 6
yang muncul)
<sup></sup> Tulisan pada sebuah kata akan Tulisan
berubah ukuran (subcript)
<sub></sub> Tulisan pada sebuah kata akan Tulisan
berada pada atas tulisan lain
(supercript)
12
c. Font
Pada Tabel 2.4 berikut penggunaan link sering dijumpai pada setiap
halaman HTML yang bertujuan untuk memberikan informasi pindah ke
halaman lain atau mengunjungi situs lain.
Tabel 2.3 Font

<font></font> Color, size, name Untuk merubah gaya
tulisan atau huruf yang
akan ditampilkan.
d. Link
Pada Tabel 2.4 berikut penggunaan link sering dijumpai pada setiap
halaman HTML yang bertujuan untuk memberikan informasi pindah ke
halaman lain atau mengunjungi situs lain.
Tabel 2.4 Link

<a></a> Href, name, style dan Untuk membuat link ke
lain-lain. dokumen atau mengunjungi
situs lainnya.
e. Gambar
Pada Tabel 2.5 dibawah ini merupakan tag yang sering digunakan
terkait gambar mulai dari ukuran, resolusi, bentuk dan lain sebagainya
Tabel 2.5 Gambar

<img> Style, height, width Untuk menampilkan dan
dan lain-lain. merubah gambar pada
halaman.
13
f. Formatting
Pada Tabel 2.6 berikut formating merupakan tag yang digunakan untuk
melakukan format teks pada sebuah halaman HTML seperti membuat baris
baru atau membuat sebuah list pada sebuah teks.
Tabel 2.6 Formatting

Tag Deskripsi Contoh
<ul></ul> Untuk mengurutkan l List 1
sebuah tulisan tanpa
l List 2
memberi penomoran
(unordered list)
<ol></ol> Untuk mengurutkan 1. List 1
sebuah tulisan
2. List 2
menggunakan penomoran
(ordered list)
<br> Untuk membuat baris baru Tulisan
atau enter
baru
g. Tabel
Pada Tabel 2.7 berikut merupakan cara penggunaan tag untuk membuat
sebuah tabel pada halaman HTML seperti kolom, ketebalan garis pada tabel,
ukuran tabel dan lain sebagainya.
Tabel 2.7 Tabel

<table></table> Width, height, Untuk mengatur semua
border dan lain- elemen yang berkaitan
lain. dengan table.
14
<th></th> Width, height dan Untuk membuat header

lain-lain. (kepala table) yang
otomatiske tengah dan
tebal.
<td></td> Width, height dan Untuk membuat kolom
lain-lain. pada table.
h. Form
Pada Tabel 2.8 berikut ini merupakan format untuk membuat sebuah
form pada halaman HTML, form ini umumnya digunakan untuk proses
menyimpan data yang dimasukan oleh user untuk di proses ke proses
berikutnya atau mengirim ke halaman yang lain.
Tabel 2.8 Form

<form></form> Method action name Untuk mengatur
semua elemen yang
berkaitan dengan
form.
<tinput type=” ”> Password, email, Untuk membuat
text number dan lain- variasi dari tipe elemn
lain. form.
<select></select> Name, size. Untuk membuat
combo box yang
digunakan bersama
option/pilihan yang
akan dipilih user pada
form yang
ditampilkan.
15
Setiap tag-tag tersebut memiliki properti dokumen yang diatur melalui
atribut-atribut yang terdapat dalam <body></body>, contoh
background=lokasi & nama file.
Gambar 2.2 Contoh Properti Dokumen
Pada Gambar 2.2 menunjukan bahwa properti pada HTML bisa
disisipkan di dalam sebuah tag HTML. Properti ini digunakan untuk
menambah atau membuat format tertentu untuk tag yang ingin diubah
formatnya. Mulai dari warna, ukuran, jenis font dan lain sebagainya.
2.2 Regular Expression (Regex)
Regular expression (regex) merupakan suatu metode yang sangat baik untuk
memanipulasi data teks (Stub..). Regex menggunakan beberapa simbol / karakter
khusus untuk menotasikan sebuah pola (pattern) yang terdiri atas meta character
dan repetisi. Meta-character adalah sebuah simbol/tanda yang menyatakan
pengulangan pola karakter. Regex didukung oleh berbagai macam bahasa
pemrograman salah satunya adalah PHP (HypertextProcessor). Regex atau biasa
disebut ekspresi regular merupakan cara yang digunakan untuk pencocokan string
pada sebuah teks seperti karakter, kata maupun model dari sebuah karakter
(Rachman, 2017).
16
Penggunaan regex dapat digunakan pada apapun yang bisa diselesaikan
dengan pencocokan pola baik sebagian maupun keseluruhan string. Berikut
merupakan beberapa kasus yang umum menggunakan regex:
• Validasi / verifikasi struktur tring / teks.
Untuk kasus validasi ini yang paling umum digunakan adalah validasi
email yang diaplikasikan ketika mengisi form untuk memasukkan data email.
Hal ini dimaksudkan agar memastikan pengguna memasukkan data email
dengan benar sesuai format email secara umum. Contoh regex yang dapat
digunakan untuk validasi email:
^([a-zA-Z0-9._%-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6})*$
Tanda ^ merupakan awal dari teks. Kemudian diikuti dengan [a-zA-
Z0-9. %-]+ yang berarti sekelompok karakter dimana karakter yang bisa
digunakan adalah alfabet besar dan kecil, angka, tanda titik, underscore,
persen, dan strip. Tanda + menandakan bahwa kelompok karakter tersebut
harus ada minimal 1 dan boleh lebih dari 1. Setelah itu diikuti oleh karakter
@ dan kelompok karakter setelahnya, dan di bagian akhir terdapat kelompok
karakter juga setelah tanda titik.
• Pencarian/penggantian/mengatur ulang string.
Pencarian kata yang sesuai menurut pola adalah fungsi regex yang paling
umum dan paling banyak digunakan baik dalam pencarian data di database
untuk keperluan mencocokkan data, ataupun pencarian pola untuk kata untuk
diganti dengan format kata lain. Seperti contoh, mengubah format angka
desimal dalam sebuah teks yang awalnya menggunakan pemisah tanda titik
17
(.) diubah menjadi tanda koma. Karena tanda titik (.) tidak hanya digunakan
sebagai pemisah angka desimal, melainkan juga digunakan sebagai tanda dari
akhir kalimat, maka perlu menggunakan regex untuk mencari dan
mencocokkan dengan pola angka desimal, baru kemudian mengganti titik
dengan koma. Pencarian angka desimal bisa menggunakan pola regex
berikut:
(\d+)\.(\d+)
Tanda kurung () menandakan bahwa konten di dalamnya adalah satu
kelompok. \d merupakan representasi dari digit, yakni angka dari 0 hingga 9.
Diikuti tanda + yang artinya karakter angka harus ada 1 atau lebih yang
kemudian diikuti oleh tanda titik (.) dan setelah tanda titik diikuti lagi oleh 1
atau lebih karakter angka. Dengan pola ini maka regex bisa digunakan untuk
mencari pola angka desimal yg dipisahkan oleh tanda titik, contohnya angka
12.35. Setelah menemukan substring dengan pola tersebut maka akan dengan
mudah mengganti angka titik pada angka desimal dengan tanda koma.
Contoh lain penggunaan regex dalam pencarian kata dalam kode HTML,
misalnya ingin mendeteksi css untuk menentukan ukuran font dengan regex
bisa menggunakan pola berikut:
font\-size *: *\d+(px|rem)
Dengan menggunakan pola di atas, maka dapat digunakan untuk
mendeteksi font-size: 12px yang merupakan kode css untuk menentukan
ukuran font.
• Memecah string menjadi beberapa bagian berdasarkan pemisahnya.

18
Untuk kegunaan ini lebih jarang digunakan daripada pencarian kata
menurut polanya. Karena memecah string pada umumnya hanya diperlukan
untuk memecah string dengan pemisah 1 karakter misalnya spasi, atau tanda
strip (-). Namun pada kasus-kasus tertentu, penggunaan regex untuk
memecah teks juga diperlukan ketika dibutuhkan untuk memisah teks setelah
didapatkan substring dengan pola tertentu.
Karakter-karakter yang digunakan dalam regex terdiri dari beberapa
kombinasi antara lain karakter normal, karakter meta tertentu dan
metasequences. Karakter normal mewakili karakter itu sendiri atau karakter
literal, sedangkan meta character dan metasequences merupakan
karakter/sequences yang merepresentasikan maksud tertentu contohnya
kuantitas, lokasi, tipe dari karakter tertentu.
2.2.1 Wildcard
Wildcard merupakan sebuah bentuk primitif dari regex dan banyak
digunakan atau diaplikasikan pada DOS dan LINUX Shell. Wildcard digunakan
untuk melakukan pencocokan kumpulan file atau direktori yang sesuai. Contoh dari
wildcard adalah sebagai berikut, untuk mencari sebuah jenis file / format file
tertentu maka dapat ditulis dengan perintah *. (format file). Misalnya *.doc untuk
melakukan pencocokan file dengan format .doc.
2.2.2 Meta Character
Meta Character atau karakter meta adalah beberapa karakter dalam pola
regex yang diartikan secara khusus dan bukan mewakili karakter sebenarnya.
19
2.2.2.1 Pemilihan
Pemilihan digunakan untuk memilih satu dari dua atau lebih alternatif
yang disediakan. Pemilihan ini diwakilkan oleh karakter “|” atau garis lurus vertikal
atau biasa dibaca sebagai “atau”. Contohnya:
• Dia | mereka
Saat pencocokan kata “dia | mereka” akan cocok dengan kata “dia” atau
kata “mereka”, tetapi tidak dengan kata lainnya.
2.2.2.2 Pengelompokan
Pengelompokan digunakan untuk mengelompokan aturan yang diawali
dengan karakter “(“ dan “)” atau biasa dibaca dengan buka dan tutup kurung.
Contohnya:
• Mereka (berkebun | bertani)
Saat pencocokan kata “mereka (berkebun | bertani)” akan cocok dengan
kata “mereka berkebun” atau kata “mereka bertani”, tetapi tidak dengan kata
lainnya.
2.2.2.3 Set Karakter
Set karakter digunakan untuk pemilihan karakter dimana set ini memiliki
fasilitas sintaks rentang dan negasi. Maksud dari sintaks rentang adalah karakter
yang diawali dengan dengan karakter tertentu dan diakhiri dengan karakter tertentu,
sedangkan yang dimaksud dengan sintaks negasi adalah semua karakter yang
dicocokan kecuali karakter negasi tersebut. Contohnya:

20
• Bis (auo)
Saat pencocokan kata “Bis (auo)” akan cocok dengan kata “bisa”,
“bisu” atau “biso”, tetapi tidak dengan kata lainnya.
• [a-e]
Saat pencocokan kata “B[a-e]” akan cocok dengan kata “a,b,c,d,e”, tetapi
tidak dengan kata lainnya.
• [0-9][0-9]
Saat pencocokan angka “[0-9][0-9]” akan cocok dengan 00 sampai
dengan 99 (100 kombinasi angka yang akan dicocokan).
• [^j]
Saat pencocokan huruf “[^j]” akan cocok dengan semua huruf kecuali
huruf “j”.
2.2.2.4 Optional
Optional yang dimaksud dalam regex adalah huruf/kelompok aturan yang
berada pada sebelah kiri simbol tanda tanya “?” atau tepat sebelum “?” bersifat
optional yang diartikan “boleh ada atau boleh juga tidak”. Karakter ini diwakilkan
oleh tanda tanya “?” dan karakter pada optional ini memiliki arti yang berbeda
dengan karakter tanda tanya pada wildcard. Contohnya:
• Bagai?mana
Saat pencocokan kata “bagai?mana” akan cocok dengan kata
“bagaimana” atau “bagamana”.

21
2.2.2.5 Titik
Titik / dot atau yang diwakilkan dengan simbol “.” merupakan sebuah
karakter dalam regex yang cocok dengan semua karakter tunggal. Contohnya:
• bis.
Saat pencocokan kata “bis.” akan cocok dengan “bisa”, “bisu,” “bis3”
dan lain-lain.
2.2.2.6 Pengulangan
Pengulangan dapat diartikan sebagai “satu atau lebih” dari karakter/set
aturan yang berada pada sebelah kiri dari simbol “+” atau dapat diwakilkan dengan
simbol “*” yang artinya “nol atau lebih”. Contohnya:
• .+
Saat pencocokan karakter “.+” akan cocok dengan satu/lebih karakter
apapun.
• .*
Saat pencocokan karakter “.*” akan cocok dengan karakter apapun
termasuk juga string kosong.
2.2.2.7 Jangkar
Jangkar dapat diartikan dengan “harus di awal” dan “harus diakhir” yang
diwakilkan dengan simbol “^” dan “$”. Karakter ini mensyaratkan
posisi/penambatan pola ke string yang dicocokan/dicari. Contohnya:
• ^123
Saat pencocokan angka “^123” akan cocok dengan angka
“123”,”12345” tetapi tidak dengan angka “001233”.

22
• ^123$
Saat pencocokan angka “^123$” akan cocok dengan angka
“33123”,”12345”.
2.2.2.8 Quantifier
Quantifier diartikan dengan “berapa rentang”/jumlah karakter yang
diperbolehkan dari sebuah pola string (satu atau kumpulan karakter yang berada di
sebelah kiri dari quantifier). terdapat beberapa format dari quantifier diantaranya:
• X{n}
X{n} artinya set aturan “X” harus ada sebanyak “n” kali, contohnya [0-
3]{2} saat pencocokan angka akan cocok dengan yang dimulai dari 00
sampa dengan 33.
• X{m,}
X{m} artinya set aturan “X” harus ada minimal sebanyak “m” kali,
contohnya [0-3]{1} saat pencocokan angka akan cocok dengan yang
dimulai dari 0 sampa dengan 3.
• X{,n}
X{,n} artinya set aturan “X” boleh ada hingga terulang sebanyak
maksimal “n” kali.
• X{m,n}
X{m,n} artinya set aturan “X” boleh ada minimal “m” hingga terulang
sebanyak maksimal “n” kali, contohnya [0-3]{1,3} saat pencocokan angka
akan cocok dengan yang dimulai dari 0 sampa dengan 333 (mulai dari 1
digit angka hingga 3 digit angka).

23
2.2.2.9 Modifier
Perilaku pada mesin regex dapat diubah menggunakan modifier dalam
proses pencocokan pola. Terdapat beberapa modifier diantaranya sebagai berikut:
a. Modifier i (IGNORE_CASE)
Modifier ini dapat diartikan dengan tidak membedakan antara huruf besar
dengan huruf kecil pada sebuah karakter yang akan dicocokan.
b. Modifier g (GLOBAL_MATCH)
Modifier ini hanya digunakan pada bahasa pemrograman Perl. Dengan
menggunakan modifier ini, proses pencocokan karakter berikutnya akan
dilanjutkan dari posisi terakhir diteruskan, tidak diulang dari posisi awal
string pencocokan.
2.2.2.10 Karakter Escape
Karakter escape digunakan untuk menjadikan karakter meta berada tepat
di belakang simbol escape menjadi sebuah karakter literal, selain itu digunakan
untuk menyatakan karakter yang tidak bisa dinyatakan secara langsung. Karakter
escape ini diwakilkan dengan simbol “\” (backslash). Contohnya:
• [0-3]+(\.[0-3]*)?
Saat pencocokan angka akan cocok dengan 2, 12.2, 102, ...dan
seterusnya dimana pola tersebut diartikan sebagai berikut “deretan
satu/lebih digit angka yang boleh diikuti dengan . (titik) dan deretan angka”.
• \n
Digunakan untuk membuat baris baru atau enter.

24
2.2.3 Character Classes
Character Classes digunakan untuk mendefinisikan / menentukan set
karakter yang tujuannya untuk mempersingkat / menggantikan regex untuk
kumpulan string dengan maksud tertentu. Contohnya:
• [0-9]
[0-9] dapat digantikan dengan karakter “\d”.
Terdapat beberapa jenis dari character classes diantaranya
ShorthandsClass, POSIX Character Classes, Unicode Character Classes.
1. Shorthand Classes
Pada Tabel 2.9 berikut merupakan sebuah shorthand classes pada
dokumen HTML.
Tabel 2.9 Shorthand Classes

Pola Deskripsi
\c Kontrol karakter
\d Digit [0-9]
\D Bukan digit [^0-9]
\w Word / kata [a-zA-Z0-9_]
\W Bukan word / kata [^a-zA-Z0-9_]
\s White space / spasi [\n\r\f\t]
\S Bukan White space / spasi [^\n\r\f\t]
\0ABC Karakter oktal
\xMN Karakter hexadesimal
2. POSIX Character Classes
Pada Tabel 2.10 berikut merupakan POSIX character classes pada
sebuah dokumen di HTML.

25
Tabel 2.10 POSIX Character Classes

Pola Deskripsi
[:digit:] Digit
[:xdigit:] Hexadesimal digit
[:upper:] Huruf besar
[:lower:] Huruf kecil
[:word:] Kata [dapat berupa angka, huruf,
underscore]
[:punct:] Tanda baca
3. Unicode Character Classes
Pada Tabel 2.11 berikut merupakan sebuah Unicode Character Classes
pada dokumen HTML.
Tabel 2.11 Unicode Character Classes

Pola Deskripsi
\p{C} Kontrol kode dan karakter yang tidak
termasuk dalam kategori lain
\p{Cf} Karakter format non-visible
\p{L} Huruf
\p{Ll} Huruf kecil
\p{Cc} ASCII dan Latin-1 kontrol karakter
\p{Lu} Huruf besar
\p{N} Karakter numerik
2.3 Contoh HTML
HTML memungkinkan seorang pengguna dapat membuat dan menyusun
bagian heading, paragraf, link atau tautan, dan blockquote untuk halaman sebuah
website.
26
HTML sebenarnya bukanlah bahasa pemrograman, artinya HTML tidak
punya kemampuan untuk membuat fungsionalitas yang dinamis. Contoh kode
atau script membuat paragraf digambarkan pada Gambar 2.3 berikut ini.
Gambar 2.3 Contoh kode HTML dalam membuat paragraf
Adapun contoh struktur dasar dari HTML yang dapat dipelajari dan
dipraktekkan di antaranya seperti yang digamabrkan pada Gambar 2.4 berikut ini.
Gambar 2.4 Contoh Struktur dasar HTML
2.4 PHP (Hypertext Preprocessor)
PHP merupakan bahasa pemrograman yang script server-side. Dalam
pengembangan atau pembuatan sebuah website selain HTML yang biasa digunakan
untuk membuat halaman, PHP juga sering kali disisipkan pada dokumen HTML.
Dalam hal ini penggunaan PHP bertujuan untuk membuat website yang sedang
dikembangkan menjadi dinamis, dengan artian dapat diubah secara bebas tidak
statis sehingga dalam perawatan sebuah website bisa menjadi lebih mudah, efisien
27
dan efektif. PHP merupakan software yang open-source, yang artinya dapat secara
bebas digunakan untuk berbagai kalangan dan kebutuhan dan dapat disebarluaskan.
Berikut kelebihan PHP, yaitu:
1. Open-source, sehingga penggunaanya tidak berbayar.
2. Lintas platform, bisa digunakan atau dijalankan pada sistem operasi apapun
seperti Linux, Windows, FreeBSD dan lain-lain.
3. PHP didukung dari berbagai web server seperti APACHE, IIS dan lain-lain.
PHP dapat terkoneksi dengan berbagai macam database seperti MySql, SQL
Server dan lain-lain. PHP juga dapat diitegrasikan dengan HTML, Javascript,
JQuery, AJAX. Pada umumnya PHP lebih banyak digunakan bersamaan dengan
file HTML. Dengan menggunakan PHP, bisa membuat website powerfull yang
dinamis dengan disertai manajemen database (Kadir, 2018).
2.5 Skala Likert
Menurut (Sugiyono, 2013) Skala likert dimanfaatkan untuk mengukur sikap,
pendapat, dan persepsi seseorang atau sekelompok orang tentang fenomena sosial.
Dalam penelitian, fenomena sosial ini telah diterapkan secara spesifik oleh peneliti,
yang selanjutnya disebut sebagai variabel penelitian. Dengan skala ini, maka
variabel yang akan diukur dijabarkan menjadi indikator variabel. Kemudian
indikator tersebut dijadikan sebagai titik tolak untuk menyusun item-item
instrument yang dapat berupa penyataan atau pertanyaan.
Jawaban setiap item instrument yang menggunakan skala likert mempunyai
gradasi mulai dari sangat positif sampai sangat negatif, yang dapat berupa kata-kata
antara lain:
28
a. Sangat setuju, setuju, ragu-ragu, tidak setuju, dan sangat tidak setuju.
b. Selalu, sering, kadang-kadang, dan tidak pernah.
c. Sangat positif, positif, negatif, dan sangat negatif.
d. Sangat baik, baik, tidak baik, dan sangat tidak baik.
Untuk keperluan analisis kuantitatif, maka jawaban tersebut dapat diberi
bobot nilai angka, misalnya:
a. Sangat setuju/selalu/sangat positif diberi bobot nilai angka 5
b. Setuju/sering/positif diberi bobot nilai angka 4
c. Ragu-ragu/kadang-kadang/netral diberi bobot nilai angka 3
d. Tidak setuju/hampir tidak pernah/negatif diberi bobot nilai angka 2
e. Sangat tidak setuju/tidak pernah diberi bobot nilai angka 1

BAB III
ANALISIS DAN PERANCANGAN SISTEM
3.1 Gambaran Umum
Dalam penelitian ini akan dikembangkan sistem yang dapat memberikan
komentar otomatis pada file source code yang berformat .htm / .html. Data yang
digunakan diperoleh melalui internet. Dalam sistem ini terdapat beberapa proses
yang dimulai dari preprocessing yaitu memisahkan antara source code dan
komentar dengan regex pada file .htm / .html hingga menghasilkan file yang telah
berisi komentar secara otomatis. Penelitian ini dimulai dari proses input data yaitu
file source code berformat .htm/.html kemudian memisahkan antara source code
dari komentar dengan regex, setelah itu memberikan komentar secara otomatis
dengan regex terhadap source code dan hasil output dari sistem berupa source code
html yang telah ditambahai dengan komentar otomatis.
3.2 Rancangan Sistem
Adapun rancangan keseluruhan sistem dapat dilihat pada Gambar 3.1 berikut
ini:
29
30
Gambar 3.1 Flowchart Keseluruhan Sistem
Gambar 3.1 merupakan desain dari keseluruhan sistem dalam penelitian ini,
dimulai dari input file source code berformat .htm/.html, proses selanjutnya
memisahkan antara source code dan komentar dengan regex. Proses pemisahan ini
dimaksudkan untuk memisahkan komentar yang sudah ada pada file .htm/.html
tersebut agar file yang akan diproses hanya berisi source code. Kemudian hasil dari
pemisahan berupa source code tersebut dimasukan ke proses selanjutnya yaitu

31
memberikan komentar secara otomatis dengan menggunakan regex, hasil dari
sistem berupa file source code berformat .htm/.html berisi komentar otomatis.
3.2.1 Sequence Diagram Sistem
Adapun rancangan sequence diagram sistem adalah sebagai berikut:
Gambar 3.2 Sequence Diagram Sistem
Gambar 3.2 merupakan gambar sequence diagram alur sistem dimana alur
tersebut dijelaskan sebagai berikut:
1. User melakukan akses pada halaman utama dan muncul form yang berisi
pilih file.
2. Sistem melakukan proses regex.
3. Sistem melakukan return hasil proses regex ke halaman utama.
4. User mendapatkan notifikasi bahwa file selesai di proses.
5. User memilih download file.

32
6. Sistem melakukan proses download.
7. User mendapatkan notifikasi bahwa file berhasil di download.
3.2.2 Mockup Sistem
Adapun mockup sistem adalah sebagai berikut:
Gambar 3 3 Mockup Sistem
Mockup sistem merupakan rancangan atau desain awal dari sistem yang
akan dibuat. Mockup ini dibuat bertujuan untuk memberikan gambaran terhadap
fitur yang diperlukan dan juga tata letak sistem secara keseluruhan. Walaupun hasil
akhir dari sistem yang ddibuat tidak sama persis dengan yang digambarkan pada
mockup sistem, akan tetapi mockup sistem sangat membantu dalam tahap
perancangan sistem di awal.
Mockup sistem untuk penelitian ini digambarkan pada Gambar 3.3, dimana
pada mockup tersebut terdapat beberapa elemen yaitu ada tombol untuk memilih
file, submit dan download. Ketiga tombol tersebut merupakan fitur utama dalam
33
sistem ini dimana proses di depan (front-end) hanya terdiri dari proses upload file
HTML yang akan diberi komentar dan download file hasil yang merupakan file
html yang telah diberikan komentar secara otomatis.
Berikut merupakan penjelasan lebih detail mengenai tombol-tombol yang
akan digunakan. Tombol “Choose File” digunakan untuk memilih file yang diambil
dari penyimpanan file user, kemudian setelah memilih file, nama file tersebut akan
tampil pada text box. Untuk tombol “Submit” digunakan untuk melakukan proses
regex pada file yang terpilih. Dan tombol download digunakan untuk mengunduh /
mendownload file yang selesai di proses. Hasil unduhan / download akan masuk
pada penyimpanan internal device user.
3.2.3 Pengujian Skala Likert
Skala Likert merupakan skala yang digunakan untuk mengukur pendapat,
persepsi, sikap pada seseorang atau sebuah kelompok mengenai sebuah fenomena
atau peristiwa sosial, berdasarkan definisi operasional yang telah ditentukan oleh
peneliti. Berdasarkan dari pengertian diatas maka dapat disimpulkan bahwa skala
likert ini dilakukan untuk mengukur pengujian dari penelitian yang dicoba oleh
peneliti. Pada penelitian ini skala likert bertujuan untuk mengukur fungsionalitas
penggunaan sistem. Contohnya:
• Apakah sistem yang digunakan dapat berjalan dengan baik dan benar?
• Apakah output dari sistem sudah sesuai dengan yang diharapkan?
Prosedur dalam pembuatan skala likert adalah sebagai berikut:
1. Peneliti mengumpulkan item atau materi yang relevan terkait dengan
masalah yang diteliti.

34
2. Item atau materi yang telah dikumpulkan dicoba kepada sekelompok
responden yang cukup representatif dari populasi yang ingin diteliti terkait
dengan masalah penelitian.
3. Sekelompok responden tersebut diminta untuk memberi penilaian pada
setiap item atau materi yang telah dikumpulkan berdasarkan hasil penelitian,
penilaian didasarkan pada skala mulai dari sangat senang sampai tidak
senang. Pada penelitian ini yang digunakan mulai dari sangat setuju hingga
sangat tidak setuju.
4. Jawaban dari responden tersebut dikumpulkan menjadi satu kemudian
memberikan skor pada tiap masing-masing skala. Untuk pemberian skor
bebas, bisa dimulai dr skor 1 untuk yang terendah atau skor 5 untuk yang
tertinggi. Pada penelitian ini yang digunakan adalah skor 5 tertinggi dan
skor 1 untuk yang terendah..
5. Menjumlah skor pada masing-masing item di setiap jawaban/respons dari
responden kemudian di total.
Diawali dengan membuat pertanyaan yang relevan terkait penggunaan
sistem dan skor pada skala likert ditunjukan pada urutan berikut:
1. Skor 1. Sangat (tidak setuju/buruk/kurang sekali) (STS)
2. Skor 2. Tidak (setuju/baik/) atau kurang (TS)
3. Skor 3. Netral / Cukup (N)
4. Skor 4. (Setuju/Baik/suka) (S)
5. Skor 5. Sangat (setuju/Baik/Suka) (SS)

35
Tabel 3.1 Skala Likert Pengujian Sistem

No Pernyataan SS S N TS STS
1 Apakah pada tombol pilih file
proses pemilihan file sudah sesuai
dengan format file yang dipilih yaitu
*htm / *html?
2 Apakah tombol submit bisa
melakukan proses regex?
3 Apakah muncul notifikasi bahwa
file berhasil diproses?
4 Apakah tombol download bisa
melakukan proses download/unduh
file yang telah diproses?
file berhasil di download/unduh?
6 File yang berhasil terunduh apakah
sudah sesuai dengan output yang
diharapkan pada sistem?
7 Apakah dapat mengulangi proses
mulai dari awal setelah mengunduh
file?
8 Apakah sistem sudah sesuai dengan
tujuan dari penelitian?
Pada pengujian sistem ini pernyataan skala likert adalah seperti yang
ditunjukan pada Tabel 3.1. Pengujian ini dilakukan setelah sistem selesai dikerjakan
kemudian diuji berdasarkan pernyataan yang sudah disiapkan. Setelah dilakukan
pengujian, proses selanjutnya adalah menghitung persentase skor dari tiap-tiap
pilihan SS, S, N, TS, dan STS. Setelah proses perhitungan selesai maka dapat ditarik
36
kesimpulan dari system yang diujikan. Contoh cara perhitungan skor adalah sebagai
berikut:
Pada pertanyaan pertama
1. Berapa jumlah responden yang memilih sangat setuju (5) = jumlah
responden x nilai pertanyaan = total sangat setuju
2. Berapa jumlah responden yang memilih setuju (4) = jumlah responden x
nilai pertanyaan = total setuju
3. Berapa jumlah responden yang memilih cukup (3) = jumlah responden x
nilai pertanyaan = total cukup
4. Berapa jumlah responden yang memilih tidak setuju (2) = jumlah responden
x nilai pertanyaan = total tidak setuju
5. Berapa jumlah responden yang memilih sangat tidak setuju (1) = jumlah
responden x nilai pertanyaan = total sangat tidak setuju
Total skor = total sangat setuju + total setuju + total cukup + total tidak setuju +
total sangat tidak setuju.
Untuk mendapatkan hasil intepretasi, maka perlu diketahui skor tertinggi
(Y) dan skor terendah (X) pada tiap penilaian dengan rumus sebagai berikut:
Y = skor tertinggi pada skala likert x jumlah responden
X = skor terendah pada skala likert x jumlah responden
Setelah diperoleh nilai X dan Y maka penilaian berikutnya adalah
interpretasi responden menggunakan rumus index %.
𝐓𝐨𝐭𝐚𝐥 𝐒𝐤𝐨𝐫
𝐑𝐮𝐦𝐮𝐬 𝐈𝐧𝐝𝐞𝐱 (%) = 𝒙 𝟏𝟎𝟎%
𝐘
37
Pengujian sistem aplikasi ini biasanya berkaitan dengan kinerja dari sistem
aplikasi tersebut. Pengujian kinerja ini meliputi 3 kategori seperti berikut:
1. Pengujian performance, pengujian ini digunakan untuk menguji kecepatan
validasi, skalabilitas, kestabilan sistem yang diuji.
2. Load testing, pengujian ini digunakan untuk menguji kecepatan performa
sistem yang diuji ketika sedang dibawah kondisi tertekan selama proses
sistem sedang bekerja.
Stress testing, pengujian ini berfokus kepada menentukan atau memvalidasi kinerja
sistem yang diuji ketika sedang dibawah tekanan dan juga volume tekanan yang
berada diluar antisipasi sistem.

BAB IV
IMPLEMENTASI DAN PEMBAHASAN
4.1 Perangkat Uji Coba
Dalam pembuatan aplikasi ini, spesifikasi perangkat lunak (Software) dan
perangkat keras (Hardware) yang dibutuhkan. Perangkat keras yang digunakan
adalah laptop. Sedangkan untuk perangkat lunak adalah kebutuhan sebuah sistem
operasi dan software yang mendukung dalam pembuatan aplikasi ini Berikut ini
rincian perangkat keras dan perangkat lunak:
a. Perangkat Keras
Laptop Lenovo yang mempunyai spesifikasi sebagai berikut:
1. Processor Core i3
2. Memori RAM 8 GB
3. Harddisk 500 GB
b. Perangkat Lunak
Perangkat lunak yang digunakan dalam penelitian sebagai berikut:
1. Sistem Operasi Windows
2. Sublime Text Editor
4.2 Program Aplikasi
Implementasi program dibuat menggunakan bahasa pemrograman PHP versi
7 dan memakai Bootstrap sebagai desain tampilan GUI dan Sublime sebagai code
editor untuk melakukan uji coba aplikasi.

39
4.3 Skenario Pengujian Sistem
Pada sub bab ini akan dijelaskan skenario pengujian sistem dengan
menggunakan dataset kumpulan file .html yang dikumpulkan dari berbagai sumber.
Dataset tersebut telah melewati beberapa proses yaitu pengecekan jika terdapat
komentar pada file html sebelum di uji coba pada sistem maka akan di hapus
komentar tersebut, sehingga komentar yang muncul hanya dari hasil pengujian
sistem. Untuk menguji sistem yang telah dibuat, maka dalam penelitian ini penulis
menggunakan 2 skenario pengujian yaitu pengujian melakukan komentar otomatis
dan pengujian skala likert dari sistem yang telah dibuat.
Pada skenario pengujian pertama adalah dataset satu persatu di upload pada
sistem kemudian sistem akan melakukan proses pemberian komentar secara
otomatis pada file html yang di upload, kemudian jika proses telah selesai maka
selanjutnya menuju ke proses berikutnya yaitu mengunduh file yang sudah di proses
tersebut. Jika sudah berhasil di unduh maka user dapat melihat atau mengecek
apakah komentar yang diberikan sudah sesuai dengan file yang di upload
sebelumnya.
Pada proses skenario pengujian kedua yaitu melakukan pengujian terhadap
fungsionalitas sistem selama di uji pada skenario pengujian yang pertama. proses
ini melibatkan user untuk memberikan review terkait penggunaan sistem secara
menyeluruh mulai dari awal hingga akhir. Pada skenario ini penulis menyiapkan
pertanyaan-pertanyaan yang dijawab oleh user berdasarkan dari skala tertinggi ke
rendah terhadap fungsionalitas sistem tersebut. Skala yang dibutuhkan adalah skala
persetujuan seperti sangat setuju, setuju, cukup, tidak setuju, dan sangat tidak
40
setuju. Kemudian dari hasil tersebut dihitung dan akan muncul nilai skor dari sistem
tersebut berdasarkan user.
4.4 Pembahasan Antarmuka
Pada sub bab ini akan dijelaskan mengenai antarmuka sistem untuk
implementasi regex pada pemberian komentar kode program html. Pada Gambar
4.1 menggambarkan tentang alur penelitian, berikut ini adalah tampilan sistem.
Gambar 4.1 Tampilan Pada Sistem
Pada Gambar 4.1 diatas terdapat 2 proses yaitu proses saat upload file dimana
file yang akan di upload hanya berjenis / format .htm / .html, kemudian proses
kedua adalah saat file sudah dipilih maka submit untuk dilakukan proses pemberian
komentar secara otomatis menggunakan regex. Proses ini jika sudah selesai maka
akan muncul proses berikutnya yaitu melakukan unduh file yang berhasil di proses
tersebut.
41
4.4.1 Proses Submit
Pada proses submit ini tampilan sistem sama dengan tampilan awal sistem,
berikut adalah Gambar 4.2 yang menggambarkan tentang proses submit.
Gambar 4.2 Proses Submit
Gambar 4.2 merupakan proses submit, proses ini merupakan proses lanjutan
setelah file sudah dipilih. Karena penelitian ini mengenai pemberian komentar
terhadap file html, maka program dibuat agar hanya bisa input file html.
Kemudian file tersebut akan melalui tahapan pencarian pola pada regex.
Proses ini dilakukan dengan cara mencari tag html yang telah terdaftar dengan
pencarian pola regex, setelah mendapatkan tag html yang dicari berdasarkan tag
yang terdapat pada file yang di upload maka berikutnya diberikan komentar
berdasarkan list data deskripsi dari tag tersebut, sehingga nantinya tag html tersebut
memiliki deskripsi seperti arti atau tujuan penggunaan tag html tersebut pada file
yang telah di upload. Proses ini bisa memakan waktu yang lama atau cepat
tergantung banyaknya tag html yang digunakan pada file yang di upload.
42
4.4.2 Proses Unduh Hasil Pemberian Komentar Otomatis
Pada proses unduh ini tampilan akan muncul setelah proses submit
sebelumnya selesai dilakukan. Pada Gambar 4.3 terdapat 2 pilihan yaitu
menggambarkan proses unduh hasil pemberian komentar otomatis dan melakukan
proses submit kembali (mengulang proses awal), berikut adalah tampilan proses ini.
Gambar 4.3 Proses Unduh Hasil Pemberian Komentar
Pada Gambar 4.3 terdapat 2 pilihan yaitu Download dan Gunakan lagi,
proses ini merupakan proses terakhir dari sistem dimana user dapat mengunduh
hasil pemberian komentar otomatis pada sistem. Hasil yang di unduh ini akan secara
otomatis tersimpan pada lokal komputer user atau biasanya ada pada folder
Downloads. Setelah file berhasil di unduh user bisa melihat langsung perbedaan
yang muncul pada file awal sebelum dilakukan proses pemberian komentar secara
otomatis dan sesudahnya. Komentar yang muncul berdasarkan dari tag html yang
43
ada pada file yang di upload oleh user. Gambar 4.4 dan 4.5 berikut merupakan hasil
contoh awal dan akhir file yang di upload dan yang di unduh dari sistem
Gambar 4.4 File yang diUpload
Gambar 4.5 File yang Di Unduh
Berdasarkan Gambar 4.4 dan 4.5 di atas dapat terlihat perbedaan dari tag
html yang ada pada file tersebut. Pemberian komentar tersebut dapat memudahkan
orang-orang yang baru belajar html baik secara otodidak maupun dengan cara lain
untuk memahami penggunaan tag html tersebut pada file html yang mereka
gunakan. Setelah selesai mengunduh user bisa melakukan proses dari awal kembali
44
untuk mencoba file html yang berbeda. Kemudian proses yang telah dijelaskan pada
sub bab sebelumnya akan terulang kembali.
4.5 Pengujian Sistem
Pengujian sistem pada implementasi regex pada pemberian komentar kode
program html ini dilakukan dengan cara pengujian skala likert yakni pengujian yang
dilakukan berdasarkan fungsionalitas pada sistem yang telah dibuat. Penjelasan
mengenai proses pengujian ini dapat dilihat kembali pada sub bab sebelumnya.
Pada pengujian ini dilakukan oleh 5 reponden untuk merepresentasikan terkait
fungsionalitas sistem, 5 responden tersebut merupakan mahasiswa dan alumni yang
mengambil jurusan teknik informatika pada perguruan tinggi swasta di Surabaya.
Pertanyaan yang diberikan oleh peneliti kepada responden dengan presentse nilai
index adalah sebagai berikut:
Tabel 4.1 Skala Likert Pengujian Sistem Dari Responden 1

*htm / *html?
45
file?

*htm / *html?
46
file?

*htm / *html?
file?
47

*htm / *html?
file?

*htm / *html?
48
file?
Tabel 4.6 Presentase Nilai Pengujian Sistem

Jawaban Keterangan
0% - 19.99% Sangat (Tidak Setuju, Buruk atau Kurang Sekali)
20% - 39.99% Tidak Setuju atau Kurang Baik
40% - 59.99% Cukup atau Netral
60% - 79.99% Setuju, Baik atau Suka
80% - 100% Sangat (Setuju, Baik, Suka)
Berikut rekap hasil responden berdasarkan tiap pertanyaan dan pilihan
dimana pilihan dibagi menjadi:
1. Skor 1. Sangat (tidak setuju/buruk/kurang sekali) (STS)

49
2. Skor 2. Tidak (setuju/baik/) atau kurang (TS)
3. Skor 3. Netral / Cukup (N)
4. Skor 4. (Setuju/Baik/suka) (S)
5. Skor 5. Sangat (setuju/Baik/Suka) (SS)
Berikut perhitungan dari masing-masing pertanyaan dan skor yang telah
ditentukan:
1. Pertanyaan pertama
SS = 3, S = 2, C = 0, TS = 0, STS = 0
a) Responden yang menjawab sangat setuju = 3 x 5 = 15
b) Responden yang menjawab setuju = 2 x 4 = 8
c) Responden yang menjawab cukup = 0 x 3 = 0
d) Responden yang menjawab tidak setuju = 0 x 2 = 0
e) Responden yang menjawab sangat tidak setuju = 0 x 1 = 0
f) Total skor = 15 + 8 + 0 + 0 + 0 = 23
g) Jumlah skor tertinggi untuk pilihan sangat setuju adalah 5 x 5 (jumlah
responden) = 25, sedangkan jumlah skor terendah untuk pilihan sangat
tidak setuju adalah 1 x 5 (jumlah responden) = 5

23
h) Rumus Index (%) = 𝑥 100% = 92%
25
i) 92% kategori sangat setuju (mengacu pada table 4.6 Presentasi Nilai
Pengujian Sistem). Maka dapat disimpulkan bahwa responden sangat
setuju tombol proses pilih sudah sesuai pada sistem.
2. Pertanyaan kedua
SS = 5, S = 0, C = 0, TS =0, STS = 0
50
f) Total skor = 25 + 0 + 0 + 0 + 0 = 25

25
h) Rumus Index (%) = 𝑥 100% = 100%
25
setuju tombol submit bisa melakukan proses regex.
3. Pertanyaan ketiga
SS = 1, S = 3, C = 1, TS =0, STS = 0
f) Total skor = 5 + 12 + 3 + 0 + 0 = 20
51
tidak setuju adalah 1 x 5 (jumlah responden) = 5.

20
h) Rumus Index (%) = 25
𝑥 100% = 80%
setuju muncul notifikasi file berhasil di proses
4. Pertanyaan keempat
SS = 1, S = 4, C = 0, TS =0, STS = 0
f) Total skor = 5 + 16 + 0 + 0 + 0 = 21

21
𝑥 100% = 84%
setuju tombol download bisa melakukan proses download/unduh file
yang telah diproses.

52
5. Pertanyaan kelima
SS = 0, S = 3, C = 2, TS =0, STS = 0
f) Total skor = 0 + 12 + 6 + 0 + 0 = 18

18
𝑥 100% = 72%
i) 72% kategori setuju (mengacu pada table 4.6 Presentasi Nilai
Pengujian Sistem). Maka dapat disimpulkan bahwa responden setuju
muncul notifikasi bahwa file berhasil di download/unduh.
6. Pertanyaan keenam
SS = 5, S = 0, C = 0, TS =0, STS = 0
f) Total skor = 5 + 16 + 0 + 0 + 0 = 21
53
g) Jumlah skor tertinggi untuk pilihan sangat setuju adalah 5 x 5
(jumlah responden) = 25, sedangkan jumlah skor terendah untuk
pilihan sangat tidak setuju adalah 1 x 5 (jumlah responden) = 5

21
𝑥 100% = 84%
Pengujian Sistem). Maka dapat disimpulkan bahwa responden
sangat setuju File yang berhasil terunduh sudah sesuai dengan output
yang diharapkan pada sistem.
7. Pertanyaan ketujuh
SS = 1, S = 4, C = 0, TS =0, STS = 0
f) Total skor = 5 + 16 + 0 + 0 + 0 = 21

21
𝑥 100% = 84%
dapat mengulangi proses mulai dari awal setelah mengunduh file.

54
8. Pertanyaan kedelapan
SS = 2, S = 3, C = 0, TS =0, STS = 0
f) Total skor = 25 + 0 + 0 + 0 + 0 = 25

25
h) Rumus Index (%) = 𝑥 100% = 100%
25
setuju sistem sudah sesuai dengan tujuan dari penelitian.

BAB V
PENUTUP
5.1 Kesimpulan
Setelah melakukan pengujian pada sistem menggunakan implementasi regex
pada pemberian komentar kode program html didapatkan beberapa kesimpulan
sebagai berikut:
1. Total persentase skor pada setiap pertanyaan yang paling mendominasi
adalah sangat setuju yaitu antara 80% - 100%.
2. Total skor terendah adalah 72% dimana skor tersebut masuk kedalam
kategori setuju (60% - 79.99%). Skor tertinggi adalah 100% dimana skor
tersebut masuk dalam kategori sangat setuju (80% - 100%).
3. Output proses implementasi regex pada pemberian komentar kode program
html sesuai dengan tujuan penelitian yaitu memberikan informasi terkait
penggunaan tag pada HTML untuk memudahkan pemahaman dalam
pembuatan sebuah website.
5.2 Saran
Dari penelitian yang telah dilakukan, ada beberapa saran untuk
pengembangan pada penelitian selanjutnya. Adapun saran yang diberikan, sebagai
berikut:
1. Perlu dilakukan menggunakan bahasa pemrograman yang lain.
55
56
2. Perlu penambahan responden untuk menguji sistem agar hasil pengujian
dapat lebih beragam.
3. Perlu menambahkan dataset lebih banyak untuk menguji hasil dari sistem.
DAFTAR PUSTAKA
Aprianto, S. G. (2021, Desember 01). kodingbagus. Retrieved from kodingbagus:
https://kodingbagus.blogspot.com/2019/05/download-ebook-php-untuk-
pemula.html
Rachman, A. (2017). Komentar Semi Otomatis Untuk Memudahkan Pemahaman
Pada Bahasa Pemrograman Java.
Rachmi Sinha, A. D. (2012). Transmutation of Reguler Expression to Source Code
Using Code Generators. International Journal of Computer Trends and
Technology.
Astamal, R. (2021, September 22). https://rioastamal.net/menjadi-webmaster-
dalam-30-hari/. Retrieved from https://rioastamal.net/menjadi-webmaster-
dalam-30-hari/: https://rioastamal.net/menjadi-webmaster-dalam-30-hari/
Pemrograman Berbasis Web. (2022, Februari 27). Retrieved from
https://lmsspada.kemdikbud.go.id/mod/page/view.php?id=57743
(2022, Februari 27). Retrieved from https://adoc.pub/modul-pemrograman-
web4137d42b78dafefe65643d9c0ea88f6242420.html
http://www.ocw.upj.ac.id/files/Slide-PSY310-PSY310-Slide-4.pdf. (n.d.). Retrieved
from http://www.ocw.upj.ac.id/files/Slide-PSY310-PSY310-Slide-4.pdf
57
Sapoetra, A. N. (2022, Februari 1). Academia. Retrieved from Academia:
https://www.academia.edu/31217125/Cara_Menghitung_Kuesioner_Skala_
Likert
Gea, D. (2022, Februari 27). Media Neliti. Retrieved from Media Neliti:
https://media.neliti.com/media/publications/166314-ID-pengujian-kualitas-
website-ditinjau-dari.pdf
Nadzirin, M. (2022, 27 Februari). Academia. Retrieved from Academia:
https://www.academia.edu/33296169/MODUL_PEMROGRAMAN_WEB_
pdf
LAMPIRAN
DAFTAR RIWAYAT HIDUP
Penulis Bernama Dini Nur Fhadillah yang dilahirkan di Surabaya

pada tanggal 13 Desember 1996 dari pasangan suami istri yang
bernama Bapak Paiman dan Ibu Sugiharti. Penulis merupakan
anak pertama dari tiga bersaudara. Penulis beralamatkan Jalan
Putat Gede Barat gang 2 nomor 22 – Surabaya.
Pendidikan yang pernah ditempuh

2002 – 2008 : SD Negeri Putat Gede 2 Surabaya
2008 – 20011 : SMP GIKI 1 Surabaya
2011 – 2014 : SMKN 4 Surabaya
2014 – 2022 : Jurusan Teknik Informatika, Falkultas Teknik Elektro dan
Teknologi Informasi, ITATS
Pengalaman Kerja
a. Juni 2015 – Juli 2015: SPG Event Ramadhan Korek Zippo di Jatim Expo.
b. Agustus 2015 – Oktober 2015 : SPG Event Batu Permata di Hi-Tech Mall.
c. Januari 2018 – April 2018: Marketing Kartu Kredit BCA di PT. EXA.
d. November 2019 – Februari 2020: Nail Therapist di Bella Artistry.
e. April 2021 – sekarang: Admin Online di UFO Elektronika.

Skripsi Dini Nur Fhadillah 062014106385

Diunggah oleh

Informasi Dokumen

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Skripsi Dini Nur Fhadillah 062014106385

Diunggah oleh

Hak Cipta:

Format Tersedia

IMPLEMENTASI REGEX PADA PEMBERIAN

KOMENTAR KODE PROGRAM HTML

JURUSAN TEKNIK INFORMATIKA

Diajukan Guna Memenuhi Persyaratan

Surabaya __ Februari 2022

Jurusan Teknik Informatika Dosen Pembimbing

Andy Rachman, S.T., M.Kom., Andy Rachman, S.T., M.Kom.,

Judul : Implementasi Regex Pada Pemberian Komentar Kode Program

Telah dinyatakan lulus sidang skripsi pada:

Dian Puspita Hapsari, S.Kom., M.Kom., Andy Rachman, S.T., M.Kom.,

Septiyawan Rosetya W., S.Kom., M.Kom.,

Rahmi Rizkiana Putri, S.ST., M.Kom.,

Andy Rachman, S.T., M.Kom.,

Andy Rachman, S.T., M.Kom.,

pernah diajukan untuk memperoleh gelar kesarjanaan di suatu Perguruan Tinggi,

disebutkan dalam Daftar Acuan / Daftar Pustaka.

Apabila ditemukan suatu jiplakan / plagiat, maka saya bersedia menerima

sesuai ketentuan, peraturan dan perundang-undangan yang berlaku.

Surabaya, 21 Februari 2022

Dini Nur Fhadilah

Dini Nur Fhadillah, NPM: 06.2014.1.06385

Kata kunci: Website, Komentar, HTML, Regex

rahmat-Nya, sehingga penulisan Skripsi yang berJudul “IMPLEMENTASI

REGEX PADA PEMBERIAN KOMENTAR KODE PROGRAM HTML”

ucapan terimakasih berikut ditujukan kepada:

1. Tuhan Yang Maha Esa

2. Kedua orang tua,adik-adik dan keluarga besar yang selalu

memberikan doa dan dukungan selama masa studi

3. Andy Rachman, S.T., M.Kom. selaku Ketua Jurusan Teknik

Informatika dan selaku dosen pembimbing yang selalu memberikan

bimbingan, arahan dan dukungan

bermanfaat bagi pembaca dan penulis.

Surabaya, Februari 2022

LEMBAR JUDUL .......................................................................................... i

LEMBAR PENGESAHAN BUKU SKRIPSI .............................................. ii

LEMBAR PENGESAHAN SIDANG SKRIPSI .......................................... iii

SURAT PERNYATAAN ............................................................................... iiiv

KATA PENGANTAR .................................................................................... vii

DAFTAR ISI ................................................................................................... viii

DAFTAR GAMBAR ...................................................................................... xi

DAFTAR TABEL .......................................................................................... xii

1.1 Latar Belakang ....................................................................... 1

1.2 Rumusan Masalah .................................................................. 4

1.3 Tujuan .................................................................................... 5

1.4 Batasan Masalah..................................................................... 5

1.5 Manfaat Penelitian ................................................................. 6

1.6 Metodologi Penelitian ............................................................ 6

1.7 Sistematika Penelitian ............................................................ 6

2.1 HTML (Hypertext Markup Language) .................................. 8

2.1.1 Dasar - dasar HTML .................................................. 8

2.1.2 Struktur Dasar HTML ................................................ 9

2.2 Regular Expression (Regex) .................................................. 15

2.2.1 Wildcard ..................................................................... 18

2.2.2 Meta Character .......................................................... 18

2.2.3 Character Classes ...................................................... 24

2.3 Contoh HTML........................................................................ 25

2.4 PHP (Hypertext Preprocessor) .............................................. 26

2.5 Skala Likert ............................................................................ 27

BAB III ANALISIS DAN PERANCANGAN SISTEM

3.1 Gambaran Umum ................................................................... 29

3.2 Rancangan Sistem .................................................................. 29

3.2.1 Sequence Diagram Sistem ......................................... 31

3.2.2 Mockup Sistem ........................................................... 32

3.2.3 Pengujian Skala Likert ............................................... 33