Anda di halaman 1dari 77

RANCANG BANGUN APLIKASI PAYMENT REQUEST PT.

IDSTAR
CIPTA TEKNOLOGI MENGGUNAKAN APPSMITH

MAGANG

Diajukan sebagai salah satu syarat untuk memperoleh


Gelar Sarjana Teknik Komputer

Rupertus Herlambang Eko Nugroho


00000034220

PROGRAM STUDI TEKNIK KOMPUTER


FAKULTAS TEKNIK DAN INFORMATIKA
UNIVERSITAS MULTIMEDIA NUSANTARA
TANGERANG
2022
RANCANG BANGUN APLIKASI PAYMENT REQUEST PT. IDSTAR
CIPTA TEKNOLOGI MENGGUNAKAN APPSMITH

MAGANG

Diajukan sebagai salah satu syarat untuk memperoleh


Gelar Sarjana Teknik Komputer

Rupertus Herlambang Eko Nugroho


00000034220

PROGRAM STUDI TEKNIK KOMPUTER


FAKULTAS TEKNIK DAN INFORMATIKA
UNIVERSITAS MULTIMEDIA NUSANTARA
TANGERANG
2022

i
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
PERNYATAAN TIDAK MELAKUKAN PLAGIAT

Dengan ini saya yang bertanda tangan di bawah ini:


Nama : Rupertus Herlambang Eko Nugroho
NIM : 00000034220
Program Studi : Teknik Komputer
Fakultas : Teknik dan Informatika
Menyatakan bahwa saya telah melaksanakan praktik kerja magang:
Nama perusahaan : PT. IDStar Cipta Teknologi
Divisi : Research and Development
Alamat : Wisma Staco Lantai 7 Jl. Casablanca Raya Kav.
18, Menteng Dalam, Tebet, Jakarta Selatan
Periode magang : 8 Februari 2022 - 8 Agustus 2022
Pembimbing lapangan : Sulianto
Laporan kerja magang merupakan hasil karya saya sendiri, dan saya tidak
melakukan plagiat. Semua kutipan karya ilmiah orang lain atau lembaga lain yang
dirujuk dalam laporan kerja magang ini telah saya sebutkan sumber kutipannya
serta saya cantumkan di Daftar Pustaka. Jika di kemudian hari terbukti ditemukan
kecurangan/ penyimpangan, baik dalam pelaksanaan kerja magang maupun dalam
penulisan laporan kerja magang, saya bersedia menerima konsekuensi dinyatakan
tidak lulus untuk mata kuliah kerja magang yang telah saya tempuh.

Tangerang, 30 Juni 2022

(Rupertus Herlambang Eko Nugroho)

ii
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
HALAMAN PENGESAHAN

Magang dengan judul

RANCANG BANGUN APLIKASI PAYMENT REQUEST PT. IDSTAR


CIPTA TEKNOLOGI MENGGUNAKAN APPSMITH

oleh

Nama : Rupertus Herlambang Eko Nugroho


NIM : 00000034220
Program Studi : Teknik Komputer
Fakultas : Fakultas Teknik dan Informatika

Telah diujikan pada hari Senin, 11 Juli 2022


Pukul 09.00 s/s 10.00 dan dinyatakan
LULUS
Dengan susunan penguji sebagai berikut

Dosen Pembimbing
Penguji

(Dareen Kusuma Halim, S.Kom.,


(Samuel, M.T.I.)
M.Eng.Sc.)
NIDN: 0304038902
NIDN: 0317129202

Ketua Program Studi Teknik Komputer,

(Samuel, M.T.I.)
NIDN: 0304038902

iii
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
HALAMAN PERSETUJUAN PUBLIKASI KARYA ILMIAH UNTUK
KEPENTINGAN AKADEMIS

Sebagai sivitas akademik Universitas Multimedia Nusantara, saya yang bertanda


tangan di bawah ini:
Nama : Rupertus Herlambang Eko Nugroho
NIM : 00000034220
Program Studi : Teknik Komputer
Fakultas : Teknik dan Informatika
Jenis Karya : Magang
Demi pengembangan ilmu pengetahuan, menyetujui untuk memberikan kepada
Universitas Multimedia Nusantara hak Bebas Royalti Non-eksklusif (Non-
exclusive Royalty-Free Right) atas karya ilmiah saya yang berjudul:

RANCANG BANGUN APLIKASI PAYMENT REQUEST PT. IDSTAR


CIPTA TEKNOLOGI MENGGUNAKAN APPSMITH

Beserta perangkat yang ada (jika diperlukan). Dengan Hak Bebas Royalti Non eks-
klusif ini Universitas Multimedia Nusantara berhak menyimpan, mengalih media
/ format-kan, mengelola dalam bentuk pangkalan data (database), merawat, dan
mempublikasikan tugas akhir saya selama tetap mencantumkan nama saya sebagai
penulis / pencipta dan sebagai pemilik Hak Cipta. Demikian pernyataan ini saya
buat dengan sebenarnya.

Tangerang, 30 Juni 2022


Yang menyatakan

Rupertus Herlambang Eko Nugroho

iv
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Halaman Persembahan / Motto

”A good name is to be more desired than great wealth, Favor is better


than silver and gold.”

Proverbs 22:1 (NASB)

v
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
KATA PENGANTAR

Puji Syukur atas berkat dan rahmat kepada Tuhan Yang Maha Esa, atas se-
lesainya penulisan laporan Magang ini dengan judul: Rancang Bangun Aplikasi
Payment Request PT. IDStar Cipta Teknologi Menggunakan Appsmith dilakukan
untuk memenuhi salah satu syarat untuk mencapai gelar Sarjana Komputer Jurusan
Teknik Komputer Pada Fakultas Teknik dan Informatika Universitas Multimedia
Nusantara. Saya menyadari bahwa, tanpa bantuan dan bimbingan dari berbagai pi-
hak, dari masa perkuliahan sampai pada penyusunan laporan magang ini, sangatlah
sulit bagi saya untuk menyelesaikan laporan magang ini. Oleh karena itu, saya
mengucapkan terima kasih kepada:

1. Bapak 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. Bapak Samuel, M.T.I., selaku Ketua Program Studi Informatika Universitas


Multimedia Nusantara.

4. Bapak Dareen Kusuma Halim, S.Kom., M.Eng.Sc., sebagai Pembimbing Ma-


gang yang telah banyak meluangkan waktu untuk memberikan bimbingan,
arahan dan motivasi atas terselesainya laporan magang ini.

5. Kepada Pimpinan Perusahaan Bapak Ferdinand Prasetyo

6. Orang Tua dan keluarga saya yang telah memberikan bantuan dukungan ma-
terial dan moral, sehingga penulis dapat menyelesaikan tesis ini.

Semoga laporan magang ini bermanfaat, baik sebagai sumber informasi maupun
sumber inspirasi, bagi para pembaca.

Tangerang, 30 Juni 2022

Rupertus Herlambang Eko Nugroho

vi
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
RANCANG BANGUN APLIKASI PAYMENT REQUEST PT. IDSTAR
CIPTA TEKNOLOGI MENGGUNAKAN APPSMITH
Rupertus Herlambang Eko Nugroho

ABSTRAK

Laporan magang ini berisi tentang pelaksanaan kegiatan kerja magang yang di-
lakukan di PT. IDStar Cipta Teknologi selama 92 hari yang dimulai dari 8 Februari
2022 hingga 30 Juni 2022. Tugas utama yang diberikan adalah melakukan per-
ancangan dan pembuatan website untuk mencatat kegiatan payment request yang
terjadi di dalam internal perusahaan. Aplikasi dibuat menggunakan platform low-
code Appsmith dan digabungkan dengan Amazon Web Services untuk pembuatan
sistem database, pengiriman email, dan media penyimpanan. Di dalam aplikasi
tersebut, user dapat melakukan permohonan payment request yang ingin diajukan.
Payment request yang sudah diajukan akan dilakukan approval sesuai dengan prose-
dur yang berlaku di dalam internal perusahaan. User inputter juga dapat melakukan
edit atau delete sebelum melakukan submit for approval dan pihak finance juga
dapat mengedit beberapa informasi dari paymetn request yang diajukan oleh user
inputter apabila ada kesalahan pengetikan atau input. Dalam pembuatan aplikasi
ini juga sudah disediakan fitur superadmin yang berguna untuk mengatur approval
pihak finance dan menambahkan item list yang terdapat di dalam aplikasi utama
payment request.

Kata kunci: Appsmith, payment request, Amazon Web Services, finance

vii
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Design and Build a Payment Request Application for PT. IDStar Cipta
Teknologi using Appsmith
Rupertus Herlambang Eko Nugroho

ABSTRACT

This internship report contains the implementation of internship activities carried


out at PT. IDStar Cipta Teknologi for 92 days starting from February 8, 2022 to June
30, 2022. The main task given is to design and create a website to record payment
request activities that occur internally within the company. Applications are built
using Appsmith’s low-code platform and combined with Amazon Web Services for
system database creation, email delivery, and storage media. In the application, the
user can make a payment request that he wants to submit. Payment requests that
have been submitted will be approved according to the procedures that apply within
the company’s internal. The inputter user can also edit or delete before submitting
for approval and the finance party can also edit some information from the payment
request submitted by the inputter user if there is a typing or input error. In making
this application, a superadmin feature has also been provided which is useful for
managing the approval of the finance party and adding list items contained in the
main payment request application.

Keywords: Appsmith, payment request, Amazon Web Services, finance

viii
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
DAFTAR ISI

