BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

2.1.1. Pengertian Internet

Menurut Simarmata (2010:47) “Internet adalah kelompok atau kumpulan

dari jutaan komputer”. Penggunaan internet memungkinkan kita untuk

mendapatkan informasi dari komputer yang ada di dalam kelompok tersebut

dengan asumsi bahwa pemilik komputer memberikan izin akses.

2.1.2. Web Server

Menurut Rozi dan Community (2016:16) “Web server adalah program

untuk melayani penyajian halaman web di internet”. Web server dibutuhkan

dalam mendesain web dinamis yang menggunakan script pemrograman seperti

PHP. Misalnya untuk windows web server bisa memakai XAMPP yang berisi

paket software Apache, Mysql, dan PHP.

2.1.3. Web Browser

Menurut Soetejo (2012:19) mengemukakan bahwa:

Web browser disebut juga penjelajah web, adalah perangkat lunak yang
berfungsi menampilkan dan melakukan interaksi dengan dokumen-
dokumen yang disediakan oleh server web. Peramban web yang populer
adalah Microsoft Internet Explorer dan Mozilla Firefox. Web browser
diperlukan untuk menguji-coba hasil pembuatan dokumen HTML.

8
 9

2.1.4. Website

Menurut Soetejo (2012:11) mengemukakan bahwa:

Situs dapat diartikan sebagai kumpulan halaman-halaman yang digunakan
untuk menampilkan informasi gambar gerak, suara, dan atau gabungan
dari semuanya itu baik yang berifat statis maupun dinamis yang
membentuk suatu rangkaian bangunan yang saling terkait dimana masing-
masingdihubungkan dengan link-link.

2.1.5. WWW (World Wide Web)

Menurut Prasojo dan Riyanto (2010:188) “Adalah suatu ruang informasi

yang dipakai oleh pengenal global yang disebut URL (Uniform Resource

Identifier) untuk mengindentifikasikan sumber daya-sumber daya yang berguna”.

Jika sebelumnya internet hanya digunakan untuk aplikasi yang berbasis

teks (gopher), maka dengan Web ini pengguna bisa mencari informasi dalam

berbagai bentuk. Informasi yang dihasilkan Web dapat berupa teks, gambar,

audio, visual, model grafis, film, dan lain-lain. Web menggunakan hyperlink yang

memudahkan pencarian informasi dalam berbagai bentuk.

2.1.6. HTML (Hypertext Markup Language)

Menurut Rozi dan Community (2016:17) “HTML singkatan dari

Hypertext Markup Language. HTML adalah bahasa pengkodean yang digunakan

untuk membuat halaman web agar bisa ditampilkan melalui web browser”.

2.1.7. PHP (PHP Hypertext Prepocessor)

Menurut EMS (2016:56) “PHP merupakan bahasa scripting seperti

HTML”. PHP adalah singkatan dari PHP Hypertext Preprocessor. Salah satu

kelebihan PHP adalah mudah berinteraksi dengan database. Beberapa database

 10

yang paling banyak disandingkan dengan PHP adalah MYSQL. Untuk

menghubungkan PHP dengan database hanya perlu mengetahui nama database

dan lokasi database.

2.1.8. CSS (Cascading Style Sheet)

Menurut Suryana dan Koesheryatin (2014:101) “CSS (Cascading Style

Sheet) adalah suatu bahasa stylesheet yang digunakan untuk mengatur tampilan

suatu website, baik tata letaknya, jenis huruf, warna, dan semua yang

berhubungan dengan tampilan”.

2.1.9. JavaScript

Menurut Suryana dan Koesheryatin (2014:181) “JavaScript adalah script

berdasar pada objek yang memperbolehkan pemakai untuk mengendalikan banyak

aspek interaksi pemakai pada suatu dokumen HTML”. Objek tersebut dapat

berupa suatu window, frame, URL, document, form, button, atau item yang lain.

2.1.10. XAMPP

Menurut Erwin (2011:1) menjelaskan bahwa:

