7
BAB II
LANDASAN TEORI
2.1. Konsep Dasar Web A. Website
Menurut Sarwono (2012:4) mengatakan bahwa “website dikenal dengan kependekan web atau situs web yang merupakan sekumpulan halaman-halaman yang dirancang dengan menggunakan bahasa HTML”.
1. Internet
Menurut Sibero (2013:10) “internet (interconnected networks) adalah jaringan komputer yang menghubungkan antar jaringan secara global, internet dapat juga di sebut jaringan dalam satu jaringan yang luas”. Seperti halnya jaringan lokal maupun jaringan area, internet dapat juga menggunakan protokol komunikasi yang sama yaitu TCP/IP (transmission Control protokol/internet protokol).
Jaringan internet menyediakan beberapa aplikasi yang dapat digunakan oleh pemakai internet, diantaranya :
a. World Wide Web
Menurut Sidik (2014:1) “World Wide Web (WWW), lebih dikenal dengan web, merupakan salah satu layanan yang didapat oleh pemakai komputer yang terhubung ke internet”.
b. Web Server
Menurut Sadeli (2011:2) “Web Server adalah sebuah aplikasi tempat menyimpan data-data untuk membuat website”. Juga sering di artikan sebagai layanan data di web browser. Fungsi dari web server sebagai penerima permintaan berupa halaman client dan mengirimkan kembali hasil yang diminta dalam bentuk halaman web.
c. Web Browser
Menurut Sidik (2014:5) “Browser Web adalah software yang digunakan untuk menampilkan informasi dari server web. Software ini kini telah dikembangkan dengan menggunakan user interface grafis, sehingga pemakai
dapat dengan melakukan ‘point dan click’ untuk pindah antar dokumen.
2. Macromedia Dreamweaver 5
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 profesional 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 Sie 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.
3. 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 Pearl. Nama XAMPP merupakan singkatan dari X (empat sistem operasi apapun), Apache, MySQL, PHP dan Pearl. Program ini tersedia dalam GNU General Public License dan bebas, merupakan web yang mudah digunakan yang dapat melayani tampilan halaman web yang dinamis.
B. Bahasa Pemrograman 1. PHP (Personal Home Page)
Menurut Arief (2011:43) “PHP (Pearl Hypertext Preprocessor) adalah bahasa server slide scripting yang menyatu dengan HTML untuk membuat halaman web yang dinamis”. Dengan menggunakan program PHP, sebuah website akan lebih interaktif dan dinamis.
2. CSS (Cascading Style Sheet)
Menurut Adhi (2014:252) “CSS (Cascading Style Sheet) adalah suatu teknologi yang digunakan untuk memperindah tampilan halaman website (situs)”.
Singkatnya dengan menggunakan Metode CSS ini penulis dengan mudah mengubah secara keseluruhan sekaligus memformat ulang situs.
3. HTML (Hypertext Markup Language)
Menurut Anhar (2010:40) HTML (Hyper Text Markup Language) adalah
“sekumpulan simbol-simbol atau tag-tag yang dituliskan dalam sebuah file yang digunakan untuk menampilkan halaman pada web browser”. Tag-tag HTML selalu diawali dengan <x> dan diakhiri dengan </x> dimana x Dag HTML itu seperti b, i, u, dan lain-lain.
HTML merupakan bahasa pemrograman web yang memiliki sintak atau aturan tertentu dalam menuliskan script atau kode-kode, sehingga browser dapat menampilkan informasi dengan membaca kode-kode HTML. Untuk memudahkan kita dalam mempelajari pemrograman HTML.
HTML sendiri terdiri dari tag-tag yang berfungsi sebagai perintah untuk menampilkan pesan melalui web browser sehingga kita dapat memahami isi halaman- halaman web. “HTML adalah bahasa bahasa yang digunakan pada dokumen web sebagai bahasa untuk pertukaran dokumen web, struktur dokumen HTML terdiri dari tag pembuka dan tag penutup”. HTML versi 1.0 dibangun oleh W3C dan terus mengalami perkembangan sampai saat ini HTML terakhir adalah versi 5.0 struktur dokumen HTML sebagai berikut:
<html>
<head>
<tittle></tittle>
</head>
<Brody></Brody>
</html>
4. JavaScript
Menurut Hidayatullah dan Jauhari (2014:422) “JavaScript adalah suatu bahasa scripting yang digunakan sebagai fungsionalitas dalam membuat suatu web”. JavaScript sendiri bersifat client-slide sehingga untuk menggunakannya browser anda harus mengaktifkan fitur javaScript (bila konfigurasi browser anda di set pada konfigurasi default, secara otomatis browser anda sudah mengaktifkan fitur JavaSript.
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.
5. JQuery
Menurut Hidayatullah dan Jauhari (2014:426), “JQuery adalah kumpulan fungsi-fungsi JavaScript yang sudah dibentuk sebagai 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 developer web menggunakannya. JQuery dikenal dengan slogan “Write les, do Moore” artinya penulisan kode yang sedikit tetapi memiliki beberapa aksi (Action).
C. Basis Data
Menurut Rosa dan Shalahuddin (2013:43) “Basis data adalah sistem terkomputerisasi yang tuan utamanya adalah memelihara data yang sudah diolah atau informasi dan membuat informasi tersedia saat dibutuhkan. Pada intinya basis data adalah. Pada buku ini menggunakan basis data relasional
1. MySQL
Menurut Anhar (2010:45) “MySQL (My Structure Query Language) adalah salah satu Database Management System (DBMS) dari sekian banyak DBMS seperti oracle, MS SQL, postrage SQL, dan lainnya. MySQL berfungsi untuk mengolah database menggunakan bahasa SQL. MySQL bersifat open source sehingga kita bisa menggunakannya secara gratis.
2. PhpMyadmin
Menurut Kadir (2009:4) dengan menggunakan PHP My Admin aplikasi ini dapat membantu dalam menavigasi beberapa database, Table, log, dan beberapa lainnya.
D. Model Pengembangan Perangkat Lunak
Salah satu model pengembangan perangkat lunak adalah Water fall. Menurut Rosa dan Shalahuddin (2013: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).
Sumber: Rosa A.S dan M. Shalahuddin (2013:29) Gambar II.1. Ilustrasi Model Waterfall
Tahapan metode water fall menurut Rosa dan Shalahuddin (2013:28) adalah:
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 analis kebutuhan ke representasi desain agar dapat diimplementasikan menjadi program pada tahap selanjutnya. Desain perangkat lunak yang dihasilkan pada tahap ini juga perlu didokumentasikan.
Sistem/ Rekayasa Informasi
Analisis Desain Pengodean Pengujian
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 diingikan.
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 analisis spesifikasi untuk perubahan perangkat lunak yang sudah ada, tapi tidak untuk membuat perangkat lunak baru.
2.2. Teori Pendukung A. Struktur Navigasi
Menurut Sukanto (2008:62) “Struktur navigasi dalam situs web melibatkan sistem navigasi situs web secara keseluruhan dan desain interface situs web tersebut, navigasi memudahkan jalan yang mudah ketika menjelajahi situs web”. Struktur navigasi juga dapat diartikan sebagai struktur alur dari suatu program yang merupakan rancangan hubungan dan rantai kerja dari beberapa area yang berbeda dan dapat membantu mengorganisasikan seluruh elemen pembuatan website.
Bentuk dasar dari struktur navigasi menurut Binanto (2010a:269) sebagai berikut:
1. Linear (Satu Alur)
Struktur navigasi linear hanya mempunyai satu rantaian cerita yang berurut yang menampilkan satu demi satu tampilan layar secara berurut menurut urutannya. Tampilan yang dapat ditampilkan pada struktur jenis ini adalah satu halaman sebelumnya atau satu halaman sesudahnya, tidak dapat dua halaman sebelumnya atau dua halaman sesudahnya, pengguna akan melakukan navigasi secara berurutan, dalam France atau byte informasi satu ke yang lainnya.
Sumber : Binanto, (2010a:269)
Gambar II.2. Struktur Navigasi Linear
2. Hierarchial (Hierarki)
Truk dasar ini disebut juga linier dengan percabangan karena pengguna melakukan navigasi disepanjang cabang pohong struktur yang terbentuk oleh logika ini.
Sumber :Binanto (2010b:269)
Gambar II.3. Struktur Navigasi Hierarchial (Hierarki) 3. Non Linear (Tidak Berurut)
Struktur navigasi non linear merupakan pengembangan dari struktur navigasi linear. Pada struktur ini diperkenankan membuat navigasi bercabang.
Percabangan yang dibuat pada struktur non linear ini berbeda dengan percabangan pada struktur hierarchial, karena pada percabangan non linear ini walaupun terdapat percabangan tetap tiap-tiap tampilan mempunyai kedudukan yang sama yaitu tidak ada Master Page dan Slave Page, pengguna akan melakukan navigasi dengan bebas melalui isi proyek dengan tidak terkait dengan jalur yang sudah ditentukan sebelumnya.
Sumber : Binanto (2010c:270)
Gambar II.4. Struktur Navigasi Non Linear (tidak berurut) 4. Composite (Campuran)
Struktur navigasi pengguna akan melakukan navigasi dengan bebas (secara non linear), tetapi terkadang dibatasi presentasi linear film atau informasi penting dan pada data yang paling terorganisasi secara logis pada satu hierarki.
Sumber : Binanto (2010d:270)
Gambar II.5. Struktur Navigasi Composite (campuran)
B. Entity Relationship Diagram (ERD)
Menurut Rosa dan Shalahuddin (2013:50) “Entity Relationship Diagram (ERD) adalah teknik yang digunakan untuk memodelkan kebutuhan data dari satu organisasi, biasanya oleh System Analys dalam tahap ini analisis persyaratan proyek dikembangkan System”. ERD dikembangkan berdasarkan teori himpunan 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.
Tabel II.1.
Simbol-Simbol Entity Relationship Diagram
Simbol Deskripsi
Entitas Entitas merupakan data inti yang akan disimpan; bakal tabel pada basis data; benda yang memiliki data dan harus disimpan datanya agar dapat diakses oleh aplikasi komputer; penamaan entitas biasanya lebih ke kata benda dan belum merupakan nama tabel.
Atribut kolom data yang butuh disimpan dalam satu entitas
Atribut kunci primer kolom data yang butuh disimpan dalam satu entitas dan digunakan sebagai kunci akses nama_entitas
nama_atribut
nama kunci primer
record yang diingikan; biasanya berupa di;
kunci primer dapat lebih dari satu kolom, asalkan kombinasi dari beberapa kolom tersebut dapat bersifat unik (berbeda tanpa ada yang sama).
Atribut Multinilai kolom data yang butuh disimpan dalam satu entitas yang dapat memiliki nilai lebih dari satu.
Relasi Relasi yang menghubungkan antar entitas;
biasanya diawali dengan kata kerja.
Asosiasi /Association N
Penghubung antara relasi dan entitas di mana di kedua ujungnya memiliki multiplicity kemungkinan jumlah pamakaian
Kemungkinan jumlah maksimum
keterhubungan antara entitas satu dengan entitas yang lain disebut dengan kardinalitas.
Misalkan ada kardinalitas 1 ke N atau sering disebut dengan one to many menghubungkan entitas A dan entitas B maka
Sumber: Rosa A.S dan M. Shalahuddin (2013:50) nama_relasi
nama_atribut
Langkah-langkah yang harus dipahami sebelum merancang basis data dengan menggunakan model entity relationship diagram, diantaranya adalah:
a. One Key
Satu atau lebih atribut yang dapat membedakan setiap basis data dalam tabel secara unik.
b. Candidate Key
Merupakan kumpulan atribut minimal yang membedakan setiap basis data dalam tabel secara unik.
c. Relation Key
Nilai dari kunci relasi harus mengidentifikasikan sebuah basis yang unik di dalam sebut relasi, kunci relasi terdiri dari satu atau lebih atribut-atribut relasi.
d. Alternative Key
Kunci yang tidak ada di dunia nyata, tetapi diadakan dan dijadikan primary Key.
Kunci alternatif dibuat ketika tidak ada satupun atribut dalam sebuah relasi yang bisa mewakili atribut tersebut.
e. Composite Key
Primary Key yang terdiri dari lebih satu atribut f. Foreign Key
Istilah foreign Key juga banyak di gunakan dalam perancangan. Sebuah foreign Key adalah sekumpulan atribut data satu relasi (misal A) sedemikian sehingga kumpulan atribut ini bukan kunci relasi A tetapi merupakan kunci dari relasi lain.
C. Derajat Relationship
Model relasi ini berdasarkan persepsi dunia nyata diantaranya himpunan objek dan di identifikasi secara unik, dan objeknya dapat berbentuk orang, barang, dan sebagainya. Kardinalitas relasi menunjukan maksimum entitas yang dapat berelasi dengan entitas pada himpunan entitas (misalkan A dan B) dapat berupa satu ke satu (one to one), satu ke banyak (one to many) dan banyak ke banyak (many to many).
a. Satu ke Satu (One to One)
Berarti setiap entitas pada himpunan entitas A berhubungan dengan paling banyak dengan satu entitas pada himpunan entitas B, dan begitu juga sebaliknya setiap entitas pada himpunan entitas B berhubungan dengan paling banyak dengan satu entitas himpunan entitas B.
b. Satu ke Banyak (One to Many)
Berarti setiap entitas pada himpunan entitas A dan berhubungan dengan banyak entitas pada himpunan entitas B, tetapi tidak sebaliknya, dimana setiap entitas pada himpunan entitas yang berhubungan dengan paling banyak dengan satu entitas pada himpunan entitas A.
c. Banyak ke Banyak (Many to Many)
Berarti setiap entitas pada himpunan entitas A dapat berhubungan dengan banyak entitas pada himpunan entitas B, demikian juga sebaliknya, dimana setiap entitas pada himpunan entitas B dapat berhubungan dengan banyak entitas pada himpunan entitas A.
D. LRS (Logical Record Structure)
Menurut Lestari (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 di luar field tipe record ditempatkan. LRS terdiri dari link-link antar 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.
E. Pengujian Web
Menurut Sukamto dan Shalahuddin (2013:272) “pengujian perangkat lunak (web) adalah sebuah elemen sebuah topik yang yang memiliki cakupan luas dan sering dikaitkan dengan verifikasi (verification) dan validasi (validation) (V&V)”.
Verifikasi mengacu pada sekumpulan aktivitas yang menjamin bahwa perangkat lunak mengimplementasikan dengan benar sebuah fungsi yang spesifik. Validasi mengacu pada sekumpulan aktivitas yang berbeda yang menjamin bahwa perangkat lunak yang dibangun dapat ditelusuri sesuai dengan kebutuhan pelanggan (customer).
Salah satu pengujian perangkat lunak yaitu dengan menggunakan Black Box Testing.
Black Box Testing sendiri menguji perangkat lunak dari segi spesifikasi fungsional tanpa menguji desain 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 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, misalkan untuk kasus proses login maka kasus uji yang dibuat adalah:
a. Jika user memasukkan nama pemakai (username) dan kata sandi (password) yang benar, misalkan nama pemakai benar dan kata sandi benar.
b. Jika user memasukkan nama pemakai (username) dan kata sandi (password) yang salah, misalkan nama pemakai benar tapi kata sandi salah, atau sebaliknya, atau keduanya salah.
