APLIKASI KASIR BERBASIS WEB

PADA CV. GRIYA SARANA INFORMATIKA

Laporan ini disusun sebagai salah satu syarat

Ujian Kenaikan Kelas XII 2022/2023

Disusun Oleh :

MUHAMMAD IKHSAN NUR SHIDIQ

NIS. 19331928

KOMPETENSI KEAHLIAN REKAYASA PERANGKAT LUNAK

SMK INFORMATIKA AL-IRSYAD AL-ISLAMIYYAH CIREBON
TAHUN AJARAN 2022/2023

1
 YAYASAN AL-IRSYAD AL-ISLAMIYYAH CIREBON
SMK INFORMATIKA AL-IRSYAD AL-ISLAMIYYAH

Kompetensi Keahlian Rekayasa Perangkat Lunak (RPL)

TANDA PERSETUJUAN DAN PENGESAHAN LAPORAN

PRAKTEK KERJA LAPANGAN PADA CV. GSI

Nama : Muhammad Ikhsan Nur Shidiq

NIS / NISN : 19331928
Program Keahlian : Teknik Komputer Dan Informasi
Kompetensi Keahlian : Rekayasa Perangkat Lunak
Judul Laporan PKL : Aplikasi Kasir Berbasis Web

Laporan praktek kerja lapangan ini telah disetujui dan disahkan serta diizinkan
untuk dipresentasikan pada ujian lisan praktek kerja lapangan periode : 2022/2023.

Kepala Kompetensi RPL Pembimbing Laporan

Fahmi, M.Kom Fahmi, M.Kom

NIK: 19830120091022 NIK: 19830120091022

Menyetujui,
Kepala SMK Informatika Al-Irsyad Al-Islamiyyah Cirebon

Sri Wahyuni Aslamiah, S.Pd

NIK: 19830720072012
 PENGUJI PKL

Laporan Praktek Kerja Lapangan ini telah dipresentasikan dan diujikan didepan

Tim Penguji PKL Kompetensi Keahlian Rekayasa Perangkat Lunak (RPL)

SMK Informatika Al-Irsyad Al-Islamiyyah Cirebon

pada tanggal : .........

No Nama Tanda Tangan Jabatan

1. ……………….. ……………….. Penguji 1

2. ……………….. ……………….. Penguji 2

 LEMBAR KONSULTASI PKL
SMK INFORMATIKA AL-IRSYAD AL-ISLAMIYYAH CIREBON
KOMPETENSI KEAHLIAN : REKAYASA PERANGKAT LUNAK

FOTO NIS : 19331928

3x4 Nama Lengkap : Muhammad Ikhsan Nur Shidiq

Pembimbing I : Fahmi, M.Kom
Pembimbing II : Muhammad Hafiizh
Judul PKL : Aplikasi Kasir Berbasis Web

Tanggal Paraf Guru

No. Pokok Bahasan
Bimbingan Pembimbing
1. 12 -08-2022 Pengantar Laporan
2. 09-09-2022 Pembahasan Bab 1
3. 30-09-2022 Pembahasan Bab 2
4. 07-10-2022 Pembahasan Bab 3
5. 14-10-2022 Pembahasan Bab 4
6. 28-10-2022 Program Aplikasi
7. - -

Catatan untuk guru pembimbing

Bimbingan PKL
 Dimulai tanggal : 12 Agustus 2022
 Diakhiri tanggal : 28 November 2022
 Jumlah Pertemuan Bimbingan : 6

Disetujui oleh,
Guru Pembimbing Laporan

Fahmi, M.Kom
NIK: 19830120091022
 KATA PENGANTAR

Puji syukur penulis panjatkan atas kehadirat Allah Subhanahu wa ta ‘ala yang

telah melimpahkan rahmat kepada penulis sehingga dapat menyelesaikan

penyususnan laporan Praktik Kerja Lapangan (PKL) ini, sebagai salah satu syarat

untuk mengikuti Sidang PKL pada Kompetensi Keahlian Rekayasa Perangkat

Lunak (RPL) di Sekolah Menengah Kejuruan (SMK) Informatika Al-Irsyad Al-

Islamiyyah Cirebon .

Selama dalam penyelesaian dan penyusunan laporan ini, tidak lepas dari

bantuan dan bimbingan dari berbagai pihak sehingga penulis bias mendapatkan

informasi yang dibutuhkan dalam penyusunan laporan ini. Oleh karena itu, pada

kesempatan ini penulis ingin menyampaikan terimakasih yang sebesar-besarnya

kepada yang terhormat:

1. Ibu Sri Wahyuni Aslamiah selaku Kepala SMK Informatika Al-Irsyad

Al-Islamiyyah Cirebon yang telah memberikan ijin dalam penyusunan

penulisan laporan ini.

2. Bapak Abdurachim, S.Kom, selaku Ketua Panitia PKL Tahun

2022/2023.

