5

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

Pembuatan penelitian ini tidak terlepas dari teori-teori yang mendukung dalam

mempelajari serta merancang sebuah web. Sebelum penulis merancang sebuah web,

penulis mempersiapkan apa saja yang akan digunakan, yaitu Aphace web server,

Sublime Text, database MySQL, dan browser sebagai media internet. Penulis

menggunakan apache sebagai server web untuk server aplikasinya, penulis

menggunakan Sublime Text yang berfungsi sebagai editor. Sementara untuk server

database-nya menggunakan MySQL dan untuk mengaksesnya penulis menggunakan

program browser berupa Google Chrome sebagai media internet.

A. Website

Menurut Prasetyo dalam (Setiyawati, Yogyakarta, & Purwokerto, 2016) web adalah

suatu sistem yang berkaitan dengan dokumen yang digunakan sebagi media untuk

menampilkan gambar, teks, multimedia dan lainnya yang ada pada jaringan internet,

Sibero. Website dibagi menjadi dua kategori,

1. Website Statis

Tampilan dari jenis web ini selalu tetap dan tidak terkoneksi ke suatu database.

pemakai hanya dapat melihat isi dari website tersebut tanpa bisa melakukan

6

interaksi. Website jenis ini biasanya hanya berisi bahasa HTML, CSS dan Java

Script.

2. Website Dinamis

Website tipe ini dibagi menjadi dua bagian yaitu:

a. Client Side Technologies Merupakan teknologi web programming di mana script

dijalankan dikomputer client, tanpa berinteraksi dengan server. Salah satu

kelemahan dari Client Side Technologies adalah Browser Spesific, yakni jalan

tidaknya script sangat tergantung pada browser yang digunakan. Contoh: Java

Script, VB Script, ActiveX Control, Java Applets.

b. Server Side Technologies Teknologi server web ini dimana script dijalankan di

server, kemudian hasil dari pemrosesan itu kemudian dikirim ke client dalam

bentuk HTML, sehingga bisa ditampilkan oleh pengguna. Server Side

Technoogies memiliki keunggulan tidak tergantung pada browser dan keamanan

lebih bagus, karena script diserver tidak bisa dilihat melalui browser. Selain itu

juga memiliki waktu load lebih cepat karena yang di download merupakan

dokumen HTML murni. Contoh script: PHP, ASP (Active Server Page), CGI

(Commoon Gateway Interface).

1. Internet

Menurut (Tasiati & Corie Mei Hellyana, 2017) “Internet sebetulnya singkatan dari

kata Interconnected Networking. Networking artinya jaringan, sedang Interconnected

berarti saling berkaitan/terkoneksi. Sehingga internet adalah jaringan komputer yang

saling terkoneksi”.

7

Menurut Internet adalah jaringan global yang menghubungkan komputer-komputer di

seluruh dunia. Dengan internet, sebuah computer bisa mengakses data yang terdapat

pada computer lain di benua yang berbeda.

2. Web Browser

Web browser (Susanti, 2016) adalah program untuk menampilkan halaman yang

berbentuk kode HTML. Semua halaman web ditulis dengan bahasa HTML (Hypertext

Mark Up Language). Walaupun beberapa file mempunyai ekstensi yang berbeda

(contoh: .html, .php, .php3), output file-file tersebut tetap HTML. HTML adalah

medium yang selalu dikirimkan ke web browser baik halaman itu berupa halaman

statis, sebuah script (seperti PHP), ataupun yang dibuat oleh program CGI

(Common Gateway Interface)

3. Sublime Text

Menurut Bos dalam (Connolly, 2018) menjelaskan Sublime Text merupakan salah

satu text editor yang sangat powerful yang dapat meningkatkan produktivitas dan

mengembangkan kualitas kode yang tinggi.

B. Bahasa Pemrograman

1. MySQL

Menurut (Ahluwalia et al., 2016) merupakan aplikasi database server.

Pengembangnya disebut Structured Query Language (SQL). SQL merupakan bahasa