HALAMAN JUDUL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . i
PERNYATAAN TIDAK MELAKUKAN PLAGIAT . . . . . . . . . . . . . . ii
HALAMAN PENGESAHAN . . . . . . . . . . . . . . . . . . . . . . . . . iii
HALAMAN PERSETUJUAN PUBLIKASI ILMIAH . . . . . . . . . . . . . iv
HALAMAN PERSEMBAHAN/MOTO . . . . . . . . . . . . . . . . . . . . v
KATA PENGANTAR . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vi
ABSTRAK . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vii
ABSTRACT . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . viii
DAFTAR ISI . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ix
DAFTAR GAMBAR . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xi
DAFTAR TABEL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xii
DAFTAR LAMPIRAN . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xiii
BAB 1 PENDAHULUAN . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
1.1 Latar Belakang Masalah . . . . . . . . . . . . . . . . . . . . . . . . 1
1.2 Maksud dan Tujuan Kerja Magang . . . . . . . . . . . . . . . . . . 1
1.3 Waktu dan Prosedur Pelaksanaan Kerja Magang . . . . . . . . . . . 1
BAB 2 GAMBARAN UMUM PERUSAHAAN . . . . . . . . . . . . . . . 2
2.1 Sejarah Singkat Perusahaan . . . . . . . . . . . . . . . . . . . . . . 2
2.2 Visi dan Misi Perusahaan . . . . . . . . . . . . . . . . . . . . . . . 2
2.3 Struktur Organisasi Perusahaan . . . . . . . . . . . . . . . . . . . . 3
BAB 3 PELAKSANAAN KERJA MAGANG . . . . . . . . . . . . . . . . 4
3.1 Kedudukan dan Organisasi . . . . . . . . . . . . . . . . . . . . . . 4
3.2 Tugas yang Dilakukan . . . . . . . . . . . . . . . . . . . . . . . . . 4
3.3 Uraian Pelaksanaan Magang . . . . . . . . . . . . . . . . . . . . . 5
3.4 Tech Stack yang Digunakan . . . . . . . . . . . . . . . . . . . . . . 7
3.5 Flow Aplikasi . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
3.5.1 Pengajuan Payment Request . . . . . . . . . . . . . . . . . 7
3.5.2 Approval Payment Request . . . . . . . . . . . . . . . . . . 9
3.6 Fitur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
3.6.1 Aplikasi Payment Request . . . . . . . . . . . . . . . . . . 11
3.6.2 Aplikasi Superadmin Payment Request . . . . . . . . . . . 16
3.7 Sistem Database . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
3.7.1 Alert . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
3.7.2 Bank . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24
3.7.3 Beneficiary . . . . . . . . . . . . . . . . . . . . . . . . . . 24
3.7.4 COA (Chart of Accounts) . . . . . . . . . . . . . . . . . . . 25
3.7.5 Company . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
3.7.6 Currency . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
3.7.7 DepartmentType . . . . . . . . . . . . . . . . . . . . . . . 27
3.7.8 Employee . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
3.7.9 ExpenseType . . . . . . . . . . . . . . . . . . . . . . . . . 30
3.7.10 FinancePersonnel . . . . . . . . . . . . . . . . . . . . . . . 30
3.7.11 PaymentRequest . . . . . . . . . . . . . . . . . . . . . . . 32
3.7.12 Project . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
3.7.13 PymntReqDetail . . . . . . . . . . . . . . . . . . . . . . . 40
3.7.14 RequestStatus . . . . . . . . . . . . . . . . . . . . . . . . . 40
3.8 Kendala dan Solusi yang Ditemukan . . . . . . . . . . . . . . . . . 41
BAB 4 SIMPULAN DAN SARAN . . . . . . . . . . . . . . . . . . . . . . 43

ix
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
4.1 Simpulan . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
4.2 Saran . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44
DAFTAR PUSTAKA . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45

x
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
DAFTAR GAMBAR

Gambar 2.1 Struktur organisasi perusahaan PT. IDStar Cipta Teknologi 3


Gambar 3.1 Flowchart Aplikasi Payment Request . . . . . . . . . . . . 8
Gambar 3.2 Flowchart Approval Aplikasi Payment Request . . . . . . 10
Gambar 3.3 Tampilan Login 3.3a dan Ketika Masuk ke Dalam Aplikasi
Belum Melakukan Login 3.3b . . . . . . . . . . . . . . . 11
Gambar 3.4 Tampilan Payment Request List . . . . . . . . . . . . . . 12
Gambar 3.5 Tampilan page Payment Request Detail List . . . . . . . . 13
Gambar 3.6 Tampilan Input Payment Request Header 3.6a dan Detail
3.6b . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
Gambar 3.7 Tampilan Edit Payment Request Header 3.7a dan Detail 3.7b 15
Gambar 3.8 Tampilan page Project . . . . . . . . . . . . . . . . . . . . 15
Gambar 3.9 Tampilan page Payment Request Report . . . . . . . . . . 16
Gambar 3.10 Tampilan page Employee pada Superadmin Payment Re-
quest . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
Gambar 3.11 Tampilan page Finance Team pada Superadmin Payment
Request . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
Gambar 3.12 Tampilan page Department pada Superadmin Payment Re-
quest . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
Gambar 3.13 Tampilan page Company pada Superadmin Payment Request 18
Gambar 3.14 Tampilan page COA pada Superadmin Payment Request . 19
Gambar 3.15 Tampilan page COA pada Superadmin Payment Request . 19
Gambar 3.16 Tampilan page Currency pada Superadmin Payment Request 19
Gambar 3.17 Tampilan page Expense Type pada Superadmin Payment
Request . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
Gambar 3.18 Tampilan page Beneficiary pada Superadmin Payment Re-
quest . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
Gambar 3.19 Tampilan page Beneficiary pada Superadmin Payment Re-
quest . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
Gambar 3.20 ERD Aplikasi Payment Request . . . . . . . . . . . . . . 23

xi
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
DAFTAR TABEL

Tabel 3.1 Pekerjaan yang dilakukan tiap minggu selama pelak-


sanaan kerja magang . . . . . . . . . . . . . . . . . . . . 6
Tabel 3.2 Table Alert . . . . . . . . . . . . . . . . . . . . . . . . . . 24
Tabel 3.3 Table Bank . . . . . . . . . . . . . . . . . . . . . . . . . 24
Tabel 3.4 Table Beneficiary . . . . . . . . . . . . . . . . . . . . . . 25
Tabel 3.5 Table COA . . . . . . . . . . . . . . . . . . . . . . . . . 25
Tabel 3.6 Table Company . . . . . . . . . . . . . . . . . . . . . . . 26
Tabel 3.7 Table Currency . . . . . . . . . . . . . . . . . . . . . . . 27
Tabel 3.8 Table DepartmentType . . . . . . . . . . . . . . . . . . . 27
Tabel 3.9 Table Employee . . . . . . . . . . . . . . . . . . . . . . . 28
Tabel 3.10 Table ExpenseType . . . . . . . . . . . . . . . . . . . . . 30
Tabel 3.11 Table FinancePersonnel . . . . . . . . . . . . . . . . . . . 30
Tabel 3.12 Table PaymentRequest . . . . . . . . . . . . . . . . . . . 32
Tabel 3.13 Table Project . . . . . . . . . . . . . . . . . . . . . . . . 39
Tabel 3.14 Table PymntReqDetail . . . . . . . . . . . . . . . . . . . 40
Tabel 3.15 Table RequestStatus . . . . . . . . . . . . . . . . . . . . . 41

xii
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
DAFTAR LAMPIRAN

Lampiran 1. Cover letter ( MKBM 01 ) . . . . . . . . . . . . . . . . . . . . 45


Lampiran 2. Form Bimbingan . . . . . . . . . . . . . . . . . . . . . . . . . 47
Lampiran 3. Kartu MBKM (MKBM 02) . . . . . . . . . . . . . . . . . . . . 48
Lampiran 4. Daily Task . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
Lampiran 5. Verifikasi Laporan MBKM (MBKM 04) . . . . . . . . . . . . . 61
Lampiran 6. Pengecekan Turnitin Bab (1 - 4) . . . . . . . . . . . . . . . . . 62

xiii
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
BAB 1
PENDAHULUAN

1.1 Latar Belakang Masalah

Pada setiap perusahaan, pasti akan terjadi suatu transaksi dalam kegiatan
bisnis di dalam perusahaan tersebut. Namun setiap transaksi di dalam perusahaan
tersebut tentunya juga perlu dicatat agar tidak terjadi penyalahgunaan dana perusa-
haan. Oleh karena itu, setiap perusahaan wajib memiliki sistem untuk mengawasi
transaksi yang terjadi di dalam perusahaan tersebut.
Begitu pula yang terjadi pada perusahaan PT. IDStar Cipta Teknologi yang
bergerak di bidang outsourcing tenaga kerja dalam bidang IT. Di dalam perusa-
haan ini, setiap transaksi yang terjadi akan dicatat dan memerlukan request approval
pada setiap transaksinya. Namun, sistem yang digunakan dilakukan secara manual
dan memakan banyak waktu dalam melakukan request approval dari transaksi yang
sedang dan/atau akan terjadi. Oleh karena itu, perusahaan memerlukan sistem yang
lebih modern dan terstruktur, serta tidak memakan banyak waktu dalam melakukan
request approval.

1.2 Maksud dan Tujuan Kerja Magang

