BAB II
LANDASAN TEORI
2.1 E-tourism
E-tourism merupakan konsep pemanfaatan teknologi informasi dan komunikasi guna meningkatkan bidang pariwisata, memberikan layanan pariwisata kepada konsumen dan menjadikan pemasaran pariwisata lebih mudah di akses (Marselin, 2008).
Dengan adanya pemasaran e-tourism melalui online ini wisatawan akan lebih mudah untuk melakukan kunjungan wisata dan memeberikan keringanan karena cukup akses internet wisatawan mendapatkan informasi wisata wilayah Indramayu dan booking tiket wisata terlebih dahulu tanpa harus datang langsung ke tempatnya.
2.2 Website
Website adalah kumpulan halaman yang menampilkan berbagai macam informasi teks, data, gambar diam ataupun bergerak, data animasi, suara, video maupun gabungan dari semuanya, baik itu yang bersifat statis maupun yang dinamis, yang dimana membentuk satu rangkaian bangunan yang saling berkaitan dimana masing-masing dihubungkan dengan jaringan halaman atau hyperlink.
Halaman website biasanya berupa dokumen yang ditulis dalam format Hyper Text Markup Language (HTML), yang bisa diakses melalui HTTP, HTTP adalah suatu protokol yang menyampaikan berbagai informasi dari server website untuk ditampilkan kepada para user atau pemakai melalui web browser (Sora, 2014).
2.3 HTML
HTML adalah script yang digunakan dalam pembuatan aplikasi e-tourism, karena aplikasi ini berbasis web. Penjelasan HTML akan dibahas pada subbab berikut.
2.3.1 Definisi HTML (Hyper Text Markup Language)
HTML yang merupakan singkatan dari Hyper Text Markup Language adalah serangkaian kode program yang merupakan dasar dari representasi visual sebuah
halaman Web. Didalamnya berisi kumpulan informasi yang disimpan dalam tag- tag tertentu, dimana tag-tag tersebut digunakan untuk melakukan format terhadap informasi yang dimaksud. Berbagai pengembangan telah dilakukan terhadap kode HTML dan telah melahirkan teknologi-teknologi baru di dalam dunia pemrograman web. Kendati demikian, sampai sekarang HTML tetap berdiri kokoh sebagai dasar dari bahasa web seperti PHP, ASP, JSP dan lainnya. Bahkan secara umum, mayoritas situs web yang ada di Internet pun masih tetap menggunakan HTML sebagai teknologi utama mereka (Constantianus, 2005).
2.3.2 Pengenalan Dasar HTML
Dalam Script HTML terdapat tag, elemen dan atribut. Dalam penyimpanan file HTML menggunakan format text reguler dan mengandung tag.
1. Elemen HTML
Element merupakan bagian utuh dari yang mencakup tag,atribut dan elemen.
Komponen-komponen dasar pembentuk dokumen html yang terdiri dari tiga bagian yaitu tag pembuka, isi dan tag penutup.
Gambar 2. 1 Penulisan Elemen HTML
Tag HTML berfungi untuk memberitahu browser bagaimana teks di dalamnya harus ditampilkan. Kebanyakan tag-tag dalam HTML ditulis secara berpasangan yang diawali “< dan >” disini dinamakan tag pembuka dan diakhiri “</ dan >
merupakan tag penutup .
2. Atribut HTML
Atribut adalah bagian dari elemen yang melengkapi elemen tersebut. Atribut dibuat dalam elemen manapun. Letak penulisan atribut berada di dalam tag pembuka letak penulisan atribut berada di dalam tag pembuka. Format penulisannya nama-atribut=“nilainya”. Nilai atribut dapat anda apit dengan petik ganda (“) maupun tunggal (‘) ( Dian, 2016).
2.4 PHP (Hypertext Preprocessor)
PHP singkatan dari Hypertext Prepocessor. PHP adalah salah satu bahasa pemrograman open source yang sangat cocok atau dikhususkan untuk pengembangan web dan dapat ditanamkan pada sebuah skripsi HTML. PHP dapat dikatakan menggambarkan beberapa bahasa pemrograman seperti C, Java, dan Perl serta mudah untuk dipelajari. PHP merupakan bahasa scripting server – side, dimana pemrosesan datanya dilakukan pada sisi server. Adapun pengertian lain PHP adalah akronim dari Hypertext Preprocessor, yaitu suatu bahasa pemrograman berbasiskan kode-kode (script) yang digunakan untuk mengolah suatu data dan mengirimkannya kembali ke web browser menjadi kode HTML” (Firman, 2016).
Berikut Gambar contoh sintaks PHP.
Gambar 2. 2 Sintaks PHP
PHP mempunyai jenis/tipe data yang sering digunakan , diantaranya:
a. Integer, merupakan tipe data PHP berupa bilangan bulat. Tipe data ini sering sekali digunakan pada pemerograman PHP khususnya yang berkaitannya dengan bilangan bulat.
b. Float, dapat di katakan juga bilangan berkoma (,) tapi dalam pemrogramannya tidak menggunakan koma melainkan titik (.).
c. String, merupakan tipe data berupa karakter. Didalamnya bisa berupa teks, atau kata.
d. Boolean, merupakan tipe data yang bisa bernilai True atau False. Tipe data boolean biasanya digunakan untuk logika, sepertipada pada kondisi if atau looping (pengulangan).
e. Array, merupakan kumpulan dari tipe data, didalamnya memiliki banyak nilai. Jadi dapat dikatakan array merupakan tipe data yang terdiri darikumpulan tipe data.
f. Objek, tipe data objek dapat berupa bilangan, fungsi, maupun variabel. Tipe data ini digunakan supaya programer terbiasa dengan Objek Oriented Programing (OOP). Sehingga data yang dimasukan pada srcript program dapat diringkas.
2.5 CSS (Cascading Style Sheet)
CSS merupakan aturan mengendalikan beberapa komponen dalam sebuah web sehingga akan lebih terstruktur pada umumnya CSS dipakai untuk memformat tampilan halaman web yang dibuat dengan bahasa HTML dan XHTML.CSS adalah bahasa style sheet yang digunakan untuk mengatur tampilan dokumen. Dengan adanya CSS untuk menampilkan halaman yang sama dengan format yang berbeda (Binarso, 2012).
CSS memiliki dua jenis sifat yaitu internal dan eksternal. Jenis tersebut adalah sebagai berikut.
1. Internal, CSS yang dibuat disisipkan ke dalam file kode HTML.
2. Eksternal, pembuatan kode CSS dan HTML dilakukan secara terpisah. Artinya membuat satu file CSS dan file CSS tersebut dapat dipanggil berulang-ulang kali untuk dihubungkan dengan file HTML (melalui linked).
CSS mempunyai tiga struktur kode dasar untuk memper indah tampilan web yaitu selektor, blok deklarasi, properti dan nilainya. Berikut contoh struktur kode dasar CSS dilihat pada Gambar 2.3.
Gambar 2. 3 Contoh Struktur Kode Dasar CSS
1. Selektor, adalah kata kunci untuk memilih elemen HTML yang akan di atur 2. Blok Deklarasi, adalah tempat kita menuliskan atribut-atibut CSS yang
akan diberikan ke selektor.
3. Nilai Properti, merupakan atribut atau sekumpulan aturan yang akan diberikan kepada elemen yang dipilih.
2.6 MYSQL
Gambar 2. 4 Logo MySQL
MySQL adalah Relational Database Management System (RDBMS) yang didistribusikan secara gratis dibawah lisensi GPL (General Public License).
Dimana setiap orang bebas untuk menggunakan MySQL, namun tidak boleh dijadikan produk turunan yang bersifat komersial. MySQL sebenarnya merupakan turunan salah satu konsep utama dalam database sejak lama, yaitu SQL (Structured Query Language) (Ramdhani, 2013).
2.7 Java Script
Java Script pada awalnya diciptakan untuk menangani validasi dari sebuah formulir dalam website yang sebelumnya ditugaskan pada bahasa pemograman server seperti Perl. Namun dengan berkembangnya zaman JavaScript menjadi pemain penting dalam perkembangan teknologi website (Winarno, 2014).
JavaScript adalah bahasa scripting yang dibuat untuk berinteraksi dengan halaman website dan dibuat dengan tiga bagian :
1. ECMAScript, yang didefinisikan dalam ECMA-262 dan menjadi bagian utama dalam menjalankan fungsionalitas.
2. Document Object Model (DOM), yang menyediakan method dan interface untuk bekerja dengan isi dari halaman website.
3. Browser Object Model (BOM), yang menyediakan method dan interfaces untuk berinteraksi dengan browser. Berikut Contoh Script dari Java Script 1. <!DOCTYPE html>
2. <html>
3. <head>
4. <title>javascript</title>
5. <script type="text/javascript">
6. alert("Hello I am Javascript");
7. </script>
8. </head>
9. <body>
10. </body>
11. </html>
2.8 Boostrap
Boostrap merupakan framework HTML dan CSS yang berfungsi untuk situs web dan aplikasi web. Bootstrap berisi HTML dan CSS desain berbasis template
untuk tipografi, bentuk, tombol, navigasi dan komponen antarmuka lainnya, serta opsional JavaScript ekstensi. Hal ini bertujuan untuk memudahkan dalam pengembangan dari website dinamis dan aplikasi web (Kurniawan, 2018). Berikut contoh dikrektori boostrap dilihat pada Gambar 2.5.
Gambar 2. 5 Direktori Boostrap 2.9 Balsamiq Mockup
Menurut (Hanafiyah, 2015) “Balsamiq Mockups adalah salah satu software yang digunakan dalam pembuatan desain dalam pembuatan tampilan user interface dari sebuah aplikasi. Dengan menggunakan Balsamiq Mockup dalam pembuatan user interface akan menjadi mudah karena Balsamiq Mockup menyediakan tools yang dapat memudahkan dalam membuat desain prototyping aplikasi yang akan dibuat”. Berikut komponen user interface balsamiq Mockup dapat dilihat pada Gambar 2.6.
Gambar 2. 6 Balsamiq Mockup
2.10 Sublime Text
Gambar 2. 7 Sublime Text
Sublime Text merupakan teks editor berbagai jenis bahasa pemrograman diantaranya adalah PHP Sublime Text Editor merupakan editor text lintas-platform dengan Python application programming interface (API). Sublime Text editor menyediakan plugin untuk mempermudah Developer dalam menulis sebuah kode untuk menghemat waktu (Media, 2017).
Ada beberapa fitur dalam sublime sebagai berikut.
1. Goto Anything
Fitur yang sangat membantu dalam membuka file ataupun menjelajahi isi dari file hanya dengan beberapa keystrokes.
2. Multiple Selections
Fitur ini memungkinkan user untuk mengubah secara interaktif banyak baris sekaligus, mengubah nama variabel dengan mudah, dan memanipulasi file lebih cepat dari sebelumnya.
3. Command Pallete
Dengan hanya beberapa keystorkes, user dapat dengan cepat mencari fungsi yang diinginkan, tanpa harus menavigasi melalui menu.
4. Distraction Free Mode
Bila user memerlukan fokus penuh pada aplikasi ini, fitur ini dapat membantu user dengan memberikan tampilan layar penuh.
5. Split Editing
Dapatkan hasil yang maksimal dari monitor layar lebar dengan dukungan editing perpecahan. Mengedit sisi file dengan sisi, atau mengedit dua lokasi di satu file. Anda dapat mengedit dengan banyak baris dan kolom yang user inginkan.
6. Instant Project Switch
Menangkap semua file yang dimasukkan kedalam project pada aplikasi ini.
Terintegrasi dengan fitur Goto Anything untuk menjelajahi semua file yang ada ataupun untuk beralih ke file dalam project lainnya dengan cepat.
7. Plugin API
Dilengkapi dengan plugin API berbasis Phyton sehingga membuat aplikasi ini sangat tangguh.
8. Customize Anything
Aplikasi ini memberikan user fleksibilitas dalam hal pengaturan fungsional dalam aplikasi ini.
2.11 UML(Unified Modelling Language)
Unified Modeling Language (UML) adalah bahasa pemodelan visual yang digunakan untuk menspesifikasikan, memvisualisasikan, membangun, dan mendokumentasikan rancangan dari suatu sistem perangkat lunak. Pemodelan memberikan gambaran yang jelas mengenai sistem yang akan dibangun baik dari sisi struktural ataupun fungsional.
UML dapat diterapkan pada semua model pengembangan, tingkatan siklus sistem, dan berbagai macam domain aplikasi. Dalam UML terdapat konsep semantik, notasi, dan panduan masing-masing diagram. UML juga memiliki bagian statis, dinamis, ruang lingkup, dan organisasional. UML bertujuan menyatukan teknik-teknik pemodelan berorientasi objek menjadi terstandarisasi (Akil, 2016).
A. Class Diagram
Class diagram adalah sebuah class yang menggambarkan struktur dan penjelasan class, paket, dan objek serta hubungan satu sama lain seperti containment, pewarisan, asosiasi, dan lain-lain. Class diagram juga menjelaskan hubungan antar class dalam sebuah sistem yang sedang dibuat dan bagaimana
Class diagram memiliki 3 area pokok (utama) yaitu : nama,atribut,dan operasi. Nama berfungsi untuk member identitas pada sebuah kelas, atribut fungsinya adalah untuk member karakteristik pada data yang dimiliki suatu objek di dalam kelas, sedangkan operasi fungsinya adalah memberikan sebuah fungsi ke sebuah objek (lyananur, 2014). Berikut contoh classs diagram dapat dilihat pada Gambar 2.8
Gambar 2. 8 Class Diagram Tabel 2. 1 Komponen Class diagram
Simbol Keterangan
Generalization. Hubungan dimana objek anak (descendent) berbagi perilaku dan struktur data dari objek yang ada di atasnya objek induk (ancestor).
Nary Association. Upaya untuk menghindari asosiasi dengan lebih dari 2 objek.
Class. Himpunan dari objek-objek yang berbagi atribut serta operasi yang sama.
Simbol Keterangan
Collaboration. Deskripsi dari urutan aksi-aksi yang ditampilkan sistem yang menghasilkan suatu hasil yang terukur bagi suatu Actor.
Realization. Operasi yang benar-benar dilakukan oleh suatu objek.
Dependency. Hubungan dimana perubahan yang terjadi pada suatu elemen mandiri (independent) akan mempegaruhi elemen yang bergantung padanya elemen yang tidak mandiri.
Association. Apa yang menghubungkan antara objek satu dengan
objek lainnya Sumber : (Nugraha. A, 2009) A. Use Case Diagram
Use case Diagram merupakan salah jenis diagram pada UML yang menggambarkan interaksi antara sistem dan aktor. Berikut contoh Usecase Diagram bisa dilihat pada Gambar 2.9.
Use case Diagram mempunyai relasi yang digunakan berikut gambar
penjelasan komponen Use case Diagram.
Tabel 2. 2 Komponen Use case Diagram
Simbol Keterangan
Actor. Menspesifikasikan himpunan peran yang pengguna mainkan ketika berinteraksi dengan Usecase .
Dependency. Pada suatu elemen mandiri atau independent akan mempengaruhi elemen yang bergantung padanya elemen yang tidak mandiri atau independent.
Generalization. Hubungan dimana objek anak (descendent) berbagi perilaku dan struktur data dari objek yang ada di atasnya objek induk (ancestor).
Note. Elemen fisik yang eksis saat aplikasi dijalankan dan mencerminkan suatu sumber daya komputasi.
Usecase. Deskripsi dari urutan aksi-aksi yang ditampilkan sistem yang menghasilkan suatu hasil yang terukur bagi suatu Actor.
Extend. Menspesifikasikan bahwa Usecase target memperluas perilaku dari Usecase sumber pada suatu titik yang diberikan.
Association. Apa yang menghubungkan antara objek satu dengan objek lainnya.
Sumber : (Nugraha. A, 2009)
B. Activity Diagram
Activity Diagram atau Diagram aktivitas adalah bentuk visual dari alur kerja
yang berisi aktivitas dan tindakan, juga dapat berisi pilihan, atau pengulangan.
Dalam Unified Modeling Language(UML), diagram aktivitas dibuat untuk menjelaskan aktivitas komputer maupun alur aktivitas dalam organisasi. Selain itu diagram aktivitas menggambarkan alur kontrol secara garis besar (Bagaskara, 2018). Berikut Gambar dari Activity Diagram dapat dilihat dari Gambar 2.10.
Gambar 2. 10 Activity Diagram
Activity Diagram mempunyai relasi yang digunakan use case berikut Gambar
dan penjelasan komponen Activity Diagram. Berikut Tabel komponen activity diagram
Tabel 2. 3 Komponen Activity Diagram.
Simbol Keterangan
Actifity. Memperlihatkan bagaimana masing- masing kelas antarmuka saling berinteraksi satu sama lain.
Action. State dari sistem yang mencerminkan eksekusi dari suatu aksi.
2.12 Flowchart
Flowchart adalah suatu bagan dengan simbol-simbol tertentu yang menggambarkan urutan proses secara mendetail dan hubungan antara suatu proses (instruksi) dengan proses lainnya dalam suatu program. Berikut ini adalah beberapa simbol yang digunakan dalam menggambar suatu flowchart bisa diihat pada Tabel 2.4.
Tabel 2. 4 Simbol Flowchart
Simbol Keterangan
Garis Alir (Flow Line), arah aliran program
Terminator, permulaan / akhir program (start/end).
Decision, perbandingan pernyataan, penyeleksian data yang memberikan pilihan untuk langkah selanjutnya.
Terminator, permulaan / akhir program (start/end).
Simbol Keterangan
Initial Node. Bagaimana objek dibentuk atau diawali.
Actifity Final Node. Bagaimana objek dibentuk dan dihancurkan.
Fork Node. Satu aliran yang pada tahap tertentu berubah menjadi beberapa aliran.
Simbol Keterangan
Preparation, proses inisialisasi / pemberian harga awal.
Proses, merupakan proses perhitungan / proses pengolahan data.
Input/Output Data, proses penginputan/output data, parameter, dan informasi.
Predefined Process (Sub Program), permulaan sub program/ proses menjalankan sub program.
On Page Connector, adalah penghubung bagian- bagian flowchart yang berada pada satu halaman.
2.13 Normalisasi Database
Normalisasi adalah suatu teknik untuk mengorganisasikan data kedalam tabel-tabel untuk memenuhi kebutuhan pemakai didalam suatu organisasi (Swara, 2016). Tujuan dari normalisasi adalah :
a. Untuk menghilangkan kerangkapan data.
b. Untuk mengurangi kompleksitas.
c. Untuk mempermudah pemodifikasian data.
Adapun proses normalisasi antara lain:
Berdasarkan tahapan normalisasi, terdapat enam bentuk normal yaitu:
1. Bentuk Normal Tahap Pertama (1st Normal Form / 1NF) 2. Bentuk Normal Tahap Kedua (2nd Normal Form / 2NF) 3. Bentuk Normal Tahap (3rd Normal Form / 3NF)
4. Boyce-Code Normal Form (BCNF)
5. Bentuk Normal Tahap (4th Normal Form / 4NF) 6. Bentuk Normal Tahap (5th Normal Form / 5NF)
2.14 Pengujian Black box Testing
Pengujian perangkat lunak merupakan tahapan untuk menemukan kesalahan- kesalahan dan kekurangan-kekurangan pada perangkat lunak yang dibangun sehingga bisa diketahui apakah perangkat lunak tersebut telah memenuhi kriteria sesuai dengan tujuan atau tidak. Adapun metode pengujian yang digunakan pada perangkatl lunak ini adalah metode black box. Pengujian black box berfokus pada persyaratan fungsional perangkat lunak (Retno Hendrowati, 2013).
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 (Arlina, 2017).
Menurut (Ariani, 2009) Black box testing dilakukan untuk dapat mengetahui 1. Fungsi yang tidak benar atau tidak ada.
2. Kesalahan antarmuka (interface errors).
3. Kesalahan pada struktur data dan akses basis data.
4. Kesalahan performansi (performance errors).
5. Kesalahan inisialisasi dan terminasi.