3. Bapak Fahmi, M.Kom., selaku Ketua Kompetensi Rekayasa Perangkat

Lunak SMK Al Irsyad Al Islamiyyah Kota Cirebon, dan sekaligus juga

sebagai Pembimbing Laporan yang telah memberikan arahan dan

bimbingannya dalam penyusunan laporan ini.

 4. Bapak Muhammad Hafiizh, S.Kom, selaku Pembimbing Lapangan yang

telah memberikan arahan dan bimbingan kunjungan di lapangan.

5. Bapak dan Ibu Guru serta Staff TU SMK Informatika Al-Irsyad Al-

Islamiyyah Cirebon.

6. Bapak Oskar Haris, S.T, selaku Kepala CV. Griya Sarana Informatika.

7. Mas Chandra bakhtiar, selaku pembimbing di CV GSI.

8. Seluruh Staff dan Karyawan CV GSI

9. Rekan-rekan kelas XII RPL yang telah memberikan support dan

dukungan selama pelaksanaan PKL dan penyusunan laporan.

10. Serta semua pihak yang tidak dapat penulis sebutkan satu persatu, yang

turut membantu sehingga penulis dapat menyelesaikan laporan PKL ini.

Penulis menyadari bahwa penyusunan laporan ini p enulisan laporan PKL ini

masih banyak kekurangan. Oleh karena itu, segala kritik dan saran yang

membangun sangat penulis harapkan. Semoga penulisan yang telah penulis susun

ini dapat bermanfaat, baik bagi penulis sendiri maupun bagin semua pihak yang

memerlukan.

Cirebon, September 2022

Muhammad Ikhsan Nur Shidiq

 DAFTAR ISI

APLIKASI KASIR BERBASIS WEB.....................................................................i

TANDA PERSETUJUAN DAN PENGESAHAN LAPORAN..............................ii
PENGUJI PKL........................................................................................................iii
LEMBAR KONSULTASI PKL.............................................................................iv
KATA PENGANTAR.............................................................................................v
DAFTAR ISI..........................................................................................................vii
DAFTAR GAMBAR..............................................................................................ix
DAFTAR TABEL....................................................................................................x
DAFTAR LAMPIRAN...........................................................................................xi
BAB I.......................................................................................................................1
PENDAHULUAN...................................................................................................1
1.1. Latar Belakang Pemilihan Judul................................................................1
1.2. Maksud dan Tujuan...................................................................................1
1.3. Metode Penelitian......................................................................................1
1.4. Sistematika Penulisan................................................................................2
BAB II......................................................................................................................3
LANDASAN TEORI...............................................................................................3
2.1 Teori Pendukung Program.........................................................................3
2.1.1 Pengertian Web..................................................................................3
2.1.2 HTML................................................................................................3
2.1.3 PHP....................................................................................................4
2.1.4 Database.............................................................................................4
2.1.5 MySQL...............................................................................................4
2.1.6 CSS.....................................................................................................5
2.1.7 Bootstrap............................................................................................6
2.1.8 AJAX.................................................................................................6
2.1.9 Laravel...............................................................................................7
2.2 Teori Perancangan Program......................................................................8
2.2.1 Pengertian Flowchart (Alur Program)................................................8
2.2.2 Pengertian Flowmap(Alur System)....................................................9
 2.2.3 Pengertian DFD (Data Flow Dagram)...............................................9
2.2.4 Pengertian ERD (Entity Relationship Diagram)..............................11
BAB III..................................................................................................................12
TINJAUAN PERUSAHAAN................................................................................12
3.1. Sejarah Perusahaan..................................................................................12
3.2. Struktur Organisasi Perusahaan...............................................................12
3.3. Jenis Badan Usaha...................................................................................13
BAB IV..................................................................................................................14
PEMBAHASAN....................................................................................................14
4.1 Perancangan Sistem.................................................................................14
4.1.1 Flowmap...........................................................................................14
4.1.2 DFD..................................................................................................15
4.1.3 Flowchart Program...........................................................................17
4.2 Spesifikasi Program.................................................................................18
4.2.1 Desain Tampilan Program...............................................................18
4.2.2 Struktur Table..................................................................................23
4.2.3 Tampilan Program............................................................................25
4.3 Sarana Pendukung Program....................................................................29
4.3.1 Software...........................................................................................29
4.3.2 Hardware..........................................................................................29
BAB V....................................................................................................................30
PENUTUP..............................................................................................................30
5.1. Kesimpulan..............................................................................................30
5.2. Saran-saran..............................................................................................30
DAFTAR PUSTAKA............................................................................................31
DAFTAR RIWAYAT HIDUP...............................................................................33
 DAFTAR GAMBAR

Gambar 2.1 Contoh Flowchart.................................................................................8

Gambar 4.1 Dfd Konteks.......................................................................................15