Tujuan umum penulis melakukan kerja magang adalah agar dapat menge-
nal dunia kerja, mendapatkan pengalaman kerja, menerapkan dan memperdalam
ilmu-ilmu yang telah dipelajari selama perkuliahan, serta membangun relasi de-
ngan karyawan di PT. IDStar Cipta Teknologi. Selain itu, tujuan penulis melakukan
kerja magang di PT. IDStar Cipta Teknologi yaitu mempelajari keahlian di bidang
sistem informasi, terutama dalam bidang backend developer, dalam penerapan di
kehidupan kerja nyata.

1.3 Waktu dan Prosedur Pelaksanaan Kerja Magang

Kerja magang yang dilakukan penulis dilakukan selama 6 bulan dimulai


dari tanggal 8 Februari 2022 sampai 8 Agustus 2022. Pelaksanaan kerja dilakukan
secara Work from Office (WFO) dan Work from Home (WFH) secara bergantian.
Pelaksanaan kerja dilakukan dari hari Senin sampai Jumat dengan ketentuan jam
kerja dimulai dari pukul 08.30 dan selesai pada pukul 17.30.

1
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
BAB 2
GAMBARAN UMUM PERUSAHAAN

2.1 Sejarah Singkat Perusahaan

PT. IDStar Cipta Teknologi berdiri pada tahun 2018 yang terletak di Gedung
Wisma Staco Lantai 7 Jl. Casablanca Raya Kav. 18, Menteng Dalam, Tebet, Jakarta
Selatan. Perusahaan ini dipimpin oleh Bapak Ferdinand Prasetyo selaku Chief Exec-
utive Officer. PT IDStar Cipta Teknologi merupakan perusahaan outsourcing yang
berfokus pada penyediaan layanan IT profesional melalui konsultasi untuk individu
dan perusahaan[1].
PT. IDStar Cipta Teknologi merupakan bagian dari IDStar Group yang di-
pimpin Ibu Arifa Tan sebagai Group CEO. IDStar Group terdiri dari beberapa pe-
rusahaan, yang terdiri dari PT. Mitra Teknologi Kreasi, PT. Drife Solusi Integrasi,
Technology Visionaries Sdn. Bhd., dan PT. IDStar Cipta Teknologi sendiri.

2.2 Visi dan Misi Perusahaan

Perusahaan PT IDStar Cipta Teknologi memiliki visi untuk memperhatikan


generasi yang siap pada dunia digital yang mampu untuk berinvoasi dan memimpin
bisnis di seluruh benua Asia[1]. Selain itu, perusahan juga memiliki misi untuk
membangun, mempercepat, mendukung, dan memberdayakan setiap transformasi
bisnis organisasi[1].
Selain itu, perusahaan PT IDStar Cipta Teknologi ini juga memiliki bebe-
rapa values yang mendukung visi dan misi perusahaan. Values tersebut disingkat
menjadi TOPCE[1], yang memiliki makna antara lain :

1. T – Trustworthy : Setiap karyawan yang bekerja dapat dipercaya dan bertang-


gung jawab atas pekerjaan yang diberikan

2. O – One Team : Setiap karyawan dapat bekerja di dalam satu tim

3. P – Professional-Star Attitude : Setiap karyawan dituntut untuk profesional


dalam melakukan pekerjaannya

4. C – Constant Improvement : Setiap karyawan diharapkan dapat selalu


berkembang seiring berjalannya waktu

2
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
5. E – Entrepreneur Spirit : Setiap karyawan harus memiliki semangat en-
trepreneurship dalam setiap pekerjaannya

2.3 Struktur Organisasi Perusahaan

Struktur organisasi perusahaan PT. IDStar Cipta Teknologi dapat dilihat


pada Gambar 2.1 di bawah. Pada gambar tersebut dapat dilihat bahwa perusahaan
PT. IDStar Cipta Teknologi ini dipimpin oleh Bapak Ferdinand Prasetyo selaku
Chief Executive Officer dan di bawahnya terdapat Chief Operating Officer yang di-
pimpin oleh Bapak Erwin Hardijanto.
Pada struktur organisasi tersebut, posisi penulis berada di Squad Internal
App yang dipimpin langsung oleh Bapak Sulianto sebagai Squad Leader Internal
App yang terdapat pada tim Research and Development Officer yang dipimpin lang-
sung di bawah kepemimpinan Bapak Ferdinand Prasetyo.

Gambar 2.1. Struktur organisasi perusahaan PT. IDStar Cipta Teknologi

3
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
BAB 3
PELAKSANAAN KERJA MAGANG

3.1 Kedudukan dan Organisasi

Kedudukan dalam perusahaan yang diberikan kepada penulis saat melak-


sanakan magang di PT. IDStar Cipta Teknologi, saya menempati posisi sebagai
Backend Developer yang berada pada tim Research and Development yang di
dalamnya terdiri dari dua orang yakni penulis sendiri bersama dengan supervisor
(pembimbing di lapangan) penulis sendiri. Tim Research and Development ini
sendiri dipimpin langsung di bawah kepemimpinan Bapak Ferdinand Prasetyo.
Setiap harinya, tim Research and Development melakukan pertemuan secara
offline di kantor dan sesekali melakukan meeting online melalui Google Meet ketika
work from home. Supervisor juga ikut ambil andil bersama penulis dalam proyek
yang diberikan. Supervisor melihat dan membantu penulis secara langsung selama
pengerjaan proyek. Supervisor juga memberikan saran pengerjaan dalam proyek
website yang dibuat, seperti fitur-fitur dan mekanisme penjagaan di dalamnya.

3.2 Tugas yang Dilakukan

Selama proses pelaksanaan magang di PT. IDStar Cipta Teknologi, tugas-


tugas yang dilaksanakan oleh penulis diberikan oleh Bapak Sulianto selaku ke-
tua dari tim Research and Development yang sekaligus juga merupakan supervisor
saya. Dalam pengerjaan proyek, penulis bersama supervisor melakukan meeting se-
cara online untuk membicarakan fitur-fitur apa saja yang akan dibuat dan rancangan
struktur dari database yang diinginkan. Namun, dalam pelaksanaannya, fitur dan
rancangan yang telah dibuat di awal sering terjadi perubahan. Metode pengerjaan
yang seperti penulis lakukan tersebut disebut juga dengan metode Agile dalam Soft-
ware Development Life Cycle (SDLC). Metode Agile merupakan metodologi pe-
ngembangan software yang didasari oleh prinsip pengembangan sistem kerja yang
memerlukan adaptasi dengan cepat. Agile mengharuskan kita untuk selalu siap
pada perubahan yang akan terjadi, dan bersifat fleksibel ketika menghadapi suatu
masalah[2].
Berikut merupakan rincian tugas-tugas yang penulis lakukan selama
kegiatan magang :

4
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
1. Membuat backend dari website payment request selama periode magang
menggunakan low-code programming Appsmith.

2. Merancang dan membuat database menggunakan MySQL yang digunakan


pada aplikasi payment request.

3. Membuat aplikasi web payment request menggunakan platform low-code


programming Appsmith[3].

3.3 Uraian Pelaksanaan Magang

Hingga saat penulis melakukan penulisan laporan ini, penulis telah melak-
sanakan kegiatan magang selama 4 bulan lebih 2 minggu (18 minggu) dari durasi
perjanjian magang yang telah ditentukan yakni selama 6 bulan. Kegiatan magang
penulis lakukan dari tanggal 8 Februari 2022 hingga 8 Agustus 2022. Proses pelak-
sanaan dan pengerjaan magang dalam kurun waktu 5 bulan tersebut dapat dilihat
pada Tabel 3.1.

5
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.1. Pekerjaan yang dilakukan tiap minggu selama pelaksanaan kerja magang

Minggu Ke - Pekerjaan yang dilakukan


1 Melakukan onboarding awal yang membahas struktur organisasi
perusahaan, peraturan dan ketentuan perusahaan PT. IDStar Cipta
Teknologi dan merancang aplikasi payment request.
2 Merancang aplikasi payment request dan mempelajari penggunaan
Appsmith
3 Mempelajari dan mencoba fitur-fitur yang terdapat di Appsmith
4 Mempelajari dan mencoba fitur-fitur yang terdapat di Appsmith
5 Mulai membuat aplikasi payment request menggunakan Appsmith.
Dimulai dari tampilan pada seluruh page dan flow dari aplikasi
Payment Request.
6 Menambahkan fitur upload dan download pada aplikasi payemnt
request dengan menggunakan AWS S3.
7 Menambahkan fitur kirim email notifikasi menggunakan AWS SES
dan membuat aplikasi superadmin payment request.
8 Melanjutkan membuat aplikasi superadmin payment request.
9 Menambahkan jagaan input pada aplikasi payment request dan su-
peradmin payment request.
10 Testing keseluruhan aplikasi payment request dan superadmin pay-
ment request dan memperbaiki bug.
11 Final testing dan launching aplikasi payment request dan superad-
min payment request.
12 Melihat feedback user dan memperbaiki bug login pada aplikasi
payment request. Login diubah dari menggunakan akun Google
Sign-in menjadi menggunakan OTP.
13 Menambahkan fitur approval massal pada aplikasi payment re-
quest.
14 Menambahkan fitur pop-up modal view Payment Request Detail
pada aplikasi payment request.
15 Testing dan launching fitur approval massal dan pop-up view Pay-
ment Request Detail.
16 Merancang dan membuat fitur Settlement dari payment request Ad-
vance.
17 Melanjutkan membuat fitur Settlement dari payment request Ad-
vance.
18 Melanjutkan membuat fitur
6 Settlement dari payment request Ad-
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
vance.
Nusantara
19 Testing fitur Settlement yang sudah dibuat.
3.4 Tech Stack yang Digunakan

