BAB II LANDASAN TEORI - repository.bsi.ac.id · 6 BAB II LANDASAN TEORI 2.1. Konsep Dasar Web Menurut Fitri Marisa (2017:1) Website dapat diartikan sebagai kumpulan halaman-halaman

6

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

Menurut Fitri Marisa (2017:1) Website dapat diartikan sebagai kumpulan

halaman-halaman yang digunakan untuk mempublikasikan informasi berupa teks,

gambar, dan program multimedia lainya berupa animasi (gamabr gerak, tulisan

gerak), suara, dan atau gabunagn dari semuanya itu baik yang berifat statis

maupun dinamis yang membentuk suatu rangkaian bangunan yang saling terkait

antara satu halaman dengan halaman yang lain yang sering disebut hyperlink.

A. Website

1. Web Server

Menurut Aan dalam Jurnal (2013:2) menyimpulkan bahwa:

Web server adalah server yang melayani permintaan klien terdapat halaman

web seperti apache, IIS (Internet Information Server) dan berkomunikas

dengan Middleware untuk menterjemahkan kode-kode tertentu,

menjalankan kode-kode tersebut dan memungkinkan berinteraksi dengan

basis data, PHP atau ASP.

Contoh Web Server:

a. Apache

Apache merupakan salah satu jenis web server yang paling banyak

digunakan di internet.

b. Nginx

Nginx (dibaca engine x) merupakan salah satu web server open source

selain apache.

7

c. ISS (Internet Information Services)

IIS merupakan web server yang digunakan dalam Windows, terutama

Windows 2000 dan Windows 2003.

2. Web Browser

Menurut Putri dkk (2018:2) menyimpulkan bahwa:

Web browser adalah sebuah program komputer yang dibuat untuk menerjemahkan

kode-kode perintah HTML menjadi tampilan web di komputer pengguna berupa

text, image, dan multimedia yang dapat dilihat dan di nikmati langsung. Tampilan

web yang dihasilkan dapat dibaca dan dimengerti oleh orang awam sekalipun.

Contoh Web Browser: Mozilla Firefox, Google Chorme, Internet Exploler

3. Website SISFO Akademik

Menurut Tedi Kurnia dkk (2012:9):

Sistem Informasi Akademik Siswa Berbasis Web adalah:

a. Sistem yang dirancang dapat mengakomodasi kebutuhan dalam

mempermudah dan mempercepat kinerja guru dan staf yang bertugas

dalam mengelola data akademik siswa. Dengan demikian penyimpanan

data-data tentang siswa pada current system dapat diminimalkan.

b. Sistem informasi akademik siswa berbasis web telah mengakomodasi

guru dan staf yang bertugas untuk dapat mengelola data-data akademik

siswa, dengan mudah dapat diakses lewat internet.

c. Unified Approach (UA) dapat digunakan sebagai metodologi untuk

menganalisis dan merancang Sistem Informasi Akademik Siswa

Berbasis web

Contoh Web Sisfo Akademik: www.bsi.ac.id

8

B. Bahasa Pemograman

Menurut Zairen, Danisa dan Anggit Dwi Hartanto (2013) “Bahasa

Pemrograman adalah instruksi atau perintah yang dibuat manusia dengan

membentuk susunan kode yang kemudian diterjemahkan oleh program computer

sehingga dimengerti oleh komputer.”

1. HTML

Menurut Jubilee Enterprise (2017:1):

HTML adalah (Hypertext Markup Language). Lantas, apa itu arti dari tiap-

tiap kata yang membentuk singkatan HTML itu? Berikut penjelasan

singkatnya:

a. Hypertext adalah sebuah teks yang apabila diklik akan membawa Anda

pergi dari satu dokumen ke dokumen lainnya. Dalam prakteknya,

Hypertext berwujud sebuah link yang bisa mengantar Anda ke dunia

internet yang sangat luas.

b. Markup adalah tag (semacam kode) yang mengatur layout dan

tampilan-tampilan visual yang kita lihat di sebuah website, termasuk

font, warna teks, gambar, dan sebagainya.

c. Language yang merupakan penunjuk bahwa HTML adalah semacam

script pemrograman.

Dengan kata lain, HTML adalah script pemrograman yang mengatur

bagaimana kita menyajikan informasi di dunia internet dan bagaimana

informasi itu membawa kita melompat dari satu tempat ke tempat lainnya.

9

Contoh Bahasa Pemograman HTML:

Gambar II.1 Contoh Bahasa Pemograman HTML

2. PHP

Menurut TIM EMS (2016:1), “PHP adalah singkatan dari PHP Hypertext