Gambar 4.2 DFD Level 1 Pengaduan....................................................................16
Gambar 4.3 Flowmap Program..............................................................................18
Gambar 4.4 Desain Halaman Login.......................................................................18
Gambar 4.5 Desain Halaman Dashboard Admin...................................................19
Gambar 4.6 Desain Halaman Informasi Admin.....................................................19
Gambar 4.7 Desain Halaman Kategori Admin......................................................20
Gambar 4.8 Desain Halaman Akun Admin...........................................................20
Gambar 4.9 Desain Halaman Riwayat Pengaduan................................................21
Gambar 4.10 Desain Halaman Pengaduan Admin.................................................21
Gambar 4.11 Desain Halaman Home User............................................................22
Gambar 4.12 Tampilan Halaman Login................................................................25
Gambar 4.13 Tampilan Halaman Dashboard Admin.............................................26
Gambar 4.14 Tampilan Informasi Admin..............................................................26
Gambar 4.15 Tampilan Halaman Kategori Admin................................................27
Gambar 4.16 Halaman Kategori Admin................................................................27
Gambar 4.17 Tampilan Halaman Pengaduan........................................................28
Gambar 4.18 Tampilan Halaman Home User........................................................28
 DAFTAR TABEL

Tabel 2.1 Simbol Data Flow Diagram...................................................................10

Tabel 4.1 Alur Flowmap........................................................................................14

Tabel 4.2 Tabel Akun.............................................................................................23
Tabel 4.3 Tabel Balasan.........................................................................................23
Tabel 4.4 Tabel Informasi......................................................................................24
Tabel 4.5 Tabel Kategori.......................................................................................24
Tabel 4.6 Tabel Pengaduan....................................................................................24
Tabel 4.7 Software Pendukung Program...............................................................29
Tabel 4.8 Hardware Pendukung Program..............................................................29
 DAFTAR LAMPIRAN

1. Surat Balasan PKL DU/DI ............................................................ Terlampir

2. Absensi Kehadiran Selama PKL.................................................... Terlampir

3. Uraian Kegiatan PKL..................................................................... Terlampir

4. Nilai PKL Dari DU/DI................................................................... Terlampir

 BAB I

PENDAHULUAN

1.1. Latar Belakang Pemilihan Judul

Kasir adalah tempat untuk melakukan transaksi atau pembayaran yang

menjadi akhir dari sebuah transaksi jual beli antara konsumen dan produsen

sehingga menghasilkan kepuasan pada masing-masing pihak.

1.2. Maksud dan Tujuan

Maksud dari pembuatan aplikasi kasir berbasis web adalah untuk

mempermudah dalam bertransaksi antara produsen dan konsumen.

1.3. Metode Penelitian

Metode penelitian yang dilakukan penulis adalah sebagai berikut :

1.3.1. Metode Wawancara

Pada metode ini penulis langsung mewawancarai salah satu

karyawan CV GSI yang ada di tempat PKL. Penulis menjadikan

karyawan dari CV GSI tersebut sebagai narasumber untuk mendapatkan

informasi program seperti apa yang harus dibuat serta bagaimana alur

kerja dan spesifikasi dari program tersebut.

1.3.2. Praktek Lapangan

Disini penulis melakukan praktek kerja lapangan selama 5 bulan

dimulai dari Bulan Juli 2022 hingga penghujung Bulan November

2022.

1
 2

1.3.3. Studi Pustaka

Untuk menunjang dalam penulisan laporan ini, penulis juga

menggunakan teknik studi pustaka, yaitu dengan memanfaatkan

informasi dari internet melalui referensi artikel serta literatur buku.

1.4. Sistematika Penulisan

Adapun sistematik penulisan laporan yang penulis buat adalah sebagai

berikut :

BAB I : PENDAHULUAN

Bab ini membahas tentang latar belakang pemilihan judul laporan,

maksud dan tujuan program, metode pengumpulan data, dan sistematis

penulisan laporan.

BAB II : LANDASAN TEORI

Bab ini membahas tentang konsep dasar dan teori pendukung untuk

membuat program.

BAB III : TINJAUAN PERUSAHAAN

Pada bab ini membahas tentang sejarah perusahaan, struktur

organisasi perusahaan, dan jenis badan usaha perusahaan.

BAB IV : PEMBAHASAN

Bab ini membahas tentang tinjauan kasus, spesifikasi rancangan

program, dan sarana pendukung program.

BAB V : PENUTUP

Bab ini berisi penutup berupa kesimpulan yang didapat, dan saran-

saran
 BAB II

LANDASAN TEORI

2.1 Teori Pendukung Program

2.1.1 Pengertian Web

Website adalah sebuah kumpulan halaman pada suatu domain di

internet yang dibuat dengan tujuan tertentu dan saling berhubungan

serta dapat diakses secara luas melalui halaman depan (home page)

menggunakan sebuah browser menggunakan URL website.

Sumber : https://www.niagahoster.co.id/blog/pengertian-website/

2.1.2 HTML