Dalam perancangan dan pembuatan aplikasi payment request PT. IDStar


Cipta Teknologi, penulis menggunakan beberapa tech stack di dalamnya, antara
lain :

1. Low-code programming : Appsmith

2. Database : MySQL

3. Cloud : Amazon Web Service

3.5 Flow Aplikasi

3.5.1 Pengajuan Payment Request

Aplikasi payment request ini menggunakan metode login menggunakan


OTP. Kode OTP yang sudah digenerate kemudian akan dikirimkan ke user melalui
email yang telah dipilih user. Ketika user sudah melakukan login, informasi lo-
gin seperti employee ID, nama user, dan email user akan disimpan menggunakan
metode storeValue yang disediakan Appsmith. Informasi tersebut digunakan untuk
flow pengajuan payment request. Flow pengajuan payment request sebagai berikut
:

7
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Gambar 3.1. Flowchart Aplikasi Payment Request

8
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
3.5.2 Approval Payment Request

Setiap payment request yang telah diajukan oleh user inputter perlu di-
lakukan approval. Setelah user menekan tombol request for approval, user leader
dari user inputter akan dikirimi email notifikasi bahwa ada payment request yang
perlu dilakukan approval dan status berubah menjadi WALD (Waiting for Leader
Approval). Setelah user leader melakukan approval, selanjutnya user dept head akan
dikirimi email notifikasi seperti sebelumnya dan status berubah menjadi WAHD
(Waiting for Head of Department Approval). Begitu pula seterusnya hingga ap-
proval C Level (CEO). Setelah user C level melakukan approval, apilikasi akan
melihat dahulu apakah jenis payment request yang diajukan merupakan jenis pay-
ment request baru atau jenis payment request Settlement. Jika jenis payment request
yang diajukan merupakan jenis payment request baru, maka status akan berubah
menjadi WRLS (Waiting to be Released) dan user Finance akan dikirimi email
notifikasi bahwa terdapat payment request yang perlu dirilis. Saat tim Finance
melakukan rilis, mereka perlu memberikan bukti transfer atas payment request yang
diajukan. Setelah melakukan upload bukti transfer, status berubah menjadi RLSF
(Released by Finance) dan user inputter akan dikirimi email notifikasi bahwa pay-
ment request yang diajukan sudah dirilis oleh tim Finance. Dan jika jenis pay-
ment request yang diajukan merupakan jenis payment request Settlement, maka
aplikasi akan melihat dahulu apakah nilai/jumlah uang yang dimasukkan lebih dari,
kurang dari, sama dengan, atau tidak digunakan sama sekali uang tersebut. Jika
lebih dari, flow yang dijalankan sama seperti flow saat mengajukan payment re-
quest baru. Jika jumlah yang dimasukkan kurang dari atau tidak digunakan sama
sekali, user akan mengembalikan uang tersebut ke pemberi dana. Dan jika jumlah
yang diajukan penggunaannya sama dengan uang yang digunakan maka pengajuan
settlement akan langsung selesai. Berikut flow dalam melakukan approval :

9
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Gambar 3.2. Flowchart Approval Aplikasi Payment Request

3.6 Fitur

Pada aplikasi payment request ini digunakan untuk seluruh karyawan yang
ada di perusahaan. Oleh karena itu, pada aplikasi ini diperlukan beberapa roles
untuk setiap usernya. Terdapat 3 roles untuk usernya, yaitu :

1. Inputter : user inputter dapat membuat payment request yang ingin diajukan.
User inputter juga dapat menambahkan atau menghapus item payment re-
quest yang pernah dilakukan, serta mengedit atau menghapus payment re-
quest yang pernah dibuat jika user inputter belum melakukan submit.

2. Leader, Dept Head, CEO, dan CFO : user ini dapat melakukan approval atau
rejection dari payment request yang telah diajukan.

3. Finance dan Finance Manager : user ini dapat melakukan approval atau rejec-
tion dari payment request yang telah diajukan. Selain itu, user ini juga dapat

10
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
melakukan edit dari payment request yang diajukan.

Pada aplikasi payment request ini terdapat dua aplikasi terpisah, yaitu apli-
kasi utama yang dapat digunakan oleh semua karyawan dan aplikasi superadmin
yang hanya dapat diakses oleh tim Finance. Berikut penjelasan dari masing-masing
aplikasi :

3.6.1 Aplikasi Payment Request

Pada aplikasi payment request, semua karyawan yang sudah terdaftar dalam
database dapat melakukan login aplikasi payment request dan melakukan pengajuan
payment request yang ingin diajukan. Pada aplikasi payment request ini terdapat
beberapa fitur pada setiap pagenya. Fitur-fitur tersebut di antaranya :

A. Login

Di sini user akan diminta untuk melakukan login menggunakan email. Dari
pihak C level, penulis diminta untuk melakukan list email dari semua karyawan
yang ada dan user hanya perlu memilih email mereka tanpa perlu mengetiknya.
Dan setelah user memilih email mereka, penulis juga diminta untuk menggu-
nakan metode login menggunakan kode OTP. Hal tersebut dikarenakan jika user
melakukan login menggunakan password pada umumnya, user akan cenderung lupa
dan perlu mereset password mereka yang mana akan memakan waktu.

(a) (b)

Gambar 3.3. Tampilan Login 3.3a dan Ketika Masuk ke Dalam Aplikasi Belum Melakukan
Login 3.3b

11
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
B. Payment Request List

Pada page ini, user dapat melihat list payment request yang pernah diajukan.
User juga dapat melakukan filter dari payment request yang ada. Pada page ini user
juga dapat melakukan approval, rejection, release, deletion, dan edit pada payment
request yang akan dan/atau sedang diajukan sesuai dengan roles yang sebelumnya
penulis sudah dijelaskan. Untuk fitur approval, user juga dapat melakukan approval
secara massal (approval untuk banyak payment request). User juga dapat melihat
preview dari detail item payment request yang diinput pada setiap payment request
yang telah diajukan. Selain itu, user juga dapat mengunduh dokumen releasal trans-
fer receipt yang pernah diunggah.

Gambar 3.4. Tampilan Payment Request List

C. Payment Request Detail List

Pada page ini, user dapat melihat informasi dari detail-detail item payment
request yang diajukan. Di sini user juga dapat melihat history dari approval yang
telah dilakukan. User juga dapat melakukan approval, reject, release, edit, dan
delete pada payment request yang dipilih sesuai dengan roles yang sebelumnya
penulis sudah dijelaskan. Serta user juga dapat melihat dan mengunduh invoice
dari item yang pernah diunggah sebelumnya saat melakukan input payment request.
Di page ini, user inputter juga dapat melakukan request for approval. Setelah user
melakukan request for approval, payment request yang dibuat akan diberikan Re-
quest ID yang di-generate secara otomatis.

12
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Gambar 3.5. Tampilan page Payment Request Detail List

D. Input Payment Request

Pada page ini terbagi menjadi dua bagian, yaitu page untuk menginput pay-
ment request header dan page untuk menginput payment request detail. Pada page
payment request header digunakan untuk menginput informasi yang ditampilkan
pada page payment request list dan pada header di Payment Request Detail List.
Informasi-informasi tersebut di antara seperti periode payment request, nama pe-
rusahaan, nama departemen perusahaan, jenis pengeluaran, jatuh tempo pemba-
yaran, jenis mata uang, dan beneficiary. Setelah user mengisi data yang ada di pay-

13
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
ment request header, user dapat melakukan submit dan user akan dibawa ke page
input payment request detail. Page input payment request detail ini digunakan untuk
memasukkan item-item yang ingin diajukan payment request. Pada page input pay-
ment request detail, user dapat memasukkan informasi seperti COA, deskripsi per
item, nominal (harga) dari item, dan mengunggah invoice dari item yang diajukan.
Setelah user

(a)

(b)

Gambar 3.6. Tampilan Input Payment Request Header 3.6a dan Detail 3.6b

E. Edit Payment Request

Page edit payment request ini juga memiliki tampilan yang mirip seperti
pada page input payment request. Pada page ini juga terbagi menjadi dua bagian,
yaitu page untuk mengedit payment request header dan page untuk mengedit
payment request detail. Akan tetapi, kedua page tersebut hanya berfungsi pada

14
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
satu bagian saja. Pada page edit payment request header hanya digunakan untuk
mengedit header pada payment request yang dibuat, dan page edit payment request
detail hanya digunakan untuk mengedit informasi per masing-masing item dalam
satu payment request.

(a) (b)

Gambar 3.7. Tampilan Edit Payment Request Header 3.7a dan Detail 3.7b

F. Project

Page Project ini digunakan untuk melihat, menambahkan, dan mengak-


tifkan/menonaktifkan project yang pernah dan/atau akan dilakukan payment re-
quest. Sebelum user dapat melakukan input payment request dengan tipe/jenis
project, user diminta untuk menambahkan project yang akan dilakukan payment
request terlebih dulu jika project yang diinginkan belum muncul.

Gambar 3.8. Tampilan page Project

15
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
G. Report

Pada page ini user dapat melihat jumlah total dari setiap transaksi yang ber-
jalan pada setiap perusahaan. Transaksi yang berjalan dikelompokkan berdasarkan
mata uang yang pernah dipilih saat melakukan payment request pada setiap perusa-
haan.

Gambar 3.9. Tampilan page Payment Request Report

3.6.2 Aplikasi Superadmin Payment Request

Pada aplikasi superadmin payment request hanya dapat diakses oleh tim Fi-
nance. Pada aplikasi superadmin ini, terdapat beberapa page untuk mengelola be-
berapa hal yang berada pada aplikasi payment request, antara lain :

