7

BAB II

LANDASAN TEORI

2.1 Konsep Dasar Web

Web memiliki konsep-konsep dasar yang menjadi acuan dalam mempelajari

suatu web. Pada bab ini penulis akan membahas beberapa teori, adapun beberapa teori

yang akan dijelaskan untuk membantu dalam pembuatan web sebagai berikut :

2.1.1 Website

Website halaman situs yang terdapat banyak informasi yang dibutuhkan dan juga

dapat diakses secara cepat sehingga dalam pembuatan web diperlukan suatu website.

Berikut ini akan diuraikan beberapa yang diperlukan disuatu website.

1. Internet

Jaringan antar komputer yang saling berkaitan secara terus menerus baik melalui

email, transmisi file, dan komunikasi dua arah antar individu atau kelompok.

Menurut Nugroho (2019:3) “Internet adalah sebuah solusi jaringan yang dapat

menghubungkan beberapa jaringan Local yang ada pada suatu Daerah, Kota, atau

bahkan pada sebuah Negara”.

Menurut Zaki & Winarno (2015:1) “Internet sebetulnya singkatan dari kata

Interconnected Networking. Networking artinya artinya jaringan, sedang

Interconnected berarti Saling berkaitan/terkoneksi. Sehingga internet adalah jaringan

komputer yang saling terkoneksi”

8

2. Website

kumpulan halaman yang saling berhubungan untuk memudahkan tukar menukar

dan menampilkan berbagai macam informasi teks, gambar, animasi, suara dan lain-

lain.

Menurut Abdulloh (2018:1) “website dapat diartikan sebagai kumpulan halaman

yang berisi informasi data digital baik berupa teks, gambar, animasi, suara dan video

atau gabungan dari semuanya yang disediakan melalui jalur koneksi internet sehingga

dapat diakses dan dilihat oleh semua orang di seluruh dunia”.

Menurut Putra (2015:69) “website merupakan suatu kumpulan dari halaman-

halaman situs, yang terangkum dalam sebuah domain atau subdomain, yang tempatnya

berada di dalam World Wide Web (WWW) di dalam Internet”.

3. Web Browser

perangkat lunak yang digunakan untuk mencari sumber-sumber informasi

didalam jaringan internet dan dapat menampilkan gambar, memutar file multimedia,

mengirim, dan menerima email serta mengelola HTML.

Menurut Abdulloh (2018:4) “web browser digunakan untuk menampilkan dan

mengetes hasil program”.

4. Web Server

Sebuah software yang memberikan layanan berbasis data berfungsi untuk

melakukan transfer berkas permintaan berupa berkas teks, video, gambar, file, dan

lain-lain.

Menurut Abdulloh (2018:4) “web server merupakan perangkat lunak yang

berfungsi untuk menerima permintaan (request) melalui protokol HTTP atau HTTPS

dari client kemudian mengirimkan kembali dalam bentuk halaman-halaman web”.

9

Menurut Yudhanto & Prasetyo (2018:10) “web server adalah perangkat lunak

yang berfungsi sebagai penerima permintaan yang dikirimkan melalui browser,

kemudian memberikan tanggapan permintaan data bentuk halaman situs web atau

lebih umumnya dalam dokumen HTML”.

2.1.2 Bahasa Pemrograman

Dalam penulisan Tugas Akhir, penulis menggunakan bahasa pemrograman yang

dapat menunjang dan menentukan secara persis data apa saja yang akan diolah oleh

komputer. Adapun bahasa pemrograman yang dipakai sebagai berikut:

1. HTML (HyperText Markup Language)

Sebuah bahasa pemrograman yang digunakan untuk membuat sebuah halaman

web, menampilkan berbagai informasi dan dapat juga digunakan sebagai link-link

menuju halaman web yang lain dengan kode tertentu.

Menurut Abdulloh (2018:7) “HTML merupakan singkatan dari HyperText

Markup Language yaitu bahasa standar web yang dikelola penggunaannya oleh W3C

(World Wide Web Consortium) berupa tag-tag yang menyusun setiap elemen dari

website”.

Menurut Setiawan (2017:16) “HTML atau Hyper Text Markup Language

merupakan sebuah bahasa pemrograman terstruktur yang dikembangkan untuk

membuat halaman website yang dapat diakses atau ditampilkan menggunakan Web

Browser”.