Hypertext Markup Language (HTML) adalah sebuah bahasa

markah yang digunakan untuk membuat sebuah halaman web,

menampilkan berbagai informasi di dalam sebuah penjelajah web

Internet dan pemformatan hiperteks sederhana yang ditulis dalam

berkas format ASCII agar dapat menghasilkan tampilan wujud yang

terintegerasi. Dengan kata lain, berkas yang dibuat dalam perangkat

lunak pengolah kata dan disimpan dalam format ASCII normal

sehingga menjadi halaman web dengan perintah-perintah HTML.

Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di

dunia penerbitan dan percetakan yang disebut dengan SGML (Standard

Generalized Markup Language), HTML adalah sebuah standar yang

digunakan secara luas untuk menampilkan halaman web. HTML saat

3
 4

ini merupakan standar Internet yang didefinisikan dan dikendalikan

penggunaannya oleh World Wide Web Consortium (W3C).

Sumber: https://id.wikipedia.org/wiki/HTML

2.1.3 PHP

PHP: Hypertext Preprocessor adalah bahasa skrip yang dapat

ditanamkan atau disisipkan ke dalam HTML. PHP banyak dipakai

untuk memprogram situs web dinamis. PHP dapat digunakan untuk

membangun sebuah CMS.

Sumber: https://id.wikipedia.org/wiki/PHP

2.1.4 Database

Pangkalan data atau basis data (bahasa Inggris: database) adalah

kumpulan informasi yang disimpan di dalam komputer secara

sistematik sehingga dapat diperiksa menggunakan suatu program

komputer untuk memperoleh informasi dari basis data tersebut.

Perangkat lunak yang digunakan untuk mengelola dan memanggil kueri

(query) basis data disebut sistem manajemen basis data (database

management system, DBMS). Sistem basis data dipelajari dalam ilmu

informasi.

Sumber: https://id.wikipedia.org/wiki/Pangkalan_data

2.1.5 MySQL

MySQL adalah sebuah implementasi dari sistem manajemen basis

data relasional (RDBMS) yang didistribusikan secara gratis di bawah

lisensi GPL (General Public License). Setiap pengguna dapat secara

bebas menggunakan MySQL, tetapi dengan batasan perangkat lunak

 5

tersebut tidak boleh dijadikan produk turunan yang bersifat komersial.

MySQL sebenarnya merupakan turunan salah satu konsep utama dalam

basisdata yang telah ada sebelumnya; SQL (Structured Query

Language). SQL adalah sebuah konsep pengoperasian basisdata,

terutama untuk pemilihan atau seleksi dan pemasukan data, yang

memungkinkan pengoperasian data dikerjakan dengan mudah secara

otomatis.

Sumber: https://id.wikipedia.org/wiki/MySQL

2.1.6 CSS

Cascading Style Sheet (CSS) merupakan aturan untuk mengatur

beberapa komponen dalam sebuah web sehingga akan lebih terstruktur

dan seragam. CSS bukan merupakan bahasa pemograman.

Sama halnya styles dalam aplikasi pengolahan kata seperti

Microsoft Word yang dapat mengatur beberapa style, misalnya heading,

subbab, bodytext, footer, images, dan style lainnya untuk dapat

digunakan bersama-sama dalam beberapa berkas (file). Pada umumnya

CSS dipakai untuk memformat tampilan halaman web yang dibuat

dengan bahasa HTML dan XHTML.

CSS dapat mengendalikan ukuran gambar, warna bagian tubuh

pada teks, warna tabel, ukuran border, warna border, warna hyperlink,

warna mouse over, spasi antar paragraf, spasi antar teks, margin kiri,

kanan, atas, bawah, dan parameter lainnya. CSS adalah bahasa style

sheet yang digunakan untuk mengatur tampilan dokumen. Dengan

 6

adanya CSS memungkinkan kita untuk menampilkan halaman yang

sama dengan format yang berbeda.

Sumber: https://id.wikipedia.org/wiki/Cascading_Style_Sheets

2.1.7 Bootstrap

Bootstrap adalah open-source framework (kerangka kerja

pemrograman) front-end (library) yang bebas (gratis) untuk merancang

situs web dan aplikasi web. Framework ini berisi template desain

berbasis HTML dan CSS untuk tipografi, formulir, tombol, navigasi

dan komponen antarmuka lainnya, serta juga ekstensi opsional

JavaScript. Tidak seperti kebanyakan framework web lainnya,

framework ini hanya fokus pada pengembangan front-end saja.

Sumber: https://id.wikipedia.org/wiki/Bootstrap_(framework_front-

end)

2.1.8 AJAX

Asynchronous JavaScript and XMLHTTP, atau disingkat AJaX, adalah

suatu teknik pemrograman berbasis web untuk menciptakan aplikasi

web interaktif. Tujuannya adalah untuk memindahkan sebagian besar