A. Employee

Page ini digunakan untuk menampilkan seluruh karyawan yang terdapat di


dalam database.

16
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Gambar 3.10. Tampilan page Employee pada Superadmin Payment Request

B. Finance Team

Pada page ini digunakan untuk menambahkan, mengedit, dan menghapus


user yang tergabung dalam tim Finance. Di page ini juga user dapat mengatur role
pada setiap user di dalam tim Finance untuk melakukan approval. Page ini juga
digunakan untuk mengatur autentikasi user yang dapat mengakses aplikasi super-
admin payment request.

Gambar 3.11. Tampilan page Finance Team pada Superadmin Payment Request

17
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
C. Department

Page Department ini digunakan untuk menambahkan, mengedit, dan menon-


aktifkan/mengaktifkan departemen yang terdapat di dalam perusahaan.

Gambar 3.12. Tampilan page Department pada Superadmin Payment Request

D. Company

Page Company ini digunakan untuk mengedit, dan menonaktifkan/mengak-


tifkan perusahaan yang dapat mengajukan payment request.

Gambar 3.13. Tampilan page Company pada Superadmin Payment Request

E. COA

Page COA ini digunakan untuk menambahkan, mengedit, dan/atau menon-


aktifkan/mengaktifkan COA yang digunakan dalam aplikasi payment request.

18
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Gambar 3.14. Tampilan page COA pada Superadmin Payment Request

F. Bank

Page Bank ini digunakan untuk menambahkan, mengedit, dan/atau menon-


aktifkan/mengaktifkan Bank yang digunakan dalam aplikasi payment request.

Gambar 3.15. Tampilan page COA pada Superadmin Payment Request

G. Currency

Page Currency ini digunakan untuk menambahkan, mengedit, dan menon-


aktifkan/mengaktifkan jenis mata uang yang digunakan dalam aplikasi payment re-
quest.

Gambar 3.16. Tampilan page Currency pada Superadmin Payment Request

19
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
H. Expense Type

Page Expense Type ini digunakan untuk menambahkan, mengedit, dan


menonaktifkan/mengaktifkan jenis pengeluaran yang digunakan dalam aplikasi
payment request.

Gambar 3.17. Tampilan page Expense Type pada Superadmin Payment Request

I. Beneficiary

Page Beneficiary ini digunakan untuk menambahkan, mengedit, dan menon-


aktifkan/mengaktifkan rekening bank penerima dana (beneficiary) yang digunakan
dalam aplikasi payment request.

Gambar 3.18. Tampilan page Beneficiary pada Superadmin Payment Request

J. Project

Page Project ini digunakan untuk menambahkan, mengedit, dan menonak-


tifkan/mengaktifkan project yang akan dilakukan payment request yang digunakan
dalam aplikasi Payment Request.

20
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Gambar 3.19. Tampilan page Beneficiary pada Superadmin Payment Request

3.7 Sistem Database

Dalam pembuatan aplikasi payment request, sistem database dibuat meng-


gunakan MySQL. Terdapat tabel di dalam sistem database yang dibuat, yaitu :

1. Alert

2. Bank

3. Beneficiary

4. COA

5. Company

6. Currency

7. DepartmentType

8. Employee

9. ExpenseType

10. FinancePersonnel

11. PaymentRequest

12. Project

13. PymntReqDetail

14. RequestStatus

21
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Jika dilihat dari sisi backend, table-table tersebut penulis buat secara lang-
sung pada database MySQL menggunakan aplikasi SQLyog yang kemudian untuk
melakukan CRUD dilakukan dengan melakukan RAW query pada aplikasi Appm-
sith. Hal tersebut penulis lakukan karena pada aplikasi Appsmith hanya dapat
melakukan RAW data query dari database yang penulis miliki. Dan untuk pengga-
bungan data dari setiap table yang ada, penulis menggunakan function JOIN. Untuk
ERD (Entity Relationship Diagram) dapat dilihat pada gambar berikut :

22
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Gambar 3.20. ERD Aplikasi Payment Request

Pada setiap table tersebut memiliki column yang berbeda-beda, antara lain :

3.7.1 Alert

Pada table Alert ini digunakan untuk menyimpan alert notification kepada
user pada saat menggunakan aplikasi payment request. Kolom-kolom yang terdapat

23
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
pada table ini di antaranya :

Tabel 3.2. Table Alert

Nama kolom Tipe data Deskripsi


AlertCode int PK untuk menampung primary key dari tabel
alert ini
AlertContent varchar(500) berisi text alert yang ditampilkan.

3.7.2 Bank

Pada table Bank ini digunakan untuk menyimpan bank-bank yang akan di-
gunakan dalam aplikasi payment request. Kolom-kolom yang terdapat pada table
ini di antaranya :

Tabel 3.3. Table Bank

Nama kolom Tipe data Deskripsi


BankCode varchar(11) PK untuk menampung primary key dari table
bank.
BankName varchar(100) berisi nama bank.
BankStatus enum(’Active’, ’Inactive’) berisi status dari bank, apakah masih aktif
atau tidak.

3.7.3 Beneficiary

Table Beneficiary digunakan untuk menyimpan penerima dana (beneficiary)


dari payment request yang diajukan. Kolom-kolom yang terdapat pada table ini di
antaranya :

24
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.4. Table Beneficiary

Nama kolom Tipe data Deskripsi


BenefId int PK untuk menampung primary key dari table
beneficiary.
BenefName varchar(100) berisi nama beneficiary dari payment re-
quest yang diinginkan.
BenefBankCode varchar(11) berisi kode bank pada masing-masing
beneficiary.
BenefAcctNo varchar(20) berisi nomor rekening dari penerima ben-
eficiary.
BenefAcctName varchar(255) berisi nama dari rekening penerima bene-
ficiary.
BenefBranchName varchar(100) berisi cabang bank dari penerima benefi-
ciary.
BenefStatus enum(’Active’, ’Inac- digunakan untuk mengatur status dari
tive’) rekening beneficiary.
BenefType enum(’Organization’, digunakan untuk mengatur tipe rekening
’Personal’) beneficiary.

3.7.4 COA (Chart of Accounts)

Pada table COA digunakan untuk menyimpan jenis pembukuan dari pay-
ment request yang dilakukan. Kolom-kolom yang terdapat pada table ini di an-
taranya :

Tabel 3.5. Table COA

Nama kolom Tipe data Deskripsi


COACode varchar(10) PK untuk menampung primary key dari table
COA sekaligus menjadi kode dari COA.
COAName varchar(45) berisi nama dari kode COA yang telah di-
tentukan.
Lanjut pada halaman berikutnya

25
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.5 Tabel COA (lanjutan)
Nama kolom Tipe data Deskripsi
COAStatus enum(’Active’, ’Inactive’) digunakan untuk mengatur status dari
COA.

3.7.5 Company

Pada table company ini digunakan untuk menyimpan perusahaan-perusahan


yang akan menggunakan aplikasi payment request ini. Kolom-kolom yang terdapat
pada table ini di antaranya :

Tabel 3.6. Table Company

Nama kolom Tipe data Deskripsi


CompCode varchar(3) PK untuk menampung primary key dari table
Company sekaligus menjadi kode Com-
pany.
CompName varchar(45) berisi nama-nama dari perusahaan.
CompLogoURL text berisi link gambar dari logo perusahaan.
CEOId varchar(40) berisi ID CEO perusahaan dari table
ApiEmployee.
CEOEmpId varchar(10) berisi Employee ID (Nomor Induk
Karyawan) CEO.
CompStatus enum(’Active’, ’In- digunakan untuk mengatur status dari pe-
active’) rusahaan yang ada.
BenefIdStlmt int berisi kode beneficiary dari masing-
masing perusahaan.

3.7.6 Currency

Pada table Currency digunakan untuk menyimpan jenis mata uang yang akan
digunakan saat melakukan payment request. Kolom-kolom yang terdapat pada table
ini di antaranya :

26
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.7. Table Currency

Nama kolom Tipe data Deskripsi


CurrCode varchar(3) PK digunakan untuk menampung primary
key dari table Currency sekaligus menjadi
kode mata uang yang digunakan.
CurrName varchar(50) berisi nama-nama dari mata uang yang di-
gunakan.
CurrOrder smallint digunakan untuk mengatur order dari
mata uang yang sering digunakan.
CurrStatus enum(’Active’, ’In- digunakan untuk mengatur status dari
active’) mata uang yang ada.

3.7.7 DepartmentType

Pada table DepartmentType digunakan untuk menyimpan departemen-


departemen yang ada di perusahaan yang akan menggunakan aplikasi payment re-
quest. Kolom-kolom yang terdapat pada table ini di antaranya :

Tabel 3.8. Table DepartmentType

Nama kolom Tipe data Deskripsi


DeptCode varchar(3) PK digunakan untuk menampung primary
key dari table DepartmentType sekali-
gus menjadi kode dari masing-masing de-
partemen.
DeptName varchar(255) berisi nama-nama dari departemen yang
ada.
DeptTypeStatus enum(’Active’, ’In- digunakan untuk mengatur status dari de-
active’) partemen yang ada.

27
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
3.7.8 Employee

Pada table Employee digunakan untuk menyimpan informasi mengenai data


setiap karyawan yang ada di internal perusahaan. Data-data ini juga digunakan
untuk memberikan akses ke aplikasi payment request.

Tabel 3.9. Table Employee

Nama kolom Tipe data Deskripsi


