Anda di halaman 1dari 40

RANCANG BANGUN APLIKASI INVENTARIS TOKO AMI IT

& CREATIVE BERBASIS WEB MENGGUNAKAN


FRAMEWORK CODEIGNITER 3

LAPORAN KERJA PRAKTEK

PROGRAM STUDI TEKNIK INFORMATIKA


JURUSAN TEKNIK INFORMATIKA
FAKULTAS TEKNIK
UNIVERSITAS PAPUA
MANOKWARI
2022
RANCANG BANGUN APLIKASI INVENTARIS TOKO AMI IT
& CREATIVE BERBASIS WEB MENGGUNAKAN
FRAMEWORK CODEIGNITER 3

LAPORAN KERJA PRAKTEK

ABDUL MALIK MOMBAY


201765037

PROGRAM STUDI TEKNIK INFORMATIKA


JURUSAN TEKNIK INFORMATIKA
FAKULTAS TEKNIK
UNIVERSITAS PAPUA
MANOKWARI
2022

ii
LEMBAR PENGESAHAN

JUDUL : RANCANG BANGUN APLIKASI INVENTARIS TOKO


AMI IT & CREATIVE BERBABIS WEB MENGGUNAKAN
FRAMEWORK CODEIGNITER 3
NAMA : ABDUL MALIK MOMBAY
NIM : 201765037
PROGRAM STUDI : S1 TEKNIK INFORMATIKA
JURUSAN : TEKNIK INFORMATIKA
FAKULTAS : TEKNIK

Disetujui

Pembimbing Pembimbing Lapangan

Christian Dwi Suhendra S.T., M.Sc. Rahadika Purnata


NIP. 198612182019031008

Diketahui
Ketua Program Studi

Christian Dwi Suhendra S.T., M.Sc.


NIP. 198612182019031008

iii
KATA PENGANTAR

Allhamdullilah, Segala puji syukur bagi penulis panjatkan kehadirat Allah


SWT atas segala kemudahan, rahmat, dan hidayah-Nya yang diberikan kepada
penulis sehingga penulis dapat menjalankan amanah yang menjadi tanggung jawab
kita. Sholawat serta salam senantiasa selalu tercurah pada kita Nabi Muhammad
Saw, Keluarga, serta sahabatnya. Dalam menuntun penulis sehingga dapat
menyelesaikan Laporan Kerja Praktek (KP) ini. Kegiatan Kerja Praktek (KP)
merupakan salah satu program yang di selenggrakan oleh Universitas Papua bagi
para mahasiswa/i jenjang Sarjana salah satunya Jurusan Teknik Informatika.
Program ini bertujuan untuk mengembangkan dan meningkatkan keahlian,
kemampuan serta keterampilan mahasiswa/i dalam menerapkan ilmu yang di
peroleh ke dalam dunia wirausaha. Dalam hal ini penulis melalukan Kerja Praktek
(KP) pada Toko Ami It & Creative.
Penulis dapat menyelesaikan Laporan Kerja Praktek (KP) yang berjudul
RANCANG BANGUN APLIKASI INVENTARIS TOKO AMI IT & CREATIVE
BERBASIS WEB MENGGUNAKAN FRAMEWORK CODEIGNITER 3
Laporan ini disusun setelah penulis melaksanakan Kerja Praktek selama kurang
lebih satu bulan di Toko Ami It & Creative.
Dalam kesempatan ini penulis menyadari bahwa selama mengikuti KP dan
penulisan laporan, tidak terlepas dari dukungan, saran, dan motivasi adanya
dukungan dari berbagai pihak, penulisan laporan ini tidak dapat di selesaikan, oleh
sebab itu penulis menyampaikan terima kasih yang sebesar – besarnya kepada :
1. Christian Dwi Suhendra S.T., M.Sc. selaku dosen pembimbing yang
senantiasa memberikan dukungan, bantuan, dan meluangkan waktu untuk
membimbing penulis dalam melakukakan Kerja Praktek dan penyusunan
Laporan Kerja Praktek.
2. Penulis juga menyampaikan terima kasih kepada bapak Rahadika Purnata
selaku pemilik took dan pembimbing teknis yang telah memberikan
kesempatan bagi penulis untuk melaksanakan kegiatan kerja praktek.

iv
3. Kedua orang tua serta saudara/i saya, yang telah mendukung penulis melalui
doa dan motivasi serta materi dalam melakukan kerja praktek.
4. Kepada teman-teman angkatan 2017 yang telah memberikan saran,
semangat, kritik, dan kerjasamanya.
5. Kepada teman-teman yolo gank yang telah mendukung, membantu,
menyemangati, meberikan dukungan selama mengerjakan laporan ini.

Pada penulisan laporan Kuliah Praktek ini penulis menyadari bahwa masih ada
kekurangan di dalamnya. Maka dari itu penulis Berharap adanya kritik dan saran
yamg membangun dari pembaca agar laporan Kuliah Praktek ini dapat berkembang
menjadi lebih baik lagi kedepannya. Mohon maaf penulis sampaikan jika terjadi
kesalahan kata pada laporan Kuliah Praktek ini. Sekian dan terima kasih

Manokwari, 27 Februari 2022

Abdul Malik Mombay

v
DAFTAR ISI

HALAMAN JUDUL .............................................................................................. i