Preprocessing. Merupakan bahasa scripting untuk web yang cukup populer.

Dengan PHP, Anda bisa membuat web dinamis di mana kode PHP

diselipkan di antara script kode-kode HTML yang merupakan bahasa

markup standar untuk dunia web.”

Contoh Bahasa Pemograman PHP:

Gambar II.2 Contoh Bahasa Pemograman PHP

3. CSS

Menurut Abdul Kadir dalam Jurnal Fajar Hariadi (2013:3), “CSS adalah

singkatan dari Cascading Style-Sheet, yaitu sebuah pengembangan atas

kode HTML yang sudah ada sebelumnya. Dengan CSS, bisa menentukan

10

sebuah struktur dasar halaman web secara lebih mudah dan cepat, serta irit

size.”

Contoh Bahasa Pemograman CSS:

Gambar II.3 Contoh Bahasa Pemograman CSS

4. Java Script

Menurut Indra Yatini dalam Jurnal (2014:2) menyimpulkan bahwa:

JavaScript adalah bahasa scripting kecil, ringan, berorientasi objek yang

ditempelkan pada kode HTML dan di proses di sisi client. JavaScript

digunakan dalam pembuatan website agar lebih interaktif dengan

memberikan kemampuan tambahan terhadap HTML melalui eksekusi

perintah di sisi browser. JavaScript dapat merespon perintah user dengan

cepat dan menjadikan halaman web menjadi responsif.

Contoh Bahasa Pemograman JavaScript:

Gambar II.1 Contoh Bahasa Pemograman JavaScript

11

5. JQuery

Menurut Indra Yatini dalam Jurnal (2014:2), “jQuery adalah JavaScript

library yang dirancang untuk meringkas kode-kode JavaScript, sehingga

dapat menyederhanakan penulisan skrip program, sesuai dengan slogan

“write less, do more” .”

Contoh Bahasa Pemograman JQuery:

Gambar II.4 Contoh Bahasa Pemograman JQuery

C. Basis Data dan Aplikasi Basis Data

Menurut Said Mirza Fahlevi (2013:1) “Basis data (database) adalah

sekumpulan data yang saling berhubungan secara logis dan terorganisir dengan

baik. Basis data merupakan salah satu komponen utama pendukung program

aplikasi. Hampir semua program aplikasi yang melibatkan pengelolaan data dapat

dipastikan menggunakan basis data sebagai tempat penyimpanan datanya. ”

Menurut Robi Yanto (2016:5) “Basis data digunakan untuk mengatasi

permasalahan pengolahan data dengan metode pengarsipan berkas dan basis data

sangat diperlukan dalam membangun sistem informasi pada sebuah perusahaan

sehingga dengan basis data dapat meningkatkan kinerja perusahaan dan

meningkatkan daya saing perusahaan.”

Menurut Said Mirza Fahlevi (2013:12) “Program Aplikasi Basis Data

(Database Application Program) adalah program komputer yang berinteraksi

12

dengan basis data dengan cara mengirimkan perintah ke Sistem Pengelola Basis

Data. ”

1. PhpMyAdmin

Menurut Aprilita Dwiyani dalam Jurnal (2013:2) MySQL adalah salah satu

perangkat lunak Database Management System (DBMS) yang sering

digunakan saat ini, yang didistribusikan secara gratis di bawah lisensi GPL

(GNU General Public License). Sehingga setiap orang mudah untuk

mendapatkan dan bebas untuk menggunakan MySQL.

2. MySQL

Menurut Aprilita Dwiyani dalam Jurnal (2013:2) MySQL adalah salah satu

perangkat lunak Database Management System (DBMS) yang sering

digunakan saat ini, yang didistribusikan secara gratis di bawah lisensi GPL

(GNU General Public License). Sehingga setiap orang mudah untuk

mendapatkan dan bebas untuk menggunakan MySQL.

Contoh Koneksi MySQL:

Gambar II.5 Contoh Koneksi MySQL

D. Metode Pengembangan Perangkat Lunak

Metode yang digunakan pada pengembangan perangkat lunak ini

menggunakan model waterfall. Menurut Pressman dan Sommervile dalam

13

Muharto, dan Arisandy Ambarita, M.Kom. (2016), metode ini terdiri beberapa

tahapan, yaitu:

1. Analisis dan definisi kebutuhan. Layanan, batasan, dan tujuan sistem

ditentukan melalui konsultasi dengan user atau pemakai.

2. Perancangan sistem dan perangkat lunak. Proses perancangan sistem

membagi persyaratan dalam sistem perangkat keras atau perangkat lunak.

Kegiatan ini menentukan arsitektur sistem secara keseluruhan. Perancangan