EmpId varchar(10) PK digunakan untuk menampung primary
key dari table Employee sekaligus men-
jadi nomor induk karyawan.
EmpName varchar(100) digunakan untuk menyimpan nama-nama
karyawan yang ada.
EmpEmail varchar(100) digunakan untuk menyimpan email
karyawan. Email karyawan ini juga
digunakan untuk melakukan login ke
dalam aplikasi payment request.
EmpPosition varchar(100) digunakan untuk menyimpan jabatan dari
masing-masing karyawan.
EmpPosLevel varchar(100) digunakan untuk menyimpan level ja-
batan setiap karyawan.
EmpOrganization varchar(100) digunakan untuk mengatur organisasi
pada setiap karyawan.
EmpOrgLevel varchar(100) digunakan untuk mengatur level organ-
isasi pada setiap karyawan
EmpJobName varchar(100) digunakan untuk menyimpan pekerjaan
setiap karyawan.
IsCLevel enum(’Y’, ’N’) digunakan untuk melihat status karyawan
seorang C level atau bukan.
LeaderEmpId varchar(10) digunakan untuk mengetahui ID leader
dari setiap karyawan. Kolom ini juga di-
gunakan untuk flow next approver dari
aplikasi payment request.
Lanjut pada halaman berikutnya

28
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.9 Table Employee (lanjutan)
Nama kolom Tipe data Deskripsi
CompCode varchar(3) digunakan untuk menyimpan kode pe-
rusahaan tempat karyawan bekerja.
InputtedAt datetime digunakan untuk mencatat kapan data per
karyawan dimasukkan ke database dari
API perusahaan.
UpdatedAt datetime digunakan untuk mencatat kapan data per
karyawan diperbarui ke database dari API
perusahaan.
Token varchar(100) digunakan untuk session per user.
OTP varchar(100) digunakan untuk menampung sementara
kode OTP yang sudah di-generate pada
setiap user untuk melakukan autentikasi.
Setelah user sudah masuk ke dalam apli-
kasi, kode yang disimpan akan dihapus.
OTPExpTime datetime digunakan untuk menampung batas
waktu berlakunya kode OTP pada setiap
user.
OTPReqCount tinyint digunakan untuk menampung jumlah re-
quest OTP yang pernah dilakukan user
saat melakukan request OTP.
OTPNextReqTime datetime digunakan untuk mencatat waktu berikut-
nya user dapat melakukan request OTP
kembali.
LastLogin datetime digunakan untuk mencatat terakhir kali
user (karyawan) melakukan login ke apli-
kasi.
LastLogout datetime digunakan untuk mencatat terakhir kali
user (karyawan) melakukan logout dari
aplikasi.

29
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
3.7.9 ExpenseType

Pada table ExpenseType digunakan untuk menyimpan jenis-jenis expense


(pengeluaran) yang dilakukan di dalam internal perusahaan.

Tabel 3.10. Table ExpenseType

Nama kolom Tipe data Deskripsi


ExpTypeCode varchar(3) PK digunakan untuk menampung primary
key dari table ExpenseType sekaligus
menjadi kode dari masing-masing jenis
expense (pengeluaran) yang digunakan.
ExpTypeName varchar(45) untuk menampung nama-nama dari kode
jenis expense (pengeluaran) yang ada.
ExpTypeStatus enum(’Active’, ’In- digunakan untuk mengatur status dari je-
active’) nis expense (pengeluaran).

3.7.10 FinancePersonnel

Pada table FinancePersonnel digunakan untuk menyimpan anggota


karyawan yang tergabung ke dalam tim Finance. Table ini juga digunakan untuk
mengatur akses ke aplikasi superadmin payment request dan mengatur akses ap-
proval payment request untuk tim Finance.

Tabel 3.11. Table FinancePersonnel

Nama kolom Tipe data Deskripsi


EmpId varchar(40) PK digunakan untuk menampung primary
key dari table DepartmentType sekali-
gus menjadi kode dari masing-masing de-
partemen.
PositionCode enum(’FIN’, ’FMG’, digunakan untuk menentukan posisi
’CFO’, ’IT’) anggota tim Finance.
Lanjut pada halaman berikutnya

30
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.11 Table FinancePersonnel (lanjutan)
Nama kolom Tipe data Deskripsi
IsEligibleToApv enum(’Yes’, ’No’) digunakan untuk mengatur akses yang da-
pat melakukan approval dari anggota tim
Finance.
IsActive enum(’Active’, ’Inac- digunakan untuk menentukan status
tive’) anggota tim Finance yang aktif dan tidak
aktif.
Token varchar(100) digunakan untuk menampung token login
pada aplikasi superadmin.
OTP varchar(100) digunakan untuk menampung sementara
kode OTP yang sudah di-generate pada
setiap user untuk melakukan autentikasi.
Setelah user sudah masuk ke dalam apli-
kasi, kode yang disimpan akan dihapus.
OTPExpTime datetime digunakan untuk menampung batas
waktu berlakunya kode OTP pada setiap
user (Finance).
OTPReqCount tinyint digunakan untuk menampung jumlah re-
quest OTP (Finance) yang pernah di-
lakukan user saat melakukan request
OTP.
OTPNextReqTime datetime digunakan untuk mencatat waktu berikut-
nya user (Finance) dapat melakukan re-
quest OTP kembali.
LastLogin datetime digunakan untuk mencatat terakhir kali
user (Finance) melakukan login ke apli-
kasi.
LastLogout datetime digunakan untuk mencatat terakhir kali
user (Finance) melakukan logout dari
aplikasi.

31
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
3.7.11 PaymentRequest

Pada table PaymentRequest digunakan untuk menyimpan segala informasi


dari pengajuan payment request yang dilakukan oleh user. Pada table ini juga digu-
nakan mencatat semua aktivitas approval yang dilakukan oleh approver. Table ini
juga digunakan untuk menampilkan informasi-informasi yang terdapat pada page
header Payment Request.

Tabel 3.12. Table PaymentRequest

Nama kolom Tipe data Deskripsi


PRHId bigint PK digunakan untuk menampung
primary key dari table Paymen-
tRequest.
ReqId varchar(255) untuk mencatat Request ID yang
sudah di-generate ketika user
melakukan request for approval.
ReqPeriodMonth enum(’01’, ’02’, digunakan untuk menampung pe-
’03’, ’04’, ’05’, riode bulan pada payment request
’06’, ’07’, ’08’, yang diajukan yang dipilih oleh
’09’, ’10’, ’11’, user.
’12’)
ReqPeriodYear year digunakan untuk menampung pe-
riode tahun pada payment request
yang diajukan yang dipilih oleh
user.
DeptCode varchar(3) digunakan untuk menyimpan
kode departemen pada payment
request yang dibuat yang dipilih
oleh user.
CompCode varchar(3) digunakan untuk menyimpan
kode perusahaan pada payment
request yang dibuat yang dipilih
oleh user.
Lanjut pada halaman berikutnya

32
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.12 Table PaymentRequest (lanjutan)
Nama kolom Tipe data Deskripsi
PymtPlanDate date digunakan untuk menyimpan
tanggal payment request tersebut
akan dibayarkan yang dipilih
oleh user.
ExpTypeCode varchar(3) digunakan untuk menyimpan
kode jenis expense (pengeluaran)
pada payment request yang
dibuat yang dipilih oleh user.
OpsProjCode enum(’Operational’, digunakan untuk menyimpan pil-
’Project’) ihan jenis payment request yang
dibuat user digunakan untuk se-
buah proyek atau kegiatan opera-
tional perusahaan.
ProjectId int digunakan untuk menyimpan ID
project yang ada pada table
Project pilihan user jika user
memilih jenis payment request
untuk sebuah proyek pada pe-
rusahaan.
InputterEmpId varchar(10) digunakan untuk mencatat ID
karyawan yang melakukan pay-
ment request.
InputterEmail varchar(100) digunakan untuk mencatat email
karyawan yang memasukkan
payment request.
InputterName varchar(100) digunakan untuk mencatat nama
karyawan yang memasukkan
payment request.
InputDateTime datetime digunakan untuk mencatat waktu
karyawan yang memasukkan
payment request..
Lanjut pada halaman berikutnya

33
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.12 Table PaymentRequest (lanjutan)
Nama kolom Tipe data Deskripsi
LeaderEmpId varchar(10) digunakan untuk mencatat ID
leader karyawan yang melakukan
approval payment request.
LeaderEmail varchar(100) digunakan untuk mencatat email
leader karyawan yang melakukan
approval payment request.
LeaderName varchar(100) digunakan untuk mencatat nama
leader karyawan yang melakukan
approval payment request.
LeaderApvDateTime datetime digunakan untuk mencatat waktu
leader karyawan yang melakukan
approval payment request.
DeptHeadEmpId varchar(10) digunakan untuk mencatat
ID dept head karyawan yang
melakukan approval payment
request.
DeptHeadEmail varchar(100) digunakan untuk mencatat
email dept head karyawan yang
melakukan approval payment
request.
DeptHeadName varchar(100) digunakan untuk mencatat
nama dept head karyawan yang
melakukan approval payment
request.
DeptHeadApvDateTime datetime digunakan untuk mencatat
waktu dept head karyawan yang
melakukan approval payment
request.
CLevelEmpId varchar(10) digunakan untuk mencatat ID
karyawan C level (CEO) yang
melakukan approval payment re-
quest.
Lanjut pada halaman berikutnya