interaksi pada komputer web surfer, melakukan pertukaran data dengan

server di belakang layar, sehingga halaman web tidak harus dibaca

ulang secara keseluruhan setiap kali seorang pengguna melakukan

perubahan. Hal ini akan meningkatkan interaktivitas, kecepatan, dan

kegunaan.

Sumber: https://id.wikipedia.org/wiki/AJAX
 7

2.1.9 Laravel

Laravel adalah sebuah framework PHP yang dirilis dibawah lisensi

MIT, dibangun dengan konsep MVC (model view controller). Laravel

adalah pengembangan website berbasis MVP yang ditulis dalam PHP

yang dirancang untuk meningkatkan kualitas perangkat lunak dengan

mengurangi biaya pengembangan awal dan biaya pemeliharaan, dan

untuk meningkatkan pengalaman bekerja dengan aplikasi dengan

menyediakan sintaks yang ekspresif, jelas dan menghemat waktu.

MVC adalah sebuah pendekatan perangkat lunak yang memisahkan

aplikasi logika dari presentasi. MVC memisahkan aplikasi berdasarkan

komponen- komponen aplikasi, seperti : manipulasi data, controller,

dan user interface.

Model, Model mewakili struktur data. Biasanya model berisi

fungsi-fungsi yang membantu seseorang dalam pengelolaan basis data

seperti memasukkan data ke basis data, pembaruan data dan lain-lain.

View, View adalah bagian yang mengatur tampilan ke pengguna.

Bisa dikatakan berupa halaman web.

Controller, Controller merupakan bagian yang menjembatani

model dan view.

Sumber: https://idcloudhost.com/pengertian-dan-keunggulan-

framework-laravel/
 8

2.2 Teori Perancangan Program

2.2.1 Pengertian Flowchart (Alur Program)

Flowchart adalah adalah suatu bagan dengan simbol-simbol

tertentu yang menggambarkan urutan proses secara mendetail dan

hubungan antara suatu proses (instruksi) dengan proses lainnya dalam

suatu program.

Dalam perancangan flowchart sebenarnya tidak ada rumus atau

patokan yang bersifat mutlak (pasti). Hal ini didasari oleh flowchart

(bagan alir) adalah sebuah gambaran dari hasil pemikiran dalam

menganalisa suatu permasalahan dalam komputer. Karena setiap analisa

akan menghasilkan hasil yang bervariasi antara satu dan lainnya.

Kendati begitu secara garis besar setiap perancangan flowchart selalu

terdiri dari tiga bagian, yaitu input, proses dan output.

Gambar 2.1 Contoh Flowchart

Sumber: https://informatikalogi.com/pengertian-flowchart-dan-jenis-jenisnya/
 9

2.2.2 Pengertian Flowmap(Alur System)

Flowmap adalah campuran peta dan flow chart,yang menunjukan

pergerakan benda dari satu lokasi ke lokasi lainnya, seperti jumlah

orang dalam migrasi, jumlah barang yang diperdagangkan, atau jumlah

paket dalam jaringan. Flowmap menolong analisis dan programmer

untuk memecahkan masalah ke dalam segmen-segmen yang lebih kecil

dan menolong dalam menganalisis alternaitf-alternatif lain dalam

pengoprasian.

a) Proses manual atau komputer.

b) Proses : Kegiatan proses yang di lakukan dengan komputerisasi.

c) Proses Manual : Kegiatan proses yang di lakukan dengan manual.

d) Garis alir : Menunjukan alir data dari atau ke proses.

e) Data store : Menunjukan penyimpanan arsip atau dokumen non

komputer.

f) Database : Tempat penyimpanan data berbasis database.

g) Data Elektronik : Menunjukan laporan data elektronik.

Sumber:https://sisteminformasimanajemen15089.wordpress.com/

2016/12/14/flowmap/

2.2.3 Pengertian DFD (Data Flow Dagram)

Data Flow Diagram (DFD) merupakan suatu cara atau metode

untuk membuat rancangan sebuah sistem yang mana berorientasi pada

alur data yang bergerak pada sebuah sistem nantinya. Dalam pembuatan

Sistem Informasi, DFD sering digunakan. DFD dibuat oleh para analis

untuk membuat sebuah sistem yang baik. Dimana DFD ini nantinya
 10

diberikan kepada para programmer untuk melakukan proses coding.

Dimana para programmer melakukan sebuah coding sesuai dengan

DFD yang dibuat oleh para analis sebelumnya. Tools yang digunakan

pada pembuatan DFD (Data Flow Diagram) yaitu EasyCase, Power

Designer 6. Salah satu cara lain untuk mendesain sistem yaitu

menggunakan UML(Unified Manual Language).

Tabel 2.1 Simbol Data Flow Diagram

Simbol Definisi
Kesatuan diluar sistem (external entity) yang
memberikan input ke sistem atau menerima
User / Terminator output dari sistem berupa orang, organisasi,
atau sistem lain.