terstruktur yang digunakan untuk mengolah database beserta isinya. Pengguna dapat

8

memanfaatkan MySQL untuk menambahkan, mengubah dan menghapus data yang

berada dalam database.

Menurut Hidayatullah(2017:177) Kelebihan dari MySQL adalah gratis, handal,

selalu di-update dan banyak forum yang memfasilitasi para pengguna jika memiliki

kendala.

Ada beberapa tipe data dalam MySQL sebagai berikut :

a. Tipe Data Numerik

b. Tipe Data Tanggal dan Waktu

c. Tipe Data String

2. Framework Boostrap

Menurut jurnal (Effendy, Nuqoba, Matematika, Sains, & Airlangga, 2016) Bootstrap

adalah front-end framework yang bagus dan luar biasa yang mengedapankan tampilan

untuk mobiledevice (Handphone, smartphone dll.) guna mempercepat dan

mempermudah pengembangan website. Bootstrap menyediakan HTML, CSS dan

Javascript siap pakai dan mudah untuk dikembangkan. Bootstrap merupakan framework

untuk membangun desain web secara responsif. Artinya, tampilan web yang dibuat oleh

bootstrapakan menyesuaikan ukuran layar dari browser yang kita gunakan baik di

desktop, tablet ataupun mobile device.

9

3. PHP

Menurut Hidayatullah (2017:223) “PHP merupakan salah satu bahasa yang harus

dikuasai. PHP Hypertext Preprocessor atau disingkat dengan PHP ini adalah suatu

bahasa scripting khususnya digunakan untuk web delevopment”.

Kelebihan PHP dapat melakukan tugas-tugas yang dilakukan dengan mekanisme

CGI seperti mengambil, mengumpulkan data dari database, meng-generate halaman

dinamis, atau bahkan menerima dan menirim cookie. Dan menjadi keutamaan PHP itu

sendiri adalah PHP bisa digunakan di berbagai operating system, diantaranya Linux,

Unix, Windows, Mac OsX, RISC OS, dan operating system lainnya.

Sedangkan menurut Wahana Komputer pada jurnal (Paulus, 2017), PHP (Hypertext

Preprocessor) merupakan bahasa pemrograman berbasis web yang memiliki kemampuan

untuk memproses dan mengolah data secara dinamis. PHP dapat dikatakan sebagai

sebuah server-side embedded script language, artinya semua sintaks dan perintah

program yang Anda tulis akan sepenuhnya dijalankan oleh server, tetapi dapat

disertakan pada halaman HTML biasa. PHP memiliki beberapa keunggulan,

diantaranya:

1. Relatif Aman, mengingat skrip atau source code PHP yang terdapat pada web

browser tidak dapat dilihat dengan fasilitas view HTML source, seperti pada

Internet Explorer atau sejenisnya karena skrip PHP ditempelkan.

2. Fleksibel, instalasi sistem operasi mendukung semua varian Linux, Windows,

Mac OS, dan varian UNIX. Selain itu, jenis webserver yang dapat diaplikasikan

10

selain Apache adalah Personal Webserver, Netscape and Planet Servers, Xitami,

OmniHTTP, dan Microsoft Internet Information Server.

3. Dalam hal keamanan data, PHP dapat menggunakan berbagai macam varian

database, seperti: MySQL, Microsoft Access, InterBase, mSQL, Sybase, Dbase,

Informix, SQL Server, dan lain-lain.

4. PHP dapat berintegrasi dengan semua aplikasi program CGI, misalnya

mengambil nilai form, sehingga menghasilkan halaman web yang dinamis.

5. PHP bisa dikatakan cepat karena ditempelkan pada HTML sehingga waktu

tanggap menjadi pendek.

6. Dilihat dari segi harga PHP tidak mahal, malah kebayakan varian PHP gratis dan

dapat diperoleh dengan cuma-cuma.

7. Selain bisa didapatkan secara gratis karena dibawah lisensi GNU, Anda juga

