pembuatan toko online menggunakan framework …eprints.uns.ac.id/11499/1/337042512201311412.pdf ·...
TRANSCRIPT
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
i
PEMBUATAN TOKO ONLINE MENGGUNAKAN
FRAMEWORK CODEIGNITER DI TOKO LARAS MULYO
JILBAB
TUGAS AKHIR Diajukan Untuk Memenuhi Salah Satu Syarat Mencapai Gelar Ahli Madya
Program Diploma III Teknik Informatika
Disusun Oleh :
LARAS SETYOWATI
NIM.M3110086
PROGRAM DIPLOMA III TEKNIK INFORMATIKA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUN
ALAM
UNIVERSITAS SEBELAS MARET
SURAKARTA
2013
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
iv
ABSTRACT
Laras Setyowati, 2013. THE MAKING OF SHOPPING ONLINE
USING CODEIGNITER FRAMEWORK “TOKO LARAS MULYO JILBAB”.
Diploma of Informatic Enginering, Faculty of Mathematics and Natural
Sciences, University of Sebelas Maret Surakarta.
Internet is one of the facilities that are very practical and economical
way to deliver information all around the world. The online store is one of the
activities of buying and selling electronically through the Internet. The purpose of
this final project is to create an online store application for “Laras Mulyo Jilbab”
clothing stores. “Laras Mulyo Jilbab” online store is a website that provides the
facility to sell specialty shop products of “Laras Mulyo Jilbab” and simplify and
introduce products with a media campaign using web.
The method that is used in the preparation of this final project are
observation and study literature. This program was developed using CodeIgniter
Framework and MySQL database. Macromedia Dreamweaver is used as and
HTML editor, and Adobe Photoshop for website design. This application has two
main functions. First, admin can manage prodct data, category data, user data,
manage orders, and pbtain customer purchase histori reports. is for general
users, any website visitor can see the product, but can not order the products,
second, is that customers can order the products, Finally, was the admin who can
do the management of product data, categorical data, user data, manage orders
and obtain customer purchase history reports. Second, costumer can order the
product exceptbfor the general using only see the product on the website.
With the online store application is expected to provide facilities that
relative more convenient for customers.
Keywords : Application online store , Laras Mulyo Jilbab, codeigniter
framework, MySQL.
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
v
ABSTRAK
Laras Setyowati, 2013. PEMBUATAN TOKO ONLINE
MENGGUNAKAN FRAMEWORK CODEIGNITER DI TOKO LARAS
MULYO JILBAB. Diploma III Teknik Informatika Fakultas Matematika
dan Ilmu Pengetahuan Alam, Universitas Sebelas Maret Surakarta.
Internet merupakan salah satu fasilitas yang sangat praktis dan ekonomis
untuk menyampaikan informasi di hampir seluruh penjuru dunia. Toko online
adalah salah satu aktivitas membeli dan menjual secara elektronik melalui
jaringan internet. Tujuan dari Tugas Akhir ini adalah untuk membuat sebuah
aplikasi toko online mengenai toko baju Laras Mulyo Jilbab. Toko online Laras
Mulyo Jilbab merupakan suatu web yang menyediakan fasilitas untuk menjual
produk khusus toko Laras Mulyo serta menyederhanakan dan memperkenalkan
produk dengan suatu media promosi yang mengunakan web.
Metode yang digunakan dalam penyusunan Tugas Akhir ini adalah
observasi dan studi pustaka. Program ini dikembangkan menggunakan
Framework CodeIgniter dan database MySQL. Macromedia Dreamweaver
sebagai editor HTML dan Adobe Photoshop untuk desain website. Aplikasi ini
memiliki dua fungsi utama. Pertama admin yang dapat melakukan pengelolaan
data produk, data kategori, data user, mengelola pesanan dan memperoleh laporan
riwayat belanja pelanggan. Kedua, pelanggan bisa melakukan pemesanan produk,
kecuali bagi pengguna umum hanya dapat melihat produk saja.
Dengan aplikasi toko online ini diharapkan dapat memberikan fasilitas
yang lebih nyaman bagi pelanggan. Bukan itu saja, juga mempermudah pemilik
toko dalam pemasaran dan pengelolaan data-data penjualan produknya.
Kata Kunci : Aplikasi toko online , Laras Mulyo Jilbab, framework codeigniter,
MySQL.
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
vi
MOTTO
Tidak ada kenikmatan lebih tinggi dari kenikmatan melampaui kesulitan,
dari satu sukses ke sukses lainnya, membangun keinginan-keinginan baru
dan melihatnya terwujud
(Samuel Johnson)
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
vii
PERSEMBAHAN
Tugas Akhir ini Penulis Persembahkan Kepada :
Allah SWT
Bapak dan ibu yang selalu mendukung, memberikan semangat dan
doa selama ini sehingga tugas akhir ini dapat terselesaikan.
Suamiku, yang selalu mendukung dan mendoakanku.
Kakak-kakakku, mbak Ani dan mbak Tari & Adik-adikku, Jimmy
dan Astri yang menjadi semangatku untuk selalu jadi contoh kakak
yang baik.
Am Syonk, Faridut, Fika, Ika, Gina, Sofyan dan teman-teman D3
Teknik informatika 2010.
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
viii
KATA PENGANTAR
Puji syukur ke hadirat Tuhan YME yang telah melimpahkan rahmat dan
barokahnya sehingga penulis dapat menyelesaikan Tugas Akhir dengan judul “
Pembuatan Toko Online Menggunakan Framework Di Toko Laras Mulyo Jilbab ”.
Laporan Tugas Akhir ini disusun untuk memenuhi salah satu syarat dalam
memperoleh gelar Amd.) pada Program Studi Diploma III Teknik Informatika
Universitas Sebelas Maret.
Dalam melakukan penelitian dan penyusunan laporan Tugas Akhir ini
penulis telah mendapatkan banyak dukungan dan bantuan dari berbagai pihak.
Penulis mengucapkan terima kasih yang tak terhingga kepada:
1. Ir. Ari Handono Ramelan, M.Sc, Ph.D selaku Pimpinan Fakultas MIPA
Universitas Sebelas Maret yang memberikan izin kepada penulis untuk
belajar.
2. Bapak Drs. Y.S Palgunadi, M.Sc. selaku Ketua Program Studi Diploma III
Teknik Informatika Universitas Sebelas Maret yang memberikan izin
kepada penulis untuk belajar.
3. Ibu Tutut Maitanti, S.Si, M.Kom. selaku dosen pembimbing yang telah
dengan penuh kesabaran dan ketulusan memberikan ilmu dan bimbingan
terbaik kepada penulis.
4. Para Dosen Program Studi Diploma III Teknik Informatika Universitas
Sebelas Maret yang telah memberikan bekal ilmu kepada penulis.
5. Para Karyawan/wati Program Studi Diploma III Teknik Informatika
Universitas Sebelas Maret yang telah membantu penulis dalam proses
belajar.
6. Ayah dan Ibu tercinta, rekan-rekan kuliah yang telah banyak memberikan
dukungan dan doanya.
Penulis menyadari sepenuhnya bahwa laporan Tugas Akhir ini masih jauh
dari sempurna. Akan tetapi penulis berharap ini dapat memberikan manfaat dan
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
ix
memberikan wawasan tambahan bagi para pembaca dan khususnya bagi penulis
sendiri.
Surakarta, 30 Juli 2013
Laras Setyowati
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
x
DAFTAR ISI
HALAMAN PENGESAHAN……………………………………………………. ii
HALAMAN PENGESAHAN…………………………………………………….iii
ABSTRACT………………………………………………………………………...iv
ABSTRAK………………………………………………………………………... v
MOTTO…………………………………………………………………………...vi
PERSEMBAHAN……………………………………………………………….. vii
KATA PENGANTAR………………………………………………………… vii-ix
DAFTAR ISI……………………………………………………………………… x
DAFTAR GAMBAR……………………………………………………………..xii
DAFTAR TABEL…………………………………………………………….. xv
BAB IPENDAHULUAN…………………………………………………………. 1
1.1 Latar Belakang……………………………………………………........... 1
1.2 Perumusan Masalah……………………………………………………... 2
1.3 Batasan Masalah Penelitian……………………………………………... 3
1.4 Tujuan Penelitian………………………………………………………... 3
1.5 Manfaat Penelitian………………………………………………………. 3
1.6 Sistematika Penulisan..........................................................................................4
BAB II LANDASAN TEORI…………………………………………………….. 5
2.1 Rekayasa Perangkat Lunak……………………………………………… 5
2.2 UML……………………………………………………………………... 6
2.2.1 Static View…………………………………………………………. 6
2.2.2 DynamicView……………………………………………………… 6
2.2.3 Functional View……………………………………………………. 7
2.2.3.1 Use Case Diagram………………………………………… 7
2.2.3.2 ActivityDiagram……………………………………………. 7
2.2.3.3 Class Diagram……………………………………………… 9
2.2.3.5 Sequence Diagram………………………………………... 10
2.3 Toko Online……………………………………………………………. 11
2.4 Codeigniter…………………………………………………………….. 12
2.5 Adobe Dreamweaver 8………………………………………………… 15
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
xi
BAB III ANALISA KEBUTUHAN DAN PERANCANGAN SISTEM……….. 16
3.1 Kebutuhan Alat dan Bahan…………………………………………….. 16
3.1.1 Kebutuhan Hardware……………………………………………... 16
3.1.2 Kebutuhan Software……………………………………………… 16
3.2 Kebutuhan Sistem……………………………………………………… 17
3.2.1 Kebutuhan Fungsional…………………………………………… 17
3.2.2 Kebutuhan Non Fungsional……………………………………… 19
3.3 Jalannya Penelitian……………………………………………………...20
3.4 Perancangan Sistem…………………………………………………… 23
3.4.1 Pemodelan Use Case……………………………………………... 23
3.4.1.1 Deskripsi Aktor………………………………………………. 23
3.4.1.2 Hak dan Kewajiban Aktor……………………………………. 23
3.4.1.3 Deskripsi Use Case…………………………………………… 24
3.4.1.4 Diagram Use Case……………………………………………. 25 3.4.2 Diagram Activity………………………………………………………... 28
3.4.2.1 Diagram Activity Manajemen Kategori…………………………….. 28
3.4.2.2 Diagram Activity Manajemen Produk………………………………. 30
3.4.2.3 Diagram Activity Login Admin dan Pelanggan…………………….. 31
3.4.2.4 Diagram Activity Pembelian Barang………………………………...32
3.4.2.5 Diagram Activity Registrasi Akun………………………………….. 33
3.4.2.6 Diagram Activity Manajemen Pesanan……………………………… 33
3.4.2.7 Diagram Activity Manajemen Pelanggan…………………………… 34
3.4.3 Class Diagram…………………………………………………………... 35
3.4.4 Diagram Sequence……………………………………………………… 37
3.5 Perancangan Database………………………………………………………… 51
3.5.1 ERD……………………………………………………………………... 51
3.5.2 Skema Diagram………………………………………………………… 52
3.5.3 Struktur Tabel Data……………………………………………………… 53
3.6 Perancangan Interface…………………………………………………………. 61
BAB IV IMPLEMENTASI DAN ANALISA…………………………………… 66
4.1 Implementasi Database………………………………………………… 66
4.2 Implementasi Tampilan……………………………………………………….. 69
4.2.1 Tampilan Halaman Admin……………………………………………… 69
4.2.2 Tampilan Halaman Publik………………………………………………. 73
4.3 Pengujian Sistem dan Analisa………………………………………………… 77
BAB V PENUTUP……………………………………………………………… 84
5.1 Kesimpulan…………………………………………………………….. 84
5.2 Saran…………………………………………………………………… 84
DAFTAR PUSTAKA…………………………………………………………… 85
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
xii
DAFTAR GAMBAR
Gambar 2.1 Logo Codeigniter……………………………………………………. 12
Gambar 2.2 Proses aliran data sistem…………………………………………… 13
Gambar 2.3 Alur program aplikasi berbasis framework Codeigniter………. 14
Gambar 3.1 blok diagram jalannya penelitian…………………………………. 20
Gambar 3.2 Diagram Use Case Manajemen Kategori…………………………. 25
Gambar 3.3 Diagram Use Case Manajemen Data Produk……………………… 26
Gambar 3.4 Diagram Use Case Manajemen Data Pelanggan………………….. 26
Gambar 3.5 Diagram Use Case Manajemen Data pesanan……………………. 27
Gambar 3.6 diagram use case transaksi dan registrasi…………………………. 27
Gambar 3.7 Diagram Activity tambah kategori…………………………………. 28
Gambar 3.8 Diagram Activity mengubah data kategori……………………….. 29
Gambar 3.9 Diagram Activity mengubah status kategori……………………… 29
Gambar 3.10 Diagram Activity tambah data produk………………………….. 30
Gambar 3.11 Diagram Activity mengubah data produk………………………. 30
Gambar 3.12 Diagram Activity mengubah status produk……………………… 31
Gambar 3.13 Diagram Activity Login Admin dan Pelanggan………………….. 31
Gambar 3.14 Diagram Activity pesanan………………………………………… 32
Gambar 3.15 Diagram Activity registrasi akun…………………………………. 33
Gambar 3.16 Diagram Activity Manajemen Pemesanan………………………… 33
Gambar 3.17 Diagram Activity Manajemen Pelanggan………………………… 34
Gambar 3.18 Class Diagram Admin……………………………………………… 35
Gambar 3.19 Class Diagram Pelanggan…………………………………………. 36
Gambar 3.20 Sequence Diagram login (admin)…………………………………. 37
Gambar 3.21 Sequence Diagram melihat data kategori (admin)……………… 38
Gambar 3.22 Sequence Diagram menambah data kategori (admin)…………. 38
Gambar 3.23 Sequence Diagram mengubah data kategori (admin)………….. 39
Gambar 3.24 Sequence Diagram mengubah status kategori (admin)…………. 39
Gambar 3.25 Sequence Diagram menghapus data kategori (admin)…………. 40
Gambar 3.26 Sequence Diagram melihat data produk (admin)………………. 40
Gambar 3.27 Sequence Diagram menambah data produk (admin)…………… 41
Gambar 3.28 Sequence Diagram mengubah data produk (admin)……………. 41
Gambar 3.29 Sequence Diagram mengubah status data produk (admin)…….. 42
Gambar 3.30 Sequence Diagram menghapus data produk(admin)……………. 42
Gambar 3.31 Sequence Diagram melihat data pelanggan (admin)……………. 43
Gambar 3.32 Sequence Diagram mengubah status data pelanggan (admin)….. 43
Gambar 3.33 Sequence Diagram menghapus data pelanggan (admin)……….. 44
Gambar 3.34 Sequence Diagram melihat data pesanan (admin)……………… 44
Gambar 3.35 Sequence Diagram mengubah status data pesanan (admin)……. 45
Gambar 3.36 Sequence Diagram Login Pelanggan…………………………….. 46
Gambar 3.37 Sequence Diagram melihat produk(pelanggan)…………………. 46
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
xiii
Gambar 3.38 Sequence Diagram melihat detail produk(pelanggan)………….. 47
Gambar 3.39 Sequence Diagram memilih produk(pelanggan)………………… 47
Gambar 3.40 Sequence Diagram checkout(pelanggan)………………………… 48
Gambar 3.41 Sequence Diagram melihat status pesanan(pelanggan)…………. 48
Gambar 3.42 Sequence Diagram melihat produk(pengunjung)……………….. 49
Gambar 3.43 Sequence Diagram melihat detail produk(pengunjung)………… 49
Gambar 3.44 Sequence Diagram memilih produk(pengunjung)………………. 50
Gambar 3.45 Sequence Diagram registrasi akun(pengunjung)………………… 50
Gambar 3.46 ERD……………………………………………………………….. 51
Gambar 3.47 Skema Diagram…………………………………………………… 52
Gambar 3.48 desain halaman utama pengunjung…………………………….. 61
Gambar 3.49 desain halaman login pengunjung……………………………….. 61
Gambar 3.50 desain halaman registrasi pengunjung……………………………. 62
Gambar 3.51 desain home pengunjung ketika sudah login……………………. 62
Gambar 3.52 desain halaman profil pengunjung……………………………….. 63
Gambar 3.53 desain halaman record pengunjung……………………………… 63
Gambar 3.54 desain halaman edit akun pengunjung…………………………… 64
Gambar 3.55 desain halaman produk pengunjung…………………………….. 64
Gambar 3.56 desain halaman login admin…………………………………….. 65
Gambar 3.57 desain halaman utama admin…………………………………… 65
Gambar 4.1 implementasi database……………………………………………. 66
Gambar 4.2 implementasi tabel foto produk…………………………………… 66
Gambar 4.3 implementasi tabel kategori………………………………….......... 66
Gambar 4.4 implementasi tabel option…………………………………………. 67
Gambar 4.5 implementasi tabel order…………………………………………… 67
Gambar 4.6 implementasi tabel order data……………………………………….. 67
Gambar 4.7 implementasi tabel produk…………………………………………. 67
Gambar 4.8 implementasi tabel user……………………………………………. 68
Gambar 4.9 implementasi tabel user data………………………………………. 68
Gambar 4.10 implementasi relasi antar tabel…………………………………… 68
Gambar 4.11 Login Admin………………………………………………………. 69
Gambar 4.12 Halaman Admin………………………………………………….. 69
Gambar 4.13 Menu Kategori……………………………………………………. 70
Gambar 4.14 Menu Produk………………………………………………………. 70
Gambar 4.15 Menu Pelanggan…………………………………………………. 71
Gambar 4.16 Menu Riwayat Belanja…………………………………………… 71
Gambar 4.17 Laporan Pertanggal……………………………………………….. 72
Gambar 4.18 Menu Home……………………………………………………….. 73
Gambar 4.19 Menu Login……………………………………………………….. 74
Gambar 4.20 Menu Profil……………………………………………………….. 74
Gambar 4.21 Menu Record……………………………………………………… 75
Gambar 4.22 Menu Edit Akun…………………………………………………… 75
Gambar 4.23 Menu Kategori dan Produk……………………………………… 76
Gambar 4.24 Uji Login Pelanggan 1……………………………………………. 77
Gambar 4.25 Uji Login Pelanggan 2…………………………………………….. 78
Gambar 4.26 Uji Login Pelanggan 3…………………………………………….. 78
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
xiv
Gambar 4.27 Uji Login Pelanggan 4……………………………........................... 79
Gambar 4.28 Uji Input Profil……………………………………………………… 79
Gambar 4.29 Uji Edit Akun……………………………………………………… 80
Gambar 4.30 Produk…………………………………………………………….. 80
Gambar 4.31 Detail Barang……………………………………………………… 81
Gambar 4.32 Data Pembelian……………………………………………………. 81
Gambar 4.33 Form Alamat Pengiriman…………………………………………. 82
Gambar 4.34 Cara Pembayaran………………………………………………… 82
Gambar 4.35 Uji Registrasi Pengunjung…………………………………………. 83
Gambar 4.36 Sukses Registrasi………………………………………………….. 83
Gambar 4.37 Uji Hapus Data Admin……………………………………………. 83
perpustakaan.uns.ac.id digilib.uns.ac.id
commit to user
xv
DAFTAR TABEL
Tabel 2.1 Simbol Use Case Diagram…………………………………………….. 7
Tabel 2.2 Simbol Activity Diagram………………………………………………. 8
Tabel 2.3 Simbol Class Diagram…………………………………………………. 9
Tabel 2.4 Simbol Sequence Diagram…………………………………………….. 10
Tabel 3.1 Tabel Kebutuhan Fungsional…………………………………………. 18
Tabel 3.2 Tabel Kebutuhan Non Fungsional……………………………………… 19
Tabel 3.3 Tabel Deskripsi Aktor………………………………………………….. 23
Tabel 3.4 Tabel Hak dan Kewajiban Aktor……………………………………… 23
Tabel 3.5 Tabel Deskripsi Use Case……………………………………………… 24
Tabel 3.6 tabel user……………………………………………………………….. 53
Tabel 3.7 tabel option…………………………………………………………….. 54
Tabel 3.8 tabel user data………………………………………………………… 55
Tabel 3.9 tabel order data……………………………………………………….. 56
Tabel 3.10 tabel produk…………………………………………………………. 57
Tabel 3.11 tabel order……………………………………………………………. 58
Tabel 3.12 tabel kategori…………………………………………………………. 59
Tabel 3.13 tabel foto produk……………………………………………………… 60