Aktivitas yang mengolah input menjadi

Proses output.
Aliran data pada sistem (antar proses, antara
Data Flow terminator & proses, serta antara proses &
data store)

Penyimpanan data pada database, biasanya

Data Store berupa tabel.

Sumber:https://adepuspita28.wordpress.com/2013/10/26/pengertian-

data-flow-diagram-dfd-dan-contoh-gambar-dfd
 11

2.2.4 Pengertian ERD (Entity Relationship Diagram)

ERD merupakan suatu model untuk menjelaskan hubungan antar

data dalam basis data berdasarkan objek-objek dasar data yang

mempunyai hubungan antar relasi. ERD untuk memodelkan struktur

data dan hubungan antar data, untuk menggambarkannya digunakan

beberapa notasi dan simbol.

Menurut salah satu para ahli, Brady dan Loonam (2010), Entity

Relationship diagram (ERD) merupakan teknik yang digunakan untuk

memodelkan kebutuhan data dari suatu organisasi, biasanya oleh

System Analys dalam tahap analisis persyaratan proyek pengembangan

system. Sementara seolah-olah teknik diagram atau alat peraga

memberikan dasar untuk desain database relasional yang mendasari

sistem informasi yang dikembangkan. ERD bersama-sama dengan

detail pendukung merupakan model data yang pada gilirannya

digunakan sebagai spesifikasi untuk database.

Sumber: http://intanstemapal24.blogspot.com/2014/08/pengertian-erd-

entity-relationship.html
 12

BAB III

TINJAUAN PERUSAHAAN

3.1. Sejarah Perusahaan

CV Griya Sarana Informatika adalah perusahaan komputer di Cirebon

yang berdiri pada 22 Juni 2010, Beralamatkan kantor di Perumahan Griya

Caraka, Jl.Hanjuang Blok H3 No.22 Kecamatan Kedawung Kab.Cirebon.

CV Griya Sarana Informatika adalah perusahaan komputer terdepan

yang menerapkan konsep penjualan produk PC rakitan murah untuk

konsumen dengan tujuan membentuk image HD menjual barang berkualitas

dengan harga terjangkau. CV Griya Sarana Informatika mengembangkan

berbagai sektor bisnis IT melalui Penjualan Retail Consumer, Distribusi

Reseller, Maintenance, Service, Layanan Purnajual, Branded PC dan Sofware

Business.

3.2. Struktur Organisasi Perusahaan

STRUKTUR ORGANISASI PERUSAHAAN

CV.GRIYA SARANA INFORMATIKA

DIREKTUR & PROGRAMMER DIREKTUR

Oskar haris ST Dr.supriyanto Ahmad S.kom M.kom

ADMIN PROGRAMMER PROGRAMMER HARDWARE HARDWARE HARDWARE

Neris Alwan Fachrudin Chandra Bakhtiar Encep Moch Iqbal
Ame Suwarno

Tabel 3.2 Struktur Organisasi

 13

3.3. Jenis Badan Usaha

Griya Sarana Informatika memiliki beberapa bidang usaha yang bisa

dijelaskan sebagai berikut:

 Penjualan

Melayani penjualan produk meliputi Komputer & Notebook baik hardware

ataupun software secara retail maupun mekanisme tender baik secara

langsung (direct selling) maupun penjualan secara online.

 Pembelian

Melayani pembelian produk (purna jual) Komputer dan Notebook beserta

aksesorisnya dalam kondisi tertentu, secara retail maupun mekanisme

lelang partai besar dan kecil.

 Perawatan

Melayani perawatan hardware dan software IT, personal maupun instansi

baik swasta maupun pemerintah.

 Jaringan IT

Melayani instalasi jaringan komputer pribadi maupun instansi dari skala

kecil hingga profesional

 BAB IV

PEMBAHASAN

4.1 Perancangan Sistem

4.1.1 Flowmap

Tabel 4.1 Alur Flowmap

Pengguna Administrator

Identitas Data Pengaduan

Pengguna Diverifikasi

Proses Input Data

Pengaduan Pengaduan
Di Proses

Data
Cek Data
Pengaduan
Pengaduan
Ditindak
lanjuti

Pengaduan Telah
Selesai

4.1.1.

14
 15

4.1.2 DFD

Kirim Informasi
Informasi Penyelesaian
Masalah

Konfirmasi
Input data Aplikasi Pengaduan dan
pengaduan Pengaduan tindakan
Client Administrator
Berbasis
web
Informasi data
Pengaduan
Client
Pesan Informasi

Gambar 4.1 Dfd Konteks

 16

Simpan Data
pengaduan Tb_pengaduan Data Pengaduan
1.1
1.6 Login
Hapus Data
Pengaduan 1.1
Input Data
Pengaduan
Data Login

Administrator
Klien

Data pengaduan 1.2

Verifikasi
1.3 Data
Proses Data Pengaduan
Pengaduan Data pengaduan Terverifikasi

