Buletin Poltanesa Vol. 23 No. 1 (Juni 2022) p-ISSN 2721-5350 e-ISSN 2721-5369 https://doi.org/10.51967/tanesa.v23i1.1069 © 2022 Politeknik Pertanian Negeri Samarinda
This work is licensed under a Creative Commons Attribution 4.0 License CC-BY

## Rancangan Aplikasi Penjualan berbasiskan Web pada Khadijah Store Menggunakan PHP dengan Codeigniter, Bootstrap dan Mysql
Mohd Imam Hidayat Teknik Informatika, Universitas Gunadarma, Depok, 16424 imamhidayat0907@gmail.com

## Mochamad Wisuda Sardjono*
Sistem Informasi, Universitas
Gunadarma, Depok, 16424 moch_wisuda@staff.gunadarma. ac.id *Corresponding author

## Bambang Gunawan Hardianto
Teknik Informatika, Universitas Gunadarma, Depok, 16424 bambang_gunawan@staff. gunadarma.ac.i Abstrak — Perkembangan UMKM di Indonesia mengalami
peningkatan yang sangat cepat, mengakibatkan  peluang  untuk  membangun  usaha semakin  terbuka  luas.  Dalam  melakukan  pemasarannya saat  ini  terkendala  dengan  masih  diberlakukannya pembatasan  kegiatan  masyarakat,  PPKM.  Imbasnya kepada  dunia  usaha  pemasaran  hasil  produksi  UMKM menjadi  tersendat.  Untuk  mengatasi  permasalahan tersebut sejak terjadi Pandemi COVID-19, para pengelola UMKM  melakukan  terobosan  dengan  memanfaatkan teknologi  informasi  Khadijah  Store  merupakan  toko perlengkapan  pakaian  dan  aksesoris  khusus  wanita  dan anak-anak.  Dalam  perkembangan  pemasaran  produknya, Khadijah  Store  masih  menggunakan  pencatatan  secara manual.  Berdasarkan  hal  tersebut,  dibutuhkan  sebuah aplikasi untuk dapat membantu baik dalam hal penjualan dan  mengatur  data  barang.  Bahasa  pemrograman  PHP digunakan  dalam  membangun  web  ini.  Agar  Website Khadijah  Store  lebih responsive dan  dinamis  maka  web ini dibuat menggunakan framework codeigniter, bootstrap dan MySQL sebagai database -nya. Codeigniter memungkinkan pengembangan sebuah web dengan cepat dan  mudah  dalam  pengelolaan  web  tersebut.  Bootstrap berfungsi  untuk  mengatur  layout  website  menyesuaikan secara  otomatis  berdasarkan  perangkat  yang  digunakan seperti:  PC,  laptop,  tablet  ataupun smartphone. Terdapat fitur live chat di dalam  website ini  yang berfungsi  untuk memudahkan  pelanggan  dalam  berkomunikasi  seputar produk yang dijual pada website Khadijah Store. Website ini telah dilakukan uji coba dengan menggunakan metode black  box  testing ,  yang  dimana  setiap  fitur  dan  menu pada website berjalan dengan baik.
Kata  Kunci — Codeigniter,  Bootstrap,  Khadijah  Store, Konsep MVC, PHP

