BAB II LANDASAN TEORI · diperlukannya website dinamis adalah ketika pembuatan halaman buku tamu...
Transcript of BAB II LANDASAN TEORI · diperlukannya website dinamis adalah ketika pembuatan halaman buku tamu...
8
BAB II
LANDASAN TEORI
2.1. Konsep Dasar Web
Bab ini memaparkan konsep dasar web dan berbagai macam teori yang
mendukung pelaksanaan Tugas Akhir, yang memberikan pemahaman yang lebih
detail mengenai topik-topik tersebut sehingga akan memudahkan proses merancang
dan membuat web pada bab selanjutnya.
A. Website dan Internet
1. Definisi Website
Menurut Sarwono (2012:4), “Website dikenal dengan kependekan web atau situs
web yang merupakan sekumpulan halaman-halaman yang dirancang dengan
menggunakan bahasa HTML”.
Web mengizinkan pemberian highlight (penyorotan/penggaris bawahan) pada kata
atau gambar dalam sebuah dokumen untuk menghubungkan atau menunjukkan ke
media lain seperti dokumen, frase, move clip, atau file suara. Web dapat
menghubungkan dari sembarang tempat dalam sebuah dokumen atau gambar ke
sembarang tempat di dokumen lain. Dengan menghubungkan browser yang memiliki
Graphichal User Interface (GUI), link-link dapat dihubungkan ke tujuan dengan
menunjukkan link tersebut dengan mouse dan menekannya.
9
2. Definisi Internet
Menurut Irawan (2011:2) “Internet merupakan kependekan dari kata
„internetwork’, yang berarti rangkaian komputer yang terhubung menjadi beberapa
rangkaian jaringan sistem komputer terhubung secara global dan menggunakan
TCP/IP sebagai protokol”.
Sedangkan Menurut Sibero (2013:10), “Internet (Interconnected Network)
adalah jaringan komputer yang menghubungkan antar jaringan secara global, internet
dapat juga disebut jaringan didalam suatu jaringan yang luas”.
Seperti halnya jaringan komputer lokal maupun jaringan komputer area, internet juga
menggunkan protokol komunikasi yang sama yaitu TCP/IP (Transmission Control
Protocol / Internet Protocol).
Adapun beberapa aplikasi berbasis web dan fasilitas yang tersedia di internet
meliputi sebagai berikut :
a. Web Server
Menurut Sibero (2013:11), “Web Server adalah sebuah komputer yang terdiri
dari sekumpulan 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 dapat dibutuhkan kapasitas dan
kapabilitas dibandingkan PC. Dukungan perangkat lunak sangat dibutuhkan agar web
server dapat secara optimal.
10
b. 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 Uniform Resource Identifier (URL) yang dapat
terdiri dari halaman web, video, gambar, ataupun konten lainnya”.
c. World Wide Web (W3)
Menurut Sibero (2013:11),”World Wide Web (W3) atau lebih dikenal juga dengan
istilah web adalah suatu sistem yang berkaitan dengan dokumen digunakan sebagai
media untuk menampilkan teks, gambar, multimedia dan lainnya pada jaringan
internet.
Menurut Sibero (2013:11) mendefinisikan bahwa:
Web statis adalah website yang tidak memiliki kode server-side processing seperti
PHP atau ASP.NET. secara teknis, yang disebut dengan website statis adalah
halaman web dengan ekstensi html atau htm. Website statis pada umumnya hanya
digunakan untuk menampilkan informasi tanpa meminta data dari user. Kebanyakan
website didunia pada awalnya hanya berupa halaman statis hingga ditemukannya tag
FORM pada kode HTML.
Menurut Sibero (2013:11) mendefinisikan bahwa:
Web dinamis adalah website yang dibuat dari file yang mengandung kode server-side
processing seperti PHP atau ASP.NET. website dinamis memberikan kesempatan
kepada user untuk lebih berinteraksi dengan halaman web tersebut. Contoh
diperlukannya website dinamis adalah ketika pembuatan halaman buku tamu atau
pembuatan aplikasi-aplikasi database.
B. E-Commerce
Menurut Joni (2010:33) Mendefinisikan bahwa:
E-Commerce adalah pembelian, penjualan, dan pemasaran barang serta jasa
melalui sistem elektronik seperti televisi, radio, jaringan komputer atau internet.
Juga dapat didefinisikan sebagai suatu cara berbelanja atau berdagang dengan
online atau direct selling yang memanfaatkan fasilitas internet dimana terdapat
website yang menyediakan layanan get and delivery.
11
Menurut Joni (2013:33), Ruang lingkup e-commerce diantaranya :
1) Bussines to Bussines (B2B)
Merupakan sistem komunikasi basis antar pelaku bisnis perusahaan atau transaksi
secara elektronik antar perusahaan yang dilakukan secara rutin dan dalam
kapasitas produk yang besar.
2) Bussines to Consumer (B2C)
Merupakan sistem komunikasi bisnis antar pelaku bisnis dengan konsumen untuk
memenuhi kebutuhan tertentu pada saat tertentu.
3) Consumer to Consumer (C2C)
Merupakan sistem komunikasi dan transaksi bisnis antar konsumen untuk
memenuhi kebutuhan tertentu pada saat tertentu.
4) Consumer to Bussiness (B2C)
Merupakan individu yang menjual produk atau jasa kepada organisasi dan
individu yang mencari penjualan dan melakukan transaksi.
C. Bahasa Pemrograman
1. PHP
Menurut Sibero (2013:49) Mendefinisikan bahwa:
PHP adalah pemrograman interpreter yaitu proses penerjemahan baris kode
sumber kode mesin yang dimengerti komputer secara langsung pada saat baris
kode dijalankan PHP disebut sebagai pemrograman Server Side Programming,
PHP adalah suatu bahasa dengan hak cipta terbuka atau yang dikenal juga dengan
Open Source, yaitu pengguna dapat mengembangkan kode-kode fungsi PHP
sesuai dengan kebutuhannya.
Pemrograman PHP dapat ditulis dalam dua bentuk yaitu penulisan baris kode
PHP pada file tunggal dan penulisan kode PHP pada halaman html (emdedded).
Kedua cara penulisan tersebut tidak memiliki perbedaan, hanya menjadi kebiasaan
12
gaya penulisan dari programmer. Utnuk penulisan kode PHP pada halaman HTML
diperlukan tambahan konfigurasi pada Web Server agar dapat berjalan. Konfigurasi
ini bertujuan untuk mendaftarkan enstensi.html agar dapat dikenali Apache Web
Server dan diproses seperti halnya file PHP dengan ekstensi.php.
2. HTML (Hypertext Markup Language)
Menurut Sibero (2013:19), “Hypertext Markup Language atau HTML adalah
bahasa yang digunakan pada dokumen web sebagai bahasa untuk pertukaran
dokumen web. Struktur dokumen HTML terdiri dari tag penutup”.
Dokumen HTML terdiri dari beberapa komponen yaitu tag, elemen, dan atribut.
Berikut ini adalah penjelasan dari masing-masing komponen tersebut :
a. Tag
Tag adalah tanda awal “ < “ dan tanda akhir “ > “ yang digunakan sebagai
pengapit suatu elemen. Tag elemen pembuka diawali dengan tanda “ < ” dan
diakhiri dengan tanda “ > “. Sedangkan untuk elemen penutup diawali dengan
tanda “ < “ dan “ / “ kemudian diakhiri dengan tanda “ < “ dan sebelum tanda “ >
“ ditambahkan tanda “ / “.
b. Elemen
Elemen adalah nama penanda yang diapit oleh tag yang memiliki fungsi dan
tujuan tertentu pada dokumen HTML. Elemen dapat memiliki elemen anak dan
nilai. Elemen anak adalah suatu elemen yang berada didalam elemen pembuka
dan elemen penutup induknya. Nilai yang dimaksud adalah suatu teks atau
karakter yang berada diantara elemen pembuka dan elemen penutup
13
c. Atribut
Atribut adalah properti elemen yang digunakan untuk mengkhususkan suatu
elemen. Elemen dapat memiliki atribut yang berbeda pada tiap masing-
masingnya. Pendefinisian nilai atribut hanya dapat dilakukan pada elemen
pembuka. Untuk elemen dari tag yang memiliki atribut yang sama dengan
induknya, namun nilai atribut tidak didefinisikan secara implisit maka nilai
atribut elemem tersebut sama dengan nilai atribut pada tag induk atau istilah
lainnya inherit. Sifat inherit tersebut tidak berlaku untuk atribut identitas,
seperti atribut id dan name.
3. CSS (Cascading Style Sheets)
Menurut Sibero (2013:112), “CSS (Cascading Style Sheets) memiliki arti gaya
menata halaman bertingkat, yang berarti setiap satu elemen yang telah diformat dan
memiliki anak dan telah diformat, maka anak dari elemen tersebut secara otomatis
mengikuti format elemen induknya”.
Cascading Style Sheets dikembangkan untuk menata gaya pengaturan halaman
web. Pada awalnya CSS dikembangkan pada SGML pada tahun 1970, dan terus
dikembangkan hingga saat ini CSS telah mendukung banyak bahasa Markup seperti :
HTML, XHTML, XML, SVG (Scalable Vector Graphics) dan Mozilla XUL (XML
User Interface Languange).
Pada bulan Desember tahun 1996 W3C mengenalkan spesifikasi CSS level 1 atau
juga dikenal CSS1 yang mendukung format huruf, warna pada teks, dan lain-lain.
Kemudian pada bulan Mei tahun 1998 W3C mengeluarkan CSS2 yang didalamnya
14
terdapat fungsi pengaturan letak elemen, dan saat ini W3C telah memperbaiki serta
meningkatkan kemampuan CSS3.
4. Adobe Dreamweaver CS5
Menurut Andi (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 profesionsl untuk
mendesain web secara visual”.
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.
Dengan kemampuan fasilitas yang optimal dalam jendela Design akan memberikan
kemudahan untuk mendesain web meskipun untuk para web desainer pemula
sekalipun. Kemampuan Dreamweaver untuk berinteraksi dengan beberapa bahasa
pemrograman seperti PHP, ASP, JavaScript, dan yang lainnya juga memberikan
fasilitas maksimal kepada desainer web dengan menyertakan bahasa pemrograman di
dalamnya.
5. XAMPP
Menurut Aditya (2011:16) mendefinisikan bahwa “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 dan Perl. Nama XAMPP
merupakan singkatan dari X (empat sistem operasi apapun), Apache, MySQL, PHP
15
dan Perl. Program ini tersedia dalam GNU General Public License dan bebas,
merupakan web yang mudah digunakan yang dapat melayani tampilan halaman web
yang dinamis.
6. Javascript
Menurut Hidayatullah dan Jauhari (2014:422) “JavaScript adalah suatu bahasa
scripting yang digunakan sebagai fungsionalitas dalam membuat suatu web”.
JavaScript sendiri bersifat client-side sehingga untuk menggunakannya browser
Anda harus mengaktifkan fitur JavaScript (bila konfigurasi browser Anda diset pada
konfigurasi default, secara otomatis browser Anda sudah mengaktifkan fitur
JavaScript).
JavaSript dikembangkan oleh netscape, sebagai bahasa pemrograman
“sederhana” karena tidak dapat digunakan untuk membuat suatu aplikasi atau applet.
Namun, dengan JavaScript kita dapat membuat sebuah halaman web yang interaktif
dengan mudah.
7. JQuery
Menurut Hidayatullah dan Jauhari (2014:426), “JQuery adalah kumpulan fungsi-
fungsi JavaScript yang sudah dibentuk sebagai suatu objek”. Sehingga penggunaan
JQuery ini bisa dikategorikan sebagai suatu library yang nantinya kita hanya perlu
menggunakan fungsi-fungsi di dalam library tersebut.
JQuery pertama kali dirilis oleh Jhon Resig pada tahun 2006. Pada
perkembangannya JQuery tidak sekedar sebagai library JavaScript, namun memiliki
keandalan dan kelebihan yang cukup banyak. Hal tersebut menyebabkan banyak
16
developer web menggunakannya. JQuery dikenal dengan slogan “Write less, do
more” artinya penulisan kode yang sedikit tetapi memiliki beberapa aksi (action).
8. Basis Data
Menurut Rosa A.S dan M.Shalahuddin (2014:43) “Sistem basis data adalah
sistem terkomputerisasi yang tujuan utamanya adalah memelihara data yang sudah
diolah atau informasindan membuat informasi tesedia saat dibutuhkan”. Pada intinya
basis data adalah media untuk menyimpan data agar dapat diakses dengan mudah dan
cepat.
a. MySQL
Menurut Anhar (2010:21) mendefinisikan bahwa:
MySQL (My Structure Query Language) adalah sebuah perangkat lunak sistem
manajemen basis data SQL (Database Management System) atau DBMS dari
sekian banyak DBMS, seperti Oracle, MS SQL, Postagre SQL, dan lain-lain.
MySQL merupakan DBMS yang multithread, multi-user yang bersifat gratis
dibawah lisensi GNU General Public Licence (GPL).
Menurut Anhar (2010:21), Beberapa kelebihan MySQL, antara lain:
1) MySQL dapat berjalan dengan stabil pada bagian sistem operasi, seperti Windows,
Linux, FreeBSD, Mac Os X Server, Solaris, dan masih banyak lagi.
2) Bersifat Open Source, MySQL di distribusikan secara open source (gratis),
dibawah lisensi GNU General Public Licence (GPL).
3) Bersifat Multiuser, MySQL dapat digunakan oleh beberapa user dalam waktu
yang bersamaan tanpa mengalami masalah.
4) MySQL memiliki kecepatan yang baik dalam menangani query (perintah SQL).
Dengan kata lain, dapat memproses lebih banyak SQL per satuan waktu.
17
b. PHPMyAdmin
Menurut Sadeli (2013:10), “PHPMyAdmin adalah sebuah software yang
berbentuk seperti halaman situs yang terdapat pada web server”.
D. Model Pengembangan Perangkat Lunak
Menurut Rosa A.S dan M.Shalahuddin (2014:28) “Model SDLC air terjun
(waterfall) sering juga disebut model sekuensial linier (sequential linear) atau alur
hidup klasik (classic life cycle). Model air terjun menyediakan pendekatan alur hidup
perangkat lunak secara sekuensial atau terurut dimulai dari analisis, desain,
pengodean, pengujian, dan tahap pendukung (support). Sekuensial ini terdiri dari 5
tahap yang sal ing terkait dan mempengaruhi seperti terlihat pada gambar berikut :
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 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.
18
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 dari 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 (supprort) atau pemeliharaan (maintenance)
Tidsk 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 analisis spesifikasi untuk perubahan
perangkat lunak yang sudah ada, tapi tidak untuk membuat perangkat lunak baru.
Gambar II.1. Ilustrasi Pengembangan Waterfall
Sumber: Rosa dan Shalahuddin (2014:28)
Sistem / Rekayasa
Informasi
Analisis Desain Pengodean Pengujian
19
2.2. Teori Pendukung
Dalam merancang suatu program tentu saja diperlukan peralatan pendukung (tool
system). Peralatan pendukung ini sangat berguna untuk menjelaskan proses jalannya
program sehingga mudah dimengerti oleh siapa saja menggunakan program yang
akan dibuat.
A. Struktur Navigasi
Menurut Mahendra (2009:1), “Struktur navigasi adalah alur yang digunakan
dalam aplikasi yang dibuat sebelum menyusun aplikasi multimedia kedalam sebuah
software, kita harus menentukan terlebih dahulu alur apa yang akan digunakan dalam
aplikasi yang dibuat.
Menurut Binanto (2010:269) ada 4 macam bentuk dasar dari struktur navigasi
yang biasa digunakan yaitu:
1. Struktur Navigasi Linear
Pengguna akan melakukan navigasi secara berurutan, dari frame atau byte
informasi ke informasi lainnya.
Sumber: Binanto: (2010:269)
Gambar II.2.
Struktur Navigasi Linear
20
2. Struktur Navigasi Hirarki
Struktur dasar ini disebut juga struktur “linear dengan percabangan” karena
pengguna melakukan navigasi disepanjang cabang pohon struktur yang terbentuk
oleh logika isi.
Sumber: Binanto: (2010:269)
Gambar 11.3.
Struktur Navigasi Hirarki
3. Struktur Navigasi Non-Linear
Pengguna akan melakukan navigasi dengan bebas melalui isi proyek dengan
tidak terikat dengan jalur yang sudah ditentukan sebelumnya.
Sumber: Binanto: (2010:270)
Gambar II.4.
Struktur Navigasi Non-Linear
21
4. Struktur Navigasi Campuran (Composite)
Pengguna akan melakukan navigasi dengan bebas (secara non-linear), tetapi
terkadang dibatasi presentasi linear film atau informasi penting dan atau pada
data yang saling terorganisasi secara logis pada suatu hirarki.
Sumber: Binanto: (2010:270)
Gambar II.5.
Struktur Navigasi Composite
B. Entity Relationship Diagram
Menurut Janner dan Iman (2010:67), “Entity Relationship Diagram adalah alat
pemodelan data utama dan akan membantu mengorganisasi data dalam suatu proyek
ke dalam entitas-entitas dan menentukan hubungan antar entitas”. Proses
memungkinkan analisis menghasilkan struktur basis data yang baik sehingga data
dapat disimpan dan diambil secara efisien.
Dalam ERD terdapat beberapa komponen seperti:
22
1. Entitas (entity)
Entitas adalah sesuatu yang nyata atau abstrak dimana kita akan menyimpan data
dan empat kelas entitas, yaitu misalnya pegawai, pembayaran, kampus, dan buku.
Contoh suatu entitas disebut instansi, misalnya pegawai Adi, pembayaran Joko
dan lain sebagainya.
2. Relasi (Relationship)
Relasi adalah hubungan alamiah yang terjadi antara satu atau lebih entitas,
misalnya proses pembayaran pegawai.
3. Kardinalitas
Kardinalitas menentukan kejadian suatu entitas untuk suatu kejadian pada entitas
yang berhubungan. Misalnya mahasiswa bisa mengambil banyak mata kuliah.
4. Atribut (Attribute)
Attribute adalah ciri umum semua atau sebagian besar instansi pada entitas
tertentu. Sebutan lain atribut adalah property, elemen, data dan field. Misalnya
nama, alamat, nomor pegawai dan gaji adalah atribut entitas pegawai. Sebuah
atribut atau kombinasi atribut yang mengidentifikasi satu dan hanya instansi suatu
entitas disebut kunci utama atau pengenal. Misalnya, nomor pegawai adalah
kunci utama untuk pegawai.
C. Logical Record Structure
Menurut Ladjamudin (2013:159), “aturan-aturan dalam melakukan transformasi
E-R Diagram ke Logical Record Structure”. Adalah sebagai berikut:
a. Setiap entity akan diubah kebentuk sebuah kotak dengan nama entity berada
diluar kotak dan atribut berada didalam kotak.
23
b. Sebuah relasi kadang disatukan dalam sebuah kotak bersama entity, kadang
dipisah dalam sebuah kotak tersendiri.
Aturan pokok diatas akan sangat dipengaruhi oleh elemen yang menjadi titik
perhatian utama pada langkah transformasi yaitu cardinality atau kardinalitas.
D. Pengujian Web
Menurut Rosa dan Shalahuddin (2014:275), “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.
Pengujian kotak hitam dilakukan dengan membuat kasus uji yang bersifat
mencoba sesama fungsi dengan memakai perangkat lunak apakah sesuai dengan
spesifikasi sesama fungsi dengan spesifikasi yang dibutuhkan. Kasus uji yang dibuat
untuk melakukan pengujian kotak hitam harus dibuat dengan kasus benar atau salah.