5

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

Sebelum penulis melakukan rancangan sebuah web, maka penulis harus

mempersiapkannya terlebih dahulu yaitu : Apache web server dan database MySQL

dalam satu software yaitu XAMPP , Visual Studio Code, Boostrap dan framework

Codeigniter. Penulis menggunakan Apache sebagai web server, Visual Studio Code

sebagai editor, server basisdatanya menggunakan MySQL, Boostrap sebagai

templates website, dan framework Codeigniter sebagai bahasa pemograman php.

A. Website

Menurut Hidayat dalam jurnal (Ma’arifati & Wijianto, 2017) “Website Situs

web (webiste) pada hakekatnya merupakan kumpulan halaman- halaman yang berisi

informasi berupa teks, gambar, animasi, audio dan atau. Halaman- halaman web

tersebut membentuk menjadi suatu rangkaian yang terkait.”

1. Internet

Menurut Wismakarma dalam (Tabrani & Pudjiarti, 2017) mengemukakan

bahwa “Internet adalah suatu jaringan komputer global terbentuk dari jaringan-

jaringan komputer lokal dan regional, memungkinkan komunikasi data antar

komputer-komputer yang terhubung ke jaringan tersebut”.

6

2. Web Browser

Menurut (Nisa & Supriyanta, 2015) mengemukakan bahwa “Web Browser

adalah aplikasi perangkat lunak yang digunakan untuk mengambil dan

menyajikan sumber informasi web”.

3. Web Server

Menurut Anhar dalam jurnal (Ma’arifati & Wijianto, 2017) mengemukakan

bahwa “Web server adalah seperangkat komputer yang digunakan untuk

menyimpan dokumen pada sebuah situs web dan memenuhi permintaan

dokumen oleh kliennya”.

B. Bahasa Pemograman

1. HTML (Hyper Text Markup Language)

Menurut Ardhana dalam jurnal (Tabrani & Pudjiarti, 2017) “HTML atau Hyper

Text Markup Language merupakan suatu bahasa yang dikenali oleh web browser

untuk menampilkan informasi seperti teks, gambar, animasi bahkan video”.

2. PHP (Personal Home Page)

Menurut Anhar dalam (Ahluwalia et al., 2016b), “PHP (PHP Hypertext

Preprocessor) yaitu bahasa pemrograman web server-side yang bersifat open source.

PHP merupakan script yang terintegrasi dengan HTML dan berada pada server

(server side HTML embedded scripting)”.

PHP adalah script yang digunakan untuk membuat halaman website yang

dinamis. Dinamis berarti halaman yang akan ditampilkan dibuat saat halaman itu

diminta oleh client. Mekanisme ini menyebabkan informasi yang diterima client

selalu yang terbaru/ up to date. Semua script PHP dieksekusi pada server dimana

script tersebut dijalankan.(Ahluwalia et al., 2016b)

7

3. Javascript

Menurut Kadir dalam jurnal (Nisa & Supriyanta, 2015) “Javascript adalah

bahasa skrip yang digunakan untuk mengontrol tindakan-tindakan yang diperlukan di

halaman web”. Sedangkan menurut Raharjo dalam jurnal (Nisa & Supriyanta, 2015)

“Javascript adalah bahasa yang berfungsi membuat skrip-skrip program yang dapat

dikenal dan dieksekusi oleh web browser dengan tujuan untuk menjadikan halaman

web lebih bersifat interaktif”.

4. JQuery

JQuery adalah library Javascript yang dibuat untuk memudahkan pembuatan

website dengan HTML yang berjalan di sisi Client. (Ahluwalia et al., 2016a)

5. CSS

Menurut Raharjo dalam (Nisa & Supriyanta, 2015) mengemukakan bahwa

“Cascading Style Sheet (CSS) adalah suatu bahasa yang bekerja sama dengan HTML

untuk mendefinisikan bagaimana suatu isi halaman web ditampilkan atau

dipresentasikan. Presentasi ini meliputi style atau gaya teks, link, maupun tata letak

(layout) halaman”. Sedangkan menurut Kadir dalam (Nisa & Supriyanta, 2015)

“Cascading Style Sheets (CSS) adalah skrip yang ditujukan secara khusus untuk

mengatur tampilan aplikasi web”.

6. Boostrap

Menurut Alatas dalam jurnal (Kusniawan & Sardiarinto, 2016) Bootstrap

merupakan “Framework ataupun Tools untuk membuat aplikasi web ataupun situs

web responsive secara cepat, mudah dan gratis”.

7. Framework Codeigniter

Menurut Betha Sidik dalam jurnal (Destiningrum, 2017) Framework adalah

“kumpulan intruksi-intruksi yang dikumpulkan dalam class dan function-function

8

dengan fungsi masing- masing untuk memudahkan developer dalam memanggilnya

tanpa harus menuliskan syntax program yang sama berulang-ulang serta dapat

menghemat waktu”.

Menurut Betha Sidik dalam jurnal (Destiningrum, 2017) Codeigniter adalah

