LAPORAN KERJA PRAKTEK
PENGEMBANGAN APLIKASI UNTUK UMKM KABUPATEN KOTA BATAM (PT. KUADRAN TEKNOLOGI INDONESIA)
PENGEMBANGAN FRONTEND APLIKASI INVENTORY APOTEK DENGAN REACT JS
MUSTAKIM 6304181108
PROGRAM STUDI REKAYASA PERANGKAT LUNAK JURUSAN TEKNIK INFORMATIKA
POLITEKNIK NEGERI BENGKALIS BENGKALIS - RIAU
2022
ii
III KATA PENGANTAR
Puji dan syukur peneliti panjatkan doa kepada Allah SWT, karena berkat dan rahmat-Nyalah penulis dapat melaksankan kerja praktek dan menyelesaikan laporan kerja praktek yang dilaksanakan di PT.KUADRAN TEKNOLOGI INDONESIA. Shalawat serta salam semoga tercurahkan kepada Nabi Muhammad SAW. Terima kasih kepada semua pihak-pihak yang terkait dalam pelaksanaan kerja praktek dan menyelesaikan laporan kerja praktek ini antara lain :
1. Bapak Ir. Joni Caster, MT sebagai Direktur Politeknik Negeri Bengkalis 2. Bapak Danuri, M.Cs selaku Ketua Jurusan Teknik Informatika Politeknik Negeri Bengkalis.
3. Ibu Rezki Kurniati, M.Kom sebagai Ketua Program Studi Rekayasa Perangkat Lunak
4. Bapak Kasmawi, M.Kom sebagai Dosen Pembimbing Kerja Praktek Politeknik Negeri Bengkalis
5. Bapak Fajri Profesio Putra, M.Cs sebagai kordinator Kerja Praktek Program
Studi Rekayasa Perangkat Lunak Politeknik Negeri Bengkalis.
6. Bapak Febian Goivani, S.T sebagai Manager PT.Kuadran Teknologi.
7. Bapak Azlan Rafar sebagai pembimbing lapangan.
Dalam pelaksanaan kerja praktek dan pembuatan laporan kerja praktek masih terdapat banyak keterbatasan dan kekurangan sehingga jauh dari kata sempurna. Kritik dan saran serta permohonan maaf dari pihak-pihak yang terkait sangat diharapkan dapat membangun kesempurnaan.
Bengkalis, 20 Mei 2022
Mustakim
IV DAFTAR ISI
LEMBAR PENGESAHAN ... ii
KATA PENGANTAR ... iii
DAFTAR ISI ... iv
DAFTAR TABEL ... v
DAFTAR GAMBAR ... vi
BAB I PENDAHULUAN ... 1
1.1 Latar Belakang Pemikiran KP ... 1
1.2 Tujuan Dan Manfaat KP ... 2
1.3 Luaran Proyek Kerja Praktek ... 3
BAB II GAMBARAN UMUM PERUSAHAAN ... 4
2.1 Biodata Perusahaan ... 4
2.2 Visi dan Misi Perusahaan ... 4
2.3 Struktur Organisasi Perusahaan ... 5
2.4 Produk-Produk Yang Dihasilkan ... 6
BAB III BIDANG PEKERJAAN SELAMA KP... 7
3.1 Design prototype aplikasi dengan balsamiq mockup ... 7
3.2 Memahami Penggunaan React Js ... 8
3.3 Merancang UI Dengan Figma ... 9
3.4 Membuat Frontend aplikasi apotek untuk pelaku UMKM kota batam 10 BAB IV PEMBUATAN FRONTEND APLIKASI INVENTORY APOTEK .. 11
4.1 Metodologi ... 11
4.2 Implementasi ... 14
4.3 Hasil ... 17
4.4 Dampak Implementasi ... 19
BAB V PENUTUP ... 20
5.1 Kesimpulan ... 20
5.2 Saran ... 20
DAFTAR PUSTAKA ... 21
Lampiran ... 22
V DAFTAR TABEL
Tabel 1. Luaran Proyek Kerja Praktek ... 3 Tabel 2. Tabel tanya jawab wawancara ... 12 Tabel 3. Tahapan dan Jadwal Pelaksanaan ... 13
VI
Gambar 2. Produk-produk perusahaan ... 6
Gambar 3. Tampilan desain 1 ... 7
Gambar 4. Tampilan desain 2 ... 7
Gambar 5. Tampilan desain 3 ... 7
Gambar 6. Tampilan desain 4 ... 7
Gambar 7. Belajar React js dengan video youtube ... 8
Gambar 8. Rancangan UI dengan Figma 1 ... 9
Gambar 9. Rancangan UI dengan Figma 2 ... 9
Gambar 10. Use case... 13
Gambar 11. Rancangan UI halaman beranda ... 15
Gambar 12. Rancangan UI halaman login ... 15
Gambar 13. Rancangan UI halaman register ... 15
Gambar 14. Rancangan UI halaman data ... 16
Gambar 15. Code program dengan react js ... 16
Gambar 16. Tampilan login ... 17
Gambar 17. Tampilan halaman beranda ... 17
Gambar 18. Tampilan halaman data obat ... 18
Gambar 19. Tampilan halaman supplier ... 18
Gambar 20. Tampilan halaman cetak laporan... 18
DAFTAR GAMBAR Gambar 1. Struktur Organisasi Perusahaan ... 5