Menurut Nugroho (2019:5) “HTML adalah kependekan dari (HyperText Markup

Language), merupakan sebuah bahasa Scripting yang berguna untuk menuliskan

halaman Web”.

10

2. PHP (Hypertext Proprocessor)

Bahasa pemrograman berupa script yang bersifat open source yang digunakan

untuk membuat halaman website untuk menghasilkan isi web yang sesuai dengan

permintaan client.

Menurut Abdulloh (2018:127) “PHP merupakan kependekan dari Hypertext

Proprocessor yaitu bahasa pemrograman web yang dapat disisipkan dalam skrip

HTML dan bekerja di sisi server”.

Menurut Setiawan (2017:54) “PHP sendiri sebenarnya merupakan singkatan dari

“Hypertext Proprocessor”, yang merupakan sebuah bahasa scripting tingkat tinggi

yang dipasang pada dokumen HTML”.

Menurut Mundzir (2018:003) “PHP berasal dari kata “Hypertext Proprocessor”,

yaitu bahasa pemrograman universal untuk penanganan pembuatan dan

pengembangan sebuah situs web dan bisa digunakan bersamaan dengan HTML”.

Menurut Nugroho (2019:201) “PHP (PHP:Hypertext Preprocessor) adalah

sebuah bahasa pemrograman yang berbentuk Scripting, sistem kerja dari program ini

adalah sebagai Interpreker bukan sebagai Compiler”.

3. CSS (Cascading Style Sheets)

Salah satu bahasa desain web yang dapat mengatur format tampilan sebuah

halaman web dengan perancangan desain text berupa font, color, margins, size dan

lain-lain.

Menurut Abdulloh (2018:45) “CSS adalah singkatan dari Cascading Style Sheet

yaitu dokumen web yang berfungsi mengatur elemen HTML dengan berbagai property

yang tersedia sehingga dapat tampil dengan berbagai gaya yang diinginkan”.

11

Menurut Setiawan (2017:116) “CSS adalah kependekan dari Cascading Style

Sheet. CSS merupakan salah satu kode pemrograman yang bertujuan untuk menghias

dan mengatur gaya tampilan /layout halaman web supaya lebih elegan dan menarik”.

4. JavaScript

Bahasa pemrograman yang bersifat client side yang pemrosesnya dilakukan oleh

client sering digunakan pada web browser untuk menciptakan halaman web yang

menarik.

Menurut Abdulloh (2018:193) “JavaScript merupakan bahasa pemrograman web

yang pemrosesnya dilakukan di sisi client”.

Menurut Sidik (2017:1) “JavaScript adalah bahasa yang digunakan untuk

membuat program yang digunakan agar dokumen HTML yang ditampilkan dalam

browser menjadi lebih interaktif, tidak sekadar indah saja”.

5. JQuery

Menurut Abdulloh (2018:233) “JQuery merupakan salah satu dari sekian banyak

JavaScript library, yaitu kumpulan fungsi JavaScript yang siap pakai, sehingga

mempermudah dan mempercepat dalam membuat kode JavaScript”.

2.1.3 Basis Data

Basis data kumpulan data yang tersimpan didalam komputer yang digunakan

suatu program untuk memperoleh informasi dari basis data tersebut. Dibawah ini akan

dijelaskan beberapa teori sebagai berikut:

Menurut Abdulloh (2018:103) “Database atau basis data adalah kumpulan

informasi yang disimpan dalam komputer secara sistematik sehingga dapat diperiksa

menggunakan suatu program komputer untuk memperoleh informasi”.

12

Menurut Fathansyah (2018:2) Basis Data terdiri atas 2 kata, yaitu Basis dan

Data. Basis kurang lebih dapat diartikan sebagai markas atau gudang, tempat

bersarang/berkumpul. Sedangkan Data adalah representasi fakta dunia nyata yang

mewakili suatu objek seperti manusia (pegawai, siswa, pembeli, pelanggan), barang,

hewan, peristiwa, konsep, keadaan, dan sebagainya yang diwujudkan dalam bentuk

angka, huruf, simbol, teks, gambar, bunyi, atau kombinasinya.

Menurut Abdulloh (2018:13) “Basis Data (Database) adalah kumpulan data

yang disimpan secara sistematis di dalam komputer yang dapat diolah atau

dimanipulasi menggunakan perangkat lunak (program aplikasi) untuk menghasilkan