34
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.12 Table PaymentRequest (lanjutan)
Nama kolom Tipe data Deskripsi
CLevelEmail varchar(100) digunakan untuk mencatat email
karyawan C level (CEO) yang
melakukan approval payment re-
quest.
CLevelName varchar(255) digunakan untuk mencatat nama
karyawan C level (CEO) yang
melakukan approval payment re-
quest.
CLevelApvDateTime datetime digunakan untuk mencatat waktu
karyawan C level (CEO) yang
melakukan approval payment re-
quest.
FinanceEmpId varchar(10) digunakan untuk mencatat
ID karyawan Finance yang
melakukan approval payment
request.
FinanceEmail varchar(100) digunakan untuk mencatat
email karyawan Finance yang
melakukan approval payment
request.
FinanceName varchar(100) digunakan untuk mencatat
nama karyawan Finance yang
melakukan approval payment
request.
FinanceApvDateTime datetime digunakan untuk mencatat
waktu karyawan Finance yang
melakukan approval payment
request.
FinMgrEmpId varchar(10) digunakan untuk mencatat ID
karyawan Finance Manager yang
melakukan approval payment re-
quest.
Lanjut pada halaman berikutnya

35
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.12 Table PaymentRequest (lanjutan)
Nama kolom Tipe data Deskripsi
FinMgrEmail varchar(100) digunakan untuk mencatat email
karyawan Finance Manager yang
melakukan approval payment re-
quest.
FinMgrName varchar(100) digunakan untuk mencatat nama
karyawan Finance Manager yang
melakukan approval payment re-
quest.
FinMgrApvDateTime datetime digunakan untuk mencatat waktu
karyawan Finance Manager yang
melakukan approval payment re-
quest.
CFOEmpId varchar(10) digunakan untuk mencatat ID
karyawan CFO yang melakukan
approval payment request.
CFOEmail varchar(100) digunakan untuk mencatat email
karyawan CFO yang melakukan
approval payment request.
CFOName varchar(100) digunakan untuk mencatat nama
karyawan CFO yang melakukan
approval payment request.
CFOApvDateTime datetime digunakan untuk mencatat waktu
karyawan CFO yang melakukan
approval payment request.
CurrCode char(3) digunakan untuk menampung
kode mata uang yang dipilih oleh
user.
Lanjut pada halaman berikutnya

36
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.12 Table PaymentRequest (lanjutan)
Nama kolom Tipe data Deskripsi
StatusCode enum(’RJCT’, berisi kode status dari payment
’DRFT’, ’WALD’, request yang sedang berjalan.
’WAHD’, ’WAFN’,
’WAMG’, ’WACF’,
’WACL’, ’WRLS’,
’RLSF’, ’WRRU’,
’WRFC’, ’STLD’)
PreviousStatusCode enum(’RJCT’, berisi kode status dari payment
’DRFT’, ’WALD’, request yang sebelumnya.
’WAHD’, ’WAFN’,
’WAMG’, ’WACF’,
’WACL’, ’WRLS’,
’RLSF’, ’WRRU’,
’WRFC’, ’STLD’)
LastApprovalByEmpId varchar(10) berisi nama-nama dari departe-
men yang ada.
LastApprovalByName varchar(100) berisi nama-nama dari departe-
men yang ada.
LastApprovalByEmail varchar(100) berisi nama-nama dari departe-
men yang ada.
LastApprovalDateTime datetime berisi nama-nama dari departe-
men yang ada.
RejectReason mediumtext digunakan untuk menyimpan
alasan payment request yang
dilakukan rejection.
RejectedByEmpId varchar(255) digunakan untuk mencatat ID
karyawan yang melakukan pay-
ment request rejection.
RejectedByName varchar(255) digunakan untuk mencatat nama
karyawan yang melakukan pay-
ment request rejection.
Lanjut pada halaman berikutnya

37
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.12 Table PaymentRequest (lanjutan)
Nama kolom Tipe data Deskripsi
RejectedByEmail varchar(255) digunakan untuk mencatat email
karyawan yang melakukan pay-
ment request rejection.
RejectedDateTime datetime digunakan untuk mencatat waktu
payment request yang dilakukan
rejection.
LastUpdated datetime digunakan untuk mencatat waktu
terakhir kali data payment re-
quest diupdate
BeneficiaryId int digunakan untuk mencatat ID
beneficiary (penerima) yang dipi-
lih oleh user.
TransferDesc mediumtext digunakan untuk mencatat
deskripsi dari bukti transfer yang
diajukan.
TransferURL varchar(500) digunakan untuk mencatat URL
dokumen yang diunggah ke AWS
S3 dari bukti transfer yang dia-
jukan.
TransferDate datetime digunakan untuk mencatat waktu
bukti transfer yang dilakukan.
ApprovalFlow enum(’1’, ’2’) berisi nama-nama dari departe-
men yang ada.
AdvIsTaken enum(’Y’, ’N’) digunakan untuk mencatat
apakah jenis payment request
Advance sudah pernah dipilih
untuk melakukan Settlement atau
belum.
AdvPRHId bigint digunakan untuk menampung
PRHId dengan jenis payment
request Advance yang dipilih
untuk Settlement.
Lanjut pada halaman berikutnya

38
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.12 Table PaymentRequest (lanjutan)
Nama kolom Tipe data Deskripsi
RefundURL varchar(500) digunakan untuk mencatat URL
dokumen yang diunggah ke AWS
S3 dari bukti pengembalian dana
yang dilakukan user.

3.7.12 Project

Table Project ini digunakan untuk menyimpan project-project yang diinput


oleh user yang user akan lakukan payment request.

Tabel 3.13. Table Project

Nama kolom Tipe data Deskripsi


ProjectId int PK digunakan untuk menampung primary
key dari table DepartmentType sekali-
gus menjadi kode dari masing-masing de-
partemen.
ProjectName varchar(255) berisi nama-nama dari departemen yang
ada.
DeptCode varchar(3) digunakan untuk mengatur status dari de-
partemen yang ada.
CompCode varchar(3) digunakan untuk mengatur status dari de-
partemen yang ada.
ProjectStatus enum(’Active’, ’In- digunakan untuk mengatur status dari de-
active’) partemen yang ada.
CreatedByEmpId varchar(10) digunakan untuk mengatur status dari de-
partemen yang ada.
CreatedAt datetime digunakan untuk mengatur status dari de-
partemen yang ada.
LastUpdatedAt datetime digunakan untuk mengatur status dari de-
partemen yang ada.

39
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
3.7.13 PymntReqDetail

Pada table PymntReqDetail digunakan untuk menyimpan item-item detail


dari payment request yang diajukan oleh user.

Tabel 3.14. Table PymntReqDetail

Nama kolom Tipe data Deskripsi


PRDId bigint PK digunakan untuk menampung primary
key dari table PymntReqDetail.
PRHId bigint digunakan untuk menampung PRHId
yang terdapat pada Table PaymentRe-
quest.
COACode varchar(10) digunakan untuk menampung kode COA
yang dipilih.
Item varchar(100) digunakan untuk menyimpan item yang
diinput.
Amount double digunakan untuk mencatat jumlah uang
per item.
Notes mediumtext digunakan untuk menyimpan catatan
pada item yang diinput.
InvoiceNo varchar(25) digunakan untuk mencatat nomor doku-
men invoice yang dimasukkan user.
InvoiceURL varchar(500) digunakan untuk menyimpan URL doku-
men invoice yang diupload ke AWS S3.

3.7.14 RequestStatus

Table RequestStatus digunakan untuk menyimpan status-status yang digu-


nakan untuk flow approval pada aplikasi payment request.

40
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Tabel 3.15. Table RequestStatus

Nama kolom Tipe data Deskripsi


StatusCode varchar(4) PK digunakan untuk menampung primary
key dari table RequestStatus sekaligus
menjadi kode status dari flow approval
yang dilakukan.
StatusName varchar(45) berisi nama-nama dari kode status-status
yang ada.
Seq tinyint digunakan untuk menampung urutan dari
status-status approval.

3.8 Kendala dan Solusi yang Ditemukan

Selama pengerjaan proyek ini, penulis menemukan beberapa kendala yang


mempersulit penulis dalam pembuatan aplikasi payment request ini. Permasalahan-
permasalahan tersebut antara lain :
1. Dokumentasi pada aplikasi Appsmith yang sangat sedikit yang mengaki-
batkan dalam proses pembuatan aplikasi payment request memerlukan waktu
yang sedikit lebih lama.

2. Fitur-fitur yang disediakan Appsmith sangat terbatas yang mana penulis


hanya dapat menggunakan fitur-fitur yang hanya disediakan oleh Appsmith

3. Dalam pembuatan aplikasi, dalam satu tim, belum ada yang pernah meng-
gunakan Appsmith yang mana juga mengakibatkan dalam proses pembuatan
aplikasi payment request memerlukan waktu yang sedikit lebih lama.
Namun dari permasalahan-permasalahan tersebut, adapun solusi yang penulis
temukan, di antaranya :
1. Untuk permasalahan dokumentasi, penulis mencoba-coba dan melakukan im-
provisasi dengan menggabungkan bahasa pemrograman JavaScript dengan at-
uran yang terdapat pada Appsmith.

2. Untuk permasalahan fitur, penulis memaksimalkan penggunaan fitur yang


disediakan Appsmith digabungkan dengan cloud platform Amazon Web Ser-
vice.

41
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
3. Untuk permasalahan dalam penggunaan Appsmith, dalam pembuatan apli-
kasi payment request dilakukan dengan cara mempelajari penggunaan apli-
kasi Appsmith sekaligus menerapkannya dalam pembuatan aplikasi payment
request.

42
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
BAB 4
SIMPULAN DAN SARAN