“Sebuah framework php yang bersifat open source dan menggunakan metode MVC

(Model, View, Controller) untuk memudahkan developer atau programmer dalam

membangun sebuah aplikasi berbasis web tanpa harus membuatnya dari awal”.

Codeigniter merupakan konsep M-V-C (Model-View-Controller) yang

memungkinkan pemisahan antara layer application-logic dan presentation. Dengan

konsep ini kode PHP, query Mysql, Javascript dan CSS dapat saling dipisah-

pisahkan sehingga ukuran file menjadi lebih kecil dan lebih mudah dalam perbaikan

kedepannya atau maintenance.(Destiningrum, 2017)

a. Model merupakan kode program (berupa OOP class) yang digunakan

untuk berhubungan dengan database MySQL sekaligus untuk

memanipulasinya (input-edit-delete).

b. View Merupakan kode program berupa template atau PHP untuk

menampilkan data pada browser.

c. Controller merupakan kode program (berupa OOP class ) yang digunakan

untuk mengontrol aliran atau dengan kata lain sebagai pengontrol model

dan view.

9

Sumber :(Destiningrum, 2017)

Gambar II.1

Alur Konsep M-V-C

C. Basis Data

1. XAMPP

Menurut Yudhanto dan Agus Purbaya dalam (Nisa & Supriyanta, 2015)

“XAMPP merupakan program paket PHP dan MySQL berbasis open source yang

saat ini merupakan andalan para programmer PHP dalam melakukan programming

dan melakukan testing hasil programnya”. Sedangkan menurut Sadeli dalam (Nisa &

Supriyanta, 2015) “Xampp adalah program yang berisi paket Apache, MySQL, dan

phpMyAdmin”.

a. Apache

Menurut Sadeli dalam (Nisa & Supriyanta, 2015) “Apache (Server HTTP

Apache atau ServerWeb/WWW Apache ) adalah webserver yang dapat

dijalankan di banyak sistem operasi (Unix, BSD, Linux, Microsoft

Windows dan Novell Netware serta platform lainnya) yang berguna untuk

melayani dan memfungsikan situs web”.

10

b. MySQL

Menurut Sibero dalam (Nisa & Supriyanta, 2015) “MySQL atau dibaca

“My Sekuel” dengan suatu RDBMS (Relational Database Management

System) merupakan aplikasi sistem yang menjalankan fungsi pengolahan

data. MySQL sendiri pertama dikembangkan oleh MySQL AB yang

kemudian diakuisisi oleh Sun Microsystem dan terakhir dikelola oleh

Oracle Coorporation.

c. PhpMyAdmin

Menurut Rahman dalam (Nisa & Supriyanta, 2015) “PHPMyadmin

adalah sebuah software berbasis pemrograman PHP yang dipergunakan

sebagai administrator MySQL melalui browser (web) yang digunakan

untuk management database”. meyakinkan bahwa persyaratan sistem

informasi telah terpenuhi.

D. Model Pengembangan Perangkat Lunak

Menurut Rosa dan Shalahuddin dalam jurnal (Kusniawan & Sardiarinto, 2016)

menjelaskan bahwa “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, dan pengujian.

11

Berikut adalah model gambar air terjun (waterfall).

Sumber : Menurut Rosa dan Shalahuddin dalam (Kusniawan & Sardiarinto,

2016)

Gambar II.2

Ilustrasi Model Waterfal

1. Analisis kebutuhan perangkat lunak.

Proses pengumpulan kebutuhan yang dilakukan secara intensif untuk mencari

spesifikasi kebutuhan perangkat lunak agar dapat dipahami perangkat lunak

seperti apa yang tepat dan dibutuhkan oleh user.

2. Desain.

Desain perangkat lunak adalah proses multi langkah yang fokus pada desain

pembuatan progam perangkat lunak termasuk struktur data, arsitektur

perangkat lunak, representasi antarmuka dan prosedur pengkodean. Tahap ini

mentranslasi kebutuhan perangkat lunak dari tahap analisis kebutuhan ke

representasi desain agar dapat diimplementasikan menjadi program pada

tahap selanjutnya.

3. Pembuatan kode program.

Hasil dari tahap ini adalah pembuatan program komputer yang sesuai dengan

desain yang telah dibuat pada tahap desain.

12

4. Pengujian.

Pengujian fokus pada perangkat lunak dari segi logika dan fungsional serta

memastikan bahwa semua bagian sudah diuji. Hal ini dilakukan untuk

meminimalisir kesalahan(error) dan memastikan keluaran yang dihasilkan

sesuai dengan 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. Proses ini juga menjaga

agar program yang sudah di buat berjalan

2.2. Teori Pendukung

A. Struktur Navigasi

Dalam pembuatan website, hal yang harus diperhatikan sebelum merancang

tampilan web adalah pembuatan struktur navigasi. Ada empat struktur dasar yang

digunakan yaitu linear, hierarkis, nonlinear, dan komposit. (Eka & Arviana, 2018)