informasi”.

1. MySql (My Structure Query Language)

Sistem manajemen database bersifat open source yang digunakan untuk

menyimpan data.

Menurut Mundzir (2018:217)“MySql adalah sistem manajemen database SQL

yang sifatnya open source (terbuka) dan paling banyak digunakan saat ini”.

Menurut Nugroho (2019:133) “MySql merupakan database yang paling digemari

dikalangan Programmer Web, dengan alasan bahwa program ini merupakan database

yang sangat kuat dan cukup stabil untuk digunakan sebagai media penyimpanan data”.

2. XAMPP

Menurut Yudhanto & Prasetyo (2018:14) “XAMPP adalah kompilasi program

aplikasi gratis terfavorit di kalangan developer/programmer yang berguna untuk

pengembangan website berbasis PHP dan MySql”. Dengan satu aplikasi ini kita akan

mendapatkan paket software komplet yang bisa dijalankan pada Windows ataupun

13

Linux sehingga programmer dapat dengan mudah melakukan simulasi pada komputer

local sebelum diunggah ke internet.

2.1.4 Model Pengembangan Perangkat Lunak

Dalam penulisan tugas akhir ini penulis menggunakan model pengembangan

perangkat lunak waterfall. Model pengembangan perangkat lunak ini akan menunjang

dan menentukan tahapan-tahapan dalam pembuatan website agar website yang dibuat

menghasilkan kualitas yang baik.

Menurut Sukamto & Salahuddin (2016:28) “Model SDLC air terjun waterfall

sering disebut juga dengan model sekuensial linier (sequential linear) atau alur hidup

klasik (classic life cycle). Model waterfall menyediakan pendekatan alur hidup

perangkat lunak secara sekuensial atau terurut dimulai dari analisis, desain,

pengodean, pengujian dan tahap pendukung (support)”.

Sumber: Sukamto & Salahuddin (2016:29)

Gambar II.1

Model Waterfall

14

1. Analisis Kebutuhan Perangkat Lunak

Proses pengumpulan kebutuhan dilakukan secara intensif untuk mespesifikasikan

kebutuhan perangkat lunak agar dapat dipahami perangkat lunak seperti apa yang

dibutuhkan oleh user. Pada tahap ini, penulis melakukan wawancara dan observasi

langsung pada proses pemesanan dan transaksi di suatu perusahaaan jasa percetakan,

dan mengumpulkan kebutuhan yang akan digunakan dalam pembuatan website

tersebut.

2. Desain

Desain perangkat lunak adalah proses multi langkah yang fokus pada desain

pembuatan program perangkat lunak termasuk struktur data, arsitektur perangkat

lunak, representasi antar muka, dan prosedur pengkodean. Pada tahap ini, penulis

merancang desain dengan menggunakan ERD (Entity Relationship Diagram) dan LRS

(Logical Relation Structure) untuk menggambarkan jalannya logika proses website ini.

Dan untuk pembatan Database menggunakan XAMPP.

3. Pembuatan Kode Program

Desain harus ditranslasikan kedalam program perangkat lunak. Hasil dari tahap

ini adalah program komputer sesuai dengan desain yang telah dibuat pada tahap

desain.

4. Pengujian

Pengujian fokus pada perangkat lunak secara dari segi lojik dan fungsional dan

memastikan bahwa semua bagian sudah diuji. Hal ini dilakukan untuk meminimalisir

kesalahan (error) dan memastikan keluaran yang dihasilkan sesuai dengan yang

dinginkan pada website tersebut.

15

5. Pendukung (support) atau Pemeliharaan (maintance)

Perubahan bisa terjadi karena adanya kesalahan yang muncul dan tidak terdeteksi

saat pengujian atau perangkat lunak harus beradaptasi dengan lingkungan baru. Tahap

pendukung atau pemeliharaan dapat mengulangi proses pengembangan mulai dari

analisis spesifikasi untuk perubahan, sehingga hasil kinerja website ini dapat terlihat.

2.2 Teori Pendukung

Dalam pembuatan tugas akhir ini penulis juga menggunakan beberapa teori

pendukung, guna menunjang keberhasilan dalam pembuatan tugas akhir ini. Adapun

teori pendukung yang digunakan penulis diantaranya adalah sebagai berikut:

2.2.1 Struktur Navigasi