dapat memodifikasi fitur PHP sesuai dengan kebutuhan.

4. JQuery

Menurut (Connolly & Begg, 2018) menjelaskan JQuery adalah open source add-on

pustaka JavaScript yang menekankan pada interaksi antara JavaScript dan HTML.

JQuery merupakan kode JavaScript yang telah ditulis dan tinggal menambahkan satu

atau dua baris kode untuk memanggil JQuery.

5. CSS

Cascading Style sheet (CSS) sudah didukung oleh hamper semua web browser

karena CSS telah di standarkan oleh Word Wide Web Consortium (W3C).

11

Ada 4 cara memasang kode CSS ke dalam kode HTML / halaman web, yaitu:

a. Inline style sheet (Memasukkan kode CSS langsung pada tag HTML)

b. Internal Style Sheet (Embed atau memasang kode CSS ke dalam bagian <head>)

c. Me-link ke external CSS

d. Import CSS file

C. Basis Data

Basis Data adalah satu komponen utama dalam sistem informasi dan tidak ada sistem

informasi yang bisa dijalankan tanpa adanya basis data.

Menurut Abdul Kadir dalam jurnal (Paulus, 2017), arti dari basis data (database)

adalah suatu pengorganisasian sekumpulan data yang saling terkait sehingga

memudahkan aktifitas untuk memperoleh informasi. Dapat disimpulkan bahwa basis

data adalah suatu kelompok data yang tergabung dalam satu tempat data yang

tersingkron melalui suatu objek.

Ada beberapa tujuan Basis Data, secara lebih lengkap pemanfaatan basis data

dilakukan untuk memenuhi tujuan berikut ini :

1. Kecepatan dan Kemudahan (Speed)

2. Efisiensi ruang penyimpanan (Space)

3. Keakuratan (Accuracy)

4. Ketersediaan (Availability)

5. Kelengkapan (Completeness)

6. Keamanan (Security)

12

7. Pemakaian Bersama (Sharability)

XAMPP Menurut Abdul Kadir dalam jurnal (Paulus, 2017), MySQL tergolong

sebagai DBMS (Database Management System). Perangkat lunak ini berguna untuk

mengelola data dengan cara yang sangat fleksibel dan cepat. Berikut adalah sejumlah

aktivitas yang terkait dengan data yang didukung oleh perangkat lunak tersebut.

1. Menyimpan data kedalam tabel.

2. Menghapus data dalam tabel

3. Mengubah data dalam tabel

4. Mengambil data yang tersimpan dalam tabel

D. Model Pengembangan Perangkat Lunak

Dalam penyusunan penelitian ini metode rekayasa perangkat lunak yang digunakan

adalah metode Waterfall. (Mirawati, 2018) Metode Waterfall mengusulkan sebuah

pendekatan kepada perkembangan perangkat lunak yang sistematik dan sekuensial yang

mulai pada tingkat dan kemajuan sistem pada seluruh analisis, desain, kode, pengujian,

dan pemeliharaan. Metode ini terdiri dari beberapa tahapan, yaitu: tahap analisis,

perancangan (design), pengkodean, dan pengujian.

2.2. Tools Program

A. Struktur Navigasi

Menurut Ardiansyah dalam jurnal (Fandi, Imaniawan, Wati, Informasi, &

Informatika, 2017) “Struktur Navigasi dapat diartikan sebagai alur dari suatu program

13

yang menggambarkan rancangan hubungan antara area yang berbeda sehingga

memudahkan proses pengorganisasian seluruh elemen-elemen website”.

Sedangkan menurut Sutopo (Fandi et al., 2017) Dalam pengembangan web, terdapat

beberapa model navigasi dasar, yang harus dikenal dengan baik oleh desainer, karena

setiap model navigasi dapat memberikan solusi tuk kebutuhan yang berbeda.

Menurut jurnal (Achyani, Arviana, 2018) 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.

1. Linear

Pengguna akan melakukan navigasi secara berurutan dari frame atau byte informasi