HALAMAN SAMPUL .......................................................................................... ii
LEMBAR PENGESAHAN ................................................................................. iii
KATA PENGANTAR .......................................................................................... iv
DAFTAR ISI ......................................................................................................... vi
DAFTAR GAMBAR ........................................................................................... vii
DAFTAR LAMPIRAN ........................................................................................ ix
I PENDAHULUAN ............................................................................................... 1
1.1 Latar Belakang ......................................................................................... 1
1.2 Rumusan Masalah .................................................................................... 2
1.3 Batasan Masalah ....................................................................................... 2
1.4 Tujuan ....................................................................................................... 2
1.5 Manfaat ..................................................................................................... 3
1.6 Waktu dan tempat ..................................................................................... 3
II KEADAAN UMUM .......................................................................................... 4
2.1 Gambaran Umum Pelaku Usaha .............................................................. 4
2.2 Ruang Lingkup Kerja Praktek .................................................................. 4
III TINJAUAN PUSTAKA .................................................................................. 5
3.1 Hypertext Preprocessor (PHP) ................................................................. 5
3.1.1 Sejarah PHP ...................................................................................... 5
3.1.2 Kelebihan PHP .................................................................................. 6
3.2 XAMPP .................................................................................................... 6
3.2.1 Asal Kata XAMPP ............................................................................ 7
3.3 Framework ................................................................................................ 8
3.4 Codeigniter ............................................................................................... 8
3.5 Bootstrap .................................................................................................. 8
3.6 Visual Studio Code ................................................................................... 9
IV MATERI KERJA PRAKTEK...................................................................... 11
4.1 Algoritma aplikasi inventary .................................................................. 11
4.2 Pembuatan aplikasi inventary ................................................................. 11
4.2.1 Instalasi framwork CI...................................................................... 11
4.2.2 Pembuatan Struktur Database dan Table ........................................ 13
4.2.3 Konfigurasi CI................................................................................. 15
4.3 Tahapan Penggunaan aplikasi inventary ................................................ 21
V PENUTUP ........................................................................................................ 30
5.1 Kesimpulan ............................................................................................. 30
5.2 Saran ....................................................................................................... 30
DAFTAR PUSTAKA .......................................................................................... 31

vi
DAFTAR GAMBAR

2. 1 Logo Toko Ami IT & Creative. ....................................................................... 4


3. 1 Logo PHP ......................................................................................................... 5
3. 2 Logo XAMPP .................................................................................................. 7
3. 3 Logo Codeigniter ............................................................................................. 8
3. 4 Logo Bootstrap ................................................................................................. 9
3. 5 Logo Visual Studio Code ............................................................................... 10
4. 1 Algoritma Aplikasi ......................................................................................... 11
4. 2 Website CI...................................................................................................... 12
4. 3 Isi folder htdocs .............................................................................................. 13
4. 4 Codeigniter awal ............................................................................................ 13
4. 5 Aplikasi Xampp ............................................................................................. 13
4. 6 Kelas Library dan Helper ............................................................................... 16
4. 7 API Koneksi ................................................................................................... 16
4. 8 Tampilan awal login aplikasi inventory ......................................................... 21
4. 9 Tampilan home aplikasi inventary admin ...................................................... 22
4. 10 Tampilan home aplikasi inventary manajer ................................................. 22
4. 11 Tampilan home aplikasi inventary gudang .................................................. 22
4. 12 Tampilan data barang ................................................................................... 23
4. 13 Tampilan tambah data barang ...................................................................... 23
4. 14 Tampilan jenis barang .................................................................................. 23
4. 15 Tampilan tambah jenis barang ..................................................................... 24
4. 16 Tampilan merk barang ................................................................................. 24
4. 17 Tampilan tambah merk barang .................................................................... 25
4. 18 Tampilan data barang masuk ....................................................................... 25
4. 19 Tampilan tambah data barang masuk ........................................................... 26
4. 20 Tampilan tambah data barang keluar ........................................................... 26
4. 21 Tampilan tambah data barang keluar ........................................................... 27
4. 22 Tampilan data transaksi................................................................................ 27
4. 23 Tampilan tambah transaksi .......................................................................... 27
4. 24 Tampilan detail transaksi ............................................................................. 28
4. 25 Tampilan mencetak data transaksi ............................................................... 28
4. 26 Tampilan data user ....................................................................................... 29
4. 27 Tampilan tambah data user .......................................................................... 29

vii
DAFTAR TABEL

4. 1 Kamus Data .................................................................................................... 14


4. 2 Tabel Model ................................................................................................... 16
4. 3 Tabel View ..................................................................................................... 18
4. 4 Tabel Controller ............................................................................................. 20

viii
DAFTAR LAMPIRAN

ix
I PENDAHULUAN

1.1 Latar Belakang

Perkembangan Sistem Informasi (SI) semakin memudahkan para


