6

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

2.1.1 Website

Menurut Tim EMS dalam Natopani (2017:6) “Website adalah

kumpulan halaman web yang diletakkan dalam suatu site maupun situs. Jadi di

dalam website terdapat halaman-halaman web, beserta file-file pendukungnya,

seperti gambar, video, dan file digital lain yang diletakan dalam satu tempat yang

diidentifikasi melalui nama domain (domain name) dan alamat ip (IP address).

Dan halaman web inilah yang ditulis dengan menggunakan standar Bahasa

HTML”.

Pada sebuah website terdapat beberapa komponen-komponen yang

dapat mendukung agar website tersebut dapat diakses oleh pengguna (Natopani,

2017:6-7), terdiri dari:

1. Internet

Menurut Jauhari dan Priyanto dalam Natopani (2017:6-7) “Internet adalah

jaringan global yang menghubungkan komputer-komputer diseluruh dunia.

Dengan internet, sebuah komputer bisa mengakses data yang terdapat pada

komputer lain di benua yang berbeda”.

2. Web Browser

Menurut Sidik dan Husni dalam Natopani (2017:6-7) “Browser Web adalah

software yang digunakan untuk menampilkan informasi dari server web”.

Software ini kini telah dikembangkan dengan menggunakan user interface

grafis, sehingga pemakai dapat dengan melakukan „point dan click’ untuk

pindah antar dokumen.

7

3. Web Server

Menurut Sidik dan Husni dalam Natopani (2017:6-7) “Web Server dapat

diartikan sebagai perangkat lunak yang dijalankan di sistem operasi pada

komputer server maupun desktop, yang berfungsi untuk menerima

permintaan (request) dalam bentuk protokol pada jaring komputer. Umumnya

protokol yang digunakan adalah HTTP (Hyper Text Transfer Protocol

Secure). Request dari client tersebut kemudian dibalas (reply) dengan cara

mengirimkan hasil permintaan tersebut melalui web browser. Protokol sendiri

di dalam jaringan komputer merupakan aturan dan standar baku untuk proses

komunikasi, hubungan, dan transfer data antar komputer pada jaringan”.

2.1.2 Sistem Informasi Geografis

Menurut Minarni dan Yusdi (2015:32) “Sistem Informasi Geografis

(SIG) merupakan sistem infomasi berbasis komputer yang merupakan

penggabungan antara unsur peta (geografis) dan informasi tentang peta tersebut

(data atribut), yang dirancang untuk mendapatkan, mengolah, memanipulasi,

analisis, memperagakan dan menampilkan data spasial untuk menyelesaikan

perencanaan, mengolah dan meneliti permasalahan”.

Menurut Minarni dan Yusdi (2015:32), menyimpulkan bahwa:

SIG merupakan suatu sistem informasi yang menekankan pada unsur

“informasi geografis”. Istilah informasi geografis mengandung

pengertian informasi mengenai tempat-tempat yang terletak di

permukaan bumi, dan informasi mengenai keteranganketerangan

(atribut) yang terdapat di permukaan bumi yang posisinya diberikan dan

diketahui. SIG membantu manusia untuk memahami “dunia nyata”

dengan melakukan proses-proses manipulasi dan presentasi data yang

direalisasikan dengan lokasi-lokasi geografis di permukaan bumi.

Sistem komputer untuk SIG terdiri dari perangkat keras (hardware),

perangkat lunak (software) dan prosedur untuk penyusunan input data,

pengolahan, analisis, pemodelan (modelling), dan penayangan data geospatial.

8

Pada SIG ini terdapat suatu sumber data geospatial (Minarni dan Yusdi,

2015:32), terdiri dari:

1. Peta Digital

2. Foto Udara

3. Citra Satelit

4. Tabel Statistik

5. Dokumen lain yang berhubungan.

Data geospatial dibedakan menjadi data grafis (atau disebut juga

data geometris) dan data atribut (data tematik). Data grafis mempunyai tiga

elemen : titik (node), garis (arc) dan luasan (poligon) dalam bentuk vektor

ataupun raster yang mewakili geometri topologi, ukuran, bentuk, posisi dan arah.