yang satu ke yang lainnya.

Sumber: (Komputer et al., 2018)

Gambar II.1

Struktur Navigasi Linear

2. Hierarki

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

pengguna melakukan navigasi disepanjang cabang pohon struktur yang terbentuk oleh

logika isi.

14

Sumber: (Komputer et al., 2018)

Gambar II.2

Struktur Navigasi Hierarki

3. Nonlinear

Pengguna akan melakukan navigasi dengan bebas melalui isi proyek dengan tidak

terkait dengan jalur yang sudah ditentukan sebelumnya.

Sumber: (Komputer et al., 2018)

Gambar II.3

Struktur Navigasi Nonlinear

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.

15

Sumber: (Komputer et al., 2018)

Gambar II.4

Struktur Navigasi Komposit

B. Enterprise Relationship Diagram (ERD)

Menurut (Tabrani & Pudjiarti, 2017) adalah “alat pemodelan data utama dan akan

membantu mengoranisasi data dalam suatu proyek ke dalam entitas-entitas dan

menentukan hubungan antar entitas. Dalam Entity Relationship Diagram (ERD) terdapat

beberapa komponen seperti:

1. Entity Entity merupakan objek yang dapat dibedakan dengan yang lain dalam dunia

nyata. Dalam entity ada yang disebut sebagai entity set yaitu kumpulan dari entity

yang sejenis.

2. Atribut Atribut adalah karakteristik dari entity atau relationship, yang menyediakan

penjelasan detail tentang entity atau relationship tersebut. Atribut digambarkan dalam

bentuk oval.

3. Relasi Relasi adalah hubungan yang terjadi antara satu atau lebih entity.

4. Kardinalitas (Derajat Relasi) Kardinalitas relasi menunjukkan jumlah maksimum

entitas yang dapat berelasi dengan entitas pada himpunan entitas lain.

16

Sedangkan menurut (Ahluwalia et al., 2016) ada beberapa jenis hubungan entitas-

entitas pada ERD adalah :

1. Satu ke satu (One to One) Setiap elemen dari Entitas A berhubungan paling banyak

dengan elemen pada Entitas B. Demikian juga sebaliknya setiap elemen B

berhubungan paling banyak satu elemen pada Entitas A.

2. Satu ke banyak (One to Many) Setiap elemen dari Entitas A berhubungan dengan

maksimal banyak elemen pada Entitas B. Dan sebaliknya setiap elemen dari Entitas

B berhubungan dengan paling banyak satu elemen di Entitas A.

3. Banyak ke satu (Many to One) Setiap elemen dari Entitas A berhubungan paling

banyak dengan satu elemen pada Entitas B. Dan sebaliknya setiap elemen dari

Entitas B behubungan dengan maksimal banyak elemen di entitas A.

4. Banyak ke banyak (Many to Many) Setiap elemen dari Entitas A berhubungan

maksimal banyak elemen pada Entitas B demikian sebaliknya.

Dan menurut Brady dan Loonam (Paulus, 2017), Entity Relationship diagram (ERD)

merupakan teknik yang digunakan untuk memodelkan kebutuhan data dari suatu

organisasi, biasanya oleh System Analys dalam tahap analisis persyaratan proyek

pengembangan sistem. Sementara seolah-olah teknik diagram atau alat peraga

memberikan dasar untuk desain database relasional yang mendasari sistem informasi

yang dikembangkan. ERD bersama-sama dengan detail pendukung merupakan model

data yang pada gilirannya digunakan sebagai spesifikasi untuk database.

17

Komponen penyusun ERD

Komponen Keterangan

Persegi panjang mewakili entitas

Elips memiliki atribut

Belah ketupat mewakili relasi

Garis menghubungkan atribut dengan

kumpulan entitas dan dengan relasi

Tabel II.1

Komponen ERD

Entitas adalah objek dalam dunia nyata yang dapat dibedakan dengan objek lain,

sebagai contoh mahasiswa, dosen, departemen. Entitias terdiri atas beberapa atribut