Dalam pembuatan website, kita juga memerlukan yang namanya struktur

navigasi. Dengan adanya struktur navigasi proses gambaran pembuatan sebuah

aplikasi menjadi lebih mudah.

Menurut Andriansyah (2016:61) “struktur navigasi dapat diartikan sebagai alur

dari suatu program yang menggambarkan rancangan hubungan antar area yang

berbeda sehingga memudahkan proses pengorganisasian seluruh elemen website”.

Struktur navigasi adalah alur yang digunakan dalam aplikasi yang dibuat.

Sebelum menyusun aplikasi multimedia kedalam sebuah software, kita harus

menentukan terlebih dahulu alur apa yang akan digunakan dalam aplikasi yang dibuat.

Bentuk dasar dari struktur navigasi yang biasa digunakan dalam proses pembuatan

16

aplikasi multimedia ada empat macam, yaitu struktur navigasi linier, hirarki, non linier

dan campuran (Setiawati, 2018).

1. Struktur Navigasi Linear

Struktur navigasi linier merupakan struktur yang mempunyai satu rangkaian cerita

berurutan. Struktur ini menampilkan satu demi satu tampilan layer secara berurutan

menurut aturannya.

Sumber: (Setiawati, 2018)

Gambar II.2

Struktur Navigasi Linear

2. Struktur Navigasi Hirarki

Struktur navigasi hirarki sering disebut struktur navigasi bercabang, yaitu

merupakan suatu struktur yang mengandalkan percabangan untuk menampilkan data

atau gambar pada layer dengan kriteria tertentu.Tampilan pada menu utama disebut

master page (halaman utama satu), halaman tersebut mempunyai halaman

percabangan yang disebut slave page (halaman pendukung) dan jika dipilih akan

menjadi halaman kedua, begitu seterusnya.

17

Sumber: (Setiawati, 2018)

Gambar II.3

Struktur Navigasi Hirarki

3. Struktur Navigasi Non-Linear

Struktur navigasi non linier (tidak terurut) merupakan pengembangan dari struktur

navigasi linier, hanya saja pada struktur ini diperkenankan untuk membuat

percabangan. Percabangan pada struktur non linier berbeda dengan percabangan pada

struktur hirarki, pada struktur ini kedudukan semua page sama, sehingga tidak dikenal

adanya master atau slave page.

Sumber: (Setiawati, 2018)

Gambar II.4

Struktur Navigasi Non-Linear

18

4. Struktur Navigasi Komposit

Struktur navigasi campuran (composite) merupakan gabungan dari struktur

sebelumnya dan disebut juga struktur navigasi bebas, maksudnya adalah jika suatu

tampilan membutuhkan percabangan maka dibuat percabangan. Struktur ini paling

banyak digunakan dalam pembuatan aplikasi multimedia.

Sumber: (Setiawati, 2018)

Gambar II.5

Struktur Navigasi Komposit

2.2.2 Enterprise Relationship Diagram (ERD)

Dalam pembuatan tugas akhir ini diperlukan ERD (Enterprise Relationship

Diagram) suatu model data berupa notasi grafis dalam pemodelan data konseptual

yang berguna menggambarkan hubungan antar data dalam basis data.

Menurut Andriansyah (2016:51) “ERD merupakan diagram yang

menggambarkan hubungan yang terjadi antar tabel”. ERD tidak menggambarkan

bagaimana jalannya sebuah program layaknya diagram alir (flowchart).

19

Menurut Sukamto & Salahuddin (2018:50) “Pemodelan awal basis data yang

paling banyak digunakan adalah menggunakan Entity Relationship Diagram (ERD) ”.

ERD dikembangkan berdasarkan teori himpunan dalam bidang matematika. ERD

digunakan untuk pemodelan basis data relational. Sehingga jika penyimpanan basis

data menggunakan OODBMS maka perancangan basis data tidak perlu menggunakan

ERD.

Berikut adalah simbol-simbol yang digunakan pada ERD:

1. Entity/Entitas

Entitas merupakan data inti yang akan disimpan; bakal tabel pada basis data;

benda yang memiliki data dan harus disimpan datanya agar dapat diakses oleh aplikasi

komputer; penamaan entitas biasanya lebih ke kata benda dan belum merupakan nama

tabel.

2. Atribut

Field atau kolom data yang butuh disimpan dalam suatu entitas

3. Atribut Kunci Primer

