LAPORAN KERJA MAGANG
PENGEMBANGAN FITUR MENU CUSTOM, SISTEM OTOMATIS DATABASE DAN SISTEM TOP UP PADA
WHITELABEL PT. INDOBEST ARTHA KREASI
Neven Yusuf 00000025750
PROGRAM STUDI INFORMATIKA FAKULTAS TEKNIK DAN INFORMATIKA UNIVERSITAS MULTIMEDIA NUSANTARA
TANGERANG
2020
LEMBAR PENGESAHAN LAPORAN KERJA MAGANG
PENGEMBANGAN FITUR MENU CUSTOM, SISTEM OTOMATIS DATABASE DAN SISTEM TOP UP PADA WHITELABEL
PT. INDOBEST ARTHA KREASI
Oleh
Nama : Neven Yusuf
NIM : 00000025750
Program Studi : Informatika
Fakultas : Teknik dan Informatika
Tangerang, 30 Oktober 2020
Dosen Pembimbing Dosen Penguji
Ito Wasito, M.Sc, Ph.D Dr. Ir. P. M. Winarno, M.Kom.
Mengetahui, Ketua Program Studi
Informatika
Marlinda Vasty Overbeek, S.Kom., M.Kom.
PENGEMBANGAN FITUR MENU CUSTOM, SISTEM OTOMATIS DATABASE DAN SISTEM TOP UP PADA
WHITELABEL PT. INDOBEST ARTHA KREASI
ABSTRAK
Whitelabel merupakan salah satu produk dari PT. Indobest Artha Kreasi (Mobilepulsa) yang berfokus untuk menyediakan layanan bagi semua orang untuk memiliki usaha menjual pulsa dan berbagai produk digital lainya dengan merek sendiri secara mudah dan biaya yang rendah. Seiring berjalannya waktu dan berkembangnya zaman, produk Whitelabel perlu turut dikembangkan untuk mengakomodasi berbagai kebutuhan tenant dan juga untuk meningkatkan efektifitas dan efisiensinya. Maka dari itu, pengembangan produk Whitelabel terutama pada fitur menu sidebar custom, perubahan otomatis database, dan Top Up by Excel dilakukan. Pengembangan produk dilakukan dengan menggunakan framework berbasis PHP bernama Laravel dan framework berbasis Javascript bernama Vue.js. Sistem database yang digunakan adalah MySQL untuk menyimpan data data produk dan tenant Whitelabel, serta MongoDB untuk menyimpan data data transaksi.
Kata Kunci: Javascript, Laravel, Mobilepulsa, PHP, Vue.js, Web Application
v
DEVELOPMENT OF CUSTOM MENU FEATURE, AUTOMATIC DATABASE SYSTEM AND TOP UP SYSTEM ON
WHITELABEL PT. INDOBEST ARTHA KREASI
ABSTRACT
Whitelabel is one of PT. Indobest Artha Kreasi s product which focuses on providing services to everyone that want to have their own payment service and various other digital products business under their own brands easily and at low costs. As times goes by and technology development continues, Whitelabel needs to be developed to accommodate the various needs of its tenants and also to increase its effectiveness and efficiency. Therefore, Whitelabel development, especially on the custom sidebar menu feature, automatic database changes, and Top Up by Excel feature is carried out.
Product development is carried out using a PHP-based framework called Laravel and a Javascript-based framework called Vue.js. The database system used is MySQL to store products and Whitelabel tenants data, and MongoDB to store transaction data.
Keywords: Javascript, Laravel, Mobilepulsa, PHP, Vue.js, Web Application
KATA PENGANTAR
Puji syukur kepada Tuhan Yang Maha Esa, atas rahmat dan karunia-Nya sehingga penulis dapat menyelesaikan laporan kerja magang yang berjudul Pengembangan Fitur Menu Custom, Sistem Otomatis Database dan Sistem Top Up Pada Whitelabel PT. Indobest Artha Kreasi de a baik dan tepat waktu. Laporan ini ditulis untuk memenuhi syarat kelulusan magang pada Program Studi Informatika Universitas Multimedia Nusantara.
Tentu dalam menyusun laporan ini, banyak pihak yang telah membantu baik secara moril dan spiritual, maka penulis ingin mengucapkan terima kasih kepada:
1. Dr. Ninok Leksono selaku Rektor Universitas Multimedia Nusantara,
2. Dr. Eng. Niki Prastomo, S.T., M.Sc., selaku Dekan Fakultas Teknik dan Informatika Universitas Multimedia Nusantara,
3. Ibu Marlinda Vasty Overbeek, S.Kom., M.Kom., selaku Ketua Program Studi Informatika Universitas Multimedia Nusantara,
4. Ir. Ito Wasito, M.Sc, Ph.D selaku dosen pembimbing pembuatan laporan kerja magang yang telah memberikan arahan dan masukan dalam pengerhaan laporan ini,
5. Bapak dan Ibu Dosen Program Studi Informatika Universitas Multimedia Nusantara yang telah memberikan ilmu pengetahuan yang sangat berguna dengan sangat baik,
vii
6. Bapak Budiman Yungsen selaku CEO PT. Indobest Artha Kreasi, yang telah memberikan kesempatan kerja magang,
7. Bapak Eddy Christiandy selaku CTO PT. Indobest Artha Kreasi, yang membantu dalam pengerjaan tugas tugas kerja magang dan memberikan materi pembelajaran selama kerja magang,
8. Reza Satyawijaya selaku Product Lead Whitelabel dan pembimbing lapangan kerja magang di PT. Indobest Artha Kreasi, yang membantu dan memberi arahan selama kerja magang,
9. Fachri Hilmi dan Syahrul Noor selaku mentor di PT. Indobest Artha Kreasi, yang membantu dan memberi arahan selama kerja magang,
10. Ayah dan Ibu, kerabat dekat, dan teman teman yang telah dengan tulus memberikan doa, motivasi, dukungan, dan nasihat nasihat yang sangat berharga, hingga akhirnya penyusunan laporan kerja magang ini dapat terselesaikan dengan baik
Semoga laporan Kerja Magang ini dapat bermanfaat, baik sebagai sumber informasi maupun sumber inspirasi, bagi para pembaca.
Tangerang, Oktober 2020
Neven Yusuf
DAFTAR ISI
HALAMAN JUDUL ..i
LEMBAR PENGESAHAN LAPORAN KERJA MAGANG ... ii
LEMBAR PERNYATAAN TIDAK PLAGIAT ... iii
ABSTRAK ... iv
KATA PENGANTAR ... vi
DAFTAR ISI ... viii
DAFTAR TABEL ... x
DAFTAR GAMBAR ... xi
DAFTAR LAMPIRAN ... xiii
BAB 1 PENDAHULUAN ... 1
1. 1 Latar Belakang ... 1
1. 2 Maksud dan Tujuan Kerja Magang ... 2
1. 3 Waktu dan Prosedur Pelaksanaan Kerja Magang ... 3
BAB 2 GAMBARAN UMUM PERUSAHAAN ... 5
2. 1 Sejarah Singkat ... 5
2. 2 Visi dan Misi ... 6
2. 3 Produk ... 6
2. 4 Struktur Organisasi ... 9
BAB 3 PELAKSANAAN KERJA MAGANG... 13
3. 1 Kedudukan dan Koordinasi ... 13
3. 2 Tugas yang Dilakukan ... 13
3. 3 Uraian Pelaksanaan ... 14
3.3.1 Proses Pelaksanaan... 14
3.3.2 Framework yang Digunakan ... 15
3.3.3 Perancangan Sistem ... 17
3.3.4 Implementasi ... 54
ix
3.3.5 Kendala yang Ditemukan ... 72
3.3.6 Solusi atas Kendala yang Ditemukan ... 72
BAB 4 SIMPULAN DAN SARAN ... 74
4.1 Simpulan ... 74
4.2 Saran ... 75
DAFTAR PUSTAKA ... 76
LAMPIRAN 77
DAFTAR TABEL
Tabel 3.1 Jadwal Kerja Magang... 14
xi
DAFTAR GAMBAR
Gambar 2.1 Logo PT. Indobest Artha Kreasi ... 6
Gambar 2.2 Tampilan aplikasi Mobilepulsa ... 7
Gambar 2.3 Tampilan aplikasi Whitelabel... 8
Gambar 2.4 Tampilan aplikasi IAK.id ... 9
Gambar 2.5 Struktur Organisasi PT. Indobest Artha Kreasi ... 10
Gambar 3.1 Flowchart Halaman Utama Fitur Menu Sidebar Custom ... 18
Gambar 3.2 Flowchart Halaman Create New Category ... 19
Gambar 3.3 Flowchart Halaman Create New Menu ... 21
Gambar 3.4 Flowchart Halaman Edit Category ... 22
Gambar 3.5 Flowchart Halaman Edit Menu ... 23
Gambar 3.6 Flowchart Delete Item ... 25
Gambar 3.7 Flowchart Change Position ... 27
Gambar 3.8 Flowchart Penampilan Menu Sidebar Custom ... 28
Gambar 3.9 Flowchart Perubahan Otomatis Database ... 30
Gambar 3.10 Flowchart Perubahan Otomatis Database ... 31
Gambar 3.11 Flowchart Halaman Top Up By Excel ... 33
Gambar 3.12 Flowchart Pemrosesan File Excel ... 35
Gambar 3.13 Flowchart Initial Validation ... 37
Gambar 3.14 Flowchart Product Validation ... 39
Gambar 3.15 Flowchart Cron Job Pemrosesan Permintaan Transaksi ... 41
Gambar 3.16 Flowchart Queue Pemrosesan Transaksi... 43
Gambar 3.17 Rancangan Halaman Utama Fitur Menu Sidebar Custom ... 45
Gambar 3.18 Rancangan Halaman Create New Category Fitur Menu Sidebar Custom ... 46
Gambar 3.19 Rancangan Halaman Create New Menu Fitur Menu Sidebar Custom .. 47
Gambar 3.20 Rancangan Halaman Change Position Fitur Menu Sidebar Custom .... 48
Gambar 3.21 Rancangan Dialog Konfirmasi Penghapusan Fitur Menu Sidebar Custom ... 49
Gambar 3.22 Rancangan Halaman Awal Fitur Top Up by Excel ... 50
Gambar 3.23 Rancangan Tabel Konfirmasi Fitur Top Up by Excel ... 51
Gambar 3.24 Rancangan Pesan Validasi Fitur Top Up by Excel ... 53
Gambar 3.25 Implementasi Halaman Utama Fitur Menu Sidebar Custom ... 54
Gambar 3.26 Implementasi Halaman Create New Category Fitur Menu Sidebar Custom ... 56 Gambar 3.27 Implementasi Halaman Create New Menu Fitur Menu Sidebar
Custom ... 57 Gambar 3.28 Implementasi Halaman Edit Category Fitur Menu Sidebar Custom .... 58 Gambar 3.29 Implementasi Halaman Edit Menu Fitur Menu Sidebar Custom ... 59 Gambar 3.30 Implementasi Halaman Change Position Fitur Menu Sidebar Custom 59 Gambar 3.31 Implementasi Dialog Konfirmasi Penghapusan Fitur Menu Sidebar Custom ... 60 Gambar 3.32 Implementasi Penampilan Menu Sidebar Custom ... 61 Gambar 3.33 Implementasi Halaman Utama Perubahan Operator Fitur Perubahan Otomatis Database Tenant ... 62 Gambar 3.34 Implementasi Halaman Utama Perubahan Produk Fitur Perubahan Otomatis Database Tenant ... 63 Gambar 3.35 Implementasi Halaman Edit Produk Fitur Perubahan Otomatis
Database Tenant ... 64 Gambar 3.36 Implementasi Halaman Daftar Produk Fitur Perubahan Otomatis
Database Tenant ... 66 Gambar 3.37 Implementasi Halaman Awal Fitur Top Up by Excel ... 67 Gambar 3.38 Implementasi Tabel Konfirmasi Transaksi Fitur Top Up by Excel ... 68 Gambar 3.39 Implementasi Validasi Permintaan Transaksi Fitur Top Up by Excel .. 69 Gambar 3.40 Implementasi Validasi Saldo Fitur Top Up by Excel ... 71
xiii
DAFTAR LAMPIRAN
1. Curriculum Vitae
2. Surat Penerimaan Kerja Magang 3. Salinan KM-03 (Kartu Kerja Magang) 4. Salinan KM-04 (Kehadiran Kerja Magang)
5. Salinan KM-05 (Laporan Realisasi Kerja Magang) 6. Salinan KM-06 (Penilaian Kerja Magang)
7. Salinan KM-07 (Tanda Terima Penyerahan Laporan Kerja Magang)