XAMPP adalah paket web server yang bersifat open-source yang bekerja
pada berbagai platform. XAMPP itu sendiri sebenarnya merupakan
akronim dengan “X” yang berarti menyilang atau menyebrangi platform
yang mana dimaksudkan tersedia untuk berbagai sistem operasi dan
platform seperti Microsoft Windows, Mac OS, Linux dan Solaris.
Sedangkan huruf lainnya “A” untuk “Apache HTTP Server”, “M” untuk
“MySql”, “P” untuk “PHP” dan “P” yang kedua untuk “Perl”. XAMPP
dirancang untuk membantu pengembang halaman web, programmer dan
desainer ntuk memeriksa dan meninjau pekerjaan mereka menggunakan
komputer mereka bahkan tanpa koneksi internet.
 11

2.1.11. PhpMyAdmin

Menurut Sibero (2011:367) “PhpMyAdmin adalah aplikasi web yang

dibuat oleh PhpMyAdmin.net. PhpMyAdmin digunakan untuk

administrasi database MySql”. Program ini digunakan untuk mengakses

database MySQL. Perintah untuk membuat tabel dapat menggunakan form

yang sudah disediakan atau langsung menuliskan skrip pada menu SQL.

PhpMyAdmin dijalankan dengan cara mengetikkan

“http://localhost/phpmyadmin” pada web browser.

2.1.12. Adobe Dreamweaver CS6

1. Adobe Dreamweaver CS6

Menurut Madcoms (2011:3) mengemukakan bahwa “Software terkemuka

untuk membangun dan mengedit web dengan menyediakan kemampuan visual

dan tingkat kode yang dapat digunakan untuk membuat website berbasis standar

dan desain untuk desktop, mobile, smartphone, tablet, dan perangkat lainnya”.

Adobe Dreamweaver merupakan program web editor yang dapat

digunakan untuk membangun dan menyunting halaman web. Dreamweaver

menyediakan fitur editor WYSIWYG (What You See Is What You Get) atau disebut

juga Design View. Maksudnya adalah tampilan hasil akhir web nantinya akan

sama dengan tampilan pada saat proses perancangan halaman web. Dreamweaver

telah terintegrasi dengan browser untuk melihat halaman web yang dikembangkan

di jendela pratinjau program sendiri, agar konten memungkinkan untuk terbuka di

web browser.
 12

Adobe Dreamweaver menyediakan banyak tool yang berkaitan dengan

pengkodean seperti HTML, CSS, XML dan pemrograman client side yaitu Java

Script dengan penggunaan yang sangat mudah dan User Friendly. Aplikasi ini

juga mendukung pemrograman script side seperti PHP, Active Server Page (ASP),

ASP.net, ASP Java Script, ASP Vb Script, Cold Fusion, dan Server Page (JSP).

Berikut ini adalah tampilan halaman utama software Adobe Dreamweaver.

Sumber: Madcoms (2011:3)

Gambar II.1.
Adobe Dreamweaver CS.6

Terdapat tiga pilihan kategori tampilan awal dreamweaver:

a. Open A Recent Item, digunakan untuk membuka File atau File recent

yang baru digunakan. Untuk membuka File dengan mengklik tombol

button open kita dapat membuka File yang akan dikerjakan.

b. Creat New, digunakan untuk mebuat Web baru dan menentukan

dokumen apa yang akan dipakai dengan menentukan bahasa

pemrograman yang akan digunakan seperti: HTML, Cold Fusion, PHP,

CSS, Java Script dan lain-lain.

 13

c. Top Features (Video), digunakan untuk membuka bebrapa fitur yang

telah disediakan melalui internet, diantaranya CS6 New Feature

Overview, Fluid Grid Layouts, Business Catalyst Authoring, CSS

Transition Panel, Jquery Mobile Swatches dan lain-lain.

2.1.13. Basis Data

Menurut Fathansyah (2007:2) “Basis data (database) sendiri dapat

didefinisikan himpunan kelompok data (arsip) yang saling berhubungan yang

