BAB 2 LANDASAN TEORI 2.1 Teori Umum Teori umum merupakan landasan utama yang menjadi dasar penelitian. Teori umum dipakai sebagai landasan yang digunakan dalam penelitian dan pembuatan aplikasi. 2.1.1 Internet Mengacu pada pendapat (Gunawan, 2010, p7) Internet berasal dari kata interconnection networking yang mempunyai arti hubungan berbagai computer dengan berbagai tipe yang membentuk sistem jaringan yang mencakup seluruh dunia (jaringan computer global) dengan melalui jalur telekomunikasi. 2.1.2 Delapan Aturan Emas untuk Perancangan Antarmuka Menurut pendapat (Shneiderman et al., 2010) Delapan aturan emas merupakan salah satu pedoman dalam merancang antarmuka dari sebuah aplikasi. Berikut ini adalah aturan-aturan yang tertera pada delapan aturan emas : 1. Konsistensi Konsisten terhadap urutan tindakan dan rancangan antarmuka sehingga pengguna dapat lebih mudah dan terbiasa menggunakan aplikasi. 9
10 2. Kegunaan yang universal Mengenal kebutuhan dari berbagai pengguna yang berbeda dan mendesain konten yang dinamis sesuai kebutuhan. Memahami perbedaan antara pemula dengan ahli, perbedaan usia, kondisi pengguna, dan perbedaaan teknologi dalam melakukan desain. 3. Memberikan umpan balik yang informatif Memberikan umpan balik kepada pengguna ketika melakukan aksi misalnya memberikan kotak dialog peringatan dan suara ketika terjadi kesalahan. 4. Memberikan dialog untuk penutupan Urutan aksi harus terorganisir menjadi beberapa bagian seperti bagian awal, bagian tengah dan bagian akhir. Dari bagian tersebut seharusnya diberikan umpan balik sehingga pengguna dapat mengetahui hasil dari aksi dan melanjutkan ke tahap berikutnya. 5. Adanya penanganan kesalahan Sistem yang dibuat sebaiknya dapat mendeteksi kesalahan supaya pengguna tidak melakukan kesalahan yang fatal dan memberikan solusi untuk kesalahan tersebut. 6. Mudah kembali ke tindakan sebelumnya Adanya fitur untuk membatalkan tindakan sebelumnya untuk menghilangkan kekhawatiran pengguna ketika mengetahui adanya kesalahan.
11 7. Mendukung pusat pengendalian internal Pengguna ahli biasanya ingin menjadi pengontrol sistem bukan sebaliknya. Sehingga sistem sebaiknya dirancang seakan-akan pengguna adalah pihak memulai aksi bukan perespon. 8. Mengurangi beban ingatan jangka pendek Pengguna memiliki keterbatasan kapasitas dalam memproses informasi dan mengingatnya dalam jangka pendek sehingga aplikasi yang dikembangkan sebaiknya tidak membuat pengguna harus mengingat informasi layar-layar sebelumnya. 2.1.3 Unified Modeling Language (UML) Menurut (Whitten dan Bentley, 2007), UML (Unified Modeling Language) merupakan kumpulan konvensi pemodelan untuk menggambarkan fungsi-fungsi yang disediakan oleh sistem tersebut. 2.1.3.1 Class Diagram Class diagram adalah sebuah diagram yang menggambarkan tentang objek-objek bernama kelas yang menyusun suatu sistem dan juga hubungan antar kelas-kelas tersebut (Whitten & Bentley., 2007).
12 Gambar 2.1 Contoh Class Diagram Terdapat tiga bagian pada suatu class, yakni : 1. Nama kelas Nama kelas terdapat di bagian pertama class yang merepresentasikan nama dari class tersebut. 2. Atribut kelas Atribut kelas terdapat di bagian tengah class yang merepresentasikan tipe data yang dimiliki. 3. Operasi Operasi terdapat di bagian bawah class yang merepresentasikan kegiatan-kegiatan yang akan dilakukan oleh class tersebut.
13 Adapun notasi-notasi yang terdapat pada class diagram, seperti : 1. Visibility Visibility digunakan untuk menentukan apakah atribut atau operasi dari sebuah kelas dapat digunakan oleh kelas yang lain. Tabel 2.1 Deskripsi Simbol Visibility Visibility Simbol Deskripsi Private - Hanya dapat hanya dapat digunakan oleh kelas yang mendefinisikan Protected # Dapat digunakan oleh kelas yang mendefinisikannya dan turunan dari kelas tersebut Public + Dapat digunakan oleh semua kelas yang berhubungan 2. Multiplicity Multiplicity digunakan untuk menentukan banyaknya kelas yang berhubungan dengan kelas yang dimaksud. Tabel 2.2 Deskripsi Simbol Multiplicity Multiplicity Deskripsi 0 1 Nol atau satu 1 Satu
14 0 * 1 * Nol atau lebih Satu atau lebih 3. Generalisasi Generalisasi digunakan untuk merepresentasikan inheritance dalam class diagram dengan menggambarkan hubungannya melalui superclass dan subclass. Superclass adalah bentuk umum dari sebuah subclass, dan subclass adalah bentuk spesifik dari sebuah superclass. Subclass memiliki semua properti yang dimiliki oleh superclass. Gambar 2.2 Contoh Notasi Pada Class Diagram
15 4. Asosiasi Asosiasi digunakan untuk menggambarkan adanya hubungan antar kelas dengan memberikan keterangan relasi dan multiplicity. Hubungan asosiasi dibedakan menjadi dua jenis, yaitu: a. Uni-directional Hubungan Uni-directional merupakan hubungan dimana dua kelas saling terhubung tetapi hanya salah satu yang memiliki peran dalam hubungan tesebut. b. Bi-directional Hubungan Bi-directional merupakan hubungan dimana dua kelas saling terhubung dan keduanya memiliki peran dalam hubungan tesebut. 5. Agregasi Agregasi digunakan untuk menggambarkan hubungan dimana sebuah kelas merupakan bagian dari kelas lain, tetapi bukan merepresentasikan inheritance. 6. Komposisi Komposisi merupakan bentuk lain dari agregasi tetapi hubungan antar kelas komposisi lebih erat dibandingkan agregasi karena kelas A yang merupakan bagian dari kelas B tidak akan ada jika kelas B tidak ada.
16 2.1.3.2 Use Case Diagram Use case diagram adalah sebuah diagram yang menggambarkan interaksi antara sistem dengan pengguna. Jadi, use case diagram menggambarkan siapa yang akan berinteraksi atau menggunakan sistem tersebut (Whitten & Bentley., 2007). Gambar 2.3 Contoh Use Case Diagram Use case diagram dideskripsikan oleh use case narrative yang menggambarkan bagaimana user berinteraksi dengan untuk menyelesaikan pekerjaannya. Tabel 2.3 Deskripsi Use Case Narrative Elemen Nama use case Keterangan Nama use case harus merepresentasikan tujuan yang ingin dicapai oleh use case tersebut dan diawali dengan kata kerja.
17 Aktor Event dijalankan yang Aktor yang menjalankan use case. Langkah-langkah yang harus dilakukan untuk menyelesaikan Precondition Kondisi yang harus dipenuhi sebelum menjalankan use case. Postcondition Hasil yang dicapai setelah use case berhasil dijalankan. Hubungan-hubungan pada use case diagram: a. Asosiasi Asosiasi menggambarkan adanya interaksi antara use case dengan aktor. Asosiasi digambarkan dengan simbol garis yang bisa mempunyai anak panah atau tanpa anak panah. Asosiasi dengan anak panah yang berasal dari aktor menunjuk ke use case menandakan bahwa aktor inisiator use case tersebut. Asosiasi tanpa anak panah menandakan interaksi antara use case dengan aktor penerima.
18 Gambar 2.4 Contoh Asosiasi pada Use Case Diagram b. Extends Extends digunakan ketika fungsi use case terdiri dari beberapa tahap yang sulit sehingga mudah dimengerti. Extends akan menghasilkan use case baru yang mewakili fungsi dari use case awal. Gambar 2.5 Contoh Extends pada Use Case Diagram
19 c. Includes/uses Includes digunakan ketika use case melakukan beberapa langkah yang sama yang menjadi sebuah entitas baru dengan sebutan use case abstrak sehingga mengurangi redundansi dalam use case diagram. Gambar 2.6 Contoh Includes pada Use Case Diagram
20 d. Depends on Depends On digunakan untuk menggambarkan hubungan use case dimana suatu use case tidak dapat dilakukan apabila use case yang lain belum dilakukan. Gambar 2.7 Contoh Depends on pada Use Case Diagram
21 e. Inheritance Inheritance digunakan untuk menggambarkan hubungan dua atau lebih aktor dalam satu sistem dengan sebuah aktor abstrak untuk menyederhanakan diagram karena aktor abstrak memiliki langkah yang dimiliki aktor lain. Gambar 2.8 Contoh Inheritance Pada Use Case Diagram
22 2.1.3.3 Sequence Diagram Sequence diagram menggambarkan model logika dari sebuah use case dengan pesan yang dikirimkan antar objek dalam waktu tertentu (Whitten & Bentley., 2007). Gambar 2.9 Contoh Sequence Diagram
23 Berikut elemen-elemen pada sequence diagram : 1. Aktor Aktor merupakan simbol yang digunakan untuk mewakili pengguna dalam berinteraksi dengan objek kelas interface. 2. Objek Objek merupakan simbol yang digunakan untuk mewakili kelas-kelas pada class diagram. 3. Aktivasi Aktivasi merupakan simbol yang digunakan untuk menggambarkan lamanya waktu dari objek saat digunakan. 4. Pesan Pesan merupakan simbol yang digunakan untuk menyampaikan method dari setiap objek yang ada. 5. Self-call Self-call merupakan simbol yang digunakan untuk menunjukkan bahwa sebuah objek mengirimkan pesan kepada objek itu sendiri. 6. Return Return merupakan simbol yang digunakan untuk menandakan respon dari pesan yang disampaikan oleh suatu objek.
24 7. Frame Frame merupakan simbol yang digunakan untuk menandakan area yang mengalami perulangan, seleksi, atau ketentuan. 2.1.3.4 Activity Diagram Activity diagram merupakan gambaran mengenai alur sebuah proses bisnis, langkah dalam sebuah use case, dan logika sebuah tindakan objek (Whitten & Bentley, 2007). Gambar 2.10 Contoh Activity Diagram Elemen-elemen pada activity diagram: 1. Initial node Initial node merupakan simbol yang merepresentasikan mulainya
25 2. Action Action merupakan simbol yang merepresentasikan suatu aktivitas yang digambarkan sesuai urutan actions. 3. Flow Flow merupakan simbol yang merepresentasikan jalur dari satu aktivitas ke aktivitas lain 4. Decision/Merge Decision/Merge merupakan simbol yang merepresentasikan keadaan kondisional. Decision mengindikasikan kondisi untuk memilih salah satu alur aktivitas sedangkan merge mengindikasikan bergabungnya alur aktivitas yang dipisahkan oleh decision sebelumnya. 5. Fork/ Join Fork merupakan simbol yang mengindikasikan adanya dua atau lebih actions yang berlangsung secara bersamaan sedangkan join mengindikasikan berakhirnya sebuah proses paralel. 6. Activity final Activity final merupakan simbol yang merepresentasikan akhir sebuah proses.
26 2.1.4 World Wide Web (WWW) Berdasarkan pendapat (McLeod, 2004, p4) World Wide Web atau WWW mendefinisikan informasi yang diakses melalui internet dimana dokumen hypermedia disimpan dan dapat diambil dengan skema pengalaman yang unik. Internet menyediakan arsitektur jaringan pada web menyediakan metode untuk penyimpanan dan pengambilan dokumen. 1. Website Sebuah computer yang terhubung dengan internet yang mengangung hypermedia yang dapat di akses oleh computer lain dalam jaringan dengan penghubung hypertext. 2. Hypertext link Sebuah penunjuk dari teks atau grafis yang digunakan untuk mengakses hypertext yang tersimpan oleh Website lain. 3. Web Page Sebuah file hypermedia yang tersimpan dengan alamat Website yang unik. 4. Home Page Halaman pertama pada sebuah Website. Halaman lain dapat diakses melalui Home Page.
27 5. Browser Perangkat lunak yang dirancang untuk menemukan dan membaca file pada internet yang dituliskan dalam Hyper Text Markup Language (HTML). 6. URL (Uniform Resource Locator) Mengacu pada alamat dari sebuah website. 7. Protocol Sebuah aturan standar yang memerintahkan komunikasi data. HTTP adalah protocol untuk hypertext. Protocol lain pada web adalah FTP (File Transfer Protocol). 8. Domain Name Alamat dari Website dimana web page disimpan. 2.1.5 Software Engineering Menurut (Roger S. Pressman, 2009, p5) adalah penggunaan dan pembentukan dalam prinsip prinsip rekayasa suara dimana yang berfungsi untuk mendapatkan suatu software yang ekonomis sehingga dapat bekerja secara efisien pada mesin nyata.
28 2.1.6 JavaScript Menurut (Abdul Kadir, 2011, p13, p15) JavaScript adalah kode untuk menyusun halaman web yang memungkinkan di jalankan di sisi pengguna. Karena dijalankan di sisi pengguna, maka JavaScript dapat digunakan untuk membuat tampilan lebih bersifat dinamis. Menampilkan jam lokal secara terus menerus, melakukan perhitungan terhadap data dalam formulir, mengubah ubah warna pada baris tertentu dalam suatu tabel dapat dikerjakan dengan menggunakan JavaScript. Contoh tag JavaScript : Gambar 2.11 Script JavaScript (Abdul Kadir, 2011, p13, p15)
29 2.1.7 Waterfall Model Menurut (Pressman, 2010, p39) Waterfall Model disebut juga dengan Classic Life Cycle, menyediakan sebuah pendekatan sistematik dan sekuensial pada pengembangan software yang dimulai dengan spesifikasi kebutuhan customer dan berlangsung melalui planning, modeling, construction, deployment, dan terakhir ongoing support pada software yang telah jadi. Gambar 2.12 Model Proses Waterfall (S.Pressman, 2010:39) 2.1.7.1 Communication Dalam tahap ini terdiri dari dua, yaitu Project Initiation dan Requirements Gathering. Requirements Gathering yang dilakukan harus secara intensif dan difokuskan kepada software.
30 2.1.7.2 Planning Setelah Communication, maka akan masuk ke tahap berikutnya yaitu Planning. Terdiri dari tiga, yaitu Estimating, Scheduling, Tracking. Pada tahap ini software engineer melakukan penjadwalan untuk menyelesaikan tahap tahap pembuatan software berdasarkan waktu yang telah dijadwalkan. 2.1.7.3 Modeling Setelah Planning, maka akan masuk ke tahap berikutnya yaitu Modeling. Terdiri dari 2, yaitu Analysis dan Design. Pada tahap Design akan focus pada empat atribut program yaitu Data Structure, Software Architecture, Interface Representation, and Algorithm Detail. Pada tahap ini mengubah requirements menjadi software representation sebelum penulisan code dimulai. 2.1.7.4 Construction Setelah Modeling, maka akan masuk ke tahap berikutnya yaitu Construction. Terdiri dari 2, yaitu Code dan Test. Pada tahap ini Design akan diubah ke dalam bentuk bahasa yang dimengerti oleh mesin. Setelah penulisan code sudah selesai, maka program tersebut akan diuji. Pengujian ini dilakukan agar segala bentuk kesalahan dapat dibetulkan dan
31 juga agar input yang dimasukkan dapat menghasilkan keluaran yang sesuai. 2.1.7.5 Deployment Setelah Construction, maka akan masuk ke tahap berikutnya, yaitu Deployment. Terdiri dari tiga, yaitu Delivery, Support, Feedback. Pada tahap ini Software Engineer menyediakan dokumentasi untuk semua fitur dan fungsi yang ada dalam program yang sudah dibuat sehingga memudahkan user dalam menggunakan program tersebut. Dan juga Software Engineer mendapat umpan balik dari user terhadap software yang dibuat untuk perbaikan yang lebih baik dengan modifikasi fungsi dan fiturnya. 2.1.8 Designing Relational Database Menurut (Satzinger, Jackson & Burd, 2005, p409) Designing Relational Database merupakan perancangan basis data relasional (Database Relational) dari sebuah class diagram. Terdapat beberapa langkah dalam merubah sebuah class diagram menjadi Relational Database. 2.1.8.1 Membuat tabel untuk setiap class. Merupakan langkah pertama dalam membuat database relasional, dengan membuat tabel untuk setiap class pada class diagram. Nama atribut dari tabel akan disamakan
32 dengan yang sudah didefinisikan dalam class diagram. Untuk mencegah kebingungan, nama tabel dan nama atribut disamakan dengan class diagram dan kamus data. 2.1.8.2 Memilih primary key untuk setiap class. Primary key untuk setiap tabel. Bila dalam sebuat tabel sudah ada sebuat atribut yang unik, maka atribut tersebut dapat dipilih sebagai primary key. 2.1.8.3 Tambahkan foreign key menunjukan hubungan one-to-one Setiap foreign key menunjukkan hubungan antar tabel yang memiliki foreign key dengan tabel yang menggunakan key yang sama sebagai primary key. Saat menunjukkan hubungan one-to-one, foreign key tidak menjadi bagian dari primary key dari table tersebut. 2.1.8.4 Buat tabel baru untuk menunjukan many-to-many. Bila terdapat suatu hubungan many-to-many antar tabel, maka tabel tersebut harus dipisahkan menjadi beberapa tabel dan memiliki lebih darisatu primary key. 2.1.8.5 Mempresentasikan hirarki dari class. Hirarki dari class ditunjukkan dengan hubungan parent class dengan child class, dimana parent class menurunkan beberapa atau seluruh atribut dan method ke child class. Ada dua (2) cara untuk merepresentasikannya:
33 1. Mengkombinasikan seluruh tabel ke dalam sebuah tabel yang memiliki seluruh atribut dari semua child class. 2. Menggunakan beberapa tabel untuk merepresentasikan child class dengan menggunakan primary key dari parent class sebagai primary key dari child class. 2.1.8.6 Mendefinisikan batasan referensi integritas. Di atas sudah dijelaskan mengenai bagaimana foreign key digunakan untuk merepresentasikan suatu hubungan antar tabel. Pada bagian ini, dijelaskan sebuah hubungan konsisten antara nilai foreign key dengan primary key. Setiap foreign key mereferensikan sebuah primary key dari tabel lain. Namun pada suatu kondisi tertentu, terdapat sebuah nilai foreign key yang muncul di suatu tabel dan juga berperan sebagai primary key pada tabel yang bersangkutan, yang biasa disebut referencial integrity constraint. 2.1.8.7 Mengevaluasi kualitas skema dan membuat perbaikan bila diperlukan. Setelah pembuatan sekumpulan tabel, desainer database harus meninjau kualitas skema yang telah dibuat. Sebuah data model yang memiliki kualitas yang bagus harus mempunyai beberapa fitur seperti: 1. Keunikan suatu set baris pada tabel dan primary key. 2. Data tidak redundan.
34 3. Kemudahan dalam modifikasi model data di masa yang akan datang. 2.1.8.8 Memilih tipe data yang sesuai dan batasan nilai untuk setiap kolom bila diperlukan. Pada tahap akhir, setiap atribut yang ditulis ke dalam database relasional, diberi tipe data yang sesuai dan batasanbatasan yang diperlukan untuk setiap atribut. 2.1.9 Rancangan Layar (Storyboard) Menurut (Dastbaz, 2003, p165), Storyboard adalah sebuah cara untuk merancang sebuah sistem multimedia dengan menggambar semua unsur dan elemen yang akan dibuat dan berisi informasi mengenai sketsa yang akan diimplementasi. Storyboard harus memberikan informasi mengenai elemen yang digunakan dalam multimedia, dalam memilih media sebaiknya harus berhati hati karena untuk menunjukan kenyamanan dalam melakukan presentasi. Storyboard digunakan agar diharapkan mendapatkan feedback dari rancangan yang akan dibuat, sehingga semua ide dan masukan dapat terlaksana dengan baik.
35 2.2 Teori Khusus Teori khusus merupakan teori yang berhubungan dengan topik yang dibahas dalam penelitian ini. Teori ini menjadi pendukung dalam penyusunan penelitian. 2.2.1 PHP (Hypertext Preprocessor) Menurut (Kadir 2008,p11) PHP merupakan sebuah sebuah bahasa pemrograman berbasis web berbentuk script yang ditempatkan dan di proses dalam server. PHP merupakan bahasa pemrograman yang bersumber dari perl merupakan pengembangan dari bahsa C. oleh karena itu, struktur pemrograman sama dengan yang ada di C. PHP mempunyai banyak keunggulan dibandingkan dengan bahasa pemrograman berbasis web yang lain. Seperti open source software. PHP mampu berintegrasi dengan berbagai macam jenis database. Database yang paling umum digunakan dalam PHP adalah MySQL. 2.2.2 MySQL Menurut (Welling dan Thompson, 2008, p3-4) MySQL berarti sebuah sistem manajemen hubungan antar basis data yang sangat cepat dan sempurna. MySQL merupakan alat bantu untuk manipulasi basis data, sehingga basis data dapat dengan mudah diisi, diambil, disusun, dan diubah datanya. Server MySQL pun dapat
36 mengatur kontrol akses dari data, sehingga beberapa pengguna dapat sekaligus bekerja pada waktu yang bersamaan. Beberapa kelebihan MySQL, dibandingkan dengan sistem basis data sejenis seperti Microsoft SQL Server, Oracle : 1. Kemampuan tinggi. 2. Tidak membutuhkan biaya untuk mendapatkan MySQL. 3. Mudah untuk konfigurasi dan dipelajari. 4. Dapat dijalankan pada beberapa sistem operasi seperti sistem Unix dan Microsoft Windows. 2.2.3 XAMPP Menurut pendapat (Betha Sidik, 2012, p72-73) XAMPP (X(Windows/Linux) Apache MySQL PHP dan Perl) merupakan paket server web PHP dan database MySQL yang paling populer di kalangan pengembang web dengan menggunakan PHP dan MySQL sebagai database-nya. Paket XAMPP, sesuai dengan kepanjangannya, X yang berarti Windows atau Linux, pengguna bisa memilih paket yang diinginkan untuk Windows atau Linux. XAMPP termasuk paket server yang paling mudah digunakan sebagai paket untuk pengembangan aplikasi web. XAMPP termasuk juga paket yang paling bagus update-nya, sehingga paling baik dipilih untuk digunakan oleh development atau pun untuk produksi. XAMPP
37 dapat diperoleh dari http://xampp.org atau http://apachefriends.org. XAMPP memiliki paket yang bisa diunduh dalam bentuk : Installer File ZIP USB Paket dalam bentuk USB disediakan oleh XAMPP agar pengembang dapat membawa-bawa paket ini dengan dipasang di USB agar pengembang dapat dengan mudah melakukan pengembangan di komputer mana pun.