Menurut Minarni dan Yusdi (2015:32) “Fungsi user adalah untuk

memilih informasi yang diperlukan, membuat standar, membuat jadwal

pemutakhiran (updating) yang efisien, menganalisa hasil yang dikeluarkan untuk

kegunaan yang diinginkan dan merencanakan aplikasi. SIG memudahkan dalam

melihat fenomena kebumian dengan perspektif yang lebih baik”.

2.1.3 Google Map API

Menurut Minarni dan Yusdi (2015:33) “Google Map adalah sebuah jasa

peta global virtual gratis dan online yang disediakan oleh Google dan dapat

ditemukan di http://maps.google.com. Google Map memberikan layanan untuk

menunjukkan jalan-jalan yang ada di seluruh dunia. Bentuknya seperti peta yang

umum, tetapi Google Map hanya menunjukkan jalan-jalan saja, dan tidak ada

nama gunung, sungai, ataupun batas-batas daerah yang biasa ditemukan di peta

umum. Walaupun begitu, peta yang ada di Google Map ini sangat lengkap. Untuk

kota-kota besar, Google Map juga menampilkan nama-nama jalan dan gedung.

Selain dalam bentuk peta, Google Map juga bisa menampilkan dalam bentuk foto

satelit”.

9

Menurut Minarni dan Yusdi (2015:33), berikut adalah fasilitas dari

Google Map:

1. Legenda

Legenda (legend) adalah keterangan tentang obyek-obyek yang ada di peta,

seperti warna hijau adalah hutan, garis merah adalah jalan, simbol buku

adalah universitas, dan sebagianya.

2. Zoom in/out

Peta di layar dapat diperbesar dengan zoom in dan diperkecil dengan zoom

out.

3. Pan

Dengan fasilitas pan peta dapat digeser- geser untuk melihat daerah yang

dikehendaki.

4. Kemampuan untuk mengubah tampilan dari peta jalan ke tampilan satelit

maupun hybrid view dan akan mengkombinasikan tampilan satelit dengan

nama jalan dan bangunan.

5. Search Bar yang berguna mencari suatu lokasi secara cepat.

6. Mencari arah jalan dengan mudah dan secara otomatis akan ditampilkan rute

perjalannannya.

7. Bisa memilih tampilan full screen ketika membuka peta jalan.

8. Bisa menyimpan lokasi-lokasi favorit anda dan menandainya sehingga bisa

kembali menemukannya dengan mudah.

9. Bisa dengan mudah mengambil koordinat dari sebuah lokasi yang pilih.

10