sebagai contoh atribut dari entitas mahasiswa adalah nim, nama, alamat, email, dan lain-

lain. Atribut nim merupakan unik untuk mengidentifikasikan atau membedakan

mahasiswa yang satu dengan yang lainnya. Pada setiap entitas harus memiliki 1 atribut

unik atau yang disebut dengan primary key. Atribut adalah setiap entitas pasti

mempunyai elemen yang disebut atribut yang berfungsi untuk mendeskripsikan

karakteristik dari entitas tersebut. Isi dari atribut mempunyai sesuatu yang dapat

mengidentifikasikan isi elemen satu dengan yang lain. Ada dua jenis atribut :

Entitas

Atribut

Relasi

18

1. Identifier (Key) digunakan untuk menentukan suatu entitas secara unik (primary

Key).

2. Descriptor (nonkey attribute) digunakan untuk menspesifikasikan karakteristik dari

suatu entity yang tidak unik.

Relasi adalah hubungan antara beberapa entitas. sebagai contoh relasi antar

mahasiswa dengan mata kuliah dimana setiap mahasiswa bisa mengambil beberapa mata

kuliah dan setiap mata kuliah bisa diambil oleh lebih dari 1 mahasiswa. relasi tersebut

memiliki hubungan banyak ke banyak.

Berikut adalah metode atau tahap untuk membuat ERD :

1. Menentukan entitas.

2. Menentukan relasi.

3. Menggambar ERD sementara.

4. Mengisi kardinalitas.

5. Menentukan kunci utama.

6. Menggambar ERD berdasar key.

7. Menentukan atribut.

8. Memetakan atribut.

9. Menggambar ERD dengan atribut.

C. Logical Record Structure (LRS)

Menurut (Ahluwalia et al., 2016) “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 ForeignKey (FK).

19

Berikut adalah cara membentuk skema database atau LRS (Logical Record Strutured)

berdasarkan Entity Relationship Diagram :

1. Jika relasinya satu-ke-satu, maka foreign key diletakan pada salah satu dari dua

entitas yang ada tau menyatukan kedua entitas tersebut.

2. Jika relasinya satu-ke-banyak, maka foreign key diletakan pada entitas Many.

3. Jika relasinya banyak-ke-banyak, maka dibua “file konektor” yang berisi dua

foreign key yang berasal dari kedua entitas

D. Pengujian Web

Menurut Rosa dan Shalahuddin dalam (Ahluwalia et al., 2016) , “Black-box testing

adalah perangkat lunak dari segi spesifikasi fungsional tanpa menguji desain dan kode

program”. Pengujian web yang dilakukan pada kesempatan ini, menggunakan metode

black box testing. Pengujian dimaksudkan untuk mengetahui fungsi-fungsi, masukan

dan keluaran dari perangkat lunak sesuai dengan spesifikasi yang dibutuhkan dan

pengujian dengan metode black box testing memungkinkan pengembang software untuk

membuat himpunan kondisi input yang akan melatih seluruh syarat-syarat fungsional

suatu program.

Sedangkan menurut (Strata & Komunikasi, 2018) Pengujian Black box merupakan

pengujian yang memfokuskan pada keperluan fungsional dari sistem. Pengujian Black

box memungkinkan pengembangan software untuk membuat himpunan kondisi input

yang akan melatih seluruh syarat-syarat fungsional suatu program. Pengujian black box

berusaha menemukan kesalahan dalam sistem seperti Fungsi yang tidak sesuai atau

hilang, kesalahan interface, kesalahan database, kesalahan performa dan lain-lain.

20

Adapun beberapa kategori kesalahan yang diuji oleh black box testing, diantaranya

(Ahluwalia et al., 2016):

1. Fungsi-fungsi yang salah atau hilang.

2. Kesalahan interface.

3. Kesalahan dalam struktur data atau akses database eksternal.

4. Kesalahan performa.

5. Kesalahan inisialisasi dan terminasi.