RANCANG BANGUN APLIKASI TOKO ONLINE BERBASIS WEB RESPONSIVE MENGGUNAKAN HMVC PADA CODEIGNITER TUGAS AKHIR Sebagai Persyaratan Guna Meraih Sarjana Strata 1 Teknik Informatika Universitas Muhammadiyah Malang Disusun Oleh: Jiwanto Ardi 09560432 JURUSAN TEKNIK INFORMATIKA FAKULTAS TEKNIK UNIVERSITAS MUHAMMADIYAH MALANG 2016 i
LEMBAR PERSETUJUAN RANCANG BANGUN APLIKASI TOKO ONLINE BERBASIS WEB RESPONSIVE MENGGUNAKAN HMVC PADA CODEIGNITER TUGAS AKHIR Sebagai Persyaratan Guna Meraih Sarjana Strata 1 Teknik Informatika Universitas Muhammadiyah Malang Disusun Oleh : Jiwanto Ardi 09560432 Telah diperiksa dan disetujui, Dosen Pembimbing I Dosen Pembimbing II Maskur, S.Kom, M.Kom. Zamah Sari, S.T, M.T. NIP. 108.1410.0542 NIP. 108.1410.0555 ii
SURAT PERNYATAAN Yang bertanda tangan dibawah ini: Nama : Jiwanto Ardi NIM : 09560432 Fak / jur : Teknik Informatika Dengan ini saya menyatakan bahwa tugas akhir saya dengan judul: Rancang Bangun Aplikasi Toko Online Berbasis Web Responsive Menggunakan HMVC Pada Codeigniter. Adalah bukan merupakan karya tulis orang lain, baik sebagian maupun keseluruhan, kecuali dalam bentuk kutipan yang telah disebutkan sumbernya. Demikian surat pernyataan ini saya buat dengan sebenar-benarnya dan apabila surat pernyataan ini tidak benar, saya siap mendapatkan sanksi akademis. Malang, 3 Mei 2016 Yang Menyatakan (Jiwanto Ardi) Mengetahui, Dosen Pembimbing I Dosen Pembimbing II Maskur, S.Kom, M.Kom. Zamah Sari, S.T, M.T. NIP. 108.1410.0542 NIP. 108.1410.0555 iv
ABSTRAK Sistem aplikasi web toko online menggunakan hmvc pada codeigniter diharapkan dapat memberi kemudahan kepada para pelaku bisnis online dalam melakukan kegiatan usaha jual beli dan memudahkan para programmer web dalam mengembangkan sistem aplikasi ini karena programmer dapat membongkar dan memasang sebuah modul tanpa mempengaruhi sistem yang sedang berjalan. Perancangan sistem aplikasi ini dikembangkan dengan menggunakan perangkat lunak XAMPP dan adobe dreamweaver cs6. Dengan menggunakan XAMPP, paket - paket aplikasi yang kita perlukan dalam merancang sebuah situs yang baik seperti Apache Web Server, PHP dan MySQL telah tersedia. Sistem aplikasi web toko online ini meliputi pemakaian situs oleh superadmin, admin, guest, dan member. Kata Kunci : hmvc, codeigniter, xampp, php v
ABSTRACT Web application system online store using hmvc on codeigniter is expected to provide convenience to business people conducting business online in selling buying and facilitates web programmers in developing this application system because programmer can unpack and install a module without affecting the running system. This application system design software developed using XAMPP and Adobe Dreamweaver CS6. By using the XAMPP package - a package of applications that we need in designing a good site such as Apache Web Server, PHP and MySQL are available. Online store web application system includes the use of the site by superadmin, admin, guest, and member. Keywords : hmvc, codeigniter, xampp, php vi
LEMBAR PERSEMBAHAN Puji syukur kepada Allah SWT atas rahmat, hidayah, dan karunia-nya, penulis dapat menyelesaikan Tugas Akhir dengan judul Rancang Bangun Aplikasi Toko Online Berbasis Web Responsive Menggunakan HMVC Pada Codeigniter. Atas terselesaikannya Tugas Akhir ini, dengan kerendahan hati, penulis menyampaikan banyak terima kasih kepada: 1. Bapak Maskur, S.Kom, M.Kom dan Bapak Zahmah Sari, S.T, M.T selaku pembimbing tugas akhir saya. 2. Bapak/Ibu Rektor Universitas Muhammadiyah Malang. 3. Bapak/Ibu Dekan Fakultas Teknik Universitas Muhammadiyah Malang. 4. Bapak/Ibu Ketua Jurusan Teknik Informatika Universitas Muhammadiyah Malang. 5. Bapak/Ibu Dosen Jurusan Teknik Informatika Universitas Muhammadiyah Malang 6. Kedua Orang Tua tercinta, Ayahanda Sukardi dan Ibunda Sumarmi. Terima kasih atas segala pengorbanan dan kasih sayang yang kalian berikan, serta doa - doa yang sangat istimewa dan yang terbaik yang kalian kirimkan lewat perantara-nya. 7. Seluruh teman teman i-class angkatan 2009. 8. Seluruh teman teman Ikabama Universitas Muhammadiyah Malang, terima kasih atas pengalaman yang diberikan. vii
LEMBAR PENGESAHAN RANCANG BANGUN APLIKASI TOKO ONLINE BERBASIS WEB RESPONSIVE MENGGUNAKAN HMVC PADA CODEIGNITER Tugas Akhir Diajukan Sebagai Syarat Untuk Memperoleh Gelar Sarjana (S1) Di Fakultas Teknik Universitas Muhammadiyah Malang Disusun Oleh : Nama : Jiwanto Ardi Nim : 09560432 Tugas Akhir ini telah disetujui dan dinyatakan lulus oleh tim penguji Pada hari senin 3 mei 2016 Disetujui Oleh, Dosen Penguji 1 Dosen Penguji 2 Aminudin, S.Kom, M.Cs. Eko Budi Cahyono, S.Kom, M.T. NIDN. 0701068603 NIP. 108.9504.0330 Mengetahui Kepala Jurusan Teknik Informatika Yuda Munarko, S.kom, M.Sc. NIP. 108.0611.0443 iii
KATA PENGANTAR Segala puji bagi Allah SWT, Tuhan seluruh alam atas limpahan rahmat dan hidayah-nya sehingga penulis dapat menyelesaikan tugas akhir yang berjudul : RANCANG BANGUN APLIKASI TOKO ONLINE BERBASIS WEB RESPONSIVE MENGGUNAKAN HMVC PADA CODEIGNITER Pada tugas akhir ini disajikan pokok-pokok pembahasan yang meliputi pendahuluan, landasan teori, perancangan sistem, implementasi dan pengujian sistem. Penulis menyadari bahwa masih terdapat banyak kekurangan dan keterbatasan dalam tugas akhir ini. Oleh karena itu, penulis mengharapkan masukan berupa saran dan kritik yang membangun agar tulisan ini dapat lebih bermanfaat bagi perkembangan ilmu pengetahuan kedepan. Akhir kata penulis berharap semoga tugas akhir ini dapat bermanfaat dan menjadi tambahan ilmu pengetahuan bagi pembaca sekalian. Penulis juga menyampaikan terima kasih kepada semua pihak yang telah membantu terselesaikannya tugas akhir mulai dari tahap awal hingga akhir. Malang, 3 Mei 2016 viii Penulis
DAFTAR ISI HALAMAN JUDUL... LEMBAR PERSETUJUAN... LEMBAR PENGESAHAN... LEMBAR PERNYATAAN... ABSTRAK... ABSTRACT... LEMBAR PERSEMBAHAN... KATA PENGANTAR... DAFTAR ISI... DAFTAR GAMBAR... DAFTAR TABEL... Hal. i ii iii iv v vi vii viii ix xii xiv BAB I : PENDAHULUAN... 1 1.1 Latar Belakang... 1 1.2 Rumusan Masalah... 2 1.3 Tujuan... 2 1.4 Batasan Masalah... 2 1.5 Metodologi... 3 BAB II : LANDASAN TEORI... 4 2.1 Web Toko Online... 4 2.2 Hierarchical Model View Controller (HMVC)... 5 2.3 Framework... 5 2.3.1 Codeigniter... 6 2.3.2 Gocart... 8 2.33 Raja Ongkir... 8 ix
2.4 Basis Data... 9 2.4.1 Database Management System (DBMS)... 10 2.5 Unified Modeling Language... 10 2.5.1 Bagian Bagian UML... 10 2.5.2 Tujuan Penggunaan UML... 14 BAB III : ANALISA DAN PERANCANGAN SISTEM... 15 3.1 Analisa Sistem... 15 3.1.1 Arsitektur Sistem... 15 3.2 Perancangan HMVC... 16 3.3 Perancangan UML... 17 3.3.1 Use Case Diagram Sistem... 18 3.3.2 Activity Diagram Sistem... 19 3.3.3 Sequence Diagram Sistem... 21 3.3.4 Class Diagram Sistem... 24 3.3.5 Desain Database... 25 3.3.6 Desain Interface... 28 BAB IV : IMPLEMENTASI DAN PENGUJIAN... 29 4.1 Implementasi Sistem... 29 4.1.1 Implementasi Pengembangan Perangkat Keras... 29 4.1.2 Implementasi Lingkungan Pengembangan Perangkat Lunak... 30 4.2 Antar Muka Sistem... 30 4.2.1 Halaman Backend... 30 4.2.2 Halaman Frontend... 35 4.3 Alur Proses Pemesanan... 41 4.4 Pengujian Sistem... 42 4.4.1 Blackbox Testing... 42 x
4.4.2 Pengujian Kuesioner... 46 4.4.2 Pengujian Performa Test... 48 BAB V : KESIMPULAN DAN SARAN... 51 5.1 Kesimpulan... 51 5.2 Saran... 52 DAFTAR PUSTAKA... 53 xi
DAFTAR GAMBAR Hal. Gambar 2.1 Konsep HMVC... 5 Gambar 3.1 Arsitektur Sistem... 15 Gambar 3.2 Struktur MVC Framework Codeigniter... 16 Gambar 3.3 Struktur HMVC... 17 Gambar 3.4 Use Case Diagram Backend Sistem... 18 Gambar 3.5 Use Case Diagram Frontend Sistem... 18 Gambar 3.6 Activity Diagram Backend Superadmin... 19 Gambar 3.7 Activity Diagram Backend Admin... 20 Gambar 3.8 Activity Diagram Frontend Login User... 20 Gambar 3.9 Activity Diagram Frontend Guest User... 21 Gambar 3.10 Sequence Diagram Backend Superadmin... 22 Gambar 3.11 Sequence Diagram Backend Admin... 22 Gambar 3.12 Sequence Diagram Frontend Member... 23 Gambar 3.13 Sequence Diagram Frontend Guest User... 23 Gambar 3.14 Class Diagram... 24 Gambar 3.15 Designer Relational Database... 28 Gambar 3.16 Tampilan Interface... 28 Gambar 4.1 Tampilan Halaman Modul Katalog... 30 Gambar 4.2 Tampilan Halaman Modul Pesanan... 31 Gambar 4.3 Tampilan Halaman Modul Konfirmasi Pembayaran... 31 Gambar 4.4 Tampilan Halaman Modul Pelanggan... 32 Gambar 4.5 Tampilan Halaman Modul Pelanggan Group... 32 Gambar 4.6 Tampilan Halaman Modul Kupon Diskon... 33 Gambar 4.7 Tampilan Halaman Modul Laporan Penjualan... 33 xii
Gambar 4.8 Tampilan Halaman Modul Kurir dan Pembayaran... 33 Gambar 4.9 Integrasi API Ongkos Kirim... 35 Gambar 4.10 Tampilan Halaman Home... 36 Gambar 4.11 Tampilan Kupon Diskon... 37 Gambar 4.12 Tampilan Member Diskon... 37 Gambar 4.13 Tampilan Alamat Tagihan dan Pengiriman... 38 Gambar 4.14 Tampilan Metode Pengiriman... 39 Gambar 4.15 Tampilan Metode Pembayaran... 39 Gambar 4.16 Tampilan Submit Pesanan... 40 Gambar 4.17 Tampilan Submit Pesanan Ke Email... 40 Gambar 4.18 Tampilan Konfirmasi Pembayaran... 41 Gambar 4.19 Alur Proses Pemesanan... 41 Gambar 4.20 Hasil Pengujian Performance Test... 49 xiii
DAFTAR TABEL Hal. Tabel 3.1 Structure Tabel Katalog Produk... 25 Tabel 3.2 Structure Tabel Kategori Produk... 25 Tabel 3.3 Structure Tabel Pelanggan... 26 Tabel 3.4 Structure Tabel Pesanan... 26 Tabel 3.5 Structure Tabel Kupon Diskon... 27 Tabel 3.6 Structure Tabel Konfirmasi Pembayaran... 27 Tabel 4.1 Pengujian Halaman Backend... 43 Tabel 4.2 Pengujian Halaman Frontend... 44 Tabel 4.3 Pertanyaan Kuesioner... 46 Tabel 4.4 Jawaban Kuesioner... 47 Tabel 4.5 Pemberian Nilai Pada Jawaban... 47 xiv
DAFTAR PUSTAKA Connolly, Thomas M. and Carolyn E. Begg. 2005. Database System : A Practical Approach to Design, Implementation, and Management Fourth Edition. USA: Addison Wesley, Longman Inc. Edhy Sutanta. (2004). Sistem Basis Data. Yogyakarta: Graha Ilmu Kadir, Abdul. 2003. Pengenalan Sistem Informasi. Yogyakarta: Penerbit Andi. McLeod, Raymond dan Schell, George. 2004. Sistem Informasi Manajemen. Diterjemahkan oleh Hendra Teguh. Edisi Delapan. Jakarta: PT Indeks. Saputra, Agus. 2011. Trik dan Solusi Pemrograman PHP, Jakarta : PT. Elex Media Komputindo. EllisLab, Inc. (2012). CodeIgniter - Open source PHP web application framework, consulted January 2012. http://www.php.net/ diakses tanggal 18 12 2015, jam 14.14 http://www.codeigniter.com/ diakses tanggal 18 12 2015, jam 14.13 53
BIOGRAFI PENULIS Jiwanto Ardi adalah seorang mahasiswa Teknik Informatika Universitas Muhammadiyah Malang. Lahir di Kota Malang pada tanggal 1 November 1990. Pernah menempuh jenjang Sekolah di SDK 1 Mardiwiyata Malang sampai tahun 2003. Kemudian melanjutkan jenjang pendidikan di SMPN 8 Malang hingga tahun 2006. Selanjutnya Melanjutkan Pendidikan di SMAN 2 Malang sampai tahun 2009. Dan kemudian menempuh jenjang perguruan tinggi di Universitas Muhammadiyah Malang hingga tahun 2016. Selagi orang tidur saya bangun, Selagi orang bangun saya jalan, Selagi orang jalan saya lari.