Sumber: Google Maps Layer (https://seefurther.withgoogle.com)

Gambar II.1. Google Maps Layer

Google Map API merupakan fungsi pemrograman yang disediakan oleh

Google Map, dengan demikian Google API tersebut memudahkan agar Google

Map bisa diintegrasikan kedalam web atau aplikasi. Google Map API ini,

merupakan salah satu aplikasi interface yang dapat diakses lewat javascript agar

Google Map dapat ditampilkan pada sebuah halaman web (Minarni dan Yusdi,

2015:33).

Menurut Minarni dan Yusdi (2015:33) menyimpulkan bahwa:

Pada Google Maps JavaScript API versi 2, untuk dapat mengakses

Google Map pada sebuah halaman web diperlukan Google API Key.

API Key adalah sederetan kode sebagai izin untuk menampilkan Google

Map pada sebuah halaman web. Namun untuk versi 3 tidak

memerlukan API Key, tetapi pihak google menganjurkan menggunakan

API Key untuk mempermudah mengontrol Google Maps API. API Key

bersifat tunggal, hanya berlaku untuk sebuah URL.

Menurut Minarni dan Yusdi (2015:33) “Salah satu syarat untuk

mendapatkan API Key adalah mempunyai akun google/Gmail untuk men-generate

domain atau URL web pada link https://code.google.com/apis/console/. API Key

bersifat gratis sampai batas 25.000 pengunjung per hari. Jika melebihi 25.000

pengunjung per hari maka diperlukan membeli kuota tambahan”.

11

2.1.4 XAMPP

Menurut Buana(2014:4) “XAMPP adalah perangkat lunak open source

yang bisa diunggah secara gratis dan bias dijalankan di semua sistem operasi

seperti Windows, Linux, Solaris dan Mac. XAMPP ini sendiri dibuat dan

dikembangkan oleh Apache Friends Perangkat lunak tersebut berisi beberapa

kumpulan perangkat lunak yang dibutuhkan, antara lain PHP, Apache, MySQL,

dan PHPMyAdmin. Dengan melakukan instalasi XAMPP, maka semua perangkat

lunak yang dibutuhkan sudah terinstal di hardisk, termasuk file-file yang

dibutuhkan”.

Xampp sendiri semakin waktu semakin berkembang, dimana setiap

perubahan versi, dibuat lebih baik dan lebih lengkap dari versi sebelumnya.

1. PHP

Menurut Buana (2014:1) “PHP merupakan Bahasa pemrograman yang paling

sering digunakan oleh programming web karena merupakan pemrograman

opensource, sehingga para programming tidak perlu membeli lisensi untuk

membuat aplikasi web”. Rasmus Lerdoft merupakan orang yang membuat

PHP pada tahun 1995. Pada waktu itu, nama PHP adalah FI (Form

Interpreted) yang merupakan sekumpulan script, digunakan untuk mengolah

data form dari web. Pada perkembangan berikutnya, Rasmus akhirnya

melepas kode sumber tersebut dan diberi nama PHP (Personal Home Page).

Dengan berubahnya kode program menjadi opensource, maka banyak

programmer tertarik dalam perkembangan PHP.

2. PHPMyAdmin

Menurut Buana (2014:2), “phpMyAdmin adalah salah satu aplikasi yang

digunakan untuk memudahkan dalam melakukan pengelolaan database

MySQL. phpMyAdmin merupakan aplikasi web yang bersifat opensource.”

12

3. MySQL

Menurut Buana (2014:2), “MySQL Merupakan database server yang paling

sering digunakan dalam pemograman PHP. MySQL digunakan untuk

menyimpan data dalam database dan memanipulasi data-data yang

diperlukan. Manipulasi data tersebut berupa menambah, mengubah, dan

menghapus data yang berada dalam database”.

2.1.5 Sublime Text

Menurut Supono dan Putratama (2016:14), menyimpulkan bahwa:

Sublime text merupakan perangkat lunak text editor yang digunakan untuk membuat atau meng-edit suatu aplikasi. Sublime text mempunyai

fitur plugin tambahan yang memudahkan programmer. Selain itu,

Sublime Text juga memiliki desain yang simpel dan keren menjadikan

Sublime Text terkesan elegan untuk sebuah syntax editor. Selain ringan,

IDE ini memiliki kecepatan proses simpan dan buka file. Tidak heran

kalau IDE ini paling banyak digunakan tertma di kalangan programmer

berbasis web.

Jadi dapat disimpulkan bahwa sublime text ialah teks editor yang

digunakan untuk membuat program aplikasi yang secara otomatis untuk

mempermudah programmer dalam mengetikkan kode editor.

2.1.6 Prototype

Menurut Wanda (2014), menyimpulkan bahwa:

Prototyping perangkat lunak (software prototyping) atau siklus hidup

menggunakan protoyping (life cycle using prototyping) adalah salah

satu metode siklus hidup sistem yang didasarkan pada konsep model

bekerja (working model). Tujuannya adalah mengembangkan model

menjadi sistem final. Artinya sistem akan dikembangkan lebih cepat

dari pada metode tradisional dan biayanya menjadi lebih rendah. Ada

banyak cara untuk memprotoyping, begitu pula dengan penggunaannya.

Ciri khas dari metodologi ini adalah pengembang sistem (system

developer), klien, dan pengguna dapat melihat dan melakukan

eksperimen dengan bagian dari sistem komputer dari sejak awal proses

pengembangan.

13

Dengan prototype yang terbuka, model sebuah sistem (atau bagiannya)

dikembangkan secara cepat dan dipoles dalam diskusi yang berkali-kali dengan

klien. Model tersebut menunjukkan kepada klien apa yang akan dilakukan oleh

sistem, namun tidak didukung oleh rancangan desain struktur yang mendetil. Pada

saat perancang dan klien melakukan percobaan dengan berbagai ide pada suatu

model dan setuju dengan desain final, rancangan yang sesungguhnya dibuat tepat

seperti model dengan kualitas yang lebih bagus.

Protoyping membantu dalam menemukan kebutuhan di tahap awal

pengembangan, terutama jika klien tidak yakin dimana masalah berasal. Selain itu

protoyping juga berguna sebagai alat untuk mendesain dan memperbaiki user

interface bagaimana sistem akan terlihat oleh orang-orang yang menggunakannya.

Menurut Wanda (2014), terdapat tahapan-tahapan pada metode

prototyping, terdiri dari:

1. Pengumpulan Kebutuhan

Pengumpulan kebutuhan Pelanggan dan pengembang bersama-sama

mendefinisikan format seluruh perangkat lunak, mengidentifikasikan semua

kebutuhan, dan garis besar sistem yang akan dibuat.

2. Membangun prototyping

Membangun prototyping dengan membuat perancangan sementara yang

berfokus pada penyajian kepada pelanggan (misalnya dengan membuat input

dan format output).

3. Evaluasi protoptyping

Evaluasi ini dilakukan oleh pelanggan apakah prototyping yang sudah

dibangun sudah sesuai dengan keinginan pelanggan. Jika sudah sesuai maka

14

langkah 4 akan diambil. Jika tidak prototyping direvisi dengan mengulang

langkah 1, 2 , dan 3.

4. Mengkodekan sistem

Dalam tahap ini prototyping yang sudah di sepakati diterjemahkan ke dalam

bahasa pemrograman yang sesuai.

5. Menguji sistem

Setelah sistem sudah menjadi suatu perangkat lunak yang siap pakai, harus

dites dahulu sebelum digunakan. Pengujian ini dilakukan dengan White Box,

Black Box, Basis Path, pengujian arsitektur dan lain-lain.

6. Evaluasi Sistem

Pelanggan mengevaluasi apakah sistem yang sudah jadi sudah sesuai dengan

yang diharapkan. Jika ya, langkah 7 dilakukan; jika tidak, ulangi langkah 4

dan 5.

7. Menggunakan sistem

Perangkat lunak yang telah diuji dan diterima pelanggan siap untuk

digunakan.

Sumber: Wanda (2014)

Gambar II.2. Model Prototyping

15

2.2. Teori Pendukung

2.2.1 Struktur Navigasi

Menurut Binanto dalam Natopani (2017:12) mengemukakan bahwa

“Setiap rencana akan dibuat desainnya dan kemudian diproduksi menjadi produk

jadi yang bersifat sementara. Di samping itu tahap ini mencakup perencanaan

struktur navigasi yang baik untuk antarmuka penggunanya. Ada 4 struktur dasar

yang digunakan yaitu linier, non linier, hirarki dan komposit”.

Berikut di bawah ini empat struktur yang terdapat pada struktur

navigasi (Natopani, 2017:12), terdiri dari:

1. Struktur Navigasi Linier

Pengguna akan melakukan navigasi secara berurutan, dari frame atau byte

informasi yang satu ke yang lainnya.

Sumber: Binanto dalam Natopani (2017:12)

Gambar II.3. Struktur Navigasi Linier

2. Struktur Navigasi Hirarki

Struktur dasar ini disebut juga struktur linier dengan percabangan karena

pengguna melakukan navigasi disepanjang cabang pohon struktur yang

terbentuk oleh logika isi.

Sumber: Binanto dalam Natopani (2017:12)

Gambar II.4. Struktur Navigasi Hirarki

16

3. Struktur Navigasi Tidak Berurut (Non-Linier)

Pengguna akan melakukan navigasi dengan jelas melalui isi proyek dengan

tidak terikat dengan jalur yang sudah ditentukan sebelumnya.

Sumber: Binanto dalam Natopani (2017:12)

Gambar II.5. Struktur Navigasi Non-Linier

4. Struktur Navigasi Campuran (Composite)

Pengguna akan melakukan navigasi dengan bebas (secara non-linier), tetapi

terkadang dibatasi prestasi linier film atau informasi penting dan pada data

yang paling terorganisasi secara logis pada suatu hirarki.

Sumber: Binanto dalam Natopani (2017:12)

Gambar II.6. Struktur Navigasi Composite

2.2.2 Entity Relationship Diagram

Menurut Mulyani (2016:100) “Salah satu tools diagram yang digunakan

untuk memodelkan konseptual (abstraksi) data adalah Entity Relationship

Diagram (ERD). Diagram ini sangat populer dan banyak digunakan oleh para

pengembang sistem dalam memodelkan data”.

Menurut Bagui dan Erap dalam Mulyani (2016:100) “ERD adalah tools

yang digunakan untuk melakukan pemodelan data secara abstrak dengan tujuan

17

untuk mendeskripsikan atau menggambarkan struktur dari data yang akan

digunakan”. ERD berfungsi untuk memodelkan struktur data dan hubungan antar

data, untuk menggambarkannya digunakan beberapa notasi dan simbol. Pada

dasarnya ada tiga komponen yang digunakan, terdiri dari:

1. Entity (Entitas)

Entity merupakan objek yang mewakili sesuatu yang nyata dan dapat

dibedakan dari sesuatu yang lain. Simbol dari entity ini biasanya digambarkan

dengan persegi panjang.

2. Atribut

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. Gambar atribut diwakili oleh simbol elips.

3. Hubungan atau Relasi

Hubungan antara sejumlah entitas yang berasal dari himpunan entitas yang

berbeda. Relasi dapat digambarkan dengan melihat relasi yang terjadi

diantara dua himpunan entitas (misalnya A dan B) dalam satu basis data,

yaitu:

18

a. Satu ke satu (One to one)

Hubungan relasi satu ke satu yaitu setiap entitas pada himpunan entitas A

berhubungan paling banyak dengan satu entitas pada himpunan entitas B.

b. Satu ke banyak (One to many)

Setiap entitas pada himpunan entitas A dapat berhubungan dengan banyak

entitas pada himpunan entitas B, tetapi setiap entitas pada entitas B dapat

berhubungan dengan satu entitas pada himpunan entitas A.

c. Banyak ke banyak (Many to many)

Setiap entitas pada himpunan entitas A dapat berhubungan dengan banyak

entitas pada himpunan entitas B.

2.2.3 Logical Record Structure

Menurut Simarmata dan Paryudi dalam Fridayanthie dan Mahdiati

(2016:132-133) “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).