Field atau kolom data yang butuh disimpan dalam suatu entitas dan digunakan

sebagai kunci akses record yang diinginkan ; biasanya berupa id; kunci primer dapat

lebih dari satu kolom, asalkan kombinasi dari beberapa kolom tersebut dapat bersifat

unik (berbeda tanpa ada yang sama).

4. Atribut Multinilai/Multivalue

Field atau kolom data yang butuh disimpan dalam suatu entitas yang dapat

memiliki nilai lebih dari satu.

5. Relasi

Relasi yang menghubungkan antar entitas; biasanya diawali dengan kata kerja.

20

2.2.3 Logical Record Structure

Menurut Andriansyah (2016:53) “LRS merupakan transformasi dari

penggambaran ERD dalam bentuk yang lebih jelas dan mudah untuk dipahami”.

Penggambaran LRS hampir mirip dengan penggambaran normalisasi file, hanya saja

tidak digambarkan simbol asterix (*) sebagai simbol primary key (kunci utama) dan

foreign key (kunci tamu).

Logical Record Structure (LRS) digambarkan kotak persegi panjang dan dengan

nama yang unik. File record pada LRS ditempatkan dalam kotak. LRS terdiri dari link

diantara tipe record lainnya, banyaknya link dari LRS yang diberi nama oleh filed-filed

yang kelihatan pada kedua link tipe record (Sukamaindrayana & Sidik, 2017).

Rancangan dari tabel-tabel yang diusulkan adalah sebagai berikut:

Sumber: (Sukamaindrayana & Sidik, 2017)

Gambar II.6

Logical Record Structure

21

2.2.4 Implementasi dan Pengujian Web

Pengujian web salah satu bagian yang sangat penting karena bentuk pengujian

ini dilakukan untuk mengevaluasi kualitas suatu produk apabila terjadinya masalah

pada web tersebut. Berikut beberapa pendapat menurut para ahli sebagai berikut:

Black-Box Testing adalah “metode pengujian perangkat lunak yang tes

fungsionalitas dari aplikasi yang bertentangan dengan struktur internal atau kerja”

(Anwar & Irawan, 2017).

Menurut Andriansyah (2016:275) “Black-Box Testing yaitu menguji perangkat

lunak dari segi spesifikasi fungsional tanpa menguji desain dan kode program”.

Pengujan dimaksudkan untuk mengetahui apakah fungsi-fungsi, masukan dan

keluaran dari perangkat lunak sesuai dengan spesifikasi yang dibutuhkan.

Black Box Testing berfokus pada spesifikasi fungsional dari perangkat lunak.

Tester dapat mendefinisikan kumpulan kondisi input dan melakukan pengetesan pada

spesifikasi fungsional program. Black Box Testing bukanlah solusi alternatif dari White

Box Testing tapi lebih merupakan pelengkap untuk menguji hal-hal yang tidak dicakup

oleh White Box Testing (Mustaqbal, Firdaus, & Rahmadi, 2015).

Black Box Testing cenderung untuk menemukan hal-hal berikut:

1. Fungsi yang tidak benar atau tidak ada.

2. Kesalahan antarmuka (interface errors).

3. Kesalahan pada struktur data dan akses basis data..

4. Kesalahan performansi (performance errors).

5. Kesalahan inisialisasi dan terminasi.

22

Pengujian didesain untuk menjawab pertanyaan-pertanyaan berikut:

1. Bagaimana fungsi-fungsi diuji agar dapat dinyatakan valid?

2. Input seperti apa yang dapat menjadi bahan kasus uji yang baik?

3. Apakah sistem sensitif pada input-input tertentu?

4. Bagaimana sekumpulan data dapat diisolasi?

5. Berapa banyak rata-rata data dan jumlah data yang dapat ditangani sistem?

6. Efek apa yang dapat membuat kombinasi data ditangani spesifik pada operasi

sistem?

Saat ini terdapat banyak metoda atau teknik untuk melaksanakan Black Box

Testing, antara lain:

1. Equivalence Partitioning

2. Boundary Value Analysis/Limit Testing

3. Comparison Testing

4. Sample Testing

5. Robustness Testing

6. Behavior Testing

7. Requirement Testing

8. Performance Testing

9. Uji Ketahanan (Endurance Testing)

10. Uji Sebab-Akibat (Cause-Effect Relationship Testing)