PEMBUATAN SISTEM INFORMASI WEB UNTUK ASOSIASI TOKO SPAREPART SEPEDA MOTOR Tugas Akhir Disusun untuk memenuhi salah satu syarat dalam memperoleh gelar Ahli Madya pada Program Studi Diploma III Teknik Informatika Universitas Sebelas Maret. Diajukan Oleh DYAN PERMANA YUDHA M3113051 PROGRAM DIPLOMA III TEKNIK INFORMATIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SEBELAS MARET 2016 i
ii
iii
iv
HALAMAN MOTTO Tuhan.Mohon bantulah aku hari ini menjadi pribadi yang percaya diri.yang gagah menghadapi kesulitan.tabah menghadapi fitnah.dan justru bekerja dengan hasil yang hebat saat orang lain meragukanku.tuhan.aamiiin (Mario Teguh) HALAMAN PERSEMBAHAN Sebuah karya tulisan ini saya dedikasikan untuk : 1. Ridho Tuhan Yang Maha Esa 2. Ayahanda dan Ibunda Tercinta 3. Kakak kandung yang sudah lulus mendahului saya 4. Bapak dan Ibu Dosen D3 Teknik Informatika yang memberikan semangat kepada saya 5. Rekan-rekan seperjuangan TI A / B D3 Teknik Informartika 2013 v
KATA PENGANTAR Puji syukur kehadirat Tuhan YME yang telah melimpahkan segenap rahmat dan karunia-nya, sehingga penyusunan Tugas Akhir dengan judul PERANCANGAN SISTEM INFORMASI WEB UNTUK ASOSIASI TOKO SPAREPART SEPEDA MOTOR ini dapat terselesaikan pada waktunya tanpa halangan berarti. Penyusunan laporan ini bertujuan untuk memenuhi persyaratan dalam memperoleh gelar Amd. Program Diploma III Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sebelas Maret Surakarta. Dalam melakukan penelitian dan penyusunan Laporan Tugas Akhir ini penulis mendapatkan bantuan dan dukungan dari berbagai pihak. Oleh sebab itu pada kesempatan ini, penulis mengucapkan terima kasih kepada semua pihak yang telah memberikan bantuan dan dukungannya, terutama kepada: 1. Prof. Ir. Ari Handono Ramelan, M.Sc.(Hons)., Ph.D. selaku Pimpinan Fakultas Matematika dan Ilmu Pengetahuan Universitas Sebelas Maret yang memberikan kesempatan kepada penulis untuk belajar. 2. Bapak Abdul Aziz, S.Kom., M.Cs. selaku Ketua Program Studi Diploma III Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sebelas Maret Surakarta yang memberikan kesempatan kepada penulis untuk belajar. 3. Bapak Eko Harry Pratisto S.T., M.Info.Tech selaku Dosen Pembimbing Tugas Akhir yang telah memberikan bimbingan, waktu, saran serta dukungan kepada penulis. 4. Keluarga yang tercinta yang telah banyak memberikan dukungan serta doa. 5. Mahasiswa D3 Teknik Informatika 2013 yang selalu memberikan semangat lebih dalam memotivasi penulis dalam menggapai cita-cita. 6. Semua pihak terkait yang tidak bisa saya sebutkan satu persatu, atas bantuan dan dukungannya dalam pelaksanaan Tugas Akhir. vi
vii
DAFTAR ISI HALAMAN PERSETUJUAN... Error! Bookmark not defined. HALAMAN PENGESAHAN... ii PERNYATAAN... iii HALAMAN MOTTO... iv HALAMAN PERSEMBAHAN... v KATA PENGANTAR... vi DAFTAR ISI... viii DAFTAR TABEL... xi DAFTAR GAMBAR... xiii INTISARI... xv ABSTRACT... xvi BAB I PENDAHULUAN... 17 1.1 Latar Belakang... 17 1.2 Perumusan Masalah... 18 1.3 Batasan Masalah... 18 1.4 Tujuan... 18 1.5 Manfaat... 18 1.6 Metodologi Penelitian... 19 1.6.1 Pengumpulan Data... 20 1.6.2 Analisa Data... 20 1.6.3 Desain dan Perancangan... 20 1.6.4 Implementasi... 21 1.6.5 Pengujian Sistem... 21 1.7 Sistematika Penulisan... 21 BAB II TINJAUAN PUSTAKA DAN LANDASAN TEORI... 23 2.1 Tinjauan Pustaka... 23 2.2 HyperText Preprocessor (PHP)... 25 2.3 Bootstrap... 25 2.4 Unified Modellin Language (UML)... 26 2.5 Use Case Diagram... 26 viii
2.6 Class Diagram... 27 2.7 Squence Diagram... 28 2.8 Basis Data... 29 2.9 Entity Relationsip Diagram (ERD)... 29 2.10. Web Server... 32 BAB III ANALISIS DAN RANCANGAN SISTEM... 34 3.1. Proses Bisnis Aplikasi... 34 3.2 Software Requirement Specification (SRS) Aplikasi berbasis Web... 35 3.2.1 Kebutuhan Fungsional Aplikasi berbasis Web... 35 3.2.2 Kebutuhan Non-Fungsional Aplikasi berbasis Web... 36 3.3 Perancangan Aplikasi berbasis Web... 37 3.3.1 Use Case Diagram... 37 3.3.2 Skenario Use Case... 38 3.3.3 Sequence Diagram... 63 3.4. Class Diagram... 91 3.5. Perancangan Basis Data... 92 3.5.1. Entity Relationship Diagram (ERD)... 93 3.5.2. Relasi Antar Tabel... 95 3.6. Perancangan Tabel... 95 3.10.1 Tabel toko... 95 3.10.2 Tabel stok... 96 3.10.3 Tabel produk... 96 3.10.4 Tabel admin... 97 3.10.5 Tabel order... 97 3.10.6 Tabel konsumen... 97 3.10.7 Tabel list_produkbaru... 98 3.10.8 Tabel kategori... 98 3.10.9 Tabel merk... 99 3.10.10 Tabel detail_order... 99 3.7. Perancangan Desain User Interface... 99 3.7.1. User Interface Aplikasi berbasis Web... 100 ix
BAB IV IMPLEMENTASI DAN PENGUJIAN... 104 4.1.1. Implementasi... Error! Bookmark not defined. 4.1.2. Implementasi Interface Aplikasi Berbasis Web... 104 4.2. Pengujian Sistem... 106 4.2.1 Pengujian Black Box... 106 BAB V KESIMPULAN DAN SARAN... 111 a. Kesimpulan... 111 b. Saran... 111 Daftar Pustaka... 112 x
DAFTAR TABEL Tabel 2.1. Simbol Komponen Use Case... 27 Tabel 2.2. Notasi Class Diagram... 28 Tabel 2.4. Simbol Sequence Diagram... 28 Tabel 2.5. Simbol Entity Relationsip Diagram (ERD)... 30 Tabel 3.1. Kebutuhan Fungsional Sistem... 35 Tabel 3.5. Use Case Menambah Toko... 38 Tabel 3.6. Use Case Melihat Toko... 39 Tabel 3.7. Use Case Menampilkan data konsumen... 40 Tabel 3.8. Use Case Menambah kategori... 40 Tabel 3.9. Use Case Melihat Kategori... 41 Tabel 3.10. Use Case Merubah Kategori... 42 Tabel 3.11. Use Case Menghapus Kategori... 43 Tabel 3.12. Use Case Melihat List Produk... 44 Tabel 3.13. Use Case Menerima List Produk... 45 Tabel 3.14. Use Case Menolak List Produk... 46 Tabel 3.15. Use Case Melihat List Produk Diterima... 47 Tabel 3.16. Use Case Menambah Produk... 48 Tabel 3.17. Use Case Melihat Produk... 48 Tabel 3.18. Use Case Merubah Produk... 49 Tabel 3.19. Use Case Merubah Gambar Produk... 50 Tabel 3.20. Use Case Melihat Detail Produk... 51 Tabel 3.21. Use Case Melihat Admin... 52 Tabel 3.22. Use Case Menambah Admin... 53 Tabel 3.23. Use Case Merubah Admin... 54 Tabel 3.24. Use Case Menghapus Admin... 55 Tabel 3.25. Use Case Melihat Pemilik Toko... 56 Tabel 3.26. Use Case Merubah Pemilik Toko... 56 Tabel 3.27. Use Case Menambah List Produk... 57 Tabel 3.28. Use Case Melihat Status List Produk... 58 Tabel 3.29. Use Case Menambah Stok Produk... 59 Tabel 3.30. Use Case Melihat Stok... 60 Tabel 3.31. Use Case Merubah Stok... 61 xi
Tabel 3.32. Use Case Melihat User Toko... 62 Tabel 3.33. Use Case Merubah User Toko... 62 Tabel 3.48. Tabel toko... 96 Tabel 3.49. Tabel stok... 96 Tabel 3.50. Tabel produk... 96 Tabel 3.51. Tabel admin... 97 Tabel 3.52. Tabel order... 97 Tabel 3.53. Tabel konsumen... 98 Tabel 3.54. Tabel list_produkbaru... 98 Tabel 3.55. Tabel kategori... 99 Tabel 3.56. Tabel detail_order... 99 Tabel 3.69. Black Box Testing pada Toko... 106 xii
DAFTAR GAMBAR Gambar 2.1. Bootstrap template AdminLTE... 26 Gambar 2.2. Satu ke satu... 31 Gambar 2.3. Satu ke banyak... 31 Gambar 2.4. Banyak ke satu... 32 Gambar 2.5. Banyak ke banyak... 32 Gambar 2.6. Contoh Representasi JSON pada sebuah Object.. Error! Bookmark not defined. Gambar 3.2. Gambaran Proses Bisnis... 34 Gambar 3.3. Use Case Diagram Aplikasi berbasis Web... 38 Gambar 3.4. Sequence Diagram Menambah Toko... 64 Gambar 3.5. Squence Diagram Melihat Toko... 65 Gambar 3.6. Squence Diagram Melihat Konsumen... 66 Gambar 3.7. Squence Diagram Menambah Kategori... 67 Gambar 3.8. Squence Diagram Melihat kategori... 68 Gambar 3.9. Squence Diagram Merubah Kategori... 69 Gambar 3.10. Squence Diagram Menghapus Kategori... 70 Gambar 3.11. Sequence Diagram Melihat List Produk... 71 Gambar 3.12. Sequence Diagram Menerima List Produk... 72 Gambar 3.13. Sequence Diagram Menolak List Produk... 73 Gambar 3.14. Squence Diagram Melihat List Produk Diterima... 74 Gambar 3.15. Sequence Diagram Menambah Produk... 74 Gambar 3.16. Sequence Diagram Melihat Produk... 75 Gambar 3.17. Sequence Diagram Merubah Produk... 76 Gambar 3.18. Sequence Diagram Merubah Gambar Produk... 77 Gambar 3.19. Sequence Diagram Melihat Detail Produk... 78 Gambar 3.20. Sequence Diagram Melihat Admin... 79 Gambar 3.21. Sequence Diagram Menambah Admin... 80 Gambar 3.22. Sequence Diagram Merubah Admin... 81 Gambar 3.23. Sequence Diagram Menghapus Admin... 82 Gambar 3.24. Sequence Diagram Melihat Pemilik Toko... 83 Gambar 3.25. Sequence Diagram Merubah Pemilik Toko... 84 Gambar 3.26. Sequence Diagram Menambah List Produk... 85 xiii
Gambar 3.27. Sequence Diagram Melihat Status List Produk... 86 Gambar 3.28. Sequence Diagram Menambah Stok Produk... 87 Gambar 3.29. Sequence Diagram Melihat Stok... 88 Gambar 3.30. Sequence Diagram Merubah Stok... 89 Gambar 3.31. Sequence Diagram Melihat User Toko... 89 Gambar 3.32. Sequence Diagram Menambah User Toko... 90 Gambar 3.44. Class Diagram... 91 Gambar 3.45. Entity Relationship Diagram (ERD)... 94 Gambar 3.46. Relasi Antar Tabel... 95 Gambar 3.48. Desain Halaman Layout Web... 100 Gambar 4.1. Implementasi Halaman Dashboard2... 104 Gambar 4.2. Implementasi Halaman Produk... 105 Gambar 4.3. Implementasi Halaman List Produk... 105 xiv
INTISARI Sebuah asosiasi komunitas toko sparepart sepeda motor yang ada di berbagai daerah membutuhkan sebuah sistem informasi untuk menjual produk. Cara pembuatan sistem informasi menggunakan bahasa pemrograman framework PHP Codeigniter, sehingga sistem informasi tersebut dijalankan di perangkat Dekstop PC. Sistem informasi ini menggunakan google maps untuk menentukan letak lokasi toko dan harus terkoneksi dengan jaringan internet. Sedangkan alat bantu software untuk sajian penampilan sistem informasi dari sisi perangkat Dekstop PC menggunakan web browser yaitu Google Chrome. Pembuatan sistem informasi penjualan toko sparepart kendaraan untuk asosiasi komunitas sparepart bertujuan untuk mencari toko sparepart berada dan sistem tersebut mengerjakan rekomendasi toko yang menjual barang sparepart dan sistem informasi tersebut melakukan inventaris produk sparepart. Kata Kunci : Framework PHP Codeigniter,, tokosparepart xv
ABSTRACT A community association motorcycle spare parts shop in various regions need an information system to sell products. Ways of making information systems using the programming language PHP CodeIgniter framework, so that the information system is run on the device Desktop PC. This information system uses google maps to determine the location of the shop and must be connected to the Internet network. While software tools for serving the system performance information from the device side of desktop PC using a web browser, Google Chrome. Making the information system of vehicle spare parts store sales for the community association aims to find the spare parts store spare parts and the system is working on shops selling spare parts and information systems that perform product inventory of spare parts. Keywords: PHP CodeIgniter Framework, android, tokosparepart xvi