7
LANDASAN TEORI
2.1. Konsep Dasar Web
Menurut Triwahyuni dan Abdul Kadir (2013:310) “World Wide Web (WWW) merupakan sumber daya internet yang sangat populer dan dapat
digunakan untuk memperoleh informasi atu bahkan melakukan transaksi pembelian”.
Web menggunakan protokol yang disebut HTTP (HyperText Transfer Protocol) yang berjalan pada TCP/IP. Dengan menggunakan HyperText, pemakai dapat melompat dari suatu dokumen ke dokumen lain dengan mudah, dengan cukup mengklik text-text khusus yang pada awalnya ditandai dengan garis bawah.
Penggunaan HyperText pada web juga telah dikembangkan lebih jauh menjadi HyperMedia. Dengan menggunakan pendekatan HyperMedia, tidak hanya text yang dapat dikaitkan, melainkan juga gambar, suara, dan bahkan video.
2.1.1. Website
Menurut Abdulloh (2016:1) menyatakan bahwa “Website adalah sekumpulan halaman yang terdiri atas beberapa laman yang berisi informasi dalam bentuk data digital, baik berupa teks, gambar, video, audio, dan animasi lainnya yang disediakan melalui jalur koneksi internet”.
Website juga merupakan halaman-halaman yang berisi informasi yang
sebagainya. Hubungan antara satu halaman web dengan yang lain disebut hyperlink, sedangkan text yang dijadikan media penghubung disebut hypertext.
A. Internet
Internet mempunyai jaringan yang besar dan luas yang saling berhubungan
dari jaringan-jaringan komputer yang menghubungkan orang-orang dan komputer-komputer diseluruh dunia, melalui telepon, satelit dan sistem-sistem komunikasi lain. Internet dibentuk oleh jutaan komputer yang terhubung bersama dari seluruh dunia, memberi jalan bagi informasi mulai dari teks, gambar, audio, video dan lainnya untuk dapat dikirim dan dinikmati bersama.
Menurut Sibero (2013:10) “Internet adalah jaringan komputer yang menghubungkan antar jaringan secara global, internet dapat juga disebut jaringan dalam suatu jaringan yang luas”.
B. Web Browser
Menurut Sibero (2013:12) mengemukakan bahwa “Web Browser adalah sebuah aplikasi perangkat lunak yang digunakan untuk mengambil dan menyajikan sumber informasi web. Sumber informasi web diidentifikasi dengan Uniform Resource Identifier (URI) yang terdiri dari halaman web, video, gambar ataupun konten lainnya”.
Sejarah web browser dimulai pada tahun 1991 saat Tim Berners-Lee membuat aplikasi web browser pertama pada komputer Next dengan nama World Wide Web Browser, kemudian di tahun 1993 NCSA (National Center
Supercomputering Application) mengembangkan browser grafis bernama
NCDSA Mosaic, yang kemudian dilanjutkan pada tahun 1994 merilis Netscape Navigator dan pada tahun 1998 berubah menjadi Mozilla Firefox.
C. Web Server
Menurut Pratama (2014:439) “Web Server merupakan perangkat lunak yang dijalankan di sistem operasi pada komputer server maupun desktop, yang berfungsi untuk menerima permintaan (request) dalam bentuk protokol, misalkan HTTP (Hyper Text Transfer Protocol) dan HTTPS (Hyper Text Transfer Protocol Secure)”.
Request tersebut kemudian dibalas (reply) dengan cara mengirimkan hasil
permintaan tersebut melalui web browser. Protokol sendiri merupakan aturan dan standar baku untuk proses komunikasi, hubungan, dan transfer data antar komputer pada jaringan.
D. Adobe Dreamweaver CS6
Menurut Wahana Komputer (2013:2) “Adobe Dreamweaver CS6 merupakan versi terbaru dari Adobe Dreamweaver CS5”. Aplikasi Adobe Dreamweaver CS6 memberikan tampilan yang lebih baik dan tentu saja semakin mudah dalam penggunaannya. Aplikasi ini mengintegrasikan beragam fitur untuk memenuhi kebutuhan pengembangan website, termasuk pembuatan halaman web dan pengelolaannya.
Adobe Dreamweaver CS6 menyetrtakan banyak tool yang berkaitan
dengan pengkodean seperti HTML, CSS, XML, dan pemrograman Client Side, yaitu javascript dengan penggunaan yang sangat mudah dan user friendly. Aplikasi ini juga mendukung pemrograman Script Server Side seperti PHP, Active Server Page (ASP), ASP.NET, ASP Java Script, Asp VB Script, Cold Fusion,
DAN Java Server Page (JSP).
E. Domain
Menurut Nilasari (2014:21) menjelaskan bahwa “Domain merupakan alamat unik di dunia maya yang digunakan untuk mengidentifikasi sebuah website.” Sebuah website dapat membeli alamat domain atau memilih alamat domain yang gratis. Sebetulnya nama domain digunakan untuk mempermudah dalam menghafalkan alamat sebuah website.
Ada pengalamatan yang berdasarkan IP. IP terdiri atas deretan angka yang dikenal dengan IP Address. Kombinasi 4 deret angka IP dimulai dari dari 0.0.0.1 sampai dengan 255.255.2555.255, sedangkan pengalamatan yang didasarkan pada domain dikenal dengan istilah DNS atau Domain Name Service. Semula nama domain hanya dapat ditulis dengan menggunakan abjad latin. Namun saat ini,
F. Hosting
Menurut Wahana Komputer (2017:2) mengemukakan bahwa “Web Hosting adalah sebuah layanan hosting internet yang dapat diakses melalui
jaringan internet”.
Perusahaan webs host menyediakan tempat di server mereka untuk disewa oleh klien, seperti sebuah pusat data. Tipe-tipe hosting sangat beragam sesuai dengan kebutuhan para penggunanya. Berikut ini beberapa tipe hosting:
1. Layanan Web Hosting Gratis
Layanan seperti ini ditawarkan oleh berbagai perusahaan dengan layanan yang terbatas, beberapa ada yang menyertakan iklan.
2. Layanan Shared Web Hosting
Sebuah website ditempatkan dalam server yang sama dengan situs lainnya. 3. Reseller Web Hosting
Klien akan menjadi pemilik web host sendiri, para reseller akan menyediakan layanan yang serupa dengan provider hosting.
2.1.2. Bahasa Pemrograman A. XAMPP
Menurut Nugroho (2013:1) menjelaskan bahwa “Xampp adalah paket program web lengkap yang dapat dipakai untuk belajar pemrograman web, khususnya PHP dan MySQL”.
Xampp fungsinya adalah sebagai server yang berdiri sendiri (localhost),
yang terdiri atas program Apache HTTP Server, MySQL database, dan penerjemah bahasa yang ditulis dengan bahasa pemrograman PHP dan Perl.
Bagian penting dari XAMPP yang biasa digunakan:
1. Htdoc adalah folder tempat meletakkan berkas-berkas yang akan dijalankan, seperti berkas PHP, HTML dan script lain.
2. PhpMyAdmin merupakan bagian untuk mengelola basis data MySQL yang ada dikomputer. Untuk membukanya, buka browser lalu ketikkan alamat http://localhost/phpMyadmin, maka akan muncul halaman phpMyAdmin.
3. Control Panel yang berfungsi untuk mengelola layanan (service) XAMPP. Seperti menghentikan (stop) layanan, ataupun memulai (start).
B. Hypertext Markup Language (HTML)
Menurut Triwahyuni dan Abdul Kadir (2013:321) “HTML adalah bahasa markah yang digunakan untuk menyusun halaman web. Kodenya berupa kumpulan tag-tag yang ditandai dengan < dan diakhiri dengan >. Tag bisa mewakili elemen di halaman web, misalkan <img> menyatakan elemen gambar serta pasangan <a> dan </a> menyatakan hyperlink”.
C. Hypertext Prepocessor (PHP)
Menurut Abdulloh (2016:3) “Hypertext Preprocessor (PHP) merupakan bahasa pemrograman yang diproses di sisi server”.
Fungsi utama PHP dalam membangun website adalah untuk melakukan pengolahan data pada database. Data website akan dimasukkan ke database, diedit, dihapus dan ditampilkan pada website yang diatur oleh PHP.
D. JavaScript
Menurut Triwahyuni dan Abdul kadir (2013:325) “JavaScript adalah bahasa pemrograman yang biasa diletakkan bersama kode HTML untuk menentukan suatu tindakan”.
Kode JavaScript disisipkan dalam halaman web menggunakan tag script dan biasanya digunakan untuk suatu kebutuhan yang bersifat client side. JavaScript digunakan pada website bertujuan agar website tersebut menjadi lebih
interaktif dan dinamis. Pengguna JavaScript pada sebuah website bersifat opsional, artinya tidak harus selalu ada. Pengguna kode JavaScript sangat dibutuhkan untuk membangun website yang berorientasi pada kenyamanan pengguna (user-experience).
E. Jquery
Menurut Abdulloh (2016:147) mengemukakan bahwa “Jquery merupakan salah satu dari sekian banyak javascript library yaitu kumpulan fungsi javascript yang siap pakai, sehingga mempermudah dan mempercepat kita dalam membuat kode javascript”.
Jquery pertama kali dirilis tahun 2006 oleh John Resig. Jquery tidak hanya
javascript untuk membuat suatu website lebih interaktif. Jquery telah digunakan
oleh banyak website besar seperti google, amazone, facebook, twitter, dan lain sebagainya.
Kelebihan-Kelebihan JQuery antara lain : 1. JQuery kompatibel dengan banyak browser. 2. JQuery mendukung semua versi CSS. 3. Ukuran Jquery sangat kecil, sekitar 20kb. 4. Dokumentasi JQuery yang lengkap. 5. Dukungan komunitas terhadap JQuery.
6. Tersedianya plugin Jquery yang sangat beragam.
F. Cascading Style Sheet (CSS)
Menurut Triwahyuni dan Abdul Kadir (2013:323) “CSS adalah kode yang dimaksudkan untuk mengatur tampilan halaman web”.
Sebagai contoh, CSS dapat dipakai untuk: 1. Mengatur jenis font maupun ukurannya.
2. Menentukan warna latar belakang halaman web. 3. Memberi bingkai pada elemen HTML.
4. Mengatur ukuran gambar.
CSS dipelihara oleh World Wide Web Consortium (W3C). Kode CSS ditulis di dalam pasangan tag <style type=”text/css”> dan </style>. Dalam hal ini, type=”text/css” menyatakan bahwa kode berupa teks dan merupakan kode CSS.
2.1.3. Basis Data
A. Pengertian Basis Data
Menurut Sukamto dan Shalahuddin (2016:43) “Basis data adalah sistem terkomputerisasi yang tujuan utamanya adalah memelihara data yang sudah diolah atau informasi dan membuat informasi tersedia saat dibutuhkan”.
B. MySQL (My Structure Query Language)
Menurut Triwahyuni dan Abdul Kadir (2013:412) “MySQL adalah nama sebuah database server yang menangani akses database yang selalu dalam bentuk pernyataan SQL (Structured Query Language) yaitu suatu bahasa yang digunakan untuk mengakses databse relasional”.
Berbeda dengan basis data konvensional seperti .dat, .dbf, .mdb, MySQL memiliki kelebihan yaitu bersifat multithread, dan multi-user serta mendukung sistem jaringan. MySQL di distribusikan secara gratis dibawah lisensi GNU General Public License (GPL), namun ada juga versi komersial bagi kalangan
tertentu yang menginginkannya.
C. PhpMyAdmin
Menurut Mandar (2017:11) “phpMyAdmin adalah salah satu dari tiga aplikasi yang include pada satu paket software web server seperti Wampserver atau Xampp”.
Abdulloh (2016:6) mengatakan bahwa “phpMyAdmin merupakan aplikasi berbasis web yang digunakan untuk membuat database MySQL sebagai tempat untuk menyimpan data-data website”.
2.1.4. Model Pengembangan Perangkat Lunak dengan Metode Waterfall
Menurut Rosa dan Shalahuddin (2016:28) menjelaskan bahwa “Pada awal pengembangan perangkat lunak, para pembuat program (programmer) langsung
melakukan pengkodean perangkat lunak tanpa menggunakan prosedur atau tahapan pengembangan perangkat lunak”. Dan ditemuilah kendala-kendala seiring dengan perkembangan skala sistem-sistem perangkat yang semakin besar.
SDLC atau Software Development Life Cycle atau sering disebut juga
System Development Life Cycle adalah proses mengembangkan atau mengubah
suatu sistem perangkat lunak dengan menggunakan model-model dan metodologi yang digunakan orang untuk mengembangkan sistem-sistem perangkat lunak sebelumnya (berdasarkan best practice atau cara-cara yang sudah teruji baik).
Seperti halnya proses metamorfosis pada kupu-kupu, untuk menjadi kupu-kupu yang indah maka dibutuhkan beberapa tahap untuk dilalui, sama halnya dengan membuat perangkat lunak, memiliki daur tahapan yang dilalui agar menghasilkan perangkat lunak yang berkualitas.
Dalam perancangan aplikasi pada tugas akhir ini penulis menggunakan SDLC model Waterfall. Menurut Rosa dan Shalahuddin (2016:28) menjelaskan bahwa “Model SDLC air terjun (waterfall) sering juga disebut model sekuensial
linier (sequential linear) atau alur hidup klasik (classic life cycle)”. Model air
terurut dimulai dari analisis, desain, pengodean, pengujian dan tahap pendukung
(support). Berikut penjelasannya:
Sumber : Rosa dan Salahuddin (2016:29)
Gambar II.1. Model Metode Waterfall
1. Analisis kebutuhan perangkat lunak
Proses pengumpulan kebutuhan dilakukan secara intensif untuk mespesifikasikan 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 antarmuka, dan prosedur pengodean. Tahap ini mentranslasi kebutuhan perangkat lunak dari tahap analisis kebutuhan ke representasi desain agar dapat diimplementasikan menjadi program pada tahap selanjutnya. Desain perangkat lunak yang dihasilkan pada tahap ini juga perlu didokumentasikan.
3. Pembuatan kode program
Desain harus ditranslasikan ke dalam 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 segi lojik dan fungsional dan memastikan bahwa semua bagian sudah diuji. Hal ini dilakukan untuk meminimalisir kesalahan (error) dan memastikan keluaran yang dihasilkan
sesuai dengan yang diinginkan.
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 pemeliharaan dapat mengulangi proses pengembangan mulai dari tahap analisis spesifikasi untuk perubahan perangkat lunak baru.
2.1.5. Pengertian Pemesanan dan Jasa
Menurut Kotler dalam Puspita dkk (2013:1) Pemesanan adalah “Kegiatan transaksi yang menyatakan keinginan untuk memiliki atau membeli barang dan jasa tersebut sebelum melakukan transaksi finansial berupa pembayaran finansial terhadap produk atau jasa yang diinginkan”.
Jasa menurut Kotler dalam Sukadi dkk (2013:2) adalah “Tindakan yang ditawarkan oleh satu pihak kepada pihak lain yang pada dasarnya tidak berwujud dan tidak berakibat pada kepemilikan atas sesuatu”.
2.2. Teori Pendukung 2.2.1. Struktur Navigasi
Menurut Binanto dalam Ryonaldi, dkk (2014:4) menyatakan bahwa “Navigasi adalah gabungan dari struktur referensi informasi situs web dan mekanisme link yang mendukung pengunjung untuk melakukan penjelajahan situs”.
Ada 4 macam bentuk dasar struktur navigasi, yaitu: Struktur Navigasi Linear, Struktur Navigasi Non Linear, Struktur Navigasi Hierarchy, dan Struktur
Navigasi Composite.
1. Struktur Navigasi Linear
Pengguna akan melakukan navigasi secara berurutan, dari frame atau byte informasi ke informasi lainnya.
1.
Sumber : Binanto dalam Ryonaldi, dkk (2014:4)
Gambar II.2. Struktur Navigasi Linear
2. Struktur Navigasi Non Linear
Pengguna akan melakukan navigasi dengan bebas melalui isi proyek dengan tidak terkait dengan jalur yang sudah ditentukan sebelumnya.
Sumber : Binanto dalam Ryonaldi, dkk (2014:5)
Gambar II.3.
Struktur Navigasi Non Linear
3. Struktur Navigasi Hierarchy
Struktur Navigasi Hierarchy sering disebut struktur navigasi bercabang. Karena pengguna melakukan navigasi di sepanjang cabang pohon struktur yang terbentuk oleh logika isi.
Sumber : Binanto dalam Ryonaldi, dkk (2014:5)
Gambar II.4.
4. Struktur Navigasi Composite
Struktur Navigasi Composite (Campuran) merupakan struktur gabungan dari ketiga struktur sebelumnya. Struktur ini disebut juga struktur navigasi bebas. Kelebihan dengan menggunakan struktur ini adalah suatu aplikasi mampu memberikan keterkaitan informasinya lebih baik.
Sumber : Binanto dalam Ryonaldi, dkk (2014:5)
Gambar II.5.
Struktur Navigasi Composite
2.2.2. Entity Relationship Diagram (ERD)
Menurut Rosa dan Shalahuddin (2016:50) “Entity Relationship Diagram (ERD) digunakan untuk pemodelan basis data relasional”. Sehingga jika penyimpanan basis data menggunakan OODBMS maka perancangan basis data tidak perlu menggunakan ERD.
Sumber: Rosa dan Shalahuddin (2016:58)
Gambar II.6.
Diagram ERD Studi Kasus Perpustakaan
1. Kardinalitas/Derajat Relasi
Untuk menjelaskan jumlah entity yang berpartisipasi dalam suatu relasi, kita dapat menggunakan derajat. Dengan menggunakan derajat relation pengguna dapat menentukan hubungan antar entitas yang telah dibuat. Menurut Fathansyah (2015:78) menjelaskan bahwa “Kardinalitas relasi menunjukkan jumlah maksimum entitas yang dapat berelasi dengan antar entitas pada himpunan entitas yang lain”. Adapun gambar kardinalitas atau derajat relasi menurut Fathansyah (2015:79) adalah sebagai berikut:
a. Satu ke Satu (one to one)
Relasi ini digunakan untuk satu entitas A hanya untuk satu entitas B, ataupun sebaliknya satu entitas B hanyak untuk satu entitas A.
Sumber : Fathansyah (2015:79)
Gambar II.7. Derajat Relasi One to One
b. Satu ke Banyak (one to many)
Pada relasi ini dijelaskan bahwa satu entitas A dapat memiliki satu atau lebih entitas B, tetapi tidak dapat dilakukan sebaliknya.
Sumber : Fathansyah (2015:80)
Gambar II.8.
Derajat Relasi One to Many
c. Banyak ke Satu (many to one)
Pada relasi ini dijelaskan bahwa entitas A hanya dapat memiliki satu entitas B, tidak dapat dilakukan sebaliknya.
Sumber : Fathansyah (2015:80)
Gambar II.9.
Derajat Relasi Many to One
d. Banyak ke Banyak (many to many)
Relasi ini menjelaskan bahwa entitas A dapat memiliki lebih dari satu entitas B dan dapat juga dilakukan sebaliknya.
Sumber : Fathansyah (2015:81)
Gambar II.10.
Derajat Relasi Many to Many
2. LRS (Logical Record Structure)
Sebuah model sistem yang digambarkan dalam sebuah tabel. LRS atau Logical Record Structure ini berisikan spesifikasi-spesifikasi field yang
Menurut Simarmata dan Paryudi dalam Fridayanthie dan Mahdiati (2016:132) “Logical Record Structure adalah representasi dari struktur record-record pada tabel yang terbentuk dari hasil relasi antar himpunan
entitas”.
Sumber : Simarmata dalam Fridayanthie dan Mahdiati (2016:132)
Gambar II.11.
Logical Record Structure
2.2.3. Implementasi dan Pengujian Web
Menurut Rosa dan Shalahuddin (2016:275) Black box Testing yaitu “Menguji perangkat lunak dari segi spesifikasi fungsional tanpa menguji desain dan kode program. Pengujian 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 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.
2. Jika user memasukkan nama pemakai (username) dan kata sandi (password)
yang salah, atau sebaliknya, atau keduanya salah.
Tabel II.1.
Contoh Tabel Blackbox Testing No Skenario Pengujian Test Case Hal yang
Diinginkan
Hasil
Pengujian Kesimpulan 1 Username dan
Password tidak diisi kemudian klik tombol login. Username: Kosong Password: Kosong
Sistem akan menolak akses user dan menampilkan “Maaf semua field harus diisi”.
Sesuai Harapan Valid
2 Mengetikkan Username diisi dan Password tidak diisi atau kosong kemudian klik tombol login. Username: Desi Password: Kosong
Sistem akan menolak akses user dan menampilkan “Maaf semua field harus diisi”.
Sesuai Harapan Valid
3 Username tidak diisi dan Password diisi kemudian klik tombol login. Username: Kosong Password: Desi
Sistem akan menolak akses user dan menampilkan “Maaf semua field harus diisi”.
Sesuai Harapan Valid
4 Mengetikkan salah satu kondisi salah pada Username atau password kemudian klik tombol login.
Username: Desi (Benar) Password: Desi123 (Salah)
Sistem akan menolak akses user dan menampilkan “Maaf Username dan Password tidak valid”.
Sesuai Harapan Valid
5 Mengetikkan Username dan Password dengan data yang benar kemudian klik tombol login. Username: Desi Password: Desi93
Sistem menerima akses login dan kemudian langsung menampilkan menu utama.
Sesuai Harapan Valid