penggunanya dari hasil Teknologi Informasi (TI) yang ada pada zaman sekarang
ini, baik itu kalangan universitas swasta maupun negeri, masyarakat tentunya
sangat memerlukan TI yang dapat memudahkan aktivitas dalam kehidupan mereka.
Karena dengan menggunakan teknologi, aktivitas akan lebih mudah di kerjakan,
hemat tenaga dan waktu. Dalam suatu pengusaha toko, tentunya memiliki transaksi
barang seperti barang yang dibeli kemudian disimpan yang tentunya di gunakan
sebagai stok barang. Semuanya itu membutuhkan laporan arsip untuk mengetahui
beberapa barang yang masuk dan beberapa barang yang telah keluar. Dengan
pembuatan laporan secara terkomputerisasi akan lebih efektif dan efisien
dibandingkan secara manual dengan menggunakan dokumen kertas karena akan
lebih memakan waktu tenaga dan biaya.
Sistem inventory barang adalah suatu system yang mengorganisasikan
serangkaian prosedur dan metode yang di rancang untuk menghasilkan,
menyebarkan dan memperoleh informasi segala sesuatu tentang pencatatan barang
di gudang yang masuk dan keluar dalam suatu toko. Sistem yang bersifat manual
atau pencatatan langsung memerlukan waktu yang lama dan juga prosesnya lambat.
Beberapa kesalahan dalam pengelola data manual adalah ketika mengecek suatu
data dan meneliti ulang tentunya akan memakan waktu. Hal ini menyebabkan
kemunduran kinerja para pekerja yang berimbas pada ketidak akuratan data dan
informasi. Oleh karena itu kita perlu membangun suatu sistem inventaris barang di
Toko It & Creative ini.
1.2 Rumusan Masalah

Dengan melihat kondisi yang ada dan kenyataan bahwa SI sangat


berkembang serta sangat diperlukan oleh Toko IT, maka sebaiknya pendataan
barang masuk dan keluar dapat dilakukan melalui sebuah SI. Dengan melalui SI,
Pendataan barang dapat dilakukan dengan lebih terarah sehingga dapat mengatasi
ketidak akuratan data. Oleh karena itu, penulis merasa perlu untuk membuat sistem
ini dengan judul “RANCANG BANGUN APLIKASI INVENTARIS TOKO AMI
ID & CREATIVE BERBASIS WEB MENGGUNAKAN CODEIGNITER 3” guna
menjawab persoalan tersebut.
Berdasarkan latar belakang yang telah disampaikan sebelumnya dapat di
tentukan rumusan masalah yang yang akan diselesaikan sebagai berikut:
1. Bagaimana cara membuat sebuah SI berbasis web menggunakan bahasa
pemrograman PHP, dan MYSQL?
2. Bagaimana cara menyimpan data inventory yang telah di masukkan?

1.3 Batasan Masalah

Dengan tujuan agar pembahasan laporan ini terfokus dan tidak melenceng
dari rumusan masalah yang ada, maka ditentukan batasan masalah adalah SI yang
di buat dapat memproses data inventory di Toko Ami It & Creative.

1.4 Tujuan

Tujuan Aplikasi yang dibuat dapat menambahkan, mengubah, mencari,


menghapus, mencetak data dan menyimpan data.
Adapun tujuan yang ingin dicapai dari pembuatan SI adalah sebagai berikut:
1. Untuk menjalin hubungan yang baik antara Universitas dan Pelaku Usaha
yang ada di Manokwari.
2. Agar mahasiswa memperoleh pengalaman tentang dunia kerja dan dapat
menyiapkan mental mahasiswa untuk memasuki dunia pekerjaan nantinya.

2
3. Mempermudah proses pengelolaan data inventory pada Toko Ami It &
Creative.

1.5 Manfaat

Manfaat dari pembuatan SI adalah sebagai berikut:


1. Bagi Mahasiswa: mahasiswa dapat mengetahui bagaimana kondisi nyata
dari dunia pekerjaan yang akan di hadapi nantinya.
2. Bagi program studi: program studi dapat menjalin hubungan yang baik
dengan pelaku usaha Toko Ami It & Creative.
3. Bagi Pelaku Usaha: pengelolaan data menjadi lebih mudah dengan adanya
aplikasi inventory tersebut.

1.6 Waktu dan tempat

Waktu dalam masa kerja praktek dimulai dari tanggal 10 Januari 2022 hingga
berakhir pada tanggal 10 februari 2022 yang bertempat di Toko Ami It & Creative.

3
II KEADAAN UMUM

2.1 Gambaran Umum Pelaku Usaha

Toko Ami It & Creative merupakan Suatu pelaku usaha yang bergerak di
bidang It dan perlengkapan atk dan lain lain, Toko Ami It & Creative terletak di
kampung Sumber Boga Sp 7 Distrik Masni, lebih tepatnya di jalur 3 poros barat sp
7. Toko ini di dirikan pada tahun 2015 dan telah mengatasi persoalan pengetikan,
pencetakan, desain yang berada di distrik masni.

Gambar 2. 1 Logo Toko Ami IT & Creative.

2.2 Ruang Lingkup Kerja Praktek

Toko Ami It & Creative sebagai pelaku usaha tempat melakukan Kerja
Praktek ini khusus menangani penjualan barang – barang dan perfoto copyan.
Namun masih perlu dilakukan pengembangan dalam pengelola datanya. Oleh
karena itu di perlukan system inventory barang untuk mengetahui stok barang dan
harga barang secara terkomputerisasi untuk memenuhi kebutuhan tersebut.

4
III TINJAUAN PUSTAKA

3.1 Hypertext Preprocessor (PHP)

PHP atau (Hypertext Preprocessor) adalah sebuah bahasa pemrograman web


yang dulunya di sebut personal home page. Bahasa pemrograman PHP dapat
disispkan ke dalam HTML (hypertext markup language)

Gambar 3. 1 Logo PHP