melibatkan identifikasi dan deskripsi abstraksi sistem perangkat lunak

mendasar.

3. Implementasi dan pengujian unit. Pada tahap ini, perancangan perangkat

lunak direalisasikan dengan program atau unit program. Pengujian ini

melibatkan verifikasi bahwa setiap unit telah memenuhi spesifikasi.

4. Integrasi dan pengujian sistem. Unit program atau program individu

diintegrasikan dan diuji sebagai sistem yang lengkap untuk menjamin

bahwa kebutuhan sistem telah dipenuhi.

5. Operasi dan pemeliharaan, yaitu mengoperasikan program di lingkungannya

dan melakukan pemeliharaan. Baisanya ini merupakan fase siklus hidup

yang paling lama. Pemeliharaan mencakup koreksi dari berbagai error yang

tidak ditemukan pada tahap-tahap sebelumnya, melakukan perbaikan atas

implementasi unit sistem dan pengembangan layanan sistem, dan

persyaratan-persyaratan baru ditambahkan.

2.2. Teori Pendukung

A. Struktur Navigasi

14

Menurut Petrus Andre (2014), Dalam menciptakan sebuah website, hal

pertama yang harus kita lakukan adalah menentukan struktur navigasi. Struktur

Navigasi merupakan struktur atau alur dari suatu program yang merupakan

rancangan hubungan (rantai kerja) dari beberapa area yang berbeda dan dapat

membantu mengorganisasikan seluruh elemen pembuatan Website.

Macam-macam Struktur Navigasi pada Website:

1. Struktur Navigasi Linier

Struktur navigasi linier hanya mempunyai satu rangkaian cerita yang

berurut, yang menampilkan satu demi satu tampilan layar secara berurut

menurut urutannya. Tampilan yang dapat ditampilkan pada sruktur jenis ini

adalah satu halaman sebelumnya atau satu halaman sesudahnya, tidak dapat

dua halaman sebelumnya atau dua halaman sesudahnya.

Gambar II.6 contoh Struktur Navigasi Linier

2. Struktur Navigasi Non-Linier

Struktur navigasi non-linier atau struktur tidak berurut merupakan

pengembangan dari struktur navigasi linier. Pada struktur ini

diperkenankan membuat navigasi bercabang. Percabangan yang dibuat

pada struktur nonlinier ini berbeda dengan percabangan pada struktur

hirarki, karena pada percabangan nonlinier ini walaupun terdapat

percabangan, tetapi tiap-tiap tampilan mempunyai kedudukan yang sama

yaitu tidak ada Master Page dan Slave Page.

15

Gambar II.7 contoh Struktur Navigasi Non-Linier

3. Struktur Navigasi Hirarki

Struktur navigasi hirarki biasa disebut struktur bercabang, merupakan suatu

struktur yang mengandalkan percabangan untuk menampilkan data

berdasarkan kriteria tertentu. Tampilan pada menu pertama akan disebut

sebagai Master Page (halaman utama pertama), halaman utama ini

mempunyai halaman percabangan yang disebut Slave Page (halaman

pendukung). Jika salah satu halaman pendukung dipilih atau diaktifkan,

maka tampilan tersebut akan bernama Master Page (halaman utama kedua),

dan seterusnya. Pada struktur navigasi ini tidak diperkenankan adanya

tampilan secara linier.

Gambar II.8 contoh Struktur Navigasi Hirarki

4. Struktur Navigasi Campuran

Struktur navigasi campuran merupakan gabungan dari ketiga struktur

sebelumnya yaitu linier, non-linier dan hirarki. Struktur navigasi ini juga

biasa disebut dengan struktur navigasi bebas. Struktur navigasi ini banyak

16

digunakan dalam pembuatan website karena struktur ini dapat digunakan

dalam pembuatan website sehingga dapat memberikan ke-interaksian yang

lebih tinggi.

Gambar II.9 contoh Struktur Navigasi Campuran

B. Entity Relationship Diagram (ERD)

Menurut Rosa dan Shalahuddin (2016:50) “Permodelan awal basis data

yang paing banyak digunakan adalah menggunakan Entity Relationship Diagram

(ERD). ERD dikembangkan berdasarkan teori himpunan dalam bidang

matematika”. ERD digunakan untuk pemodelan basis data relasional. Sehingga

jika penyimpanan basis data menggunakan OODBMS maka perancangan basis

data tidak perlu menggunakan ERD. ERD memiliki beberapa aliran notasi seperti

notasi Chen (dikembangkan oleh Peter Chen), Barker (dikembangkan oleh

Richard Barker, Ian Palmer Harry Ellis), notasi Crow’s Foot, dan beberapa notasi