Data pengaduan Diproses

Tampil Hasil pengaduan

1.4 Data pengaduan Terverifikasi 1.5

Penanganan Pengaduan
Data
Pengaduan Selesai

Data Pengaduan

Gambar 4.2 DFD Level 1 Pengaduan

17
 18

4.1.3 Flowchart Program

 19

Mulai
Input Data Akun

Cek Data
Akun
Aktifkan Input Form
Akun Pendaftaran
Akun Baru

Masuk Ke Beranda

Input Form
Pengaduan

Input Lampiran

Cek Data
Pengaduan

Data Pengaduan
Diverifikasi

Tampil Data
Batalkan
Pengaduan
Pengaduan
Terverifikasi

B
A

B A
Data Pengaduan
Diproses
Tampilkan Data
Pengaduan

Data Pengaduan
Ditindak Lanjuti
 20

Gambar 4.3 Flowmap Program

4.2 Spesifikasi Program

4.2.1 Desain Tampilan Program

a) Halaman Login

Cs Helper
Silahkan Login
Email

Password

Login

Forgot my Password

Register a new membership

Gambar 4.4 Desain Halaman Login

b) Halaman Dashboard Admin

Logo

Dashboard

Dashboard

Informasi

Menu
Informasi mengenai
data data
Menu

Gambar 4.5 Desain Halaman Dashboard Admin

c) Halaman Informasi Admin

Logo

Informasi

Dashboard
Mading Informasi
Informasi

Menu
Pesan Untuk Informasi
21
 22

d) Halaman Kategori Admin

Logo

Kategori

Dashboard

Informasi
Tabel Kategori
Kategori

Akun

Gambar 4.7 Desain Halaman Kategori Admin

e) Halaman Akun Admin

Logo

Akun

Dashboard

Informasi
Tabel Akun
Kategori

Akun

Gambar 4.8 Desain Halaman Akun Admin

 23

f) Halaman Riwayat Pengaduan Admin

Logo

Pencarian

Dashboard
Pencarian
Informasi
Awal Akhir
Kategori

Akun

Tabel Hasil Pencarian

Gambar 4.9 Desain Halaman Riwayat Pengaduan

g) Halaman Pengaduan Admin

Logo

Pengaduan

Dashboard

Informasi
Pengaduan

Kategori

Akun

Balasan Pengaduan

Gambar 4.10 Desain Halaman Pengaduan Admin

 24

h) Halaman Home

Cs Helper Home Informasi Problem Mas Sahal* Search

Selamat Datang di Web Pelayanan Pengaduan

Cs.helper adalah layanan yang bertujuan untuk mengajukan pengaduan masalah.

Nama*

Email*

Masalah*

Gambar 4.11 Desain Halaman Home User

 25

4.2.2 Struktur Table

a) Tabel Users

Tabel 4.2 Tabel Users

Field Type Lenght Ket

id integer 10 PK

name varchar 191 -

email varchar 191 -

password varchar 191 -

remember_token varchar 100 -

created_at timestamp - -

update_at timestamp - -

role enum(‘admin’,’staff’) - -

b) Tabel Balasan

Tabel 4.3 Tabel Balasan

Field Type Lenght Ket

id_balasan integer 11 PK

id_pengaduan integer 11 FK

id_akun integer 11 FK

balasan text - -

tanggal_balasan date - -
 26

c) Tabel Informasi

Tabel 4.4 Tabel Informasi

Field Type Lenght Ket

id_info integer 11 PK

id_akun integer 11 FK

info text - -

tanggal_info date - -

status_info varchar 20 -

varchar 50 -
jenis_info

d) Tabel Kategori

Tabel 4.5 Tabel Kategori

Field Type Lenght Ket

id_kategori integer 11 PK

kategori varchar 100 -

subjek_kategori text - -

e) Tabel Pengaduan

Tabel 4.6 Tabel Pengaduan

Field Type Lenght Ket

id_pengaduan integer 11 PK

id_kategori integer 11 FK

id_akun integer 11 FK

nama_pengadu varchar 100 -

 27

deskripsi_pengaduan text - -

lampiran_pengaduan varchar 100 -

Status_pengaduan Varchar 20 -

tanggal_pengaduan Date -

jenis_pengaduan Varchar 25 -

4.2.3 Tampilan Program

1. Tampilan Login

Gambar 4.12 Tampilan Halaman Login

 28

2. Halaman Dashboard Admin

Gambar 4.13 Tampilan Halaman Dashboard Admin

3. Halaman Informasi Admin

Gambar 4.14 Tampilan Informasi Admin

 29

4. Halaman Kategori Admin

Gambar 4.15 Tampilan Halaman Kategori Admin

5. Halaman Riwayat Pengaduan Admin

Gambar 4.16 Halaman Kategori Admin

 30

6. Halaman Pengaduan Admin