Berdasarkan Entity Relationship Diagram cara membentuk skema

database atau LRS (Fridayanthie dan Mahdiati, 2016:133), sebagai berikut:

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.

19

2.2.4 Implementasi dan Pengujian Web

Menurut Natopani (2017:18) “Pengujian perangkat lunak adalah elemen

sebuah topik yang memiliki cakupan luas dan sering dikaitkan dengan verifikasi

(verification) dan validasi (validation)”.

Verifikasi lebih mengarah terhadap apakah proses pengembangan

produk sudah benar dan telah berhasil mengimplementasikan fungsi yang benar,

sedangkan validasi lebih kearah hasil produk apakah sudah selesai dengan yang

diinginkan.

Menurut Natopani (2017:18-19) Pengujian untuk validasi adalah

sebagai berikut:

1. Black-Box Testing (Pengujian Kotak Hitam)

Menurut Rosa dan Shalahuddin dalam Natopani (2017:19) ”Black-Box

Testing adalah menguji perangkat lunak dari segi spesifikasi fungsional tanpa

menguji desain dan kode program”.

Pengujian yang dimaksudkan untuk mengetahui apakah fungsi-fungsi,

masukan, dan keluaran dari perangkat lunak sesuai dengan spesifikasi yang

dibutuhkan. Pengujian kotak hitam dilakukan dengan membuat kasus uji yang

bersifat mencoba semua fungsi dengan memakai perangkat lunak apakah 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:

1. Jika user memasukkan nama pemakai (username) dan kata sandi (password)

yang benar.

20

2. 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.