WEBSITE PENJUALAN AYAM POTONG TOKO BUDE
1
Ruth Ariny Yolanda
2
Desy Wulandari Asfary Putri
1) 2)
Jurusan Sistem Informasi, Fakultas Ilmu Komputer & Teknologi Informasi, Universitas Gunadarma
1) 2)
Jalan Margonda Raya No.100 Pondok Cina, Depok
1
arinyy.ruthh@gmail.com
2
dessy_wap@staff.gunadarma.ac.id
ABSTRAK
Perdagangan elektronik tidak lagi harus memajangkan barang-barang atau jasa yang hendak ditawarkan kepada konsumen di dalam lemari atau toko. Dalam sistem E-
Commerce ini dapat memberikan informasi mengenai barang-barang yang ingin
ditawarkan kepada konsumen. Hal ini dapat menguntungkan pihak penjual karena dapat meningkatkan pendapatan dan keuntungan, serta dapat memangkas biaya-biaya operasional lainnya. Kemajuan teknologi informasi saat ini telah memberi manfaat yang besar dalam dunia usaha, pembuatan website penjualan ayam potong dapat disajikan dengan menggunakan website dan dapat memberikan manfaat yang besar baik kepada penjual maupun kepada konsumen. Dengan memanfaatkan teknologi informasi maka penjualan juga data penjualan dapat diperolah secara tepat, cepat dan efisien. Sistem website ini dirancang menggunakan bahasa PHP dan database MySQL. Berdasarkan pengujian black box, sistem ini dapat berjalan sesuai dengan kebutuhannya dan diharapkan dapat membantu baik pihak penjual maupun konsumen dalam kegiatan pembelian ayam potong di toko bude.
Kata Kunci : Bisnis, E-Commerce, CodeIgniter, Website.
ABSTRACT
Electronic commerce no longer has to display goods or services offered to consumers in a storefront or a store. This E-Commerce system can provide information about the goods that you want to offer to consumers. This can benefit the seller because it can increase income and profits, and can cut other operating costs. The advancement of information technology at this time has provided great benefits in world business, the creation of a chicken sales website can be presented using the website and can provide benefits to both sellers and consumers. By utilizing information technology, sales data can also be processed accurately, quickly and efficiently. This website system is designed using PHP language and MySQL database. Based on black box testing, this system can run according to their needs and is expected to help both sellers and consumers in purchasing chicken at toko bude.
1. PENDAHULUAN 1.1. Latar Belakang Masalah
Pola hidup berbelanja masyarakat Indonesia semakin maju mengikuti perkembangan zaman. Adanya tuntutan waktu yang semakin sempit serta bergesernya budaya, maka waktu yang tersedia untuk mencari kebutuhan sehari-
hari juga berubah. Perdangangan
elektronik atau yang lebih dikenal dengan E-Commerce adalah penyebaran, pembelian, penjualan, pemasaran barang dan jasa melalui internet atau jaringan komputer. Akan tetapi, dikarenakan perekonomian Indonesia yang masih belum merata, masih banyak masyarakat yang belum melakukan perdagangan elektronik. Sehingga saat ini pasar-pasar
di Indonesia masih banyak yang
melakukan transaksi secara manual. Toko Ayam Bude merupakan salah satu toko yang berlokasi di Pasar Jaya Cibubur. Pasar Jaya Cibubur merupakan salah satu pasar yang masih melakukan transaksi pembelian secara manual. Pada era perkembangan teknologi ini, dengan adanya jual beli produk, jasa dan informasi melalui perangkat komputer yang terkoneksi dengan jaringan internet, masyarakat Indonesia bisa mendapatkan kebutuhan sehari-hari dengan sangat mudah dan dalam waktu yang singkat. Apabila beberapa tahun lalu para konsumen harus datang langsung ke pasar untuk membeli produk yang
mereka inginkan, dengan adanya
teknologi, para konsumen bisa
mendapatkan barang yang mereka
inginkan melalui platform yang tersedia. Oleh karena itu, guna membantu mempermudah para konsumen dalam melakukan transaksi jual-beli di Toko
Ayam Bude, penulis mencoba
merancang sebuah aplikasi website e- commerce dengan judul “WEBSITE PENJUALAN AYAM POTONG TOKO BUDE”.
1.2. Batasan Masalah
Website ini menampilkan produk- produk yang tersedia pada Toko Ayam Bude. Website ini dikembangkan dengan bahasa pemrograman PHP (Personal Home Page) dan MySQL sebagai database.
1.3. Tujuan Penulisan
Tujuan dari penulisan ini untuk mempermudah para konsumen dalam melakukan transaksi jual-beli di Toko Ayam Bude.
1.4. Metode Penelitian
Metode yang digunakan dalam pembuatan penelitian ini dilakukan
berdasarkan SDLC (System
Development Life Cycle) yang dimana SDLC digunakan untuk pngembangan website.
1.5. Sistematika Penulisan
Sistematika pada penulisan ilmiah ini terbagi atas beberapa bab yang memuat pembahasan dari setiap bab. Sistematikanya terdiri dari 4 bab yang saling berkaitan.
2. TELAAH PUSTAKA 2.1. E-Commerce
E-commerce merupakan suatu
proses transaksi barang atau jasa melalui sistem informasi yang memanfaatkan
teknologi informasi. E-commerce
menurut O`Brien & Marakas (2010)
“Adalah pembelian, penjualan,
pemasaran, dan servis produk, layanan, dan informasi melalui berbagai jaringan komputer.
E-commerce mengubah bentuk
persaingan, kecepatan tindakan, dan perampingan interaksi, produk, dan
pembayaran dari pelanggan ke
perusahaan dan dari perusahaan ke pemasok. Sedangkan menurut Sutabri (2012) E-commerce adalah penyebaran, pembelian, penjualan, pemasaran barang
dan jasa melalui sistem elektronik seperti enternet atau televisi, www, atau aringan komputer lainnya. E-commere dapat melibatkan transfer dana elektronik,
pertukaran data elektonik, sistem
inventori otomatis, dan sistem
pengumpulan data otomatis. Sehingga dapat dikatakan bahwa E-Commerce merupakan suatu pemasaran barang atau jasa melalui sistem informasi yang memanfaatkan teknologi informasi.
2.2. Website
Menurut Rohi Abdulloh (2015) web adalah: “Sekumpulan halaman yang terdiri dari beberapa halaman yang berisi informasi dalam bentuk data digital baik berupa text, gambar, video, audio, dan animasi lainnya yang disediakan melalui jalur koneksi internet”.
Web adalah sebuah software yang
berfungsi untuk menampilkan
dokumen-dokumen pada suatu web yang membuat pengguna dapat mengakses
internet melalui software yang
terkoneksi dengan internet.
2.3. PHP
PHP adalah bahasa pemrograman yang digunakan secara luas untuk
penanganan pembuatan dan
pengembangan sebuah web dan bisa digunakan pada HTML. PHP merupakan
singkatan dari “PHP : Hypertext
Preprocessor”, dan merupakan bahasa yang disertakan dalam dokumen HTML , sekaligus bekerja di sisi server 9server-
side HTML-embedded scripting).
Artinya sintaks dan perintah yang diberikan akan sepenuhnya dijalankan di server tetapi disertakan pada halaman HTML biasa, sehingga script-nya tak tampak di sisi client.
PHP dirancang untuk dapat bekerja sama dengan database server dan dibuat sedemikian rupa sehingga pembuatan dokumen HTML yang dapat mengakses database menjadi begitu mudah. Tujuan
dari bahasa scripting ini adalah untuk
membuat aplikasi dimana aplikasi
tersebut yang dibangun oleh PHP pada umumnya akan memberikan hasil pada web browser, tetapi prosesnya secara keseluruhan dijalankan di server.
2.4. HyperText Markup Language (HTML)
Proses tampilnya sebuah halaman website di browser melibatkan HTML. HTML (HyperText Markup Language) adalah bahasa dasar untuk web scripting
yang bersifat client side yang
memungkinkan untuk menampilkan
informasi dalam bentuk teks, grafik,
serta multimedia dan juga untuk
menghubungkan antar tampilan web
page (hyperlink).
Sibero (2011c:19) mengemukakan, “HyperText Markup Language atau HTML adalah bahasa yang digunakan pada dokumen web sebagai bahasa untuk pertukaran dokumen web”.
2.5. Cascading Style Sheet (CSS)
CSS (Cascading Style Sheet) adalah bahasa-bahasa yang mempresentasikan halaman web. Seperti warna, layout dan
font. Dengan menggunakan CSS,
seorang web developer dapat membuat halaman web yang beradaptasi dengan
berbagai macam ukuran layer.
Pembuatan CSS biasanya terpisah
dengan halaman HTM, meskipun CSS dapat disisipkan di dalam halaman
HTML. Hal ini ditujukan untuk
memudahkan pengaturan halaman
HTML yang memiliki rancangan yang sama (Henderson, 2009:72).
Maka dari itu, Cascading Style
Sheet (CSS) digunakan untuk
menampilkan sebuah web dengan
tampilan menarik, memperindah
tampilan web dan mudah digunakan. CSS adalah suatu bahasa style sheet
yang digunakan untuk mengatur
tampilan suatu dokumen yang ditulis dalam bahasa markup. Penggunaan yang
paling umum dari CSS adalah untuk memformat halaman web yang ditulis dengan HTML dan XHTML.
2.6. Konsep Basis Data
Menurut Fathansyah (2007), basis data terdiri dari 2 kata, yakti Basis dan Data. Basis kurang lebih dapat diartikan sebagai gudang atau markas, sedangkan Data merupakan representasi fakta dunia nyata yang mewakili suatu objek seperti manusia, hewan, barang, peristiwa, keadaan, konsep dan sebagainya yang terakam dalam bentuk huruf, symbol
teks, angka, gambar, bunyi atau
kombinasi lainnya.
Basis data dapat diartikan sebagai sekumpulan data atau informasi yang telah diolah dan tersimpan serta dapat digunakan kembali apabila dibutuhkan.
2.7. XAMPP
XAMPP merupakan web server yang dapat melayani tampilan web yang dinamis dan dapat diakses secara local
menggunakan web server lokal
(localhost). Menurut Putu Agus Eka (2014), “XAMPP adalah aplikasi web server yang bersifat instan (siap saji) yang dapat digunakan baik di sistem operasi Linux maupun di sistem operasi Windows”. Sedangkan menurut Kartini (2013), “XAMPP merupakan tool yang menyediakan paket perangkat lunak ke dalam satu buah paket”.
Berdasarkan pengertian ini dapat disimpulkan bahwa XAMPP adalah sebuah perangkat lunak yang terdiri atas beberapa perangkat didalamnya seperti Apache, MariaDB (MySQL), PHP dan Perl.
2.8. Unified Modelling Language (UML)
UML (Unified Modelling Language) adalah salah standar bahasa yang banyak digunakan di dunia industri untuk mendefinisikan requirement, membuat analisis & desain, serta menggambarkan
arsitektur dalam pemrograman
berorientasi objek (Sukamto dan
Shalahuddin, 2013). Pada perkembangan teknik pemrograman berorientasi objek, munculah sebuah standarisasi bahasa
pemodelan untuk pembangunan
perangkat lunak yang dibangun dengan
menggunakan teknik pemrograman
berorientasi objek, yaitu Unified
Modelling Language (UML). UML
merupakan bahasa visual untuk
pemodelan dan komunikasi mengenai sebuah sistem dengan menggunakan diagram dan teks-teks pendukung.
2.9. Framework
Menurut (Basuki, 2010) bawah
framework dapat diartikan sebagai
koleksi atau kumpulan potongan-
potongan program yang disusun atau
diorganisasikan sedemikian rupa,
sehingga dapat digunakan untuk
membantu membuat aplikasi tanpa harus membuat semua kodenya dari awal.
2.10. Codeigniter
Menurut Betha Sidik (2012),
“Codeigniter adalah sebuah framework PHP yang bersifat open source dan menggunakan metode MVC (Model, View, Controller) untuk memudahkan developer dalam memanggilnya tanpa harus menuliskan syntax program yang
sama berulang-ulang serta dapat
menghemat waktu.”
Dalam situs resmi codeigniter, (Official Website Codeigniter, 2002)
menyebutkan bahwa codeigniter
merupakan framework PHP yang kuat
dan sedikit bug. Codeigniter ini
dibangun untuk para pengembang
dengan bahasa pemrograman PHP yang membutuhkan alat untuk membuat web dengan fitur lengkap.
2.11. Bootstrap
Bootstrap merupakan salah satu jenis framework untuk CSS (Cascading
Style Sheet) yang digunakan untuk perancangan situs website. Pengunaan
bootstrap sangatlah membantu
progammer dalam membangun tampilan sebuah website. Hal tersebut tertulis di
buku Bootstrap: Responsive Web
Development karangan Jake Spurlock.
Bootstrap menyediakan banyak
sekali class-class CSS dan plugin yang siap dipakai untuk membantu dalam membuat tampilan sebuah website.
Karena sangat membantu, maka
Bootstrap menjadi salah satu front-end
framework yang paling banyak
digunakan.
2.12. SublimeText
Menurut Faridi (2015:), “Sublime text adalah teks editor berbasis Python, sebuah teks editor yang elegan, kaya fitur, cross platform, mudah dan simpel yang cukup terkenal di kalangan pengembang, penulis dan desainer. Sublime text salah satu kode editor yang biasa digunakan oleh para programmer untuk membuat suatu program”.
Berdasarkan definisi diatas maka
dapat diambil kesimpulan bahwa
sublime text adalah suatu aplikasi yang digunakan untuk membangun web.
2.13. Struktur Navigasi
Navigasi merupakan struktur
terpenting pada tahap perancangan. Navigasi merupakan rancangan yang saling berhubungan dan rantai kerja dari beberapa area yang berbeda dan dapat membantu mengorganisasikan seluruh elemen dengan pemberian perintah dan pesan. Oleh karenanya, navigasi adalah fitur yang harus disediakan. Navigasi berfungsi untuk berpindah dari satu halaman ke halaman yang lain pada suatu aplikasi berbasis web, yang juga digunakan untuk memberikan informasi lokasi yang sedang dibuka.
Menurut Sutopo (2007), dalam pengembangan web, terdapat beberapa
model navigasi dasar, yang harus dikenal dengan baik oleh desainer. Setiap model navigasi dapat memberikan solusi untuk kebutuhan yang berbeda.
3. PERANCANGAN DAN
IMPLEMENTASI 3.1. Struktur Navigasi
Struktur navigasi merupakan
struktur yang menggambarkan hubungan antara isi website yang telah dibuat. Struktur navigasi sangat diperlukan untuk mempermudah dalam melihat susunan dari website yang telah dibuat. Terdapat 2 struktur navigasi yang telah dibuat yaitu struktur navigasi bagian halaman admin dan struktur navigasi bagian halaman user. Dalam pebuatan
website ini, jenis struktur yang
digunakan adalah non linier.
Menggunakan struktur navigasi non linier karena terdapat lebih dari satu percabangan, dan tiap tampilan dari percabangan memiliki kedudukan yang sama sehingga tidak mengenal master atau slave page.
Gambar 3.1. Struktur Navigasi Admin
Gambar 3.2. Struktur Navigasi User
3.2. Perancangan Tampilan
Tampilan merupakan hal yang
sangat penting dalam merancang sebuah website. Hal itu dikarenakan dengan membuat rancangan tampilan akan
mempermudah pembuatan website dalam pembuatan design interface. Pada tahap perancangan tampilan ini akan dibahas mengenai proses pembuatan tampilan halaman website penjualan pada Toko Ayam Bude.
Gambar 3.3. Rancangan Halaman Admin Pada menu halaman admin berisi berberapa bagian, yaitu Text marque yang merupakan tulisan selamat datang admin toko ayam bude yang bergerak. Selain itu terdapat tombol logout untuk admin apabila ingin keluar. Terdapat
tombol tambah data untuk
menambahkan data baru, apabila ingin menambah jenis ayam yang ingin dijual.
Tombol pencarian berfungsi untuk
mencari data yang terdapat di bagian
admin. Selanjutnya terdapat tabel
dimana tabel ini berisi data tentang ayam.
Gambar 3.4. Tampilan Rancangan Halaman Utama
Pada menu halaman user berisi berberapa bagian, yaitu tombol login dimana user diharuskan untuk masuk terlebih dahulu sebelum memesan ayam.
Selanjutnya terdapat Picture Slide
dimana ini merupakan sebuah tampilan gambar yang akan berubah setiap sekian detik. Image merupakan foto item yang
di jual dan Label merupakan nama item yang di jual.
Gambar 3.5. Rancangan Halaman Login
3.3. UML (Unified Modelling Language) Use Case Diagram
Pada diagram use case terdapat 2 actor yang digambarkan, yaitu : user dan admin dimana pada actor pertama yaitu user dapat mengakses website secara online dan setelahnya akan masuk pada menu halaman utama website penjualan dan dapat melihat informasi seputar produk yang dicari. Sedangkan admin dapat melakukan login untuk masuk pada halaman admin, dimana admin dapat melakukan kegiatan tambah, edit dan menghapus data.
Gambar 3.6. Use Case Diagram
3.4. Tampilan Halaman Website
Tahap yang dilakukan setelah
melakukan perancangan website adalah dengan melakukan pembuatan website. Tahap ini dibagi menjadi 2 tahap, yaitu pembuatan halaman admin dan halaman user.
Halaman Admin
Tahap pembuatan halaman untuk
user dilakukan menggunakan
Tampilan yang ada pada halaman user terdiri dari :
Gambar 3.7. Login Admin
Gambar 3.8. Halaman Utama Admin
Gambar 3.9. Edit Data
Halaman User
Tahap pembuatan halaman untuk
user dilakukan menggunakan
rancanganan pada tahap perancangan. Tampilan yang ada pada halaman user terdiri dari :
Gambar 3.10. Dashboard User
Gambar 3.11. Kategori Ayam Utuh
Gambar 3.12. Kategori Ayam Potong
Gambar 3.13. Contact Us
3.5. Uji Coba
Pada penulisan ini uji coba sistem yang akan dilakukan menggunakan metode blacbox. Proses pengujian terdiri
dari uji coba sistem admin dan proses uji coba sistem user.
Tabel 3.1. Uji Coba Sistem Admin
No. Kasus Uji Coba
Proses Pengujian Hasil Yang Diharapkan keterangan 1 Login Admin Input username dan password salah Tidak dapat masuk pada halaman admin sukses Input username salah dan password benar Tidak dapat masuk pada halaman admin Sukses Input username benar dan password salah Tidak dapat masuk pada halaman admin Sukses Input username dan password benar Dapat masuk pada halaman admin Sukses 2 Tambah Data Ayam Admin menambahkan data penjualan ayam sesuai field yang tersedia Data penjualan ayam yang diinput bertambah sesuai field yang terisi Sukses 4 Edit Data Penjualan Admin melakukan perubahan data pada field yang
ada Data penjulan telah di perbarui sesuai data yang di masukkan Sukses 5 Delete Data penjualan ayam Admin menghapus data penjualan Data stelah terhapus Sukses 6 Search Enginge Mencari data yang diperlukan Data yang diperlukan muncul Sukses
Tabel 3.4. Uji Coba Sistem User
No. Kasus Uji Coba
Proses Pengujian Hasil Yang Diharapkan
keterangan 1 Login user Input username
dan password salah Tidak dapat masuk pada halaman admin sukses Input username salah dan password benar Tidak dapat masuk pada halaman admin Sukses Input username benar dan password salah Tidak dapat masuk pada halaman admin Sukses Input username dan password benar Dapat masuk pada halaman admin Sukses
2 Dashboard Klik bagian menu dashboard pada sidebar halaman user Masuk pada halaman utama pada tampilan user Sukses
3 Ayam Utuh Klik bagian menu ayam Utuh pada sidebar halaman user Masuk ke halaman bagian penjualan ayam utuh Sukses 4 Ayam Potong Klik bagian menu ayam potong Masuk ke halaman bagian penjualan ayam potong Sukses 4. PENUTUP 4.1. Kesimpulan
Pembuatan website penjualan pada Toko Ayam Bude telah berhasil dibuat dan dijalankan. Dengan dilakukannya tahap uji coba pada halaman user dan admin, menunjukkan bahwa seluruh fungsi yang ada pada website penjualan ini dapat
berjalan dengan baik seperti
menampilkan informasi yang tersedia di laman website. Bahasa pemrograman
yang digunakan dalam pembuatan
website penjualan ayam ini yaitu bahasa pemrograman PHP dan MySQL serta menggunakan Boostrap v4.5.0 dan Codeigniter 3.1.10 sebagai framework. Dengan adanya website ini dapat mempermudah para konsumen dalam menentukan produk yang akan dibeli di Toko Ayam Bude. Website telah dihosting dan telah dilakukan uji coba.
Dengan alamat website
https://tokoayambudee.000webhostapp.c om/ .
4.2. Saran
Pada website penjualan ayam di Toko Bude ini masih memiliki banyak kekurangan dan masih membutuhkan
beberapa pengembangan seperti
menambah search engine, registrasi data dan keranjang belanja agar lebih
mempermudah para konsumen
melakukan pemesanan langsung di website.
DAFTAR PUSTAKA
[1] Destiningrum, M., & Adrian, Q. J. (2017). Sistem Informasi Penjadwalan
Dokter Berbasis Web Dengan
Menggunakan Framework Codeigniter (Studi Kasus: Rumah Sakit Yukum Medical Centre). Jurnal Teknoinfo, 11(2), 30-37.
[2] Listianto, K. F., Fauzi, R. I., Irviani, R., Kasmi, K., & Garaika, G. (2017). Aplikasi E-Commerce Berbasis Web Mobile Pada Industri Konveksi Seragam Drumband Di Pekon Klaten Gadingrejo Kabupaten Pringsewu. J. TAM (Technol. Accept. Model), 8(2), 146-152.
[3] Praba, A. D. (2018). Implementasi
Model View Controller Dengan
Perpustakaan. Indonesian Journal on Software Engineering (IJSE), 4(1), 93- 97.
[4] Sovia, R., & Febio, J. (2017).
Membangun Aplikasi E-Library
Menggunakan Html, Php Script, Dan Mysql Database. Jurnal Processor, 6(2). [5] Zakir, A. (2016). Rancang Bangun
Responsive Web Layout Dengan
Menggunakan Bootstrap Framework. InfoTekJar: Jurnal Nasional Informatika dan Teknologi Jaringan, 1(1), 7-10.