diorganisasi sedemikian rupa agar kelak dapat dimanfaatkan kembali dengan

cepat dan mudah”.

2.1.14. Model Pengembangan Perangkat Lunak

Menurut Sukamto dan Shalahuddin (2014:28) mengemukakan bahwa:

Model SDLC (System Development Life Cycle) air terjun sering disebut
model sekuensial linier (sequential linier) atau alur hidup klasik (classic
life cycle). Model air terjun menyediakan pendekatan alur hidup perangkat
lunak secara sekuensial atau terurut dimulai dari analisis, desain,
pengodean, pengujan, tahan pendukung (support)”.

Berikut ini adalah gambar dan penjelasan model air terjun:

Sumber: Sukamto dan Shalahuddin (2014:28)

Gambar II.2.
Ilustrasi Model Waterfall
 14

1. Analisa 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 untuk 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 antar muka, dan prosedur pengodean. Tahap ini

mentranslasi kebutuhan perangkat lunak dari tahap analisis kebutuhan ke

representasi desain agar dapat diimpelmentasikan 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

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
 15

meminimalisir kesalahan (error) dan memastikan keluaran yang dihasilkan sesuai

dengan yang didinginkan.

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 pemeliharaaan

dapat mengulangi proses pengembangan mulai dari analisis spesifikasi untuk

perubahan perangkat lunak yang sudah ada, tapi tidak untuk membuat perangkat

lunak baru.

Model air terjun adalah struktur tahap pengembangan sistem jelas,

dokumentasi dihasilkan disetiap tahap pengembangan, dan sebuah tahap

dijalankan setelah tahap sebelumnya selesai dijalankan.

2.2. Teori Pendukung

2.2.1. Struktur Navigasi

Menurut Binanto (2010:268) “Struktur navigasi adalah gabungan dari

struktur referensi informasi situs web dan mekanisme link yang mendukung

pengunjung untuk melakukan penjelajahan situs”.

Menurut Binanto (2010:269) ada empat macam model bentuk dasar dari

struktur navigasi yang biasa digunakan yaitu:

 16

1. Struktur Navigasi Linear

Pengguna akan melakukan navigasi secara berurutan, dari frame atau byte

informasi ke informasi lainnya.

Sumber: Binanto (2010:269)

Gambar II.3.
Ilustrasi Struktur Navigasi Linear

2. Struktur Navigasi Hirarki

Struktur dasar ini disebut juga struktur “linear dengan percabangan”

karena pengguna melakukan navigasi di sepanjang cabang pohon struktur yang

terbentuk oleh logika isi.

Sumber: Binanto (2010:269)

Gambar II.4.
Ilustrasi Struktur Navigasi Hirarki
 17

3. Struktur Navigasi Non-Linear

Pengguna akan melakukan navigasi dengan bebas melalui isi proyek

dengan tidak terkait dengan jalur yang sudah ditentukan sebelunnya.

Sumber: Binanto (2010:269)

Gambar II.5.
Ilustrasi Struktur Navigasi Non-Linear

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: Binanto (2010:269)

Gambar II.6.
Ilustrasi Struktur Navigasi Campuran (Composite)
 18

2.2.2. ERD (Entity Relationship Diagram)

Menurut Fathansyah (2007:79) “Entity Relationship Diagram (ERD)

merupakan model yang berisi komponen-komponen himpunan entitas dan

himpunan relasi yang masing-masing dilengkapi dengan atribut-atribut yang

merepresentasikan seluruh fakta dari dunia nyata”.

Notasi simbolik di dalam Entity Relationship Diagram yang dapat

digunakan adalah sebagai berikut:

1. Persegi panjang menyatakan himpunan entitas

2. Lingkaran/elip menyatakan atribut (atribut yang berfungsi sebagai key

digaris bawahi)

3. Belah ketupat menyatakan himpunan relasi.

4. Garis sebagai penghubung antara himpunan relasi dengan himpunan

entitas dan himpunan entitas dengan atributnya.

5. Kardinalitas relasi dapat dinyatakan dengan banyaknya garis cabang atau