Gambar 4.17 Tampilan Halaman Pengaduan

7. Halaman Home

Gambar 4.18 Tampilan Halaman Home User

 31

4.3 Sarana Pendukung Program

4.3.1 Software

Tabel 4.7 Software Pendukung Program

Nama Software Spesifikasi

Server Xampp Versi 3.3.0

Text Editor Visual Studio Code Versi 1.17.2

Browser Chrome Browser Versi106.0.5249.119

4.3.2 Hardware

Tabel 4.8 Hardware Pendukung Program

Nama Ket

Sistem Operasi Windows 11 Home Single Language 64bit

Prosessor AMD 3020e with Radeon Graphics

@1.20 GHz

RAM 4 GB

Monitor 14" HD (1366 x 768), Acer ComfyView™

LED-backlit TFT LCD, 16:9 aspect ratio

 BAB V

PENUTUP
5.1. Kesimpulan

Kesimpulan dari pembuatan aplikasi Inventory manager atau Stock

barang berbasis web ini adalah agar dapat dengan mudah mengontrol sebuah

gudang dan dapat teratasi dengan tersusun secara rapi sehingga akan lebih

mudah.

5.2. Saran-saran

Penulis berharap agar kedepannya bisa lebih baik lagi dengan

meningkatkan program yang telah penulis buat dengan menambahkan fitur

fitur baru maupun keamanan aplikasi yang tinggi dengan menggunakan

framework seperti codeigniter maupun yang lainnya. Penulis juga ingin agar

aplikasi dapat di publikasikan di web hosting agar bukan hanya kalangan

internal saja yang memakai aplikasi ini akan tetapi orang lain pun bisa

mengakses aplikasi ini.

32
 33

DAFTAR PUSTAKA

Lerdorf, R. (2007, 04 26). PHP: Hypertext Preprocessor. Diakses dari wikipedia:

https://id.wikipedia.org/wiki/PHP

Waryanto. (2018, 01 22). Pengertian Website Lengkap dengan Jenis dan

Manfaatnya. Diakses dari niagahoster:
https://www.niagahoster.co.id/blog/pengertian-website

Wiliard, W. (2019, 09 20). Pangkalan data atau basis data. Diakses dari
wikipedia: https://id.wikipedia.org/wiki/Pangkalan_data

Wikipedia. (2014, 04 01). MySql. Diakses dari wikipedia

https://id.wikipedia.org/wiki/MySQL

Wikipedia. (2013, 08 21). Cascading Style Sheet (CSS). Diakses dari wikipedia
https://id.wikipedia.org/wiki/Cascading_Style_Sheets

Wikipedia. (2011, 09 01). Cascading Style Sheet (CSS). Diakses dari wikipedia
https://id.wikipedia.org/wiki/Bootstrap_(framework_front-end)

Wikipedia. (2022, 02 13). AJAX. Diakses dari wikipedia

https://id.wikipedia.org/wiki/AJAX
Anoname. (2016, 06 07). Pengertian dan Keunggulan Framework Laravel.
Diakses dari idcloudhost
https://idcloudhost.com/pengertian-dan-keunggulan-frameworklaravel/

Informatikalogi. (2017, 07 03). Pengertian Flowchart Dan Jenis – Jenisnya.

Diakses dari informatikalogi
https://informatikalogi.com/pengertian-flowchart-dan-jenis-jenisnya

Amelia, Mitha. (2016, 12 14). Flowmap Dan Jenis – Jenisnya. Diakses dari
sisteminformasimanajemen15089
 34

https://sisteminformasimanajemen15089.wordpress.com/2016/
12/14/flowmap

Puspita, Ade. (2013, 10 26). Pengertian Data Flow Diagram (DFD) dan Contoh
Gambar DFD. Diakses dari adepuspita28
https://adepuspita28.wordpress.com/2013/10/26/pengertian-data-flow-
diagram-dfd-dan-contoh-gambar-dfd

Anoname. (2014, 08 01). Pengertian ERD (Entity Relationship Diagram).

Diakses dari intanstemapal24
http://intanstemapal24.blogspot.com/2014/08/pengertian-erdentity-
relationship.html
 35

DAFTAR RIWAYAT HIDUP

A. Biodata Siswa

NIS/NISN : 12

Nama Lengkap : Muhammad Ikhsan Nur Shidiq

Tempat & Tanggal Lahir : Cirebon, 17 Januari 2005

Alamat Lengkap : Jl.Tulip Kalijaga Permai Kot.Cirebon

B. Riwayat Pendidikan Formal & Non-Formal

1. SDN Kalijaga Permai Kota Cirebon, lulus tahun

2. SMPN 7 Kota Cirebon, lulus tahun 2019

C. Riwayat Pengalaman Berorganisasi / Pekerjaan

1. 2022 – Sekarang : I

Cirebon, 29 November 2022

Saya yang bersangkutan

Muhammad Ikhsan Nur Shidiq