BAB II
LANDASAN
TEORI
2.1. Konsep Dasar Web
Menurut Rudyanto
(2011:7) “Web adalah salah satu
aplikasi yang berisikan dokumen-dokumen multimedia (teks, gambar, suara,
animasi, video) di dalamnya yang menggunakan protokol HTTP (hypertext transfer protocol) untuk
mengakses menggunakan perangkat lunak yang disebut browser”.
2.1.1 Website
Menurut Sibero
(2013:2) World Wide Web (W3) adalah
“suatu sistem yang berkaitan dengan dokumen digunakan sebagai media untuk
menampilkan teks, gambar, multimedia dan lainnya pada jaringan internet”.
World Wide Web
Consortium (W3C) organisasi dunia yang mengatur standar World Wide Web (W3). Organisasi ini
berkomitmen dalam mengatur aturan pegembangan web, yang terdiri dari 320
anggota. Selain mengatur aturan pengembangan web, juga ikut melibatkan diri dalam dunia pendidikan. Beberapa standar hasil pengembangan
dari W3C antara lain HTML, CSS, XHTML, DOM, SOAP, XML, dll.
Beberapa aplikasi berbasis web, yaitu:
1.
Internet
Menurut
Sibero (2013:10) “Internet (Interconnected
Network) adalah jaringan komputer yang menghubungkan antar jaringan secara
global, internet dapat juga disebut jaringan dalam suatu jarinngan yang luas”.
Sedangkan menurut Pratama (2014:37)
menjelaskan bahwa:
Internet
atau Internetworking adalah jaringan
komputer terbesar di dunia yang menghubungkan semua jaringan komputer yang ada
(Intranet, Wide Area Network, Metropolitan Area Network, Personal Area Network, dan lain-lain)
beserta dengan semua komputer, perangkat terhubung (Smartphone, tablet, komputer benam, Switch, Router, Hub, dan perangkat penghubung lainnya),
serta pengguna komputer itu sendiri, ke dalam satu wadah jaringan komputer
dunia.
Istilah dalam internet salah satunya
adalah HTTP (Hyper Text Transfer Protocol).
Menurut Hidayatullah dan Kawistara (2014:5), “Hypertext Transfer Protocol (HTTP) adalah protokol agar client dan server bisa berkomunikasi dengan gaya request-response”.
2.
Web Browser
Menurut Sibero (2013:12)
“Web browser adalah aplikasi
perangkat lunak yang digunakan untuk mengambil dan menyajikan sumber informasi web”.
Sumber informasi web
diidentifikasi dengan Unifrom Resource
Identifier (URL) yang dapat 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 Supercomputing Application) mengembangkan web browser grafis bernama NCSA
Mosaic, yang kemudian dilanjutkan pada tahun 1994 merilis Netscape Navigator dan pada tahun 1998
berubah menjadi Mozila Firefox. Microsoft corp ikut meramaikan
perkembangan web browser dengan
merilis Internet Explorer pada tahun
1995, dan diikuti oleh Opera di tahun
1996. Tidak ketinggalan Apple Inc juga
ikut meramaikan pasar web browser
dengan merilis Safari pada tahun
2003. Dan di tahun 2008 Google Inc
merilis web browser dengan nama Google Chrome.
3.
Web Server
Menurut
Sibero (2013:11) “Web
server adalah sebuah komputer yang terdiri dari perangkat keras dan
perangkat lunak”.
Secara bentuk fisik dan cara kerjanya,
perangkat keras web server tidak
berbeda dengan komputer rumah atau PC, yang membedakan adalah kapasitas dan
kapabilitasnya. Perbedaan tersebut dikarenakan web server bekerja sebagai penyedia layanan yang dapat diakses oleh
banyak pengguna, sehingga dibutuhkan kapasitas yang besar dibandingkan PC. Dukungan
perangkat lunak sangat dibutuhkan memiliki agar web server dapat berjalan optimal. Setiap perangkat lunak web server memiliki karakteristik dan
teknologi yang digunakan untuk mengatur kerja sistemnya.
2.1.2 Bahasa Pemrograman
Bahasa
pemrograman ini adalah suatu himpunan dari aturan sintaks dan semantik yang
dipakai untuk mendefinisikan program komputer.
1.
HTML (Hyper Text Markup Leanguage)
Menurut Sibero (2013:19) HTML adalah
“bahasa pemrograman yang digunakan pada dokumen web sebagai bahasa untuk pertukaran dokumen web”. Struktur dokumen HTML terdiri dari tag pembuka dan tag penutup. Struktur dokumen
HTML sebagai berikut :
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Struktur diatas adalah satu kesatuan yang harus ada dalam setiap dokumen
HTML.
2.
PHP (Hypertext Prepocessor)
Menurut Saputra dan Feni Agustin (2013:2) menjelaskan “PHP merupakan bahasa
pemrograman yang difungsikan untuk membangun suatu website dinamis”.
Menurut Sibero (2013:49) “PHP adalah pemrograman interpreter yaitu proses
penerjemahan baris kode sumber menjadi kode mesin yang dimengerti komputer
secara langsung pada saat kode baris dijalankan”.
PHP menyatu dengan kode HTML, maksudnya adalah beda kondisi. HTML digunakan
sebagai pembangun atau pondasi dari kerangka layout web, sedangkan PHP difungsikan sebagai prosesnya. Pada
awalnya PHP merupakan kependekan dari Personal
Home Page (Situs Personal) dan PHP itu sendiri pertama kali dibuat oleh
Rasmus Leodorf pada tahun 1995 untuk proses dinamis bernama F1 (Form Interpreter), yang wujudnya berupa
sekumpulan script yang digunakan
untuk mengolah data form dari web. Kemudian Rasmus merilis kembali
kode tersebut dan diumumkan pada khalayak umum dengan nama PHP/F1. Pada tahun
1997, sebuah perusahaan Zend menulis ulang kembali intepreter PHP menjadi lebih
baik. Dan pada tahun 1998, singkatan PHP diubah menjadi Hypertext Prepocessor.
Untuk membedakan kode PHP dengan HTML, didepan kode PHP tersebut tag
pembuka dan akhir kode PHP diberikan tag penutup. Contoh kode PHP didalam HTML:
<html>
<head>
<title>Contoh PHP</title>
</head>
<body>
<p>Dibawah ini adalah tulisan dari
PHP</p>
<?php
Echo “Teks dari PHP”;
?>
</body>
</html>
3.
JavaScript
Menurut Sibero (2013:150), “Javascript
adalah suatu bahasa pemrograman yang dikembangkan untuk dapat berjalan pada web browser”.
1.
Bahasa
ini adalah bahasa pemrograman untuk memberikan kemampuan tambahan terhadap
bahasa HTML dengan mengizinkan pengeksekusian perintah-perintah di sisi user artinya di sisi browser bukan di sisi server web. Javascript adalah bahasa yang “case
sensitive” artinya membedakan penamaan variabel dan fungsi yang menggunakan
huruf besar dan huruf kecil, contoh variabel atau fungsi dengan nama TEST berbeda dengan variabel dengan nama
test dan setiap instruksi di akhiri
dengan karakter titik koma (;).
2. CSS (Cascanding
Style Sheet)
Menurut Saputra dan Agustin (2012:5) “CSS (Cascanding Style Sheet) adalah suatu bahasa pemprograman web yang digunakan untuk mengendalikan
dan membangun berbagai komponen dalam web
sehingga tampilan web akan lebih
rapi, terstruktur, dan seragam”.
CSS merupakan pemprograman wajib yang harus dikuasai oleh setiap pembuat
program (web programmer), terlebih
dahulu pendesain web (web designer).
CSS saat ini dikembangkan oleh Word
Wide Web Consurtium (W3C) dan menjadi bahasa standar dalam pembuatan web.
CSS difungsikan sebagai penopang atau pendukung, dan pelengkap file html yang berperan dalam penataan
kerangka dan layout. Secara umum yang
dilakukan CSS adalah pengaturan layout,
kerangka teks, gambar, warna, tabel, spasi, dan lain sebagainya.
3. Dreamweaver
Menurut Madcoms (2011:2) ”Adobe Dreamweaver CS5 adalah versi terbaru dari
Dreamweaver yang merupakan bagian dari Adobe Creative Suite 5. Dreamweaver
sendiri merupakan aplikasi yang digunakan sebagai HTML editor profesional untuk
mendesain web secara virsual”.
Aplikasi ini juga biasa dikenal dengan istilah WYSIWYG (What You See Is What You Get), yang
intinya adalah anda tidak harus berurusan dengan tag-tag HTML untuk membuat
sebuah site dan dapat melihat hasil desainnya secara langsung.
2.1.3 Basis Data
Menurut Sukamto dan Salahuddin (2013:43) menjelaskan bahwa “Sistem basis data adalah sistem terkomputerisasi
yang tujuan utamanya adalah memelihara data yang sudah diolah atau informasi
dan membuat informasi tersedia saat dibutuhkan”. Basis data juga dapat
diartikan sebagai media untuk menyimpan data agar dapat diakses dengan mudah
dan cepat.
Sedangkan
menurut Simarmata (2009:2) menjelaskan bahwa:
sebuah sistem basis data adalah tempat penyimpanan
file data. Sebagai file data, suatu basis data tidak menyajikan informasi
secara langsung kepada pengguna. Pengguna harus menjalankan aplikasi untuk
mengakses data dari basis data dan menyajikannya dalam bentuk yang bisa
dimengerti.
1.
MySQL
Menurut Ichwan (2011:23) MySQL adalah “Relational
Database Management System (RDBMS) yang didistribusikan secara gratis
dibawah lisensi GPL (General Public
License). Dimana setiap orang bebas menggunakan MySQL, namun tidak boleh
dijadikan produk turunan atau bersifat closed
source atau komersil”.
Sedangkan menurut Sibero (2013:97), “MySQL atau dibaca My Sekuel adalah suatu RDBMS (Relational
Database Management System) yaitu aplikasi sistem yang menjalankan fungsi
pengolahan data”
2.
Xampp
Menurut Wicaksono (2012:7) “XAMPP adalah sebuah software yang berfungsi
untul menjalankan website berbasis
PHP dan menggunakan pengolahan data MySQL dikomputer lokal”.
Sedangkan menurut Ramdhan (2008:4) mengatakan bahwa “XAMPP adalah paket software yang didalamnya sedah
terkandung Web server, Apache, Database,
MySQL, dan PHP. Dengan
menginstall XAMPP, maka tidak perlu lagi melakukan instalasi dan konfigurasi Web server, Apache, PHP, dan MySQL secara manual”.
XAMPP berperan sebagai server web pada komputer lokal. Biasanya
penginstalan program XAMPP berada di folder standar, yaitu C:\XAMPP
2.1.4 Model Pengembangan Perangkat Lunak
Menurut Sukamto dan
Shalahuddin (2013:2) menjelaskan bahwa “perangkat lunak (software) adalah program komputer yang terasosiasi dengan
dokumentasi perangkat lunak seperti dokumentasi kebutuhan, model desain, dan
cara pengembangan (User manual)”.
Sebuah program tanpa terasosiasi dengan dokumentasinya maka belum dapat disebut
perangkat lunak (Software).
Model air terjun
(waterfall) sering juga disebut
dengan model sekuential linear atau
alur hidup klasik (classic life).
Model air terjun menyediakan pendekatan alur hidup perangkat lunak secara
sekuensial atau terurut yang dimulai dari analisis, desain, pengkodean, tahap
pengujian dan tahap pendukung (support).
Sumber : Sukamto dan Shalahuddin
(2013:2)
Gambar II.1
Model Waterfall
1.
Analisis
kebutuhan perangkat lunak
Proses pengumpulan kebutuhan dilakukan secara intensif untuk
menspesifikasikan kebutuhan perangkat lunak agar dapat dipahami perangkat lunak
seperti apa yang dibutuhkan oleh user. Spesifikasi
kebutuhan perangkat lunak pada tahap ini perlu untuk di dokumentasikan.
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 pengkodean.
3.
Pembuatan
kode program
Desain
harus ditranslasikan kedalam 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 dari segi logik dan fungsional
dan memastikan bahwa semua bagian sudah diuji.
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.
2.2.
Teori Pendukung
Di dalam website tidak terlepas dari penggunaan
teori pendukung. Penggunaan teori pendukung dimaksudkan untuk memudahkan
merancang dan mendesain suatu website.
2.2.1 Struktur Navigasi
Menurut
Sutopo (2007:2), “Struktur Navigasi adalah struktur bagaimana halaman web
dihubungkan dengan halman lain”.
Struktur
navigasi dapat digolongkan menurut kebutuhan akan objek, kemudahan pemakaian,
keinteraktifitasannya dan kemudahan membuatnya yang berpengaruh terhadap waktu
pembuatan suatu situs web. Bentuk
dasar dari struktur navigasi sebagai berikut :
1.
Linear (Satu
Alur)
Sebagai besar website
menggunakan linear navigation model
informasi diberikan secara sekuensial dimulai dari satu halaman.
Sumber : Sutopo(2007:6)
Gambar
II. 2
Struktur
Navigasi Linear
2.
Hierarchical (Hirarki)
Hierarchical Model diadaptasi
oleh top-down design. Konsep navigasi ini dimulai dari
satu node yang menjadi homepage. Dari homepage dapat dibuat beberapa cabang ke halaman-halaman utama.
Sumber : Sutopo (2007:7)
Gambar II. 3
Struktur Navigasi Hirarki (Hierarchical)
3.
Spoke-and-hub
Model
Dalam
Spoke-and-hub Model hanya ada dua
macam link yaitu dari homepage ke halaman tertentu dan dari
halaman tertentu ke halaman homepage.
Spoke-and-hub Model hanya menggunakan
satu node untuk menghubungkan satu node ke node lainya
Sumber : Sutopo (2007:7)
Gambar II. 4
Struktur Navigasi Spoke-and-hub Model
4.
Full
web model
Full web model memberikan
kemampuan hyperlink yang banyak. Full web model banyak digunakan karena user dapat mengakses semua topik dengan
subtopik dengan cepat. Namun kelemahan dari model ini, yaitu dapat berkaitan user kehilangan cara untuk kembali ke
topik sebelumnya.
Sumber : Sutopo (2007:8)
Gambar II. 5
Struktur Navigasi Full Web
Model
2.2.2 Entity Relationship Diagram
ERD merupakan suatu model untuk
menjelaskan hubungan antar data dalam basis data berdasarkan objek-objek dasar
data yang mempunyai hubungan antar relasi. ERD untuk memodelkan struktur data
dan hubungan antar data, untuk menggambarkan digunakan beberapa notasi dan
simbol.
Menurut
Yuhefizard (2008:17) menjelaskan bahwa “Diagram E-R digunakan untuk menggambarkan secara
sistematis hubungan antar entity-entity
yang ada dalam suatu sistem database
menggunakan simbol-simbol sehingga lebih mudah dipahami”. Dalam rekayasa
perangkat lunak, sebuah Entity
Relationship Diagram (ERD)
merupakan abstrak dan konseptual resresentasi data. Entity Relationship Diagram adalah salah satu metode pemodelan basis
data yang digunakan untuk menghasilkan skema konseptual untuk jenis/model data
semantik sistem. Dimana sistem seringkali memiliki basis data relasional, dan
ketentuannya bersifat top-down.
1.
Komponen Entity Relationship Diagram
Menurut
Yasin (2012:276) menjelaskan “ERD merupakan suatu model untuk menjelaskan
hubungan antar data dalam basis data berdasarkan objek-objek dasar data yang
mempunyai hubungan antar relasi. ERD untuk memodelkan struktur data dan
hubungan antar data, untuk menggambarkannya digunakan beberapa notasi dan
simbol. Pada dasarnya ada tiga simbol yang digunakan, yaitu:
a.
Entity
Entity merupakan objek yang mewakili
sesuatu yang nyata dan dapat dibedakan dari sesuatu yang lain. Simbol dari entity ini biasanya digambarkan dengan
persegi panjang.
Sumber: Yasin
(2012:277)
Gambar II.6.Simbol
Entitas
b.
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.
Sumber: Yasin (2012:277)
Gambar II.7.Atribut
Entitas Teknisi
c.
Hubungan / Relasi
Relasi
didefinisikan sebagai penghubung yang terjadi antar entity. Representasi diagram relasi adalah sebuah garis lurus yang
menghubungkan dua buah entity. Jenis-jenis atau hubungan yang
biasa terjadi ntar satu entity dengan
entity lain dalam sebuah basis data,
meliputi :
1.
One to One /
Satu ke Satu (1 : 1)
Hubungan relasi satu ke satu yaitu
setiap entitas pada himpunan entitas A berhubungan paling banyak dengan satu
entitas pada himpunan entitas B. Contoh hubungan antara
entity Mahasiswa dengan Kartu Mahasiswa. Seorang mahasiswa hanya
boleh memiliki satu kartu mahasiswa, satu kartu mahasiswa hanya dimiliki oleh
satu orang mahasiswa.
Sumber: Yasin (2012:277)
Gambar II.8.Relasi One to One
2.
One to many/
Satu ke Banyak ( 1 : * )
Setiap
entitas pada himpunan entitas A dapat berhubungan dengan banyak entitas pada
himpunan entitas B, setiap entitas pada entitas B dapat berhubungan dengan satu
entitas pad himpunan entitas A. Contohnya hubungan terjadi antara entiti
konsumen dapat memiliki satu atau lebih motor. Sedangkan satu motor hanya dapat
dimiliki oleh seorang konsumen.
Sumber: Yasin (2012:278)
Gambar II.9.Relasi One to Many
3.
Many to Many / Banyak ke Banyak ( * : * )
setiap
entitas pada himpunan entitas A dapat berhubungan dengan banyak entitas pada
himpunan entitas B. Contohnya hubungan yang terjadi antara Mahasiswa dengan
Mata Kuliah. Satu mahasiswa dapat mengikuti lebih dari satu mata kuliah dab
satu mata kuliah dapat diikuti oleh lebih dari satu mahasiswa.
Sumber: Yasin (2012:278)
Gambar. II.10.Relasi Many to Many
2.
Derajat Relationship
Dalam
hubungan antar entity, juga harus
ditentukan derajat relasi antar entity.
Derajat relasi menunjukkan jumlah maksimum record
suatu entity ber- relasi denga record
pada entity yang lainnya. Terdapat 3 macam derajat dari relationship, yaitu :
1. Unary
Degree (derajat satu)
Bila satu entity mempunyai relasi terhadap dirinya sendiri.
2. Binary
Degree (derajat dua)
Bila
satu relasi menghubungkan dua entity.
3. Ternary
Degree (derajat tiga)
Bila
satu entity menghubungkan lebih dari entity.
3. Logical Relational Structure
(LRS)
Menurut Utomo (2010:32), ”Model yang dibangun menunjukan segala suatu yang
harus dimasukan dalam sistem dan dalam sesuatu yang harus dikerjakan oleh
sistem, tanpa memerinci bagian sistem kerja”. Oleh karena itu logika, tidak ada
referensi ke pemilihan hardware, software
atau media.
2.2.3 Pengujian Web
Menurut
Shalahuddin 2013:275 menjelaskan bahwa “Black-box
Testing (pengujian kotak hitam) 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.
Langkah-langkah dalam black –box :
1.
Analisa
kebutuhan dan spesifikasi
2.
Pemilihan
Input.
3.
Pemilihan
Output.
4.
Seleksi
Input.
5.
Pengujian.
6.
Review
Hasil.
7.
Evaluasi.
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.
Kategori error
yang akan diketahui dengan pengujian black-box
testing :
1.
Fungsi
yang hilang atau tidak benar.
2.
Error dari antar-muka.
3.
Error dari struktur data atau akses eksternal database.
4.
Error dari kinerja atau tingkah laku.
5.
Error dari inisilisasi dan terminasi.
Belum ada tanggapan untuk " Contoh TA - BAB II LANDASAN TEORI - Jurusan Sistem "
Post a Comment