3.1.1 Sejarah PHP
Pada awalnya PHP merupakan kependekan dari Personal Home Page (Situs
personal). PHP pertama kali dibuat oleh Rasmus Lerdorf pada tahun 1995. Pada
waktu itu PHP masih bernama Form Interpreted (FI), yang wujudnya berupa
sekumpulan skrip yang digunakan untuk mengolah data formulir dari web.
Selanjutnya Rasmus merilis kode sumber tersebut untuk umum dan menamakannya
PHP/FI
Pada November 1997, dirilis PHP/FI 2.0. Pada rilis ini, interpreter PHP
sudah diimplementasikan dalam program C. Dalam rilis ini disertakan juga modul-
modul ekstensi yang meningkatkan kemampuan PHP/FI secara signifikan.
Pada tahun 1997, sebuah perusahaan bernama Zend menulis ulang
interpreter PHP menjadi lebih bersih, lebih baik, dan lebih cepat. Kemudian pada
Juni 1998, perusahaan tersebut merilis interpreter baru untuk PHP dan meresmikan
rilis tersebut sebagai PHP 3.0 dan singkatan PHP diubah menjadi akronim berulang
PHP: Hypertext Preprocessing.
Pada pertengahan tahun 1999, Zend merilis interpreter PHP baru dan rilis
tersebut dikenal dengan PHP 4.0. PHP 4.0 adalah versi PHP yang paling banyak

5
dipakai pada awal abad ke-21. Versi ini banyak dipakai disebabkan kemampuannya
untuk membangun aplikasi web kompleks tetapi tetap memiliki kecepatan dan
stabilitas yang tinggi.
Pada Juni 2004, Zend merilis PHP 5.0. Dalam versi ini, inti dari interpreter
PHP mengalami perubahan besar. Versi ini juga memasukkan model pemrograman
berorientasi objek ke dalam PHP untuk menjawab perkembangan bahasa
pemrograman ke arah paradigma berorientasi objek. Peladen web bawaan
ditambahkan pada versi 5.4 untuk mempermudah pengembang menjalankan kode
PHP tanpa menginstal peladen perangkat lunak.

3.1.2 Kelebihan PHP


Berikut ini adalah kelebihan php:
1. Bahasa pemrograman PHP adalah sebuah bahasa script yang tidak
melakukan sebuah kompilasi dalam penggunaannya.
2. Peladen web yang mendukung PHP dapat ditemukan di mana - mana dari
mulai apache, IIS, Lighttpd, hingga Xitami dengan konfigurasi yang relatif
mudah.
3. Dalam sisi pengembangan lebih mudah, karena banyaknya developer yang
siap membantu dalam pengembangan.
4. Dalam sisi pemahamanan, PHP adalah bahasa script yang paling mudah di
pahami karena memiliki banyak referensi.
5. PHP adalah bahasa Open Source yang dapat digunakan di berbagai mesin
(Linux, Unix, Macintosh, Windows) dan dapat dijalankan secara runtime
melalui console serta juga dapat menjalankan perintah-perintah system.

3.2 XAMPP

Pengertian XAMPP adalah perangkat lunak (free software) bebas, yang


mendukung untuk banyak sistem operasi, yang merupakan kompilasi dari beberapa
program. Fungsi XAMPP sendiri adalah sebagai server yang berdiri sendiri
(localhost), yang terdiri beberapa program antara lain: Apache HTTP Server,

6
MySQL database, dan penerjemah bahasa yang ditulis dengan bahasa
pemrograman PHP dan Perl.
Program ini tersedia dalam GNU General Public License dan bebas,
merupakan web server yang mudah untuk digunakan yang dapat menampilkan
halaman web yang dinamis. Untuk mendapatkanya XAMPP anda dapat
mendownload langsung dari web resminya. Dan berikut beberapa definisi program
lainnya yang terdapat dalam XAMPP.

Gambar 3. 2 Logo XAMPP

3.2.1 Asal Kata XAMPP


1. X = Cross Platform Merupakan kode penanda untuk software cross platform
atau yang bisa berjalan di banyak sistem operasi.
2. A = Apache Apache adalah aplikasi web server yang bersifat gratis dan bisa
dikembangkan oleh banyak orang (open source).
3. M = MySQL / MariaDB MySQL atau MariaDB merupakan aplikasi
database server yang dikembangkan oleh orang yang sama. MySQL
berperan dalam mengolah, mengedit, dan menghapus daftar melalui
database.
4. P = PHP Huruf “P” yang pertama dari akronim kata XAMPP adalah inisial
untuk menunjukkan eksistensi bahasa pemrograman PHP. Bahasa
pemrograman ini biasanya digunakan untuk membuat website dinamis,
contohnya dalam website berbasis CMS WordPress.
5. P = Perl Sementara itu, untuk huruf P selanjutnya merupakan singkatan dari
bahasa pemrograman Perl yang kerap digunakan untuk memenuhi berbagai

7
macam kebutuhan. Perl ini bisa berjalan di dalam banyak sistem operasi
sehingga sangat fleksibel dan banyak digunakan.

3.3 Framework

Framework atau dalam bahasa indonesia dapat diartikan sebagai “kerangka


kerja” merupakan kumpulan fungsi/prosedur dan class-class untuk tujuan tertentu
yang sudah siap digunakan sehingga bisa mempermudah dan mempercepat
pekerjaan seorang programmer tanpa harus membuat fungsi atau class dari awal
(IDCloudHost, 2017).

3.4 Codeigniter

CodeIgniter adalah sebuah framework PHP dengan model MVC (Model,


View, Controller) yang open source. CodeIgniter pertama kali dikembangkan pada
tahun 2006 oleh Rick Ellis (IDCloudHost, 2017). CodeIgniter banyak digunakan
karena dapat mempercepat dan mempermudah pembangunan sebuah web
application, mempermudah dalam maintenance karena sudah memiliki pola
tertentu dalam sebuah framework.