lain. Namun yang banyak digunakan adalah notasi dari Chen. Sebuah relasi

digunakan untuk meringkas data yang ada dalam database sehingga penggunaan

data menjadi lebih fleksibel. Penggunaan memori penyimpanannya pun lebih

efisien.

Beberapa manfaat adanya relasi adalah:

1. Penyimpanan data lebih efisien.

2. Tingkat efektivitas dan konsistensi data lebih terjamin.

17

3. Memudahkan administrator dalam memantau atau mengontrol data yang ada

dalam database.

Macam-macam relasi atau hubungan dalam database terdiri dari:

1. One To One (1-1)

Yaitu setiap baris data pada tabel pertama dihubungkan hanya ke satu baris

data pada tabel kedua

Gambar II.10 contoh ERD One To One

Sumber: Bayu Pratama

2. One To Many (1-M)

Yaitu setiap baris data dari tabel pertama dapat dihubungkan ke satu baris atau

lebih data pada tabel kedua.

Gambar II.11 contoh ERD One To Many

Sumber: Bayu Pratama

3. Many To Many (M-M)

Yaitu satu baris atau lebih data pada tabel pertama bisa dihubungkan ke satu

atau lebih baris data pada tabel kedua.

18

Gambar II.12 contoh ERD Many To Many

Sumber: Bayu Pratama

C. Logical Record Strukture (LRS)

Menurut Hasugian dan Shidiq (2012:608) memberikan batasan bahwa LRS

adalah “Sebuah model sistem yang digambarkan dengan sebuah diagram ER akan

mengikuti pola atau aturan permodelan tertentu dalam kaitannya dengan konvensi

ke LRS”. Perubahan yang terjadi yaitu mengikuti aturan-aturan sebagai berikut:

1. Setiap entitas akan diubah kebentuk kotak.

2. Sebuah atribut relasi disatukan dalam sebuah kotak bersama entitas jika

hubungan yang terjadi pada diagram ER 1:M (relasi bersatu dengan

cardinality yang paling membutuhkan referensi).

3. Sebuah relasi dipisah dalam sebuah kotak tersendiri (menjadi entitas baru)

jika tingkat hubungannya M:M (Many to Many) dan memiliki foreign key

sebagai primary key yang diambil dari kedua entitas yang sebelumnya saling

berhubungan.

Gambar II.13 contoh LRS

19

D. Implementasi dan Pengujian (Black Box Testing)

Belajar Sistem Informasi (2017:1), Pengertian Black Box Testing adalah

pengujian yang dilakukan hanya mengamati hasil eksekusi melalui data uji dan

cek fungsional perangkat lunak. Jadi analogi seperti yang kita lihat kotak hitam,

kita dapat melihat hanya penampilan luar, tanpa mengetahui apa di balik bungkus

hitamnya. Sama seperti pengujian kotak hitam, mengevaluasi hanya penampilan

eksternal (antarmuka), fungsional tanpa mengetahui apa yang sebenarnya terjadi

dalam codingan.

Tujuan Black Box Testing adalah untuk mencari kesalahan/kegagalan dalam

operasi tingkat tinggi, yang mencakup kemampuan dari perangkat lunak,

operasional/tata laksana, skenario pemakai. Fungsi dari pengujian ini berdasarkan

kepada apa yang dapat dilakukan oleh sistem. Untuk melakukan pengujian

perilaku seseorang harus mengerti lingkup dari aplikasi, solusi bisnis yang

diberikan oleh aplikasi, dan tujuan sistem dibuat.

Contoh pengujian pada aplikasi internet banking, maka pengujian yang

dilakukan adalah menjalankan aplikasi, memeriksa apakah semua fungsi pada

aplikasi berjalan dengan baik serta mengecek tampilan dari aplikasi tersebut

apakah sesuai dengan design yang sudah ditentukan atau belum.

Black Box Testing dapat menemukan error seperti:

1. Fungsi atau logika yang tidak benar

2. error interface

3. error performance

4. Kesalahan dalam struktur data atau akses database eksternal

20

Kelebihan Black Box Testing

1. Tidak perlu melihat source code secara detail

2. Mendeteksi kesalahan pengetikan / Typo

3. Mendeteksi kesalahan Design / User Interface dari sebuah software /

website

4. Menampilkan asumsi yang tidak sesuai dengan kenyataan, untuk di analisa

dan diperbaiki.

5. Seorang Tester tidak harus Programmer

Kekurangan Black Box Testing

1. Ketergantungan dengan dokumen dan design software tersebut

2. Tidak sampai level code, sehingga tester tidak mengetahui level security

dari software tersebut