## I. P ENDAHULUAN
Seiring  dengan  berkembangnya  teknologi  informasi dan  komputer  serta  internet  menyebabkan  kegiatan  yang dilakukan  oleh  masyarakat  menjadi  lebih  mudah. Didukung  dengan  terjangkaunya  masyarakat  dalam memiliki  teknologi  informasi  dan  komputer.  Sejak
diperkenalkan internet kepada masyarakat mengakibatkan peran internet ini sangatlah bermanfaat dalam memberikan  informasi  dalam  setiap  aktifitas  dalam masyarakat.    Kegiatan  jual  beli  merupakan  salah  satu contoh  aktifitas  yang  dipermudah,  dapat  dilakukan  tanpa melakukan  pertemuan  antara  penjual  dan  pembeli. Dengan  membangun  sebuah  aplikasi  maka  transaksi  jual beli  dapat  dilakukan  secara  online  memanfaatkan teknologi internet.
Aktifitas  masyarakat  pada  tahun  2020  mengalami penurunan  dikarenakan  adanya  penyebaran  penyakit COVID-19.  Hal  ini  terjadi  diberbagai  negara,  tidak terkecuali Indonesia. Untuk mengantisipasi efek penurunan  aktifitas  masyarakat  tersebut,  maka  aktifitas yang berhubungan dengan bisnis memanfaatkan teknologi  internet  dalam  melakukan  aktifitas  jual-beli. Salah  satu  contoh  pemanfaatan  teknologi  internet  yaitu dengan  membangun aplikasi  yang berbasiskan  web  yang dapat mengatasi kendala pengurangan kegiatan masyarakat.
Untuk meningkatkan layanan tersebut maka dibutuhkan  aplikasi  yang  dapat  menyelesaikan  kendala- kendala  tersebut.  Sehingga  dengan  aplikasi  tersebut penyebaran,  pembelian,  penjualan  dan  pemasaran  dapat melalui  sistem  elektronik  atau  jaringan  internet  (Nurlela, 2021).
Dengan  adaya  aplikasi  berbasis  web  ini  aktifitas  jual beli  masih  dapat  berlangsung  sehingga  bidang  usaha tersebut  masih  dapat  menghasilkan  keuntungan  dalam menjalankan usahanya.
Selama  pandemi  COVID-19,  bisnis e-commerce di Indonesia  terjadi  peningkatan  sebesar  5-10  kali  lipat, peningkatan pelanggan baru mencapai 50% (Hernikawati, 2021).  Hal  ini  untuk  mengatasi  kendala  pemasaran  yang terjadi  karena  diberlakukannya  pembatasan  kegiatan masyarakat oleh pemerintah.
Penelitian  telah  dilakukan  terhadap  pemanfaatan e- commerce pada  UMKM  (Usaha  Menengah  Kecil  dan Mikro  di  Kabupaten  Semarang.  Nilai  skor  yang dihasilkan  masih  rendah,  hal  ini  disebabkan  karena pelaku bisnis yang belum dapat sepenuhnya menggantikan  cara  tradisional  dengan  memanfaatkan teknologi informasi dalam melakukan transaksi
This work is licensed under a Creative Commons Attribution 4.0 License CC-BY
(Mumtahana,  Sekreningsih,  &  Tito,  2017)  (Firmansyah, et al., 2018).
Khadijah Store merupakan sebuah toko yang menjual perlengkapan pakaian muslim khusus wanita, berlokasi di provinsi  Aceh  kabupaten  Aceh  Barat.  Dalam  melakukan kegiatannya  masih  menggunakan  secara  konvensional yaitu  melalui  media  sosial,  informasi  antar  pembeli, pencatatan  barang  dilakukan  secara  manual  dan pendapatan  hasil  penjualan  masih  menggunakan  buku kas.  Hal  ini  mengakibatkan  proses  layanan  kepada pelanggan  menjadi  tidak  maksimal.  Pengelola  Khadijah Store  menyadari  bahwa  untuk  memperbaiki  layanan terhadap  para  pelanggannya  dibutuhkan  alat  bantu berbentuk  aplikasi  untuk  mencatat  setiap  transaksi penjualan, mengetahui jumlah stok barang dan mengetahui invoice dalam setiap periode waktu.
Berdasarkan  kendala  yang  dihadapi  dan  penelitian sebelumnya maka dibutuhkan sebuah aplikasi berbasiskan  web  yang  dapat  memberikan  solusi  untuk memudahkan pengelola Khadijah Store dalam mengelola usahanya.  Aplikasi  yang  dibuat  menggunakan  bahasa pemrograman PHP memanfaatkan framework CodeIgniter dan Bootstrap dengan  basis  data  MySQL. Sehingga aplikasi ini dapat diakses dengan menggunakan berbagai browser pada  perangkat  PC,  tablet  atau smartphone (Syarifudin,  Fauziah,  &  Rahman,  2021) (Kaban,  2017)  (Christian,  Hesinto,  &  Agustina,  2018) (Putra, 2020).
Penelitian  tentang  aktifitas  penjualan  secara  online pun  telah  dilakukan  dan  menghasilkan  solusi  yang  baik dalam  membantu  memasarkan  produk,  meningkatkan layanan,  memberikan informasi  yang cepat  (Mumtahana, Sekreningsih, & Tito, 2017) (Alexander & Husufa, 2020) (Suprianto,  Fadlan,  &  Prayogi,  2021)  (Handrianto  & Sanjaya, 2020).
Agar penelitian ini tidak meluas, maka ruang lingkup penelitian  mencakup  banyaknya  produk  dan  transaksi yang  terjadi  serta  dikelola  oleh  seseorang  yang merangkap  sebagai  pemilik  sehingga  kesulitan  dalam melakukan  pendataan  produk,  penjualan  dan  pesanan, serta  pencatatan  kas  yang  dilakukan  secara  manual menggunakan buku kas.
Penelitian  ini  dibatasi  pada  rancang  bangun pembuatan  aplikasi  berbasiskan  web  memanfaatkan framework CodeIgniter dan Bootstrap dengan  fitur aplikasi  pendataan  produk,  anggota,  transaksi  penjualan, pemesanan  dan  pencatatan  kas  serta  fasilitas Live  Chat menggunakan Tawk.to.
Dalam  penelitian  ini  hasil  yang  didapatkan  berupa sebuah  aplikasi  berbasiskan  web  untuk  penjualan  pada Khadijah  Store,  sehingga  pencatatan  dan  laporan  tidak dilakukan secara konvensional menggunakan buku.

## II. S TUDI P USTAKA
Penelitian sebelumnya telah dilakukan oleh Suprianto,  Muhammad  Fadlan  dan  Denis  Prayogi  yang berjudul  “Perancangan  Aplikasi  Point  of  Sale  Berbasis Web  Pada  Toko  Project  Salfa  Tarakan”  menghasilkan bahwa  aplikasi  tersebut  diuji  coba  menggunakan Black-
Box dan  dapat  memenuhi  kebutuhan  pemiliknya (Suprianto, Fadlan, & Prayogi, 2021).
Yopi  Handrianto  dan  Budi  Sanjaya  melakukan penelitian  dengan  judul  “Model  Waterfall  Dalam Rancang  Bangun  Sistem  Informasi  Pemesanan  Produk dan  Outlet  Berbasis  Web”,  yang  menghasilkan kesimpulan bahwa dengan dibangunnya sistem informasi yang  berbasis  web  mengubah  proses  bisnis  pemesanan produk  dan  outlet  pada  PT.  Prima  Lakto  Sehat  mnjadi lebih  cepat  dan  efisien  karena  beberapa  tahapan  proses dapat  dipermudah  dengan  adanya  fasilitas  online  yang terkoneksi  dan  terintegrasi    (Handrianto  &  Sanjaya, 2020).
Penelitian  tentang  pemanfaatan  web e-commerce dilakukan oleh Hani Atun Mumtahana, Sekreningsih Nita dan Adzinta Winerawan Tito dengan judul “Pemanfaatan Web E-Commerce Untuk Meningkatkan Strategi Pemasaran”  yang  dilakukan  pada  koperasi  mahasiswa STT  Dharma  Iswara  Madiun  untuk  industri  kerajinan kulit  di  Magetan.  Dalam  penelitian  tersebut  dihasilkan bahwa  penerapan  teknologi  sebagai  media  pemasaran hasil  industri  dapat  meningkatkan  hasil  pemasaran sebesar 15% (Mumtahana, Sekreningsih, & Tito, 2017).
Penelitian tentang pemanfaatan framework CodeIgniter juga  dilakukan  oleh  Muhammad  Syarifudin, Fauziah  dan  Ben  Rahman  dengan  judul  “Point  of  Sale Framework-Based  Code  Igniter  and  Model  View Controller Using Lightouse Testing”, yang menghasilkan pengujian dengan  menggunakan lighthouse pada aplikasi menunjukkan  bahwa  aplikasi  yang  dirancang  memiliki performa  yang  lebih  baik  dengan  menggunakan perangkat  PC,  Tablet  atau smartphone (Syarifudin, Fauziah, &  Rahman, 2021). Framework codeigniter juga digunakan  oleh  Arief  Herdiansyah  dalam  penelitiannya yang  berjudul  “System  Development  for  Learning Process  Monitoring  in  Private  Lesson  Institution  Using Codeigniter  Framework”,  dalam  penelitian  tersebut dituliskan  sebagai  sebuah  framework,  CodeIgniter memiliki  kelebihan  dalam  hal  perpustakaan  dan  paket yang  cukup  lengkap,  sehingga  lebih  mudah  bagi pengembang  untuk  merancang  situs  web.  Pengembang tidak  perlu  mengkode  semuanya  dari  awal,  cukup gunakan  perpustakaan  yang  disediakan    (Herdiansyah, 2021).
Penelitian  mengenai  pemanfaatan  aplikasi  berbasis web  juga  telah  dilakukan  seperti  pada  café,  dari  pesanan sampai reporting (Alexander  &  Husufa,  2020). Pemanfaatan  framework bootstrap pada  rancang  bangun web  sekolah  (Christian,  Hesinto,  &  Agustina,  2018). Sebagian  besar  masyarakat  (terutama  negara  maju)  telah terbiasa  menggunakan  web,  karena  sebagian  besar  jenis informasi dapat diperoleh. Teknologi informasi merupakan  cara  yang  digunakan  untuk  membuat, menyimpan,  mengubah,  dan  memanfaatkan  setiap  jenis informasi.  Penggunaan  teknologi  informasi  dalam  bisnis atau  dikenal  dengan  istilah e-commerce bagi  Usaha Dagang  Kusuma  dapat  meningkatkan  fleksibilitas produksi,  memudahkan  penyaluran  kepada  pelanggan dengan  cepat  untuk  produk  berupa  perangkat  lunak (software),  mengirim  dan  menerima  penawaran  secara
This work is licensed under a Creative Commons Attribution 4.0 License CC-BY
cepat dan efisien, serta mendukung transaksi segera tanpa menggunakan kertas (Firmansyah, et al., 2018).
Penelitian yang berhubungan dengan sistem penjualan berbasiskan  web  dan  sistem  pakar  diagnosis  penyakit pada tanaman. Dalam penelitian tersebut PHP digunakan sebagai  bahasa  pemrogaraman  dengan  database  MySQL menghasilkan penggunaan database sangat penting dalam membangun  sistem  informasi  (Zulkhaidi,  Yulianto,  & Suswanto, 2019)  (Noviani, Prambudi, & Mulyadi, 2020) (Ukkas, Harianto, & Hidayat, 2018).

## III. M ETODOLOGI
Pada  penelitian  ini  penulis  menggunakan  beberapa bahan  dan  metode  untuk  menyelesaikan  kendala  yang ada, diantaranya:
A. Codeigniter Codeigniter merupakan  sebuah  framework  yang dibuat  dengan  menggunakan  bahasa  pemrograman  PHP, yang  dapat  digunakan  untuk  pengembangan  web  secara cepat (Syarifudin, Fauziah, & Rahman, 2021) (Handrianto  &  Sanjaya,  2020).  Pemilihan  framework CodeIgniter dikembangkan  oleh  komunitas open  source . Framework  ini  menggunakan  konsep  MVC  (Model- View-Controller)  yang  memisahkan  antara  data  dan presentasi sehingga memungkinkan  pengembangan sebuah  web dengan cepat dan  mudah dalam pengelolaan web  tersebut  (Syarifudin,  Fauziah,  &  Rahman,  2021) (Handrianto  &  Sanjaya,  2020)    (Iraan  &  Sulistyowati, 2017).
B. Bootstrap
Bootstrap  merupakan  sebuah  framework  CSS  yang paling  banyak  diminati  oleh  pengembang  website, framework  ini  dapat  memudahkan  pengembang  dalam mendesain  tampilan  website  yang  responsif.  Lebar halaman  website  akan  disesuaikan  secara  otomatis berdasarkan  perangkat  yang  digunakan  seperti:  PC, laptop,  tablet  ataupun smartphone (Kaban,  2017) (Christian, Hesinto, & Agustina, 2018) (Putra, 2020). C. Basis Data MySQL
Dalam  penelitian  ini  MySQL  digunakan  sebagai media basis data, penyimpanan data. MySQL merupakan sistem  basis  data relation yang  bekerja  secara  cepat  dan mudah  digunakan,  dapat  diakses  secara  jaringan  dan digunakan untuk aplikasi multi user (Suprianto, Fadlan & Prayogi,  2021)  (Huda,  2020)  (Noviani,  Prambudi,  & Mulyadi, 2020).
D. PHP
PHP merupakan kepanjangan dari Hypertext Preprocessor,  bahasa scripting yang  terpasang  pada HTML dan bahasa pemrograman berbasis web yang lebih mudah  dimengerti  dari  bahasa  pemrograman  lain.  PHP berfungsi membangun website untuk melakukan pengolahan  data  pada  database  (Suprianto,  Fadlan,  & Prayogi, 2021) (Noviani, Prambudi, & Mulyadi, 2020). E. Metode Waterfall
Dalam  merancang  aplikasi  untuk  Khadijah  Store, Model  air  terjun  ( waterfall )  digunakan  yang  merupakan salah satu model SDLC ( System Development Life Cycle ) untuk  mengembangkan  sistem  informasi.  Model  ini menyediakan  pendekatan  alur  perangkat  lunak  secara
terurut  dari  analisis,  desain,  pengkodean  serta  pengujian (Handrianto  &  Sanjaya,  2020).  Alasan  penggunaan metode Waterfall ,  kualitas  dari  sistem  yang  dihasilkan akan  lebih  baik  karena  pelaksanaannya  dilakukan  secara bertahap  dan  proses  pengembangan  model  fase one  by one meminimalisasi kesalahan yang mungkin akan terjadi (Wahid,  2020)  (Nugraha,  Wardani,  &  Sukarmayasa, 2021).
Metode  yang  digunakan  pada  penulisan  ilmiah  ini merupakan  metode  SDLC  ( Software  Development  Life Cycle ), berikut tahapan pada SDLC:
1. Requirement
Melakukan  komunikasi  untuk  memahami  perangkat lunak  yang  diharapkan  oleh  pengguna  dan  batasan perangkat  lunak  tersebut.  Informasi  dapat  diperoleh melalui  wawancara,  diskusi  atau  survei  langsung. Kemudian  dianalisis  untuk  mendapatkan  data  yang dibutuhkan oleh pengguna.
2. Design
Membuat  desain  sistem  yang  dapat  membantu menentukan  perangkat  keras  dan  sistem  persyaratan dan  juga  membantu  dalam  mendefinisikan  asritektur sistem secara keseluruhan
3. Implementation
Pada  tahap  ini,  sistem  pertama  kali  dikembangkan  di program  kecil  yang  disebut  unit,  yang  terintegrasi dalam  tahap  selanjutnya.  Setiap  unit  dikembangkan dan  diuji  untuk  fungsionalitas  yang  disebut  sebagai unit testing.
4. Verification
Pada  tahap  ini,  sistem  dilakukan  verifikasi  dan pengujian  apakah  sistem  sepenuhnya  atau  sebagian memenuhi  persyaratan  sistem,  pengujuan  dapat dikategorikan  ke  dalam  unit  testing  (dilakukan  pada modul tertentu kode), sistem pengujian (untuk melihat bagaimana  sistem  bereaksi  ketika  semua  modul  yang terintegrasi)  dan  penerimaan  pengujian  (dilakukan dengan  atau  nama  pelanggan  untuk  melihat  apakah semua kebutuhan pelanggan puas).
5. Maintenance
Ini  adalah  tahap  akhir  dari  metode waterfall . Perangkat  lunak  yang  sudah  jadi  dijalankan  serta dilakukan  pemeliharaan.  Pemeliharaan  termasuk dalam  memperbaiki  kesalahan  yang  tidak  ditemukan pada langkah sebelumnya.

## IV. H ASIL DAN P EMBAHASAN
Aplikasi  yang  dibangun  memanfaatkan  framework CodeIgniter dan Bootstrap menggunakan  PHP  dan  basis data MySQL menghasilkan aplikasi yang siap digunakan dan  di  integrasikan  dengan  perangkat  keras  berupa komputer  PC,  laptop,  tablet, smartphone dan  printer untuk  mencetak  bukti  pemesanan  dan  penjualan.  Berikut pembahasan dari penelitian ini:
A. Analisis Kebutuhan
Dari  hasil  diskusi  dengan  pemilik  usaha,  maka terdapat 2 kebutuhan yaitu perangkat lunak dan perangkat keras
This work is licensed under a Creative Commons Attribution 4.0 License CC-BY
1. Perangkat Lunak
Terdapat  beberapa  kebutuhan  fungsional  yang diperlukan oleh pemilik yang dapat dilihat pada Tabel 1.
Tabel 1. Kebutuhan Perangkat Lunak No Kebutuhan Sistem Deskripsi 1. Dashboard Menampilkan  produk  yang  terdapat pada Khadijah Store 2. Data Barang Admin  mengetahui  detail  data  barang yang dimiliki Khadijah Store 3. Kategori Pengguna diinformasikan kategori barang yang ditawarkan oleh Khadijah Store 4. Login Admin  atau  Pengguna  dapat  akses untuk menggunakan aplikasi 5. Keranjang Pengguna  setelah  memilih  produk dapat disimpan dalam keranjang belanja  dan  melakukan  pembayaran melalui  transfer  antar  bank.  Pengguna bisa  melakukan  tambah  atau  hapus keranjang pesanan 6. Invoice Setelah melakukan validasi pemesanan dibuatkan invoice sebagai bukti penagihan. Pembayaran dilakukan melalui  transfer  setelah  ada  bukti transfer  maka  pemesanan  dikirim  ke alamat  yang telah isikan. Admin dapat melihat invoice pesanan. 7 Logout Admin  atau  Pengguna  keluar  dari aplikasi
2. Perangkat Keras
Spesifikasi  kebutuhan  perangkat  keras  pada  aplikasi yang dibangun dapat dilihat pada Tabel 2.
Tabel 2. Kebutuhan Perangkat Keras
No Nama Perangkat Spesifikasi 1. Komputer Client Intel Celeron RAM 4GB HDD 500 GB NIC 10/100
2.
Smartphone Android RAM 3 GB Layar 5” 3. Hosting Sewa 1 Tahun 4. Switch Hub 8 Port Gigabit Ethernet 10/100

## B. Desain Sistem
Aplikasi  yang  dibangun  terdiri  dari  dua  pemodelan menggunakan use case diagram dan activity diagram . 1. Use Case Diagram Terdapat  2 use  case  diagram pada  aplikasi  ini  yaitu Rancangan use  case  diagram admin  dan  Rancangan use case diagram user . Pada  Gambar  1  menunjukkan use  case  diagram Admin yang  ditujukan  untuk  pengelola  atau  admin. Admin  dapat  melakukan  beberapa  interaksi  terhadap halaman  admin  pada  aplikasi  ini  diantaranya  melihat detail  rincian,  melakukan  penambahan  data  barang, mengubah  data  barang,  menghapus  data  barang,  dan melihat invoice pesanan.
Gambar 1. Use Case Diagram Admin
Use case diagram User dapat dilihat pada Gambar 2, pengguna  atau user dapat  melakukan  proses pemesanan,  melihat  produk  atau  barang,  menambah data  pesanan  ada  keranjang  dan  bukti  pembayaran melalui  transfer.  Interaksi  ini  dapat  dilakukan  setelah user melakukan login .
Gambar 2. Use Case Diagram User
2. Activity Diagram Activity  Diagram pada  aplikasi  ini  dapat  dilihat pada Gambar 3. Yang menggambarkan alur kerja dan urutan  dari  suatu  proses.  Urutan  proses  tersebut disesuaikan  dengan  rancangan use  case  diagram admin atau use case diagram user sesuai dengan  hak akses yang diberikan.
This work is licensed under a Creative Commons Attribution 4.0 License CC-BY
Mulai Cek Database Masukkan Username dan Password Cek Hak Akses Tampilkan Dashboard
sesuai dengan Hak Aksesnya Ya Tidak Tidak Ya Selesai Gambar 3. Activity Diagram C. Implementasi Sistem
1. Form Login Aplikasi
Pada  Gambar  4.  merupakan  tampilan  halaman  login yang berfungsi untuk masuk dan mengakses ke dalam website sebagai user atau admin, dengan memasukkan username dan password.
Gambar 4. Form Login
Apabila belum memiliki akun pada aplikasi ini, maka user dapat mengisikan data dengan meng-klik tombol Belum  punya akun ? Daftar . Halaman Daftar Akun dapat dilihat pada Gambar 5.
Gambar 5. Form Daftar Akun
2. Dashboard
Untuk  halaman  dashboard  dibedakan  menurut  hak akses yang diberikan. Untuk Dashboard Admin dapat dilihat  pada  Gambar  6.  Admin  dapat  mengetahui jumlah user (pelanggan),  jumlah  barang,  jumlah pesanan dan total stok barang
Gambar 6. Form Dashboard Admin
Pada  Gambar  7,  ditampilkan  Dashboard  User (pelanggan).  Pelanggan  dapat  melihat  produk  yang ditawarkan oleh Khadijah Store
Gambar 7. Dasboard User (Pelanggan)
3. Data Barang
Admin  memiliki  hak  untuk  menambah,  mengubah dan  menghapus  data  barang  yang  dimiliki  oleh Khadijah Store dapat dilihat pada Gambar 8.
This work is licensed under a Creative Commons Attribution 4.0 License CC-BY

## Gambar 8. Form Data Barang
4. Kategori Barang
Pelanggan  yang  telah  melakukan  login  dapat  melihat barang sesuai dengan kategorinya. Dapat dilihat pada Gambar 9.
Gambar 9. Form Kategori Barang
Untuk  mengetahui  detail  dari  setiap  barang, pelanggan  dapat  meng-klik  tombol  detail.  Jika pelanggan  ingin  melakukan  pemesanan  maka  dapat meng-klik tombol tambah ke keranjang. Dapat dilihat pada Gambar 10.
Gambar 10. Form Detail Barang
5. Keranjang
Ketika  pelanggan  telah  melakukan  pemesana  dengan meng-klik tambah ke keranjang maka akan tampil list data  barang  yang  telah  dipesan  dengan  jumlah  harga total  pembayaran.  Selain  itu  pelanggan  juga  dapat melakukan  pembatalan  pesanan  dengan  meng-klik hapus  keranjang.  Seperti  yang  ditunjukkan  pada Gambar 11.
Gambar 11. Form Keranjang
Jika  pemesanan  sudah  sesuai  maka  pelanggan  dapat melakukan  pembayaran  dan  mengisi  data  yang diperlukan  serta  mengupload  bukti  bayar,  dapat dilihat pada Gambar 12.
Gambar 12. Form Pembayaran
6. Invoice
Admin  dapat  melihat  daftar  invoice  yang  tersimpan seperti pada Gambar 13.

## Gambar 13. Form Invoice (Admin)
Pada  form  tersebut  Admin  dapat  mengetahui  secara detail  status  setiap  invoice  dengan  meng-klik  tombol detail,  jika  statusnya  sudah  melakukan  pembayaran maka akan  muncul bukti pembayaran. Form halaman tersebut dapat dilihat pada Gambar 14.
This work is licensed under a Creative Commons Attribution 4.0 License CC-BY

## Gambar 14. Form Detail Invoice

## D. Integritas dan Pengujian Sistem
Untuk  menguji  kesalahan-kesalahan  pada  sistem setelah  modul-modul  yang  terpisah  digabungkan  maka digunakan  pengujian  integrasi.  Pendekatan top-down digunakan dalam pengujian integrasi ini yang ditunjukkan  pada  Gambar  15.  Modul  dibedakan berdasarkan hak akses sebagai Admin atau Pelanggan.

## LOGIN
ADMIN

## USER

## Gambar 15. Pengujian Integrasi
Pengujian  ini  dilakukan  untuk  memastikan  agar aplikasi telah berjalan sesuai dengan tahapan sebelumnya seperti  desain,  spesifikasi  dan  pengkodean. Black-box testing digunakan  untuk  pengujian  perangkat  lunak dengan  menitikberatkan  pada  persyaratan  fungsional. Hasil pengujian Black-box dapat dilihat pada Tabel 3.
Tabel 3. Hasil pengujian Black-box Operasi Pengujian Hasil yang diharapkan Hasil Pengujian Operasi AEUD (Add, Edit,  Update,  Delete) pada Menu Data Barang Login  sebagai  Admin.  Data berhasil  ditambahkan,  diubah, ditampilkan,  dihapus  pada menu Data Barang Sesuai Harapan Operasi  AD  (Add, Delete)  pada  Menu Keranjang Login sebagai User (Pelanggan).  Data  berhasil ditambahkan, ditampilkan, dihapus pada menu Keranjang Sesuai Harapan Menggunakan browser Google Chrome Menampilan  setiap  halaman admin/user,  serta  melakukan ujicoba  setiap  menu  dan tombol Sesuai Harapan Menggunakan browser Mozilla Firefox Menampilan  setiap  halaman admin/user,  serta  melakukan ujicoba  setiap  menu  dan tombol Sesuai Harapan

## E. Operasional dan Perawatan
Tahapan  operasional  ini  dirancang  disesuaikan  dan dioperasikan  pada  Khadijah  Store  dengan  memanfaatkan penyewaan  Hosting  periode  1  tahun  sehingga  hal  ini
dapat  mengurangi  biaya  pengadaan  perangkat  keras komputer  server.  Perawatan  yang  dilakukan  pada perangkat lunak, jika terjadi kesalahan maka diperbaiki

## V. K ESIMPULAN
Rancangan  aplikasi  ini  dibuat  dapat  membantu pencatatan transaksi secara komputerisasi yang selama ini dilakukan  secara  manual  dengan  melakukan  pencatatan pada  buku  kas.  Aplikasi  ini  memudahkan  pemilik  dalam mencatat barang, menghitung stok barang, dan penjualan. Dapat  diakses  melalui  perangkat  komputer,  tablet  dan smartphone selama  terhubung  dengan  jaringan  internet. Pemanfaatan  framework CodeIgniter dan Bootstrap meningkatkan  kinerja  PHP  terhadap  browser  dan perangkat yang digunakan

## DAFTAR PUSTAKA
Alexander,  J.,  &  Husufa,  N.  (2020).  Implementasi  Point Of Sales Berbasis Web Pada Usaha Olive  Cafe. Jurnal Sistem Informasi dan E-Bisnis , 452-465.
Christian,  A.,  Hesinto,  S.,  &  Agustina.  (2018).  Rancang Bangun Website Sekolah Dengan Menggunakan Framework Bootstrap. SISFOKKOM , 22-27. Firmansyah,  R.,  Mauliana,  P.,  Hunaifi,  N.,  Wiguna,  W., Sulastriningsih, R. D., & Komalasari, Y. (2018). Penerapan  Sistem  Penjualan  Online  pada  Usaha Dagang  Kusuma  Bandung. Jurnal  Abdimas UBJ , 125-136. doi:http://dx.doi.org/10.31599/jabdimas.v1i2.33
9
Gunawan,  &  Fernandes,  S.  (2021).  Implementasi Template  Web  Responsive  Dynamis  (Studi Kasus: Website Lembaga Penjaminan Mutu dan Pengembangan  Pendidikan). Jurnal  Sistem Informasi dan Informatika (SIMIKA) , 156-169. Handrianto,  Y.,  &  Sanjaya,  B.  (2020).  Model  Waterfall Dalam  Rancang  Bangun  Sistem  Informasi Pemesanan  Produk  Dan  Outlet  Berbasis  Web. Jurnal  Inovasi  Informatika  (JII)  Universitas Pradita , 153-161.
Herdiansyah,  A.  (2021).  System  Development  for Learning  Process  Monitoring  in  Private  Lesson Institution Using Codeigniter Framework. Jurnal Informatika dan Sains (JISA) , 10-16. Hernikawati,  D.  (2021).  Analisa  Dampak  Pandemi Covid-19  Terhadap  Jumlah  Kunjungan  Pada Situs  E-Commerce  Di  Indonesia  Menggunakan Uji  T  Berpasangan. Jurnal  Studi  Komunikasi
Dan Media , 191-202.
doi:10.31445/jskm.2021.4389
Huda,  M.  (2020). Bootstrap  4:  Belajar  CRUD Menggunakan  PHP  Dan  MySQL. Malang:  AE Publishing.
Iraan,  R.,  &  Sulistyowati.  (2017).  Implementasi Framework  CodeIgniter  Untuk  Pengembangan WebSite  Pada  Dinas  Perkebunan  Provinsi
This work is licensed under a Creative Commons Attribution 4.0 License CC-BY
Kalimantan  Tengah. Jurnal  Saintekom,  Vol.  7, No. 1 , 67-80.
Kaban,  R.  (2017,  April).  Design  Website  Responsive Dengan Bootstrap. Medan, Sumatra, Indonesia. Noviani, Prambudi, D. A., & Mulyadi, F. (2020). Sistem Pakar Diagnosis Penyakit Pada Tanaman Pepaya Menggunakan  Metode  Backward  Chaining Berbasis Web. Buletin Poltanesa Vol. 21 No. 2 , 50-57. Nugraha,  P.  G.,  Wardani,  N.  W.,  &  Sukarmayasa,  I.  W. (2021).  Ranang  Bangun  Sistem  Informasi
Software  Poin  Of  Sale  (POS)  dengan  Metode Waterfall  Berbasis  Web. Jurnal  Sains  dan Teknologi , 92-103. Nurlela. (2021). E-Commerce, Solusi di Tengah Pandemi COVID-19. Jurnal  Simki  Economic ,  47-56. Retrieved from https://jiped.org/index.php/JSE Pamungkas, R. (2020). RANCANG BANGUN APLIKASI E-COMMERCE BERBASIS WOOCOMMERCE SEBAGAI SOLUSI
PEMASARAN  PENJUALAN  MADU. Pelita Teknologi : Jurnal Ilmiah Informatika 15, 15 , 1- 15.
Pratama, A. F., & Diana, A. (2021). IMPLEMENTASI E- COMMERCE
DENGAN
CONTENT
MANAGEMENT SYSTEM WORDPRESS MENGGUNAKAN  WOOCOMMERCE  PADA
HOPEANDSOLES.ID. Indonesia Journal Information System (IDEALIS), 4 (1), 20-30. Putra,  M.  Y.  (2020).  Responsive  Web  Design Menggunakan  Bootstrap  Dalam  Merancang Layout  Website. Information  System  For Education and Professionals , 61-70. Suprianto,  Fadlan,  M.,  &  Prayogi,  D.  (2021). Perancangan  Aplikasi  Point  Of  Sale  Berbasis Web  Pada  Toko  Project  Salfa  Tarakan.
SEBATIK , 624-631.
Syarifudin,  M.,  Fauziah,  &  Rahman,  B.  (2021).  Point  of Sale  Framework-Based  Code  Igniter  and  Model View  Controller  Using  Ligthouse  Testing.
Journal  of  Computer  Networks,  Architecture and High Performance Computing , 202-212. Ukkas,  M.  I.,  Harianto,  K.,  &  Hidayat,  M.  H.  (2018).
Aplikasi  Penjualan  Pakaian  Couple  Berbasis Website  Pada  Rain-D  Shop  Samarinda. Sebatik Vol. 8 No. 1 , 1-7.
Wahid,  A.  A.  (2020).  Analisis  Metode  Waterfall  Untuk Pengembangan  Sistem  Informasi. Jurnal  Ilmu- ilmu  Informatika  dan  Manajemen  STMIK (INFOMAN"S) , 1-4. Zulkhaidi,  T.  C.-S.,  Yulianto,  &  Suswanto.  (2019). Implementasi Sistem Informasi Penjualan
Produk  Elektronik  Berbasis  Web  Dengan Menggunakan  Laravel  Framework. Buletin Poltanesa Vol. 20 No. 2 , 51-56.