1. Linear

Pengguna akan melakukan navigasi secara berurutan dari frame atau byte

informasi yang satu ke yang lainnya.

Sumber: (Eka & Arviana, 2018)

Gambar II.3

Struktur Navigasi Linear

13

2. Hierarkies

Struktur dasar ini disebut juga struktur “linear dengan percabangan” karena

pengguna melakukan navigasi disepanjang cabang pohon struktur yang

terbentuk oleh logika isi.

Sumber: (Eka & Arviana, 2018)

Gambar II.4

Struktur Navigasi Hierarkis

3. Nonlinear

Pengguna akan melakukan navigasi dengan bebas melalui isi proyek

dengan tidak terkait dengan jalur yang sudah ditentukan sebelumnya.

Sumber: (Eka & Arviana, 2018)

Gambar II.5

Struktur Navigasi Nonlinear

14

4. Komposit

Pengguna akan melakukan navigasi dengan bebas (secara nonlinear), tetapi

terkadang dibatasi presentasi linear film atau informasi penting dan atau

pada data yang paling terorganisasi secara logis pada suatu hierarki.

Sumber: (Eka & Arviana, 2018)

Gambar II.6

Struktur Navigasi Komposit

B. Enterprise Relationship Diagram

Menurut (Kusniawan & Sardiarinto, 2016) “ERD (Entity Relationship

Diagram) adalah gambar atau diagram yang menunjukan informasi dibuat, disimpan

dan digunakan dalam sistem bisnis.”

Menurut (Kusniawan & Sardiarinto, 2016) terdapat tiga notasi dasar yang

bekerja pada model E-R yaitu entity sets, relationship sets dan attributs.

1. Entity set dilambangkan dengan persegi panjang, seperti tampak pada

gambar berikut:

15

Sumber: (Kusniawan & Sardiarinto, 2016)

Gambar II.7

Lambang Entity Set

2. Relationship adalah hubungan diantara beberapa entity. Relationship set

adalah sekumpulan relasi yang mempunyai tipe yang sama. Relationship

set digambarkan dengan diamond seperti tampak pada gambar dibawah

ini.

Sumber: (Kusniawan & Sardiarinto, 2016)

Gambar II.8

Lambang Relationship

3. Attribute merupakan sebuah sebutan unik mewakili suatu entity. Attribute

dalam ERD dilambangkan dalam bentuk elips. seperti tampak pada

gambat dibawah ini.

Sumber: (Kusniawan & Sardiarinto, 2016)

Gambar II.9

Lambang Attribute

16

Menurut Kadir dalam (Setiyawati & Sardiarinto, 2016) ada beberapa jenis

hubungan entitas-entitas pada ERD adalah:

1. One-to-one

Disimbolkan (1:1) menyatakan bahwa setiap entitas pada tipe A paling

banyak berpasangan dengan satu entitas pada tipe entitas B , dan juga

sebaliknya.

2. One-to-many

Disimbolkan (1:M) menyatakan bahwa setiap entitas pada tipe entitas A

dapat berpasangan dengan banyak entitas pada tipe entitas B, sedangkan

setiap entitas pada B hanya dapat berpasangan dengan satu entitas pada

tipe entitas B.

3. Many-to-one

Disimbolkan (M:1) menyatakan bahwa setiap entitas pada tipe entitas A

paling banyak berpasangan dengan satu entitas pada tipe entitas B dan

setiap entitas pada tipe entitas B dapat berpasangan dengan banyak entitas

pada tipe entitas A.

4. Many-to-many

Disimbolkan (M:N) menyatakan bahwa setiap entitas pada suatu tipe

entitas A dapat berpasangan dengan banyak entitas pada tipe entitas B dan

juga sebaliknya.

Menurut Ladjamudin dalam jurnal (Tabrani & Pudjiarti, 2017)” LRS (Logical

Record Structure) terdapat dua aturan dalam melakukan transformasi E-R Diagram

ke Logical Record Structure (LRS)”. Dua aturan tersebut yaitu:

1. Setiap entity akan diubah kebentuk sebuah kotak dengan nama entity

berada diluar kotak dan atribut berada didalam kotak.

17

2. Sebuah relasi kadang disatukan dalam sebuah kotak bernama entity,

kadang dipisah dalam sebuah kotak tersendiri.

C. Implementasi dan Pengujian Web

Pengujian unit digunakan untuk menguji setiap modul untuk menjamin setiap

modul menjalankan fungsinya dengan baik. Dalam pengujian web untuk validasi

menggunakan pendekatan Black-box Testing (pengujian kotak hitam), menurut Rosa

dan Salahuddin dalam (Speed & Engineering, 2016) “Black-box Testing yaitu

menguji perangkat lunak dari segi spesifikasi fungsional tanpa menguji desain dan

kode program”. Pengujian dimaksudkan untuk mengetahui apakah fungsi-fungsi,

masukan, dan keluaran dari segi perangkat lunak sesuai dengan spesifikasi yang

dibutuhkan.