Gambar 3. 3 Logo Codeigniter

3.5 Bootstrap

Bootstrap merupakan sebuah library framework CSS yang telah dibuat


khusus uintuk mengembangkan front end sebuah website. Bootstrap juga dikenal
sebagai salah satu framework CSS, HTML, Javascript yang begitu populer di
kalangan website developer atau pengembang website.

8
Dengan adanya bootstrap tersebut tentu saja membuat halaman website bisa
menyesuaikan dengan ukuran monitor device. Baik jika di akses lewat ponsel, tablet
ataupun desktop. Awal mulanya, bootstrap sendiri bernama Twitter Blueprint. ini
dulunya diciptakan dan dikembangkan oleh Jacob Thornton dan Mark Otto yang
ada di Twitter untuk perangkat kerja yang bisa mendorong konsistensi pada alat
internalnya. Dengan memakai bootstrap tentu saja seorang developer bisa lebih
mudah dan cepat untuk membuat front end dalam sebuah website itu sendiri.

Gambar 3. 4 Logo Bootstrap

3.6 Visual Studio Code

Visual Studio Code (VS Code) adalah sebuah teks editor ringan dan handal
yang dibuat oleh Microsoft untuk sistem operasi multiplatform, artinya tersedia
juga untuk versi Linux, Mac, dan Windows. Teks editor ini secara langsung
mendukung bahasa pemrograman JavaScript, Typescript, dan Node.js, serta bahasa
pemrograman lainnya dengan bantuan plugin yang dapat dipasang via marketplace
Visual Studio Code (seperti C++, C#, Python, Go, Java, dst). Banyak sekali fitur-
fitur yang disediakan oleh Visual Studio Code, diantaranya Intellisense, Git
Integration, Debugging, dan fitur ekstensi yang menambah kemampuan teks editor.
Fitur-fitur tersebut akan terus bertambah seiring dengan bertambahnya versi Visual
Studio Code. Pembaruan versi Visual Studio Code ini juga dilakukan berkala setiap
bulan, dan inilah yang membedakan VS Code dengan teks editor-teks editor yang
lain.

9
Gambar 3. 5 Logo Visual Studio Code

Ini termasuk dukungan untuk debugging, kontrol Git yang tertanam dan
GitHub, penyorotan sintaksis, penyelesaian kode cerdas, snippet, dan refactoring
kode. Ini sangat dapat disesuaikan, memungkinkan pengguna untuk mengubah
tema, pintasan keyboard, preferensi, dan menginstal ekstensi yang menambah
fungsionalitas tambahan. Kode sumbernya gratis dan open source dan dirilis di
bawah Lisensi MIT yang permisif. Binari yang dikompilasi adalah freeware dan
gratis untuk penggunaan pribadi atau komersial.

10
IV MATERI KERJA PRAKTEK

4.1 Algoritma Aplikasi Inventary

Algoritma aplikasi inventary memiliki beberapa tahapan yaitu, verifikasi


akun, login, dashboard, CRUD data barang, CRUD data barang keluar, CRUD data
barang masuk, CRUD data transaksi dan CRUD data user. Gambar algoritma
inventary dapat dilihat pada gambar 4.1

Gambar 4. 1 Algoritma Aplikasi

4.2 Pembuatan Aplikasi Inventary

4.2.1 Instalasi Framework CI


Framework CI dapat diunduh pada situs resminya yaitu:
https://codeigniter.com/

11
Gambar 4. 2 Website CI

Setelah framework CI diunduh, selanjutnya unduh framework Bootstrap,


framework Bootstrap dapat diunduh di situs resminya yaitu:
https://getbootstrap.com/

Gambar 4. 3 Website Bootstrap

Setelah kedua framework tersebut telah diunduh, masukan file tersebut ke


dalam folder htdocs, dimana fungsi folder ini adalah menyimpan data web yang
akan diakses nanti lewat server lokal (localhost).

12
Gambar 4. 3 Isi folder htdocs
Setelah folder dibuat, ubah nama folder tersebut dengan nama “invent” agar
mudah diakses di localhost. jika nama telah diubah, maka ketikkan
http://localhost/invent/ dan akan muncul tampilan seperti pada Gambar 4.4.

Gambar 4. 4 Codeigniter awal

4.2.2 Pembuatan Struktur Database dan Table


Setelah proses pemindahan file codeigniter selesai, buka aplikasi Xampp
seperti tampak pada Gambar 4.6 lalu aktifkan “Apache” dan “MySQL” dengan
melakukan klik start pada menu “Actions”, untuk memastikan telah aktif dapat
dilihat di keterangan status change detected : running.

Gambar 4. 5 Aplikasi Xampp

Database ini bertujuan untuk menyimpan data yang diinput. untuk


Pembagian struktur data dari masingmasing tabel terdapat pada Kamus Data di
Tabel 4.1.

13
Tabel 4. 1 Kamus Data
TABEL BARANG
Nama Field Tipe Panjang Data Keterangan
Id_barang Integer 11 Primary Key
Kode_barang Varchar 10
Nama_barang Varchar 50
Harga Integer 11
Stok Integer 5
Id_jenis Integer 11
Id_merk Integer 11
TABEL BARANG_KELUAR
Nama Field Tipe Panjang Data Keterangan
Id_barang_keluar Integer 11 Primary Key
Kode_barang Varchar 20
Tgl_keluar Date
Jumlah Integer 100
TABEL BARANG_MASUK
Nama Field Tipe Panjang Data Keterangan
Id_barang_masuk Integer 11 Primary Key
Kode_barang Varchar 10
Jumlah Integer 3
harga Integer 10
TABEL DETAIL_TRANSAKSI
Nama Field Tipe Panjang Data Keterangan
Kode_transaksi Varchar 11
Kode_barang Varchar 10
qty Integer 5
TABEL JENIS_BARANG

14
Nama Field Tipe Panjang Data Keterangan
Id_jenis Integer 11 primary key
Jenis_barang Varchar 50
TABEL MERK_BARANG
Nama Field Tipe Panjang Data Keterangan
Id_merk Integer 11 primary key
Merk_barang Varchar 50
status integer 11
TABEL TRANSAKSI
Nama Field Tipe Panjang Data Keterangan
Id_transaksi Integer 11 Primary Key
Kode_transaksi Varchar 10
Tgl_transaksi date 3
Total_harga Integer 11
TABEL USERS
Nama Field Tipe Panjang Data Keterangan
Id_user Integer 11 Primary Key
Nama_user Varchar 100
Username Varchar 50
Password Varchar 50
Level Varchar 20

4.2.3 Konfigurasi CI
Dalam CI terdapat beberapa macam kelas (class) yang berbentuk library dan
helper. Keduanya berfungsi untuk membantu pemrogram (programmer) dalam
mengembangkan aplikasinya. Untuk mengatur library dan helper, buka
application/config/autoload.php pada Visual Studio Code dan atur menjadi seperti
Gambar 4.6.

15
Gambar 4. 6 Kelas Library dan Helper

Tahap yang terakhir dalam konfigurasi CI adalah membuat Application


Programming Interface (API) yang berfungsi untuk menghubungkan database
dengan framework CI kita, cara membuat API pada framework CI kita dapat dilihat
di Gambar 4.7.

Gambar 4. 7 API Koneksi

Sesuai dengan fungsi framework CI yaitu Model, View dan Controller (


MVC ), lakukan konfigurasi MVC ini sesuai dengan data yang akan ditampilkan.
1. Model
Aplikasi inventaris ini akan menggunakan lima buah model, yaitu barang
keluar, barang masuk, barang, jenis barang, merk barang, no urut, dan users. (Tabel
4.2).
Tabel 4. 2 Tabel Model
Model Nama Model Tabel RDBMS Keterangan
Data
Barang keluar
Barang_keluar Barang_keluar_model barang_keluar
dan barang
admin di ambil

16
dari tabel
barang_keluar
admin di
database. Dan
data barang
diambil dari tabel
barang di
database.
Data barang
masuk di ambil
dari tabel
Barang masuk barang_masuk di
Barang_masuk Barang_masuk_model
dan barang database Dan data
barang diambil
dari tabel barang
di data base.
Data barang di
ambil pada dari
Barang Barang_model Barang
tabel barang di
database
Berisi data jenis
barang di ambil
Jenis_barang Jenis_barang_model Jenis barang dari table Jenis
barang pada
database
Berisi data merk
barang di ambil
Merk_barang Merk_barang_model Merk barang dari table merk
barang pada
database

17
Berisi data buat
kode barang dan
No_urut No_urut Barang
data buat kode
penjualan
Berisi data admin,
Users Users_model Users manajer dan
petugas Gudang.

2. View
Aplikasi invent juga menggunakan enam buah view, yaitu barang,
barang_keluar, barang_masuk, jenis_barang, merk_barang dan Users, (Tabel 4.3).
Tabel 4. 3 Tabel View
View Nama View Keterangan
Barang_form.php berguna untuk
menunjukan halaman mengisi data
barang
Barang_list.php berguna untuk
Barang_form.php,
menunjukan halaman daftar barang dan
Barang Barang_list.php dan
update, delete barang.
Barang_read.php
Barang_read.php berguna untuk
menunjukan halaman untuk
menambahkan data

Barang_keluar_form
Barang_keluar_form.php berguna untuk
.php,
menunjukan halaman mengisi data
Barang_keluar_list.p
Barang_keluar barang_keluar
hp dan
Barang_keluar_list.php berguna untuk
Barang_keluar_read.
menunjukan halaman daftar
php

18
barang_keluar dan update, delete barang
keluar.
Barang_keluar_read.php berguna untuk
menunjukan halaman untuk
menambahkan data barang keluar
Barang_masuk_form.php berguna untuk
menunjukan halaman mengisi data
Barang_masuk_form
barang_masuk
.php,
Barang_masuk_list.php berguna untuk
Barang_masuk_list.p
Barang_masuk menunjukan halaman daftar barang
hp dan
masuk dan update, delete barang masuk.
Barang_masuk_read.
Barang_masuk_read.php berguna untuk
php
menunjukan halaman untuk
menambahkan data barang masuk
View Nama View Keterangan
Jenis_barang_form.php berguna untuk
menunjukan halaman mengisi Jenis
Jenis_barang_form.p
barang
hp,
Jenis_barang_list.php berguna untuk
Jenis_barang_list.php
Jenis_barang menunjukan halaman daftar jenis_barang
dan
dan update, delete jenis barang
Jenis_barang_read.ph
Jenis_Barang_read.php berguna untuk
p
menunjukan halaman untuk
menambahkan data jenis barang
Merk_barang_form.php berguna untuk
menunjukan halaman mengisi data merk
barang
Merk_barang
Merk_barang_list.php berguna untuk
Merk_barang_form.p
menunjukan halaman daftar merk barang
hp,
dan update, delete merk barang.

19
Menis_barang_list.ph Merk_barang_read.php berguna untuk
p dan menunjukan halaman untuk
Menis_barang_read.p menambahkan data merk barang
hp
Users_form.php berguna untuk
menunjukan halaman mengisi data Users
Users_list.php berguna untuk
Users_form.php, menunjukan halaman daftar Users dan
Users
Users_list.php dan update, delete Users.
Users_read.php Users_read.php berguna untuk
menunjukan halaman untuk
menambahkan Users

3. Controller
Aplikasi inventaris juga menggunakan tujuh buah controller, yaitu App,
barang_keluar, barang_masuk, barang, jenis_barang, Jenis_barang, Merk_barang
dan Users, (Tabel 4.4). Jika sudah selesai, buka browser dan jalankan controller
admin dengan mengunjungi url: http://localhost/invent/ maka akan muncul
tampilan seperti Gambar 4.8.
Tabel 4. 4 Tabel Controller
Controller Nama controller Keterangan
Berfungsi untuk mengkontrol data yang ada
pada login, setelah berhasil login akan
App App.php meload view di v_index.php lalu
mengambil data di menu_php. Dan akan
menampilkan tampilan home
Berfungsi untuk mengkontrol data barang
Barang_keluar Barang_keluar.php
yang keluar pada transaksi_barang keluar
Berfungsi untuk mengkontrol data barang
Barang_masuk Barang_masuk.php
yang masuk pada transaksi_barang masuk

20
Berfungsi untuk mengkontrol data yang ada
Barang Barang.php
barang
Berfungsi untuk mengkontrol data yang ada
Jenis_barang Jenis_barang.php
pada jenis barang
Berfungsi untuk mengkontrol data yang ada
Merk_barang Merk_barang.php
pada merk barang
Berfungsi untuk mengkontrol data yang ada
Users Users.php
pada Users

4.3 Tahapan Penggunaan Aplikasi Inventary

Dalam sistem ini sebelum menggunakannya, user diminta memasukkan


username dan passwoard. pada tahap login ini ada tiga jenis user yang dapat
melakukan login yakni, admin, manajer dan petugas gudang. Admin memiliki
fasilitas untuk mengelola data user, data barang, jenis merk, jenis barang, transaksi
barang keluar, transaksi barang masuk, data transaksi, sedangkan manajer memiliki
fasilitas untuk mengelola data barang, jenis merk, jenis barang, transaksi barang
keluar, transaksi barang masuk, data transaksi, dan petugas gudang memiliki
fasilitas untuk mengelola transaksi barang keluar, transaksi barang masuk, data
transaksi.

Gambar 4. 8 Tampilan awal login aplikasi inventory

Setelah melakukan login, user akan diarahkan sesuai level user, halaman
akan langsung menuju halaman utama, yang berisi data manajemen user, data
barang, jenis merk, jenis barang, transaksi barang keluar, transaksi barang masuk,

21
dan data transaksi. tiap login berdasarkan level user akan ditampilkan tiap menu
yang berbeda.

Gambar 4. 9 Tampilan home aplikasi inventary admin

Gambar 4. 10 Tampilan home aplikasi inventary manajer

Gambar 4. 11 Tampilan home aplikasi inventary gudang

Data barang adalah fasilitas yang diberikan untuk melihat data barang yang
tersedia, pada fasilitas ini yang dapat melakukan tambah barang, hapus barang,
update barang, hanyalah admin dan manajer.

22
Gambar 4. 12 Tampilan data barang

Tambah barang akan mengarahkan user ke form isian data barang yang akan
ditambahkan. Di dalam form tersebut berisi isian yang harus di isi seperti, kode
barang, nama barang, harga, jemis barang, merk barang, dan stok. Pada tampilan
tambah data barang ini mirip dengan ubah data barang

Gambar 4. 13 Tampilan tambah data barang

Jenis barang adalah fasilitas yang diberikan untuk melihat jenis barang yang
telah ditambahkan, pada fasilitas ini yang dapat melakukan tambah jenis barang,
hapus jenis barang dan update jenis barang, hanyalah admin dan manajer.

Gambar 4. 14 Tampilan jenis barang

23
Tambah jenis barang akan mengarahkan user ke form isian data jenis barang
yang akan ditambahkan. Di dalam form tersebut berisi isian yang harus di isi seperti
jenis barang. Pada tampilan tambah jenis barang ini mirip dengan ubah jenis barang

Gambar 4. 15 Tampilan tambah jenis barang

Merk barang adalah fasilitas yang diberikan untuk melihat merk barang
yang telah ditambahkan, pada fasilitas ini yang dapat melakukan tambah merk
barang, hapus dan update, hanyalah admin dan manajer.

Gambar 4. 16 Tampilan merk barang

Tambah merk barang akan mengarahkan user ke form isian data merk
barang yang akan ditambahkan. Di dalam form tersebut berisi isian yang harus di
isi seperti merk barang. Pada tampilan tambah merk barang ini mirip dengan ubah
merk barang

24
Gambar 4. 17 Tampilan tambah merk barang

Data barang masuk adalah fasilitas yang diberikan untuk melihat data
barang masuk yang telah ditambahkan, pada fasilitas ini yang dapat melakukan
tambah kode barang, jumlah barang, dan harga, hanyalah, manajer dan petugas
gudang. Pada data barang masuk ini jika ditambahkan maka pada menu data barang
otomatis akan bertambah.

Gambar 4. 18 Tampilan data barang masuk

Tambah data barang masuk akan mengarahkan user ke form isian data
barang masuk yang akan ditambahkan. Di dalam form tersebut berisi isian yang
harus di isi seperti, kode barang, jumlah, harga. Pada tampilan tambah barang
masuk ini mirip dengan ubah barang masuk.

25
Gambar 4. 19 Tampilan tambah data barang masuk

Data barang keluar adalah fasilitas yang diberikan untuk melihat data
barang keluar yang telah dibuat, pada fasilitas ini yang dapat mengisi, kode barang,
tanggal keluar, dan jumlah hanyalah, manajer dan petugas gudang. Pada data
barang keluar ini jika dibuat maka pada menu data barang otomatis akan berkurang
datanya.

Gambar 4. 20 Tampilan tambah data barang keluar

Tambah data barang keluar akan mengarahkan user ke form isian data
barang keluar yang akan ditambahkan. Di dalam form tersebut berisi isian yang
harus di isi seperti, kode barang, tanggal keluar dan jumlah. Pada tampilan tambah
barang keluar ini mirip dengan ubah barang keluar.

26
Gambar 4. 21 Tampilan tambah data barang keluar

Data transaksi adalah fasilitas yang diberikan untuk melihat data transaksi
pada pelanggan yang telah membeli sebuah barang.

Gambar 4. 22 Tampilan data transaksi


Tambah transaksi akan mengarahkan user ke form isian data tambah
transaksi yang akan ditambahkan. Di dalam form tersebut berisi isian yang harus di
isi seperti, nama barang, lalu jika telah di isi maka otomatis kode barang, stok
tersedia dan harga otomatis muncul, lalu pilih jumlah yang mau di beli secara
manual, ulangi berulang kali pada barang yang ingin di beli.

Gambar 4. 23 Tampilan tambah transaksi

27
Menu detail transaksi adalah menu form yang telah di isi pada tambah
transaksi.

Gambar 4. 24 Tampilan detail transaksi

Menu cetak ini adalah menu form yang telah di isi pada tambah transaksi,
ketika akan klik cetak otomatis akan mengarahkan ke halaman baru untuk mencetak
dengan menekan ctrl + p disitu akan ada pilihan untuk print atau save ke pdf.

Gambar 4. 25 Tampilan mencetak data transaksi

Data user adalah fasilitas yang diberikan untuk melihat data user yang telah
di daftarkan oleh admin, pada fasilitas ini yang dapat melakukan tambah user, hapus
user, update user, hanyalah admin.

28
Gambar 4. 26 Tampilan data user

Tambah data user akan mengarahkan user ke form isian data user yang akan
ditambahkan. Di dalam form tersebut berisi seperti, nama, user, passwoard dan
level. Pada level ini akun akan didaftarkan pada tingkatan admin, manajer atau
petugas gudang. Pada tampilan tambah user ini mirip dengan ubah user.

Gambar 4. 27 Tampilan tambah data user

29
V PENUTUP

5.1 Kesimpulan

Dari kerja praktek yang dilakukan, dapat di ambil kesimpulan antara lain:
1. Sistem inventary barang yang telah di buat ini dapat mempercepat dan
meningkatkan efektifitas pendataan yang masuk dan keluar di Toko Ami It
& Creative.
2. Penumpukan atau kekurangan persediaan barang - barang pada toko dapat
timbul karena kurangnya informasi mengenai persediaan barang secara real
time.

5.2 Saran

Dari kerja praktek yang dilakukan, dapat di ambil saran antara lain:
1. Pembangunan aplikasi sistem inventary berbasis web ini perlu dilakukan
dengan seiringnya teknologi yang terus berkembang
2. Melakukan pengendalian terhadap stok barang secara berkala yang telah
di sediakan oleh sistem, dengan tujuan untuk mengetahui keadaan stok
barang
3. Sebelum sistem di implementasikan pada pemilik toko, di perlukan
pelatihan bagi user untuk dapat menggunakan sistem dengan baik dan
mengbackup data terhadap sistem tersebut.

30
DAFTAR PUSTAKA

Terstruktur, K. P. (1970). Data flow diagram 1. 1–17. Retrieved from


http://fenni.staff.gunadarma.ac.id/Downloads/files/7725/Data+Flow+Diagra
m.pdf
Wikipedia. (2020). PHP - wikipedia bahasa indonesia, ensikpoledia bebas. 4–5.
Retrieved from https://id.wikipedia.org/wiki/PHP
IDCloudHost. (2017). Mengenal Apa itu Framework CodeIgniter | IDCloudHost.
https://idcloudhost.com/panduan/mengenal-apa-itu-framework-codeigniter/
Nugroho, A. (2019). Pengertian Bootstrap Dan Cara Menggunakannya.
https://qwords.com/blog/apa-itu-bootstrap/
IDCloudHost. (2019). (n.d.). Mengenal Apa itu Pengertian XAMPP.
https://idcloudhost.com/kamus-hosting/xampp/
Dayna, B. Al. (2020). Pengertian Visual Studio - Sejarah, Fitur, Fungsi, Kegunaan
dan Manfaat. uangcoder.com/2020/07/pengertian-dan-sejarah-visual-studio.html

31

Anda mungkin juga menyukai