dengan pemakaian angka (1 dan 1 untuk relasi satu-ke-satu, dan N untuk

relasi satu-ke-banyak atau N dan N untuk relasi banyak ke banyak).

Ada pula beberapa tahapan dalam pembuatan Entity Relationship

Diagram, yaitu:

1. Mengidentifikasikan dan menetapkan seluruh himpunan entitas yang akan

terlibat.

2. Menentukan atribut key dari masing-masing himpunan entitas.

3. Mengidentifikasi dan menetapkan seluruh himpunan relasi di antara

himpunan entitas yang ada beserta foreign key-nya.

 19

4. Menentukan derajat/kardinalitas relasi untuk setiap himpunan relasi.

Menurut Fathansyah (2007:80) mengemukakan juga “relasi antar

himpunan entitas dapat dikelompokkan dalam tiga jenis, yaitu: Kerelasian jenis 1-
ke-1/satu ke satu (one to one), Kerelasian jenis n-ke-1/banyak ke satu (many to
one) atau 1-ke-n/satu ke banyak (one to many), Kerelasian jenis n-ken/banyak ke
banyak (many to many)”.

2.2.3. LRS (Logical Record Structure)

Logical Record Structure dibentuk dengan nomor dari tipe record.

Beberapa tipe record digambarkan oleh kotak empat persegi panjang dan dengan

nama yang unik. Menurut Iskandar dan Rangkuti (2008:126) “LRS terdiri dari

beberapa link di antara tipe record. Link ini menunjukkan arah dari satu tipe

record ke tipe record lainnya. Banyak link dari LRS yang diberi tanda field yang

kelihatan pada kedua tipe record. Penggambaran LRS mulai dengan

menggunakan model yang dimengerti”.

Dua metode yang dapat digunakan, dimulai dengan hubungan kedua

model yang dapat dikonversikan ke LRS. Metode yang lain dimulai dengan Entity

Relationship Diagram dan langsung dikonversikan ke LRS.

1. Konversi ERD ke LRS, entity relationship diagram harus diubah ke

bentuk LRS (struktur record secara logik), Dari bentuk LRS inilah yang

nantinya dapat ditransformasikan ke bentuk relasi (tabel).

2. Konversi ERD ke LRS, sebuah model sistem yang digambarkan dengan

sebuah ERD akan mengikuti pola permodelan tertentu. Dalam kaitannya

dengan koversi ke LRS, untuk perubahan yang terjadi adalah mengikuti

aturan-aturan berikut:
 20

a. Setiap entitas diubah ke dalam bentuk kotak dengan nama entitas

berada di kolom atas kotak dan atribut berada di dalam kotak.

b. Sebuah relationship kadang disatukan, dalam sebuah kotak bersama

entitas, kadang sebuah kotak bersama-sama dengan entitas, kadang

disatukan dalam sebuah kotak tersendiri.

3. Konversi LRS ke relasi atau tabel adalah bentuk pernyataan data secara

grafis 2 (dua) dimensi, yang terdiri dari kolom dan baris. Relasi adalah

bentuk visual dari sebuah file dan tiap kolom dalam sebuah field, atau

yang dalam bentuk lingkaran pada ERD dikenal dengan sebutan atribut.

Konversi dari logical record structure dilakukan dengan cara:

a. Nama logical record structure menjadi nama relasi.

b. Tiap atribut menjadi sebuah kolom di dalam relasi.

 21

2.2.4. Pengujian Unit

Menurut Sukamto dan Shalahuddin (2014:275) “Black-Box Testing

(pengujian kotak hitam) yaitu menguji desain dan kode program”. Pengujian

dimaksudkan untuk mengetahui apakah fungsi-fungsi, masukan, dan keluaran dari

perangkat lunak sesuai dengan spesifikasi yang dibutuhkan, dan juga

mengevaluasi hanya dari tampilan luarnya (interface) fungsionalitasnya tanpa

mengetahui apa sesungguhnya yang terjadi dalam proses detail.