Post on 09-Dec-2020
8
BAB II
LANDASAN TEORI
2.1. Konsep Dasar Web
Konsep dasar web merupakan kumpulan halaman-halaman untuk
menginformasikan sesuatu dalam internet yang dapat berisi teks, gambar, animasi,
video, dan lainnya. Secara umum ada beberapa hal yang harus dimengerti di dalam
sebuah web termasuk beberapa bahasa pemograman dan aplikasi pendukung untuk
membuat suatu web.
2.1.1. Website
Website berisi teori-teori tentang definisi internet, world wide web, web
browser, dan web server.
A. Internet
Secara umum internet dapat diartikan sebagai media pertukaran informasi dan
komunikasi. Semua informasi bisa di dapat dengan mudah dan bebas tanpa ada
batasan. Menurut Nugroho (2019:1), “Internet adalah sebuah solusi jaringan yang
dapat menghubungkan beberapa jaringan local yang ada pada suatu daerah, kota, atau
bahkan pada sebuah negara”.
Menurut Yunita & Sukma (2016:175), “Internet merupakan hubungan antar
berbagai jenis computer dan jaringan di dunia yang berbeda sistem operasi maupun
aplikasinya dimana hubungan tersebut memanfaatkan kemajuan komunikasi (telepon
dan satelit) yang menggunakan protocol standar dalam berkomunikasi yaitu protocol
TCP/IP (Transmission Control/Internet Protocol)”. TCP/IP memiliki teknik
mengindentifikasi dengan menggunakan penomoran yang dinamakan IP Address
9
(Internet Protocol Address). Dengan menggunakan nomor ini, sebuah komputer dapat
terhubung dengan komputer yang lainnya dalam sebuah jaringan.
B. World Wide Web (WWW)
Menurut Purnama (2016:32) , ”World Wide Web adalah kumpulan informasi
multimedia (tekstual, grafis, spasial, suara, dan sebagainya) yang disusun dalam
bentuk HyperText”.
WWW merupakan singkatan dari frasa kata World Wide Web yang jika
diartikan satu persatu, maka word berarti dunia, wide berarti ukuran besar atau raksasa,
dan web berarti sebuah sistem yang digunakan untuk mengirimkan data maupun
dokumen ke jaringan internet. Maka dari itu, WWW adalah sistem yang digunakan
untuk mengirimkan dan menyebarkan data ke jaringan berskala besar yang ada
diseluruh dunia (Yunita & Sukma, 2016).
C. Web Browser
Menurut Purnama (2016:7), “Web Browser adalah software yang digunakan
untuk membuka web di internet”. Web browser biasanya menyesuaikan dengan sistem
operasi yang digunakan oleh komputer. Tentunya keperluan dan performanya juga
sudah pasti berbeda. Misalnya untuk sistem operasi yang berjalan pada perangkat
mobile maka kapasitasnya akan lebih kecil, berbeda dengan sistem operasi yang
berjalan pada PC (Personal Computer).
10
D. Web Server
Menurut Yudhanto & Prasetyo (2018:10), “Web server adalah perangkat lunak
yang berfungsi sebagai penerima permintaan yang dikirimkan melalui browser,
kemudian memberikan tanggapan permintaan dalam bentuk halaman situs web atau
lebih umumnya dalam dokumen HTML”.
2.1.2. Bahasa Pemograman
Bahasa Pemograman berisi teori-teori tentang definisi PHP (PHP Hypertext
Preprocessor), Java Script, Cascading Style Sheet (CSS), Model View Controller
(MVC), dan Framework yang digunakan oleh penulis dalam membuat sistem
informasi pemesanan paket pernikahan.
A. PHP Hypertext Preprocessor (PHP)
Menurut Raharjo (2015:95), “PHP merupakan bahasa pemograman yang
mendukung dua metodelogi pemograman, yaitu pemograman prosedural dan
pemograman berorientasi objek”.
Menurut Yudhanto & Prasetyo (2018:7), “PHP atau Hypertext Preprocessor
adalah bahasa pemograman script server side yang sengaja dirancang lebih cenderung
untuk membuat dan mengembangkan web”.
PHP memang dirancang untuk para pengembang web agar dapat menciptakan
suatu halaman web yang bersifat dinamis. Artinya PHP dapat membentuk suatu
tampilan berdasarkan apa yang diminta oleh user, seperti dapat mengakses suatu
database dan menampilkannya pada halaman web.
11
B. JavaScript
Menurut Purbadian (2015:54), “Javascript merupakan bahasa pemograman
script yang berjalan pada sisi client atau browser”.
Menurut Yudhanto & Prasetyo (2018:5), “Javascript digunakan untuk
membuat website kita lebih interaktif kepada user yang menggunakan website
tersebut”.
Bentuk JavaScript mirip dengan Java, namun keduanya berbeda jauh. Menurut
Wijaya (2017:1579), “Java adalah bahasa pemograman compiler dan JavaScript
adalah script interpreter yang diletakkan pada bagian skrip HTML”.
C. Cascading Style Sheet (CSS)
Menurut Yudhanto & Prasetyo (2018:4), “CSS atau Cascading Stylesheet, yaitu
bahasa yang digunakan untuk format HTML agar menjadi lebih bagus dan efektif
dalam tampilan”.
Menurut Purbadian (2015:24), “CSS yang mempunyai kepanjangan dari
Cascading Style Sheet merupakan suatu bahasa pemograman web yang digunakan
untuk mendesain halaman web (style sheet language) agar tercipta suatu halaman web
yang rapih, terstruktur, dan seragam”.
Berdasarkan kedua pengertian diatas, penulis dapat menyimpulkan bahwa CSS
dapat diartikan sebagai suatu bahasa stylesheet yang berfungsi untuk mempercantik
tampilan suatu website, baik tata letaknya, huruf, jenis, warna, dan semua hal yang
berhubungan dengan tampilan.
12
D. Model View Controller (MVC)
Menurut Yudhanto & Prasetyo (2018:6), “Model-View-Controller atau MVC
adalah sebuah metode untuk membuat sebuah aplikasi dengan memisahkan data
(Model) dari tampilan (View) dan cara bagaimana memprosesnya (Controller)”.
Sedangkan untuk penjelasan lengkap mengenai Model-View-Controller
(MVC) menurut Badiyanto & Ardhana (2018:13-14) adalah sebagai berikut:
1. Model
Model berhubungan dengan data dan interaksi ke database atau webservice.
Model juga mempresentasikan struktur data dari aplikasi yang bisa berupa basis
data maupun data lain, misalnya dalam bentuk file teks, XML maupun webservice.
Biasanya didalam model berisi class dan fungsi yaitu untuk melakukan manipulasi
data seperti insert, update, delete dan search, namun tidak dapat berhubungan
dengan bagian View secara langsung. Sebuah aplikasi website biasanya
menggunakan database dalam menyimpan data, oleh karena itu model biasanya
akan berhubungan dengan perintah-perintah query SQL.
2. View
View berhubungan dengan segala sesuatu yang akan ditempatkan ke end-user.
Biasa berupa halaman Web, RSS, JavaScript dan lain-lain. Programmer harus
menghindari adanya logika pemrosesan data di view. Didalam View hanya berisi
variabel-variabel yang berisi data yang siap ditampilkan. View dapat dikatakan
sebagai halaman website yang dibuat menggunakan HTML dengan bantuan CSS,
JavaScript, dan Jquery.
3. Controller
Controller merupakan penghubung antara Model dan View. Didalam Controller
inilah terdapat class dan fungsi-fungsi yang memproses permintaan dari View
13
kedalam struktur data didalam Model. Controller juga tidak boleh berisi kode
untuk mengakses basis data. Tugas controller adalah menyediakan berbagai
variable yang akan ditampilkan di view, memanggil model untuk melakukan akses
ke database, menyediakan penanganan error, mengerjakan proses logika dari
aplikasi, serta melakukan validasi atau pengecekan terhadap input.
E. Framework
Dalam bahasa inggris framework berarti kerangka kerja. Secara harfiah
framework dapat diartikan sebagai sebuah tools yang berfungsi untuk membantu
sebuah pekerjaan.
Menurut Sukamto & Shalahuddin (2014:253), “Framework adalah kerangka
kerja yang memudahkan programmer untuk membuat sebuah aplikasi sehingga
programmer akan lebih mudah melakukan perubahan (customize) terhadap
aplikasinya dan dapat memakainya kembali untuk aplikasi lain yang sejenis”.
Menurut Yudhanto & Prasetyo (2018:8) menyimpulkan bahwa:
Framework juga dapat diartikan sebagai kumpulan script (terutama class dan
function yang dapat membantu developer/programmer dalam menangani
berbagai masalah-masalah dalam pemograman, seperti koneksi ke database,
pemanggilan variabel, file dan lain-lain sehingga pekerjaan developer lebih
fokus dan lebih cepat dalam membangun aplikasi.
Disini penulis menggunakan framework Codeigniter sebagai kerangka kerja
pembuatan aplikasi berbasis web. Menurut Raharjo (2015:5), “Codeigniter adalah
framework web untuk PHP dan merupakan framework yang mengimplementasikan
pola desain MVC”.
14
2.1.3. Basis Data
Menurut Yudhanto & Prasetyo (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”.
Menurut (Yanto, 2016), “Database adalah sekumpulan dari file-file yang
dilengkapi dengan atribut dan record yang saling berinteraksi untuk mencapai tujuan
menghasilkan informasi yang dibutuhkan oleh pihak pengguna”.
Menurut Sukamto & Shalahuddin (2014:43), “Sistem basis data adalah sistem
yang terkomputerisasi yang tujuan utamanya adalah memelihara data yang sudah
diolah atau informasi dan membuat informasi tersedia saat dibutuhkan”.
Berdasarkan pengertian-pengertian diatas, penulis dapat menyimpulkan bahwa
basis data adalah media untuk menyimpan data agar dapat diakses dengan mudah dan
cepat.
A. 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”.
Menurut Raharjo (2015:25), “XAMPP adalah kompilasi software yang
membungkus Apache HTTP Server, MySQL, PHP, dan Perl.” Dengan menggunakan
XAMPP, instalasi paket software yang dibutukan untuk proses pengembangan web
(Apache HTTP Server, MySQL, dan PHP) dapat dilakukan dengan sangat mudah.
15
B. My Structured Query Language (MySQL)
MySQL yang merupakan singkatan dari “My Structured Query Languange”
adalah database yang paling favorit saat ini. Menurut Purbadian (2015:2), “MySQL
adalah sebuah database yang digunakan untuk menampung suatu data”.
MySQL tidak memiliki aplikasi client berbasis visual seperti database lain
(SQL Server), sehingga untuk mengaksesnya kita memerlukan program aplikasi
tambahan. Misalnya MySQL Front untuk berbasis desktop, atau PHP My Admin untuk
berbasis web.
C. Structured Query Language (SQL)
Menurut Sukamto & Shalahuddin (2014:46), “SQL (Structured Query
Language) adalah bahasa yang digunakan untuk mengelola data pada RDBMS”.
D. PHP My Admin
Menurut Yudhanto & Prasetyo (2018:15), “PhpMyAdmin adalah aplikasi web
untuk mengelola database MySQL dan database MariaDB dengan mudah melalui
antarmuka (interface) grafis, aplikasi web ini ditulis menggunakan bahasa
pemograman PHP”.
2.1.4. Model Pengembangan Perangkat Lunak
Menurut Sukamto & Shalahuddin (2018:28-30), “Model SDLC air terjun
(waterfall) sering juga disebut model sekuensial linier (sequential linear) atau alur
hidup klasik (classic life cycle)”. Model air terjun menyediakan pendekatan alur hidup
perangkat lunak secara sekuensial atau terurut dimulai dari analisis, desain,
pengkodean, pengujian dan tahap pendukung (support).
16
Berikut adalah model gambar air terjun:
Sumber: Sukamto & Shalahuddin (2018:29).
Gambar II.1.
Diagram Model Air Terjun
Berikut metode waterfall terbagi menjadi 5 tahapan yaitu:
1. Analisis Kebutuhan Perangkat Lunak
Proses pengumpulan kebutuhan dilakukan secara intensif untuk
menspesifikasikan kebutuhan perangkat lunak agar dapat dipahami perangkat
lunak seperti apa yang dibutuhkan oleh user. Spesifikasi kebutuhan perangkat
lunak pada tahap ini perlu didokumentasikan.
2. Desain
Desain perangkat lunak adalah proses multi langkah yang fokus pada desain
pembuatan program perangkat lunak termasuk struktur data, arsitektur perangkat
lunak, representasi antarmuka, dan prosedur pengodean. Tahap ini mentranslasi
kebutuhan perangkat lunak dari tahap analisis kebutuhan ke representasi desain
agar dapat di implementasikan menjadi program pada tahap selanjutnya. Desain
perangkat lunak yang dihasilkan pada tahap ini juga perlu didokumentasikan.
3. Pembuatan kode program
Desain harus ditranslasikan kedalam program perangkat lunak. Hasil dari tahapan
ini adalah program komputer sesuai dengan desain yang telah dibuat pada tahap
desain.
17
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
yang diinginkan.
5. Pendukung (Support) atau Pemeliharaan (Maintenance)
Tidak menutup kemungkinan sebuah perangkat lunak mengalami perubahan
ketika sudah dikirimkan ke user. 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
mengulai proses pengembangan mulai dari analisis spesifikasi untuk perubahan
perangkat lunak yang sudah ada, tapi tidak untuk membuat perangkat lunak baru.
2.2. Tools Program
Peralatan program (tools program) merupakan alat yang digunakan untuk
menggambarkan bentuk logika model dari suatu sistem dengan menggunakan simbol
atau diagram yang menunjukkan secara tepat arti dan fungsinya. Peralatan program
(tools program) yang dijelaskan adalah Entity Relationship Diagram, Relational
Record Structure, struktur navigasi, dan Black-box testing.
2.2.1. Entity Relationship Diagram (ERD)
A. Entity Relationship Diagram (ERD)
Menurut Pratama (2014:49), “ERD (Entity Relationship Diagram) adalah
diagram yang menggambarkan keterkaitan antartabel beserta dengan field-field di
dalamnya pada suatu database sistem”. Sebuah database memuat minimal sebuah
tabel dengan sebuah atau beberapa buah field (kolom) di dalamnya. Setiap tabel
18
umumnya memiliki keterkaitan hubungan. Keterkaitan antartabel ini biasa disebut
dengan relasi.
Menurut Sukamto & Shalahuddin (2018:50), “ERD dikembangkan
berdasarkan teori himpunan dalam bidang matematika yang digunakan untuk
pemodelan basis data relational”.
Menurut Yanto (2016:32), ERD terdiri dari 3 komponen utama, yaitu:
1. Entitas (Entity)
Entitas adalah suatu objek di dunia nyata yang dapat dibedakan dengan objek
lainnya. Objek tersebut dapat berupa orang, benda ataupun hal lainnya. Entitas
digambarkan dalam bentuk persegi panjang.
2. Atribut (Attribute)
Atribut merupakan semua informasi yang berkaitan dengan entitas. Atribut sering
dikenal dengan properti dari suatu entitas atau objek. Atribut digambarkan dalam
bentuk lingkaran elips.
3. Relasi (Relationship)
Gambar belah ketupat merupakan perlambangan relasi antar entitas atau sering
disebut kerelasian.
Menurut Pratama (2014:49-50), terdapat tiga buah jenis relasi antar tabel di
dalam bagan ERD, yaitu:
1. One to One (Satu ke Satu)
Relasi ini menggambarkan hubungan satu field pada tabel pertama ke satu field
pada tabel kedua. Relasi ini paling sederhana. Sebagai contoh, pada sistem
informasi perpustakaan terdapat tabel Buku (dengan field Kode_Buku,
Kode_Kategori, Kode_Penulis, Nama_Penulis, Judul, Penerbit) dan tabel
19
Kategori (Kode_kategori, Nama_Kategori, Alamat). Field Kode_Kategori
memiliki keterkaitan (relasi) satu ke satu pada tabel Buku dan tabel Kategori.
2. One to Many (Satu ke Banyak)
Relasi ini menggambarkan hubungan satu field pada tabel pertama ke dua atau
beberapa buah field di tabel kedua.
3. Many to Many (Banyak ke Banyak)
Sebagai contoh, sebuah sistem informasi sekolah memiliki pengguna guru dan
siswa di dalamnya. Sistem informasi ini memiliki sebuah database bernama
sisfosekolah dengan tiga buah tabel di dalamnya. Ketiga tabel tersebut adalah
tabel Guru (memuat field NIP, Nama_Guru, Pangkat_Golongan, Alamat), tabel
Mata_Pelajaran (memuat field Kode_Mata_Pelajaran, Nama_Mata_Pelajaran),
dan tabel Mengajar (memuat field NIP, Kode_Mata_Pelajaran, Kelas).
Tabel Mengajar terbentuk dari relasi antara tabel Guru dan tabel Mata_Pelajaran.
Relasi dalam hal ini berupa relasi N ke N, yang artinya satu atau lebih field pada
tabel pertama dapat dihubungkan ke satu atau lebih field pada tabel kedua dan
membentuk tabel ketiga. Pada contoh ini, satu guru (pada tabel Guru) dapat
mengajar satu atau lebih mata pelajaran (pada tabel Mata_Pelajaran) dan satu mata
pelajaran dapat memiliki lebih dari satu guru pengajar, untuk kemudian
membentuk tabel Mengajar.
B. Logical Relational Structure (LRS)
Menurut Tabrani (2014:35), “LRS adalah Logical Record Structure dibentuk
dengan nomor dari record. Beberapa tipe record digambarkan oleh kotak empat
persegi panjang dan dengan nama yang unik”.
20
Menurut Fridayanthie dan Mahdiati dalam (Lestari, Tabrani, & Ayumida,
2018), “Logical Record Structured (LRS) adalah representasi dari struktur record-
record pada tabel-tabel yang terbentuk dari hasil relasi antar himpunan entitas.
Menentukan kardinalitas, jumlah tabel, dan Foreign Key (FK)”.
Pola atau aturan dalam pemodelan LRS, yaitu:
a. Setiap entitas akan diubah kebentuk kotak.
b. Sebuah atribut relasi disatukan dalam sebuah kotak bersama entitas jika
berhubungan yang terjadi pada diagram-ER 1:M (relasi bersatu dengan
cardinality M) atau tingkat hubungan 1:1 (relasi bersatu dengan cardinality yang
paling membutuhkan referensi).
c. Sebuah relasi dipisah dalam sebuah kotak tersendiri (menjadi entitas baru) jika
tingkat hubungannya M:M (many to many) dan memiliki foreign key yang diambil
dari kedua entitas yang sebelumnya saling berhubungan.
2.2.2. Struktur Navigasi
Menurut Andriansyah dalam (Imaniawan & Wati, 2017) mengemukakan
bahwa “Struktur Navigasi adalah alur dari suatu program yang menggambarkan
rancangan hubungan antara area yang berbeda sehingga memudahkan proses
pengorganisasian seluruh elemen-elemen website”.
Struktur navigasi merupakan salah satu unsur yang paling penting bagi sebuah
website. Dengan adanya struktur navigasi ini, pengunjung website akan lebih mudah
dalam membaca komponen dan fasilitas apa saja yang terdapat dalam website tersebut
(Wijaya, Aji, & Fandhilah, 2018).
Menurut Andriansyah (2016:61) menjelaskan bahwa, “Struktur navigasi
adalah dalam sebuah pembuatan website, diperlukan struktur navigasi sebagai bentuk
21
penggambaran dari halaman-halaman apa saja yang tersedia didalam website.
Layaknya petunjuk arah, navigasi memudahkan pengguna untuk “berselancar”
didalam sebuah website.
1. Struktur Navigasi Linear
Pengguna akan melakukan navigasi secara berurutan dari frame atau byte
informasi ke informasi lainnya.
Sumber: Andriansyah, (2016:61)
Gambar II.2.
Struktur Navigasi Linear
2. Struktur Navigasi Hirarki
Struktur dasar ini disebut juga struktur “Linear dengan percabangan” karena
pengguna melakukan navigasi disepanjang cabang pohon terstruktur yang terbentuk
oleh logika isi.
Sumber: Andriansyah, (2016:62)
Gambar II.3.
Struktur Navigasi Hirarki
3. Struktur Navigasi Non-Linear
Pengguna akan melakukan navigasi dengan bebas melalui isi proyek dengan tidak
terikat dengan jalur yang sudah ditentukan sebelumnya.
Sumber: Andriansyah, (2016:62)
Gambar II.4.
Struktur Navigasi Non-Linear
22
4. Struktur Navigasi Campuran (Composite)
Pengguna akan melakukan navigasi dengan bebas (secara non-linear), tetapi
terkadang dibatasi presentasi linear film atau informasi penting dan atau pada data
yang paling terorganisasi secara logis pada suatu hirarki.
Sumber: Andriansyah, (2016:63)
Gambar II.5.
Struktur Navigasi Composite
2.2.3. Implementasi dan Pengujian Web
Black-Box Testing (pengujian kotak hitam) menurut Sukamto & Shalahuddin
(2018:275) ialah menguji perangkat lunak dari segi spesifikasi fungsional tanpa
menguji desain dan kode program. Pengujian dimaksudkan untuk mengetahui apakah
fungsi-fungsi, dan keluaran dari perangkat lunak sesuai dengan spesifikasi yang
dibutuhkan. Kasus uji yang dibuat untuk melakukan pengujian kotak hitam harus
dibuat dengan kasus benar dan kasus salah, misalkan untuk kasus proses login maka
kasus uji yang dibuat adalah:
a. Jika user memasukkan nama pemakai (username) dan kata sandi (password) yang
benar.
b. Jika user memasukkan nama pemakai (username) dan kata sandi (password) yang
salah, misalnya nama pemakai benar tapi kata sandi salah, atau sebaliknya, atau
keduanya salah.