Upload
others
View
9
Download
0
Embed Size (px)
Citation preview
6
BAB II
PENDAHULUAN
2.1. Konsep Dasar Web
Pembuatan Tugas Akhir ini tidak terlepas dari teori-teori yang mendukung
dalam mempelajari serta merancang website sistem informasi akademik yang
diharapkan berfungsi secara maksimal. Kemudahan dalam melihat suatu website bagi
setiap pengunjung akan sangat membantu dalam menyelesaikan setiap pencarian
katalog serta transaksi penjualan secara langsung.
2.1.1 Website
Menurut Arief (2011a:7) “Website adalah salah satu aplikasi yang berisikan
dokumen-dokumen multimedia (teks, gambar, animasi, video) didalamnya yang
menggunakan protokol HTTP (Hypertext Transfer Protocol) dan untuk
mengaksesnya menggunakan perangkat lunak yang disebut browser”.
a. Browser
Menurut Arief (2011b:8) “Browser adalah aplikasi yang mampu menjalankan
dokumen-dokumen web dengan cara diterjemahkan”. Prosesnya dilakukan oleh
komponen yang terdapat didalam aplikasi browser yang biasa disebut Web Engine.
Semua dokumen web ditampilkan oleh browser dengan cara diterjemahkan. Beberapa
jenis browser yang populer saat ini diantaranya adalah Internet Explorer yang
diproduksi oleh Microsoft, Mozilla Firefox, Opera, dan Safari yang diproduksi oleh
Apple.
7
b. WWW (World Wide Web)
Menurut Shelly dan Velmaart (2011: 80), “World Wide Web (WWW) atau
web, terdiri dari kumpulan dokumen elektronik di seluruh dunia. Setiap dokumen
elektronik di web disebut webpage, yang dapat berisi teks, grafik, animasi, audio dan
video”.
c. Situs Web (Websites)
Arief (2011d:7) menjelaskan “situs web adalah dokumen-dokumen web yang
terkumpul menjadi satu kesatuan yang memiliki Unified Resource Locator (URL) dan
biasanya di-publish di internet intranet”.
d. Halaman Web (Web Pages)
Menurut Farisi (2011:3), “halaman web bagian dari situs web, apabila situs
web diumpamakan merupakan seperti sebuah buku, maka halaman web merupakan
lembaran-lembaran kertas penyusun buku tersebut”.
e. Hypertext Transfer Protocol (HTTP)
Menurut Agus (2013:2), “HTTP adalah sebuah protocol server yang
digunakan oleh client/user untuk mengakses alamat suatu situs (website)
menggunakan aplikasi web browser ”.
2.1.2. Sistem Informasi Akademik
a. Sistem
Menurut Sutabri (2012:2) terdapat dua kelompok pendekatan di dalam
pendefinisian sistem, yaitu kelompok yang menekankan pada prosedur dan kelompok
yang menekankan pada elemen atau komponennya. Pendekatan yang menekankan
pada prosedur mendefinisikan sistem sebagai suatu jaringan kerja prosedur-
8
prosedur yang saling berhubungan, berkumpul bersama-sama untuk melakukan
suatu kegiatan atau untuk menyelesaikan suatu sasaran tertentu. Sedangkan
pendekatan sistem yang lebih menekankan pada elemen atau komponen
mendefinisikan sistem sebagai kumpulan elemen yang berinteraksi untuk mencapai
suatu tujuan tertentu. Kedua kelompok definisi ini adalah benar dan tidak
bertentangan. Yang berbeda adalah cara pendekatannya.
b. Informasi
Menurut Sutabri (2012:22) Informasi adalah data yang telah
diklasifikasikan atau diolah atau diinterprestasikan untuk digunakan dalam proses
pengambilan keputusan. Sistem pengolahan informasi akan mengolah data menjadi
informasi atau mengolah data dari bentuk tak berguna menjadi berguna bagi yang
menerimanya. Nilai informasi berhubungan dengan keputusan. Bila tidak ada pilihan
atau keputusan maka informasi tidak diperlukan.
c. Sistem Informasi Akademik
Menurut Aditama (2012:53), “Sistem informasi akademik adalah suatu sistem
yang dibangun untuk mengelola data-data akademik sehingga memberikan kemudahan
kepada pengguna dalam kegiatan administrasi akademik sekolah secara online”.
2.1.3. Bahasa Pemprograman
a. Hyper Text Markup Language (HTML)
Menurut Sibero (2011:19), “HTML (Hyper Text Markup Language) adalah
bahasa yang digunakan pada dokumen web sebagai bahasa untuk pertukaran
dokumen web”.
9
b. Cascading Style Sheet (CSS)
Menurut Saputra dan Agustin (2011:6), “CSS atau yang memiliki kepanjangan
Cascading Style Sheet, merupakan suatu bahasa pemrograman web yang digunakan
untuk mengendalikan dan membangun berbagai komponen dalam web sehingga
tampilan web akan lebih rapi, terstruktur, dan seragam”.
c. Personal Home Page (PHP)
Menurut Prasetyo (2014:122), “PHP (Hypertext Prepocessor) adalah anak
script yang ditanam disisi server.” Seperti sebagian besar bahasa script lainnya, PHP
dapat ditanamkan langsung kedalam HTML. Kode PHP dipisahkan dari HTML
dengan menggunakan tanda start <?php dan end?>. Ketika sebuah dokumen dibaca,
prosesor PHP hanya menterjemahkan area yang ditandai saja dan menampilkan
hasilnya apda tempat yang sama.
d. JQuery
Menurut Sigit (2011:8) “JQuery adalah library atau kumpulan kode javascript
siap pakai”. Keunggulan menggunakan JQuery dibandingkan dengan javascript
standar yaitu, menyederhanakan kode javascript dengan cara memanggil fungsi yang
disediakan oleh JQuery. Javascript sendiri merupakan bahasa scripting yang bekerja
di sisi client/browser sehingga website bisa lebih interaktif.
e. MySQL
Menurut Saputra (2011:7) “MySQL merupakan salah satu database popular
dan mendunia, MySQL bekerja menggunakan SQL Language (Structure Query
10
Language). Itu dapat diartikan bahwa MySQL merupakan standar pengguna database
didunia untuk pengolahan data”.
f. Javascript
Menurut Setiawan (2014:2), “JavaScript adalah bahasa pemrograman yang
bersifat client side scripting yang eksekusinya berada di sisi client. Client disini
adalah browser, seperti Internet Explorer (IE), Mozilla Firefox, Google Crome,
Netscape, dan Opera”.
g. XAMPP
Menurut Aditya (2011:16) XAMPP adalah perangkat lunak bebas, yang
mendukung banyak sistem operasi, merupakan kompilasi dari beberapa program.
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.
h. Adobe Dreamweaver CS5
Menurut Madcoms (2011:2) memberikan batasan bahwa “dreamweaver
adalah sebuah HTML editor profesional untuk mendesain web secara visual dan
mengelola situs atau halaman web”. Saat ini terdapat software dari kelompok adobe
yang belakangan banyak digunakan untuk mendesain suatu situs web. Versi tetrbaru
dari Adobe Dreamweaver saat ini adalah Dreamweaver CS5, terdapat beberapa
kemampuan bukan hanya sebagai software unutk desain web saja tetapi juga unutk
menyunting kode serta pembuatan aplikasi web dengan menggunakan berbagai
11
bahasa pemograman web, antara lain: JPS, PHP, ASP dan ColdFusion.
Sumber: Adobe Dreamweaver CS5
Gambar II.1
Tampilan Adobe Dreamweaver CS5
2.1.4. Basis Data
1. Pengenalan Database
Database atau basis data adalah sekumpulan data yang memiliki hubungan
secara logika dan diatur dengan susunan tertentu serta adalah representasi dari semua
fakta yang ada pada dunia nyata. Definisi lebih rinci diberikan oleh Saputra (2011:1)
database merupakan kumpulan dari data yang saling berhubungan dan berkaitan
dengan subjek tertentu pada tujuan tertentu pula. Database merupakan salah satu
komponen yang penting dalam sistem informasi. Adapun struktur database adalah
database, file atau table, records, elemen data atau field.
12
2. PhpMyAdmin
Menurut Sibero (2011:376), “phpMyAdmin merupakan aplikasi web yang
digunakan untuk administrasi database MySQL. Sebelum menjalankan phpMyAdmin,
kita harus menjalankan software pendukungnya, seperti XAMPP”. Fitur administrasi
phpMyAdmin antara lain:
a. Pembuatan, mengubah, dan menghapus database.
b. Pembuatan, mengubah, dan menghapus tabel.
c. Menampilkan, menambahkan, mengubah, dan menghapus data.
d. Membuat dan menghapus view.
e. Menampilkan dan menghapus indeks kolom.
2.1.5. Model Pengembangan Sistem Perangkat Lunak
Model ini merupakan yang paling pertama dipublikasikan. Model ini berasal
dari proses sistem dari engineering yang lebih umum, model ini dikenal sebagai
waterfall model. Beberapa tahapan dalam waterfall model menurut Rosa dan
Shalahuddin (2013:28).
Sumber: Rosa dan Shalahuddin (2013:28)
Gambar II.2
Waterfall Model
13
Tahap utama model ini dibagi kedalam 4 bagian berdasarkan pengembangan
kegiatannya:
1. Requirements Definition: Layanan, batasan dan tujuan dari sistem ditetapkan
melalui konsultasi dengan penggunaan sistem. Semua itu didefinisikan secara
detail dan bertindak sebagai spefikasi sistem.
2. System and Software Design: Proses desain sistem membagi kebutuan menjadi
hardware dan software. Ini menetapkan hampir seluruh perancangan sistem.
Desain software melibatkan pengidentifikasian dan penggambaran mengenai
pemisahan dasar sistem software dan hubungannya.
3. Implementation and Unit Testing: Dalam tahap ini, desain software adalah
menyadari sebagai kumpulan program atau suatu program. Unit testing
melibatkan verifikasi bahwa setiap unit telah mencapai spesiikasinya.
4. Integration and Sistem Testing: Suatu program atau kumpulan program
diintegrasikan dan dites sebagai sistem yang telah selesai, untuk menjamin
bahwa kebutuhan software telah terpenuhi. Setelah pengetesan, sistem software
dikirimkan kepada pelanggan.
2.2. Teori Pendukung
2.2.1. Struktur Navigasi
Menurut Mahendra (2011:1), “Struktur navigasi adalah alur yang digunakan
dalam aplikasi yang dibuat. Sebelum menyusun aplikasi kedalam sebuah software,
kita harus menentukan terlebih dahulu alur apa yang akan digunakan dalam aplikasi
yang dibuat”. Ada empat macam sturuktur navigasi, yaitu :
14
1. Struktur Navigasi Linear
Struktur navigasi linear merupakan struktur yang mempunyai satu rangkaian
cerita berurutan. Struktur ini menampilkan satu demi satu tampilan layer secara
berurutan menurut aturannya.
Sumber Mahendra (2011:1)
Gambar II.3
Struktur Navigasi Linear
2. Struktur Navigasi Hirarki
Struktur navigasi hirarki sering disebut struktur navigasi bercabang, yaitu
merupakan suatu struktur yang mengandalkan percabangan untuk menampilkan
data atau gambar pada layer dengan kriteria tertentu. Tampilan pada menu utama
disebut master page (halaman utama satu), halaman tersebut mempunyai halaman
percabangan yang disebut slave page (halaman pendukung) dan jika dipilih akan
menjadi halaman kedua, begitu seterusnya.
Sumber Mahendra (2011:2)
Gambar II.4
Struktur Navigasi Hirarki
15
3. Struktur Navigasi Non Linear
Struktur navigasi non linear (tidak terurut) merupakan pengembangan dari
struktur navigasi linear, hanya saja pada struktur ini diperkenankan untuk
membuat percabangan. Percabangan pada struktur non linier berbeda dengan
percabangan pada struktur hirarki, pada struktur ini kedudukan semua page sama,
sehingga tidak dikenal adanya master atau slave page.
Sumber Mahendra (2011:2)
Gambar II.5
Struktur Navigasi Non Linear
4. Struktur Navigasi Campuran
Struktur navigasi campuran (composite) merupakan gabungan dari struktur
sebelumnya dan disebut juga struktur navigasi bebas, maksudnya adalah jika
suatu tampilan membutuhkan percabangan maka dibuat percabangan.
16
Sumber Mahendra (2011:3)
Gambar II.6
Struktur Navigasi Campuran
2.2.2. Entity Relationship Diagram (ERD)
Menurut Rosa dan Shalahudin (2013:50), ERD (Entity Relationship Diagram)
adalah dikembangkan berdasarkan teori himpunan dalam 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. 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.
Terdapat 3 komponen yang akan dibentuk yaitu:
1. Entitas
Pada post sebelumnya mengenai basis data telah dijelaskan sedikit tentang
pengertian entity (entitas) yaitu suatu objek yang dapat dibedakan dari lainnya
yang dapat diwujudkan dalam basis data.
Contoh: Mahasiswa, Kartu Anggota Perpustakaan (KAP), dan Buku.
17
2. Relasi
Relasi adalah hubungan antara dua jenis entitas dan dipresentasikan sebagai
garis lurus yang menghubungkan dua entitas.
Contoh: Mahasiswa mendaftar sebagai anggota perpustakaan (KAP),
relasinya adalah mendaftar.
3. Atribut
Atribut memberikan informasi lebih rinci tentang jenis entitas. Atribut
memiliki struktur internal berupa tipe data.
4. Derajat Relasi atau kardinalitas rasio
Menjelaskan jumlah maksimum hubungan antara satu entitas dengan entitas
lainnya. Beberapa relasi dalam ERD adalah :
1. One to One (1:1)
Setiap anggota entitas A hanya boleh berhubungan dengan satu anggota
entitas B, begitupun sebaliknya.
2. One to Many (1:M)
Setiap anggota entitas A dapat berhubungan lebih dari satu anggota
entitas B tetapi tidak sebaliknya.
3. Many to Many (M:M)
Setiap entitas A dapat berhubungan dengan banyak entitas himpunan
entitas B dan demikian pula sebaliknya.
18
2.2.3. Logical Relational Strucure (LRS)
Menurut Wulandari (2013) “Logical Record Structure dibentuk dengan nomor
tipe record. Beberapa tipe record digambarkan oleh kotak empat persegi panjang dan
dengan nama yang unik”.
Perbedaan LRS dengan ERD dan tipe record berada diluar field tipe record
ditempatkan. LRS terdiri dari link-link diantara tipe record. Link ini menunjukkan
arah dari satu tipe record lainnya.Banyak link dari LRS yang diberi tanda field-field
yang kelihatan pada kedua link type record. Penggambaran LRS mulai dengan
menggunakan model yang dimengerti. Dua metode yang dapat digunakan, dimulai
dengan hubungan kedua model yang dapat dikonversikan ke LRS. Metode yang lain
dimulai dengan Entity Relationship Diagram dan langsung dikonversikan ke LRS.
Berikut tahapan transformasi ERD ke LRS menurut Wulandari (2013):
1. Konversi ERD ke LRS, Entity Relationship Diagram harus diubah ke bentuk
LRS (struktur record secara logic). Dari bentuk LRS inilah yang nantinya dapat
ditransformasikan ke bentuk relasi tabel.
2. Konversi ERD ke LRS sebuah model sistem yang digambarkan dengan sebuah
model sistem yang digambarkan dengan sebuah ERD akan mengikuti pola
pemodelan tertentu. Dalam kaitannya dengan konversi ke LRS, untuk perubahan
yang terjadi adalah mengikuti aturan-aturan berikut:
a. Setiap entitas diubah kebentuk kotak dengan nama entitas, berada diluar
kotak dan atribut berada didalam kotak.
19
b. Sebuah relationship kadang disatukan, dalam sebuah kotak bersama
entitas,kadang sebuah kotak bersama-sama dengan entitas, kadang
disatukan dalam sebuah kotak tersendiri.
c. Konversi LRS ke relasi tabel atau tabel adalah bentuk pernyataan data
secara grafis dimensi,yang terdiri dari kolom dan baris. Relasi adalah
bentuk visual bentuk lingkaran Entity Relationship Diagram dikenal
dengan sebutan atribut. Konversi dari logical structure, dilakukan dengan
cara:
1) Nama logical record structure menjadi nama relasi.
2) Tiap atribut menjadi sebuah kolom didalam relasi.
2.2.4. Pengujian Web (Black Box Testing)
Menurut Rosa dan Shalahuddin (2013:275) “Black-box testing yaitu
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. Kasus
uji yang dibuat untuk melakukan pengujian kotak hitam harus dibuat dengan kasus
benar dan kasus salah.
Black Box Testing mencoba untuk menemukan kesalahan dalam kategori
berikut:
1. Fungsi tidak benar atau hilang.
2. Kesalahan interface atau antarmuka.
3. Kesalahan dalam struktur data atau akses database eksternal.
4. Kesalahan kinerja atau prilaku.
20
5. Kesalahan inisialisasi dan terminasi.
Tidak seperti White Box Testing yang dilakukan pada awal proses pengujian,
Black Box Testing cenderung diterapkan pada tahap selanjutnya dari pengujian.
Karena Black Box Testing sengaja mengabaikan struktur control perhatian difokuskan
pada domain informasi.