4.1 Simpulan

Selama penulis melakukan kegiatan magang di PT. IDStar Cipta Teknologi


selama 18 minggu, aplikasi payment request yang penulis dan tim penulis buat
masih jauh dari kata sempurna. Aplikasi yang dibuat masih belum selesai dan
perlu dikembangkan lebih baik. Namun untuk fitur-fitur, flow approval, dan sistem
database yang diinginkan dalam aplikasi payment request ini sudah dapat berjalan
dengan baik.
Aplikasi payment request ini dibuat mengguanakan aplikasi Appsmith.
Aplikasi Appsmith ini menggunakan basis bahasa pemrograman JavaScript. Dalam
pembuatan backend pada aplikasi payment request ini menggunakan filosofi CRUD
(Create, Read, Update, Delete) dengan melakukan query di dalam aplikasi App-
smith. Untuk sistem database yang digunakan yaitu dengan MySQL.
Adapun penulis menemukan perbedaan dalam mendevelop aplikasi web se-
cara low-code, seperti Appsmith, dan secara full-code. Dalam mendevelop aplikasi
web secara low-code, penulis diuntungkan karena kita hanya perlu melakukan drag-
and-drop komponen pada tampilan dan melakukan koding pada function-function
yang diinginkan atau diperlukan sehingga dalam pengembangan aplikasi lebih cepat
jika dibandingkan dengan full-code yang mana developer perlu melakukan kod-
ing secara menyeluruh pada aplikasi yang dibuatnya. Namun dalam mendevelop
aplikasi secara low-code juga terdapat kekurangan di mana fitur-fitur yang ingin
diterapkan pada aplikasi web yang dibuat sangat terbatas. Meskipun pada plat-
form low-code seperti Appsmith dapat mengadakan fitur yang diinginkan, namun
penulis perlu membayar biaya langganan untuk dapat menerapkan fitur tersebut.
Selain itu, dalam platform low-code apabila menggunakan database yang bersifat
SQL, perlu melakukan query menggunakan filosofi CRUD (Create, Read, Update,
Delete) untuk melakukan pemanggilan data pada database yang mana kurang aman
karena dapat dilakukan SQL injection. Berbeda dengan full-code di mana fitur
yang diinginkan dapat diterapkan cukup bebas dan tersedia dan di internet serta
banyak yang bersifat open-source. Selain itu, jika menggunakan metode full-code
kita dapat mengunakan Object Relational Mapper (ORM) untuk memanggil data
pada database yang sudah dibuat.

43
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Selain dapat membuat aplikasi payment request di PT. IDStar Cipta
Teknologi, penulis juga dapat mengasah soft skill dan menambah koneksi dalam
melakukan magang ini. Penulis mendapatkan soft skill dalam berkomunikasi an-
tar anggota tim, melakukan problem solving dan making decision. Ini dikarenakan
antar anggota tim yang memiliki pendapat berbeda dalam pembuatan aplikasi, dan
permintaan yang diminta tim Finance dan C level yang terlalu tinggi yang mana
dalam pembuatan fitur tersebut tidak/belum tersedia, atau untuk ada fitur tersebut
perlu mengeluarkan biaya yang besar untuk diterapkan pada aplikasi Appsmith.

4.2 Saran

Adapun saran yang penulis sampaikan terkait dengan pelaksaan magang ini,
antara lain :

1. Untuk pengembangan aplikasi, penulis berharap ke depannya dapat dilakukan


menggunakan metode full code karena dengan menggunakan aplikasi low-
code seperti Appsmith fitur yang diberikan sangat terbatas dan sulit untuk
dapat keluar dari fitur yang diberikan Appsmith, serta dengan menggunakan
Appsmith dokumentasi yang diberikan juga sangat terbatas yang membuat
penulis harus mencoba-coba dahulu fitur yang diberikan Appsmith.

2. Untuk para tim Finance dan C level, penulis berharap agar dapat mengerti
bahwa Appsmith merupakan aplikasi low-code untuk membuat sebuah apli-
kasi web yang memiliki fitur terbatas dan tidak semua fitur dapat tersedia.

44
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
DAFTAR PUSTAKA

[1] IDStar, “About us,” available at https://idstar.co.id/about-us/(2022/06/28).

[2] Dicoding, “Metode sdlc dalam pengembangan software,” available at https://


www.dicoding.com/blog/metode-sdlc/ (2022/06/28).

[3] Appsmith, “Appsmith documentation,” available at https://docs.appsmith.com/


(2022/06/28).

45
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Lampiran 1. Cover letter ( MKBM 01 )

MBKM-01 Cover Letter MBKM Internship Track 1

Tangerang, February 24th 2022

No : 5/UMN/SK/Internship Track 1/II/2022


Subject : Student's Application for MBKM Internship Track 1

Dear. Head of Human Resource Department

PT. IDStar Cipta Teknologi

Universitas Multimedia Nusantara’s providing the MBKM Internship Track 1, a work-integrated


learning program, for students to hone their skills according to their talents and interests into the
real work environments. Students directly doing Internship Track 1, in the company to learn
solving problems based on knowledge that gained in campus, to link and match Internship Track
1 program with the curriculum as preparation for their future careers.

We pleased to inform the student with the following details:

    Student ID : 00000034220


    Student Name : Rupertus Herlambang Eko Nugroho
    Academic Program : Computer Engineering
    Email : rupertus.herlambang@student.umn.ac.id
    Mobile Phone : 6288211996795

Company will be received the student as an employee and Internship Track 1 participant, he/she
express their willingness to follow 800 working hours or 100 working days prior to work rules 8 hours
per day. Therefore, UMN’s student must obey all regulations stipulated by company from time to time.

Along with respect, we considered our student to get selected in the Internship Track 1 program from
your company. We thank you and look forward to hear employment acceptance letter of our student’s.

Sincerely,

Head of Departement Computer Engineering Program


Multimedia Nusantara University

( Samuel, M.T.I. )

Kampus UMN, Scientia Garden | jl. Boulevard Gading Serpong - Tangerang | P. +62 21 5422 0808 | F. +62 21 5422 0800 | www.umn.ac.id

46
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Lampiran 2. Form Bimbingan

Form Bimbingan Internship Report


Program Studi Teknik Komputer
Semester Genap 2021/2022

Nama : Rupertus Herlambang Eko Nugroho


NIM : 00000034220
Angkatan : 2019
Dosen Pembimbing : Dareen Kusuma Halim, S.Kom., M.Eng.Sc.

Meeting Tanggal Jam Keterangan Tanggal Approval


16 Maret
1 17:00 Progress dan Bimbingan Magang 29 Juni 2022
2022
2 21 Juni 2022 15:30 Progress Report 29 Juni 2022
3 22 Juni 2022 15:32 Progress Report 29 Juni 2022
4 23 Juni 2022 16:21 Progress dan Bimbingan Magang 29 Juni 2022
5 24 Juni 2022 16:33 Progress dan Bimbingan Magang 29 Juni 2022
6 27 Juni 2022 16:34 Progress dan Bimbingan Magang 29 Juni 2022
7 28 Juni 2022 15:34 Progress dan Bimbingan Magang 29 Juni 2022
8 29 Juni 2022 16:26 Progress dan Bimbingan Magang 29 Juni 2022

47
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Lampiran 3. Kartu MBKM (MBKM 02)

48
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Lampiran 4. Daily Task

49
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
50
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
51
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
52
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
53
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
54
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
55
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
56
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
57
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
58
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
59
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
60
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Lampiran 5. Verifikasi Laporan MBKM (MBKM 04)

61
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
Lampiran 6. Pengecekan Turnitin Bab (1 - 4)

Rancang Bangun Aplikasi Payment Request PT. IDStar Cipta


Teknologi Menggunakan Appsmith
ORIGINALITY REPORT

3 %
SIMILARITY INDEX
3%
INTERNET SOURCES
0%
PUBLICATIONS
0%
STUDENT PAPERS

PRIMARY SOURCES

1
kc.umn.ac.id
Internet Source 1%
2
docplayer.info
Internet Source <1 %
3
saatsantai.com
Internet Source <1 %
4
library.binus.ac.id
Internet Source <1 %
5
idstar.co.id
Internet Source <1 %
6
Submitted to Academic Library Consortium
Student Paper <1 %
7
Nanda Lailatul Qadriani, Sri Hartati, Anitasa
Dewi. "Pemanfaatan Youtube dan Edpuzzle
<1 %
sebagai Media Pembelajaran Daring Berbasis
Video Interaktif", Jurnal Pemberdayaan
Masyarakat Universitas Al Azhar Indonesia,
2021
Publication

62
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara
8
Submitted to Universitas Pelita Harapan
Student Paper <1 %
9
eprints.upj.ac.id
Internet Source <1 %
10
Rayhan Mahatma Harikusuma, Roby Syaiful
Ubed. "PERAN PT SARANA MULTIGRIYA
<1 %
FINANSIAL DALAM LIKUIDITAS PEMBIAYAAN
PERUMAHAN", Indonesian Rich Journal, 2020
Publication

11
e-repository.perpus.iainsalatiga.ac.id
Internet Source <1 %
12
sir.stikom.edu
Internet Source <1 %
13
repositori.uin-alauddin.ac.id
Internet Source <1 %
14
www.coursehero.com
Internet Source <1 %

Exclude quotes On Exclude matches < 7 words


Exclude bibliography On

63
Rancang Bangun Aplikasi ..., Rupertus Herlambang Eko Nugroho, Universitas Multimedia
Nusantara

Anda mungkin juga menyukai