Anda di halaman 1dari 74

RANCANG BANGUN WEBSITE BUDGETING PLANNING SYSTEM

PADA PT MULTIMEDIA DIGITAL NUSANTARA

MAGANG

Diajukan sebagai salah satu syarat untuk memperoleh


Gelar Sarjana Komputer (S.Kom.)

Leonardo Martine
00000033749

PROGRAM STUDI INFORMATIKA


FAKULTAS TEKNIK DAN INFORMATIKA
UNIVERSITAS MULTIMEDIA NUSANTARA
TANGERANG
2023
RANCANG BANGUN WEBSITE BUDGETING PLANNING SYSTEM
PADA PT MULTIMEDIA DIGITAL NUSANTARA

MAGANG

Diajukan sebagai salah satu syarat untuk memperoleh


Gelar Sarjana Komputer (S.Kom.)

Leonardo Martine
00000033749

PROGRAM STUDI INFORMATIKA


FAKULTAS TEKNIK DAN INFORMATIKA
UNIVERSITAS MULTIMEDIA NUSANTARA
TANGERANG
2023

i
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
PERNYATAAN TIDAK MELAKUKAN PLAGIAT

Dengan ini saya yang bertanda tangan di bawah ini:


Nama : Leonardo Martine
NIM : 00000033749
Program Studi : Informatika
Fakultas : Teknik dan Informatika
Menyatakan bahwa saya telah melaksanakan praktik kerja magang:
Nama perusahaan : PT Multimedia Digital Nusantara
Divisi : IT
Alamat : Jl. Scientia Boulevard, Curug Sangereng, Kec.
Klp. Dua, Kabupaten Tangerang, Banten 15810
Periode magang : 22 Agutus 2022 - 06 Januari 2023
Pembimbing lapangan : Andrew Willis
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, 11 Januari 2023

[meterai Rp10.000,-]

(Leonardo Martine)

ii
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
HALAMAN PERSETUJUAN

Magang dengan judul

RANCANG BANGUN WEBSITE BUDGETING PLANNING SYSTEM


PADA PT MULTIMEDIA DIGITAL NUSANTARA

oleh

Nama : Leonardo Martine


NIM : 00000033749
Program Studi : Informatika
Fakultas : Fakultas Teknik dan Informatika

Telah disetujui untuk diajukan pada

Sidang Ujian Magang Universitas Multimedia Nusantara

Tangerang,

Pembimbing

(Adhi Kusnadi, S.T, M.Si.)


NIDN: 303037304

Ketua Program Studi Informatika,


Digitally signed
by Marlinda
Vasty Overbeek
Date: 2023.01.10
12:51:58 +07'00'

(Marlinda Vasty Overbeek, S.Kom., M.Kom.)


NIDN: 0818038501

iii
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, 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 : Leonardo Martine
NIM : 00000033749
Program Studi : Informatika
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 WEBSITE BUDGETING PLANNING SYSTEM


PADA PT MULTIMEDIA DIGITAL NUSANTARA

Beserta perangkat yang ada (jika diperlukan). Dengan Hak Bebas Royalti Non
eksklusif 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, 11 Januari 2023


Yang menyatakan

Leonardo Martine

iv
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, 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 Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
KATA PENGANTAR

Puji Syukur atas berkat dan rahmat kepada Tuhan Yang Maha Esa, atas
selesainya penulisan laporan Magang ini dengan judul: Rancang Bangun Website
Budgeting Planning System pada PT MULTIMEDIA DIGITAL NUSANTARA
dilakukan untuk memenuhi salah satu syarat untuk mencapai gelar Sarjana/Magister
Komputer Jurusan Informatika Pada Fakultas Teknik dan Informatika Universitas
Multimedia Nusantara. Saya menyadari bahwa, tanpa bantuan dan bimbingan dari
berbagai pihak, 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. Ibu Marlinda Vasty Overbeek, S.Kom., M.Kom., selaku Ketua Program Studi
Informatika Universitas Multimedia Nusantara.

4. Bapak Adhi Kusnadi, S.T, M.Si., sebagai Pembimbing Magang yang


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

5. Kepada Pimpinan Perusahaan Bapak Andrew Willis di PT Multimedia Digital


Nusantara.

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

Tangerang, 11 Januari 2023

Leonardo Martine

vi
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
RANCANG BANGUN WEBSITE BUDGETING PLANNING SYSTEM
PADA PT MULTIMEDIA DIGITAL NUSANTARA
Leonardo Martine

ABSTRAK

Kerja magang ini didasari dengan perkembangan teknologi yang semakin canggih,
membuat para masyarakatpun mulai beralih untuk melakukan aktivitas sehari-
hari, dari yang sebelumnya dilakukan secara offline, menjadi online, terlebih lagi
di bidang website, seperti contohnya proses jual-beli, hingga proses pendataan
keuanganpun dilakukan secara online. Metode yang digunakan selama pelaksanaan
magang adalah metode obeservation, melakukan pengamatan dan pencatatan
mengenai sumber informasi sejelas mungkin sebelum lanjut ke tahap berikutnya,
yaitu tahap pengerjaan. Pelaksanaan kerja magang ini diawali dengan sesi
onBoarding, yang berikutnya pengembangan UMN Merdeka 2.0,lalu proyek
finance dan administrasi dan diakhiri dengan proyek akhir yaitu budgeting planning
system, dengan proses pengerjaan secara menyeluruh baik dari segi frontend
maupun backend sesuai dengan fitur yang sudah dibagi masing-masing, lalu
pembuatan database secara bersama-sama dan tools yang digunakan adalah
Visual Studio Code dan Github, untuk proses pengerjaan masih dalam tahap
pengerjaan, dikarenakan proses pengerjaan dibagi berdasarkan beberapa fitur dan
untuk pengujian dicek berdasarkan fungsi dan tampilan dari setiap fiturnya.

Kata kunci: Budgeting System, Developer,Finance, Teknologi, Website

vii
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Designing a Website Planning Budgeting System in PT MULTIMEDIA
DIGITAL NUSANTARA
Leonardo Martine

ABSTRACT

This internship is based on very fast technological developments and also


increasingly sophisticated, making the community began to switch to perform daily
activities, from those previously done offline, become online, especially in the field
of websites, because through website you can do whatever you want, starting from
selling- buying, even financial data collection is done online, this is of course the one
causing many people to start interested in working as a developer in the website field
because the job prospects are so broad. Work implementation This internship begins
with an onBoarding session, which is followed by UMN development Merdeka 2.0,
then project finance and administration and ends with the final project namely the
budgeting planning system, with a good overall process in terms of frontend and
backend in accordance with the features that have been shared respectively, then
create the database together and the tools used is Visual Studio Code and Github, for
the work process it is still under construction, because the work process is divided
based on several features and for testing it is checked based on the function and
appearance of each feature.

Keywords: Budgeting System, Developer, Finance, Technology, Website

viii
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
DAFTAR ISI

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


PERNYATAAN TIDAK MELAKUKAN PLAGIAT ............................................... ii
HALAMAN PERSETUJUAN ............................................................................... 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 Magang .....................................................................2
1.3 Waktu dan Prosedur Pelaksanaan magang ................................................2
BAB 2 GAMBARAN UMUM PERUSAHAAN ..................................................3
2.1 Sejarah Singkat Perusahaan.......................................................................3
2.2 Visi dan Misi Perusahaan ..........................................................................3
2.2.1 Visi ................................................................................................3
2.2.2 Misi ...............................................................................................3
2.3 Struktur Organisasi Perusahaan .................................................................3
BAB 3 PELAKSANAAN KERJA MAGANG .....................................................6
3.1 Kedudukan dan Organisasi ........................................................................6
3.2 Tugas yang Dilakukan ...............................................................................6
3.2.1 Peran Fitur Evaluasi ......................................................................6
3.2.2 PHP,React.js, Node.js, dan Tailwind ............................................7
3.2.3 Flowchart untuk Fitur Evaluasi pada Merdeka UMN ..................7
3.2.4 Sitemap untuk Fitur Evaluasi pada Merdeka UMN ......................8
3.2.5 Analysis Feature Website untuk Website Merdeka UMN .............9
3.2.6 Wireframe untuk Website Merdeka UMN ..................................11
3.2.7 Peran Fitur Penaganan Kendala ..................................................13
3.2.8 Sitemap Fitur Penaganan Kendala ..............................................13
3.2.9 Wireframe Fitur Penaganan Kendala ..........................................14
3.2.10 Mockup Fitur Penaganan Kendala ..............................................15
3.2.11 SR-BRIDGE ................................................................................16
3.2.12 Sitemap SR-BRIDGE .................................................................17
3.2.13 wireframe SR-BRIDGE ..............................................................17
3.2.14 SR-RAB dan Wireframe SR-RAB ................................................18
3.2.15 Responsive Login Page,Navbar, dan Sidebar ............................20
3.2.16 database SR-RAB ........................................................................23
3.2.17 Login, Registrasi, Grouping........................................................24
3.2.18 Profile User, Edit Profile User ....................................................29
3.3 Uraian Pelaksanaan Magang ...................................................................33
3.4 Pengujian Fitur Website SR-RAB ...........................................................37
3.5 Kendala dan Solusi yang Ditemukan.......................................................38
3.5.1 Kendala yang ditemukan pada saat melakukan studi
independen ..................................................................................38

ix
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
3.5.2
Solusi atas Kendala yang Ditemukan pada saat melakukan
studi independen .........................................................................39
BAB 4 SIMPULAN DAN SARAN ....................................................................40
4.1 Kesimpulan..............................................................................................40
4.2 Saran ........................................................................................................40
DAFTAR PUSTAKA .................................................................................................41

x
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
DAFTAR GAMBAR

Gambar 2.1 Struktur Organisasi PT MDN atau Multimedia Digital


Nusantara ....................................................................................4
Gambar 3.1 Bagian 3 - flowchart . . . . . . . . . . . . . . . . . . . . . 7
Gambar 3.2 Bagian 3 - sitemap . . . . . . . . . . . . . . . . . . . . . 9
Gambar 3.3 Bagian 3 - Student Counseling Meeting . . . . . . . . . . . 10
Gambar 3.4 Bagian 3 - Pre Exam Report Review . . . . . . . . . . . . 11
Gambar 3.5 Bagian 3 - Student Counseling Meeting . . . . . . . . . . . 12
Gambar 3.6 Bagian 3 - Pre Exam Report Review . . . . . . . . . . . . 12
Gambar 3.7 Bagian 3 - Penanganan Kendala . . . . . . . . . . . . . . 14
Gambar 3.8 Bagian 3 - Penanganan Kendala . . . . . . . . . . . . . . 15
Gambar 3.9 Bagian 3 - Penanganan Kendala . . . . . . . . . . . . . . 15
Gambar 3.10 Bagian 3 - Flowchart SR-BRIDGE . . . . . . . . . . . . . 16
Gambar 3.11 Bagian 3 - Sitemap SR-BRIDGE . . . . . . . . . . . . . . 17
Gambar 3.12 Bagian 3 - Wireframe SR-BRIDGE . . . . . . . . . . . . . 18
Gambar 3.13 Bagian 3 - Loginpage SR-RAB . . . . . . . . . . . . . . . 19
Gambar 3.14 Bagian 3 - NavbarSidebar SR-RAB . . . . . . . . . . . . . 19
Gambar 3.15 Bagian 3 - Profileuser dan Editprofileuser SR-RAB . . . . 19
Gambar 3.16 Bagian 3 - Login Page . . . . . . . . . . . . . . . . . . . . 20
Gambar 3.17 Bagian 3 - Responsive Login . . . . . . . . . . . . . . . . 21
Gambar 3.18 Bagian 3 - Navbar,Sidebar . . . . . . . . . . . . . . . . . 22
Gambar 3.19 Bagian 3 - Navbar,Sidebar . . . . . . . . . . . . . . . . . 22
Gambar 3.20 Bagian 3 - Navbar,Sidebar . . . . . . . . . . . . . . . . . 23
Gambar 3.21 Bagian 3 - Database SR-RAB . . . . . . . . . . . . . . . . 24
Gambar 3.22 Bagian 3 - User Registration . . . . . . . . . . . . . . . . 25
Gambar 3.23 Bagian 3 - Admin Site . . . . . . . . . . . . . . . . . . . . 26
Gambar 3.24 Bagian 3 - Models User . . . . . . . . . . . . . . . . . . . 26
Gambar 3.25 Bagian 3 - Forms Sign Up . . . . . . . . . . . . . . . . . . 27
Gambar 3.26 Bagian 3 - New User . . . . . . . . . . . . . . . . . . . . 27
Gambar 3.27 Bagian 3 - Login . . . . . . . . . . . . . . . . . . . . . . . 28
Gambar 3.28 Bagian 3 - Grouping . . . . . . . . . . . . . . . . . . . . 28
Gambar 3.29 Bagian 3 - Profile User . . . . . . . . . . . . . . . . . . . 29
Gambar 3.30 Bagian 3 - Profile User Views . . . . . . . . . . . . . . . . 30
Gambar 3.31 Bagian 3 - Context . . . . . . . . . . . . . . . . . . . . . 31
Gambar 3.32 Bagian 3 - Edit Profile . . . . . . . . . . . . . . . . . . . 32
Gambar 3.33 Bagian 3 - Edit Profile Views . . . . . . . . . . . . . . . . 33
Gambar 3.34 Bagian 3 - Web Testing . . . . . . . . . . . . . . . . . . . 38

xi
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
DAFTAR TABEL

Tabel 3.1 Pembelajaran yang dilakukan setiap minggu selama


pelaksanaan Magang ................................................................34
Tabel 3.1 Proses pengerjaan yang dilakukan selama pelaksanaan
magang(Lanjutan) ....................................................................35
Tabel 3.1 Proses pengerjaan yang dilakukan selama pelaksanaan
magang(Lanjutan) ....................................................................36
Tabel 3.1 Proses pengerjaan yang dilakukan selama pelaksanaan
magang(Lanjutan) ....................................................................37

xii
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
DAFTAR LAMPIRAN

Lampiran 1. Form Bimbingan................................................................................41


Lampiran 2. MBKM01 ..........................................................................................43
Lampiran 3. MBKM02 ..........................................................................................44
Lampiran 4. MBKM03 ..........................................................................................45
Lampiran 5. MBKM04 ..........................................................................................57
Lampiran 6. Turnitin ..............................................................................................58

xiii
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
BAB 1
PENDAHULUAN

1.1 Latar Belakang Masalah

Di era 4.0 ini perkembangan teknologi semakin cepat dan juga canggih,
dimana masyrakat dituntut untuk terus mengikuti perkembangan teknologi tersebut,
bahkan menurut data dari We Are Social, pengguna internet di Indonesia mencapai
205 juta jiwa pada januari 2022, dimana angka tersebut meningkat pesat selama
5 tahun belakangan , sebab pada tahun 2017 tercatat bahwa pengguna internet di
Indonesia hanyalah 136 juta jiwa. Itu semua terjadi karena beberapa aktivitas yang
awalnya hanya tersedia offline berkembang menjadi online mulai dari permainan,
transaksi jual-beli, bahkan proses pendataan keuangan secara online seperti melalui
website. Menurut Hidayat, Website adalah kumpulan halaman yang digunakan
untuk menampikan informasi teks, gambar, animasi, suara atau gabungan dari
semuanya, baik yang bersifat statis ataupun dinamis yang membentuk satu
rangkaian bangunan yang saling terkait, yang masing masing dihubungkan dengan
jaringan jaringan halaman[1]
Website sendiri hadir di dunia sejak tahun 1991 dan mulai dapat
digunakan secara umum pada tahun 1993, yang lebih dikenal dengan WWW atau
kepanjangannya adalah World Wide Web, WWW ini tidak lain merupakan kumpulan
situs web yang telah terhubung antara komputer melalui internet. Pengaruh dari
perkembangan teknologi juga berefek pada banyak perusahaan,terlebih sekarang
semua hal dapat dilakukan secara online dan jauh lebih efesien dibandingkan secara
offline, seperti pendaatan atau pengolahan uang perusahaan. Banyak perusahaan
yang mulai megolah data keuangannya melalui website, karena jauh lebih efektif
dan juga guna untuk menghindari human error dan menurut Pusphitasar, website
diimplementasikan dan digunakan sebagai cara dalam mempermudah penyebaran
informasi yang sekarang ini banyak gunakan oleh siapapun.[2]
PT Multimedia Digital Nusantara menjadi salah satu perusahaan yang
mulai mengembangkan pendataan atau pengelolaan keuangan perusahaan secara
online atau melalui website dengan tujuan untuk membantu pengelolaan keuangan
perusahaan agar lebih terdata dan juga terstruktur dengan baik, selain itu
keuntungan untuk mulai melakukan pendataan dan pengelolaan keuangan secara
online adalah guna untuk mengurangi kemungkinkan terjadinya human error

1
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
karena perhitungan juga sudah dilakukan oleh sistem, akan tetapi tidak dapat
dipastikan 100% selalu benar, tetapi dapat meminimalisir kemungkinan terjadinya
kesalahan dalam proses perhitungan dan tentunya sangat menghemat waktu dalam
proses pengerjaan. pengembangan website budgeting system planning ini dibuat
dengan framework django dengan bahasa python.

1.2 Maksud dan Tujuan Magang

Kegiatan magang yang dilakukan di PT Multimedia Digital Nusantara


adalah sebagai berikut, yaitu:

1. Mengembangkan hard skill dan soft skill , agar dapat berkembang


dengan lebih baik lagi.

2. Membangun relasi dan juga memperluas koneksi dengan dengan seluruh


pihak yang terlibat dalam kerja magang ini.

Sedangkan untuk tujuan yang ingin dicapai dalam pelaksanaa m agang


ini adalah membangun website Budgeting System sebagai alat pendukung untuk
membantu pendataan keuangan perushaaan.

1.3 Waktu dan Prosedur Pelaksanaan magang

Magang dilaksanakan selama kurang 5 bulan, dimulai sejak tanggal 22


Agustus 2022 sampai dengan 06 Januari 2023 sebagai developer. Prosedur
pelaksanaan magang adalah sebagai berikut:

1. Magang dilakukan secara Work From Home.

2. Proses pengerjaan dilakukan secara fleksibel, dengan deadline selama 1


minggu

3. Pengerjaan dibagi kedalam beberapa kelompok, yang terdiri dari 6 orang.

2
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
BAB 2
GAMBARAN UMUM PERUSAHAAN

2.1 Sejarah Singkat Perusahaan

PT MultiMedia Digital Nusantara berdiri pada tahun 2017, dengan Bapak


Teddy Surjianto sebagai seorang eksekutif di dalam Kompas Gramedia telah
membuat UMN Pictures. Pada awalnya PT Multimedia Digital Nusantara memiliki
nama UMN Pictures yang termasuk ke dalam salah satu lembaga usaha dari
Universitas Multimedia Nusantara. Pada awalnya UMN Pictures memiliki peran
untuk membantu tim Universitas Multimedia Nusantara dalam hal animasi serta
desain dan pada tahun 2020 perushaan UMN Pictures semakin berkembang dan
mulai merambah ke beberapa divisi seperti UMN Consulting, UMN Finance
dan juga UMN Technology, berikutnya keempat divisi ini bergabung menjadi
satu dibawah naungan PT. Multimedia Digital Nusantara. UMN Pictures sendiri
memiliki peran dalam hal Animasi dan Game Development, lalu UMN Consulting
yang berfokus dibagian riset pada PT Multimedia Digital Nusantara. Selanjutnya
UMN Finance yang berfungsi untuk mengatur keungan serta investasi dalam PT
Multimedia Digital Nusantara. Dan terakhir UMN Technology yang berfokus
dalam pengembangan Augmented Reality (AR) dan juga Virtual Reality (VR).

2.2 Visi dan Misi Perusahaan

2.2.1 Visi

Menjadi Salah Satu Perusahaan Teknologi Yang Memberdayakan Ekosistem


Digital Indonesia.

2.2.2 Misi

Membuat Inovasi progresif solusi teknologi bespoke untuk memungkinkan


dan meningkatkan para pemangku kepentingan perusahaan.

2.3 Struktur Organisasi Perusahaan

Struktur organisasi perusahaan merupakan tingkatan atau jabatan bagi


para pekerja di dalam suatu perusahaan tersebut, mulai dari chairman sebagai

3
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
petinggi atau pemilik perusahaan, hingga seorang intern, untuk struktur organisasi
perusahaan pada PT Merdeka Digital Nusantara, seorang IT intern memiliki
tugas untuk merancang website Merdeka 1.0 dan website Merdeka 2.0, mulai
dari flowchart, sitemap, hingga wireframe dan jgua mockup mengguna figma,
tugas berikutnya adalah merancang website SR-Bridge, dengan membuat flowchart,
sitemap dan juga wireframe dan yang terakhir adalah merancang dan membangun
webiste planning budgeting system atau SR-RAB, dengan membuat backend dan
juga frontend yang diakhiri dengan proses testing untuk fitur-fitur yang diminta oleh
bapak Andrew Willis, selaku supervisi peserta magang.

Gambar 2.1. Struktur Organisasi PT MDN atau Multimedia Digital Nusantara


Sumber: (Andrew Willis, 2022)

Struktur Organisasi PT MDN :


1. Chairman
Chairman adalah pemilik jabatan atau kekuasaan tertinggi pada suatu
perusahaan.

4
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
2. Komisaris
Jabatan yang ditunjuk atau dipilih untuk mengawasi seluruh kegiatan
perusahaan, terutama yang berkaitan dengan kebijakan dan pengelolaan
perusahaan.

3. Direktur
Jabatan yang memiliki tugas untuk memimpin, mengelola dan
mengarahkan Perseroan sesuai dengan tujuan Perseroan serta terus
meningkatkan efisiensi dan efektivitas Perseroan.

4. Manager
Seseorang yang bertugas untuk mengarahkan, memimpin, melakukan
koordinasi, serta melakukan berbagai pengembangan dalam rangka
mencapai tujuan perusahaan.

5. IT Intern/Peserta Magag
Posisi jangka pendek yang memberi siswa, mahasiswa, atau bahkan
fresh graduate kesempatan untuk mendapatkan keterampilan dan
pengalaman dalam lingkungan kerja langsung.

6. Project Manager
Jabatan ini menjalankan proses manajemen sebuah proyek.Bertugas
mengatur, merencanakan, dan melaksanakan proyek sesuai batasan
yang sudah ditentukan, seperti anggaran dan waktu.

7. Staff
Jabatan ini merupakan peran pembantu, untuk membantu ketua dalam
mengerjakan tugasnya.

5
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
BAB 3
PELAKSANAAN KERJA MAGANG

3.1 Kedudukan dan Organisasi

Proses pelaksanaan magang di PT Multimedia Digital Nusantara


dilaksanakan berdasarkan kerja sama antara pihak PT Multimedia Digital Nusantara
dengan Universitas Multimedia Nusantara sebagai seorang developer Intern.
Pelaksanaan magang dimulai dengan sesi OnBoarding. Sesi ini menjelaskan aturan,
arah pengerjaan proyek, dan juga struktur pengerjaan proyek. Pelaksanaan kegiatan
dilaksanakan secara work form home dan sedangkan untuk meeting diadakan
secara offline, sedangkan Discord, dan WhatsApp biasanya digunakan untuk media
komunikasi secara online dan juga menggunakan github untuk menggabungkan
pengerjaan tugas masing-masing anggota.

3.2 Tugas yang Dilakukan

3.2.1 Peran Fitur Evaluasi

Tugas pertama yang diberikan adalah untuk mempelajari peran dari fitur
evaluasi pada website UMN Merdeka, sebelum proses pembelajaran mengenai fitur
evaluasi, terdapat juga sesi OnBoarding pada sesi ini, terdapat beberapa aturan dan
juga penjelasan mengenai struktur dan arah tujuan magang. Berikutnya memahami
dan mempelajari bagamainana cara fitur evaluasi ini dapat dikembangkan dengan
lebih baik lagi pada website Merdeka UMN, dengan fungsionalitas yang baik
dan mudah dimengerti oleh beberapa pihak, baik bagi mahasiswa, department,
maupun instansi, berdasarkan user guide untuk lecturer maupun company yang
sudah diberikan oleh pihak perusahaan.

6
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
3.2.2 PHP,React.js, Node.js, dan Tailwind

Tugas kedua setelah proses pembelajaran untuk memahami bagaimana


kerja fitur evaluasi, berikutnya adalah menentukan bahasa pemograman yang akan
digunakan, disertai dengan framework dan juga framework CSS, setelah diputuskan
maka bahasa pemograman yang akan dipakai adalah PHP, sedangkan untuk
frontend menggunakan react.js, untuk backend menggunakan node.js, dan yang
terakhir untuk framework CSS menggunakan tailwind.

3.2.3 Flowchart untuk Fitur Evaluasi pada Merdeka UMN

Tugas ketiga yang diberikan adalah memahami dan mempelejari business


requirementyang diberikan oleh pihak perusahaan, berikutnya setelah selesai
mepelajarinya,membuat flowchart untuk website Merdeka UMN pada bagian fitur
evaluasi, berdasarkan dengan business requirement yang diberikan oleh pihak PT
Merdeka Digital Nusantara, pembuatan flowchart dibuat dengan menggunakan
website lucid app.

Gambar 3.1. Bagian 3 - flowchart

Berikut adalah proses atau berlajannya skema untuk flowchart fitur evaluasi,
sebelum dapat masuk ke fitur evaluasi, terdapat 3 roles yaitu user atau mahasiswa

7
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
lalu supervisi perusahaan dan juga dosen, pada halaman user, terdapat tampilan total
working hours dan rubrik penilaian mahasiswa, mahasiswa juga dapat melakukan
input working hours dan pada akun user akan mendapatkan notifikasi mengenai jam
kerja yang masih kurang dari 400 Jam sebelum Ujian Tengah Semester dan juga jam
kerja sebelum 800 Jam sebelum UAS, Sedangkan untuk supervisi perushaan juga
menampilkan total working hours untuk mahasiswa, akan tetapi supervisi nantinya
akan memberikan penilaian mengenai hasil kerja magang untuk memenuhi syarat
Ujian Tengah Semester dan juga Ujian Akhir Semester mahasiswa,yang berikutnya
akan dikirim kepada pihak department, berikutnya untuk halaman department, pada
halaman ini, pihak department akan melakukan update untuk menampilkan hasil
penilaian dari supervisi dan berikutnya pihak department juga melakukan input
penilaian untuk pihak mahasiswa.

3.2.4 Sitemap untuk Fitur Evaluasi pada Merdeka UMN

Tugas keempat yang diberikan adalah mempelajari dan memahami cara


membuat sitemap, berikutnya, setelah selesai langgsung membuat sitemap
berdasarkan flowchart yang sudah dibuat sebelumnya, menggunakan website yang
sama seperti saat membuat flowchart yaitu lucid app

8
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.2. Bagian 3 - sitemap

pada gambar 3.2 bagian 2 dalah tampilan sitemap berdasarkan flowchart


yang sudah dibuat sebelumnya. Dimana terdapat tiga user dengan tampilan page
yang berbeda sesuai dengan roles yang diberikan,user, instansi, department.

3.2.5 Analysis Feature Website untuk Website Merdeka UMN

Tugas kelima adalah membuat analysis feature untuk Student Counseling


Meeting dan juga analysis feature untuk Pre Exam Report Review

9
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.3. Bagian 3 - Student Counseling Meeting

Pada gambar 3.3 bagian 3 terdapat tampilan untuk halaman student


counseling meeting yang berfungsi untuk meninjau bimbingan yang sudah diinput
oleh mahasiswa. Pada halaman ini terdapat menu View Adviesees untuk membuka
halaman My Advisees yang berfungsi untuk menampilkan daftar mahasiswa yang
dibimbing. Berikutnya ada tombol View untuk berpindah ke halaman Student
Counseling Review. Kolom checklist berfungsi untuk memilih bimbingan yang
akan ditinjau. Kolom Advisor Comments untuk meninjau hasil bimbingan dan
Tombol Approve Selected dan Reject Selected untuk melakukan menyetujui dan
juga menolak bimbingan.

10
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.4. Bagian 3 - Pre Exam Report Review

Pada gambar 3.4 bagian 3 terdapat tampilan untuk halaman My Advisees


menampilkan daftar mahasiswa yang dibimbing dan pada kolom Pre Exam Report
Review di halaman My Advisees, terdapat tombol View untuk berpindah ke
halaman Pre Exam Report Review dan terdapat tombol download untuk melakukan
download pada file laporan yang telah diupload oleh mahasiswa. Field Remarks
digunakan untuk memberikan catatan pada approval yang akan dilakukan. Field
ini wajib diisi jika laporan akan direject dan tombol Approve dan Reject untuk
melakukan approval pada laporan yang di upload oleh mahasiswa.

3.2.6 Wireframe untuk Website Merdeka UMN

Tugas berikutnya adalah membuat Wireframe untuk Student Counseling


Meeting dan juga Wireframe untuk Pre Exam Report Review.

11
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.5. Bagian 3 - Student Counseling Meeting

Pada gambar 3.5 bagian 3 terdapat tampilan untuk halamanstudent


counseling meeting yang berfungsi untuk meninjau bimbingan yang sudah diinput
oleh mahasiswa. Pada page ini juga terjadi proses persetujuan dan juga penolakan
terhadap hasil dari counseling meeting yang dilakukan oleh mahasiswa.

Gambar 3.6. Bagian 3 - Pre Exam Report Review

Pada gambar 3.6 bagian 3 terdapat tampilan untuk halaman Pre Exam Report
Review page ini menampilkan halaman untuk hasil laporan yang sudah dipisah

12
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
perbabnya oleh mahasiswa, dan terdapat proses persetujuan dan juga penolakan
mengenai proses hasil laporan magang yang sudah dikirim oleh mahasiswa.

3.2.7 Peran Fitur Penaganan Kendala

Tugas berikutnya adalah mempelajari dan memahami beberapa fitur baru


pada website UMN Merdeka 2.0 yang salah satunya adalah fitur penanganan
kendala, fitur penangan kendala berfungsi seperti FAQ atau yang biasa dikenal
dengan Frequently Asked Question untuk mengatasi pertanyaan-pertanyaan
terhadap suatu masalah yang dialami oleh pengguna website, selain terdapat
beberapa pertanyaan yang disertai dengan jawaban, kelebihan fitur ini adalah
dapat melakukan sesi tanya jawab langgsung kepada admin sehingga dapat sangat
membantu user yang sedang kesusahan untuk mengatasi permasalahan yang sedang
dialaminya.

3.2.8 Sitemap Fitur Penaganan Kendala

Tugas berikutnya adalah membuat sitemap untuk fitur penanganan kendala


pada website Merdeka UMN 2.0 berdasarkan business requirement yang sudah
diberikan oleh pihak perusahaan.

13
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.7. Bagian 3 - Penanganan Kendala

Pada gambar 3.7 terdapat sitemap untuk fitur penanganan kendala, dimana
terdapat fungsionalitas fitur ini mirip seperti FAQ, dimana terdapat beberapa
pertanyaan dan juga jawaban mengenai beberapa masalah yang sering muncul atau
dialami oleh pengguna dan terdapat juga ticket yang berguna untuk pertanyaan
lebih detail mengenai masalah yang sedang dihadapi dan lebih jelasnya apabila
pertanyaan serta jawaban yang terdapat pada FAQ kurang jelas, pada sesi ini
pengguna dapat memberikan pertanyaan lebih detail yang nantinya akan dijawab
oleh admin, selain itu terdapat juga history pengguna saat menggunakan fitur
penaganan kendala.

3.2.9 Wireframe Fitur Penaganan Kendala

Tugas berikutnya adalah membuat wireframe untuk beberapa fitur tambahan


untuk website Merdeka UMN dan salah satunya adalah membuat wireframe untuk
fitur penanganan kendala, menggunakan figma.

14
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.8. Bagian 3 - Penanganan Kendala

Pada gambar 3.8 terdapat wireframe untuk fitur penanganan kendala dimana
terdapat halaman awal yaitu FAQ pada halaman ini menampilkan fitur search
FAQ dan search ticket dan menampilkan beberapa pertanyaan dan juga jawbanya,
berikutnya ada halaman untuk pengguna yang ingin bertanya lebih detail pada
halaman ini akan terjadi proses komunikasi antara pengguna dan juga admin untuk
memabahas dan memberi solusi terhadap masalah yang sedang dialami.

3.2.10 Mockup Fitur Penaganan Kendala

Tugas berikutnya adalah membuat mockup untuk beberapa fitur tambahan


untuk website Merdeka UMN dan salah satunya adalah membuat mockup untuk
fitur penanganan kendala, menggunakan figma.

Gambar 3.9. Bagian 3 - Penanganan Kendala

15
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Pada gambar 3.9 terdapat mockup yang dikembangkan berdasarkan
wireframe yang sudah dibuat pada gambar 3.6, tujuan utama dibuatnya mockup
untuk memberikan gambaran nyata kepada klien tentang konsep atau desain
produk yang sedang dibuat. Dengan adanya mockup dapat mempermudah skema
berjalannya aplikasi, garis-garis panah pada gambar 3.7 menunjukan flow
berjalanya aplikasi.

3.2.11 SR-BRIDGE

Tugas berikutnya adalah mempelajari proyek baru atau disebut dengan SR-
BRIDGE, proyek ini berhubungan dengan finance dan proses administrasi dengan
proyek PT Multimedia Digital Nusantara, atau dapat dikatakan proyek ini berada
dibawah naungan PT Multimedia Digital Nusantara,

Gambar 3.10. Bagian 3 - Flowchart SR-BRIDGE

16
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Pada gambar 3.10 merupakan flowchart dari pruek SR-BRIDGE dimana
terdapat proses login lalu akan langgsung menampilkan project list page, user juga
dapat melihat detail project dan create new project, tidak hanya itu user juga dapat
melakukan update terhadap project yang sudah dibuat sebelumnya.

3.2.12 Sitemap SR-BRIDGE

Tugas berikutnya setelah membuat flowchart adalah membuat sitemap untuk


proyek SR-Bridge

Gambar 3.11. Bagian 3 - Sitemap SR-BRIDGE

Berikut adalah sitemap untuk proyek SR-BRIDGE dimana terdapat login


dengan CAS atau yang lebih dikenal dengan Central Authentication Service, lalu
terdapat juga page project list, project detail, page untuk membuat proyek baru
serta menambah client.

3.2.13 wireframe SR-BRIDGE

Tugas terakhir untuk proses pengerjaan proyek SR-BRIDGE adalah


membuat wireframe dan untuk pengerjaan wireframe sesuai dengan pembagian
tugas masing-masing, berikut adalah page untuk project detail dan edit project

17
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.12. Bagian 3 - Wireframe SR-BRIDGE

Pada gambar 3.12 bagian 3 terdapat page untuk project detail page untuk
menampilkan seluruh informasi proyek dan juga terdapat edit project page yang
muncul melalui pop up dengan menampilkan informasi proyek yang mau diedit
atau diperbaharui informasinya.

3.2.14 SR-RAB dan Wireframe SR-RAB

Proyek terakhir yang diberikan adalah membuat website budgeting planning


system dengan tujuan untuk mengatur keuangan perusahaan, selain itu website
budgeting planning system ini juga berguna untuk mengatur anggaran perusahaan
agar terdata dengan baik, dan guna untuk mengurangi kemungkinan human error
yang sering terjadi, karena pendataan dan perhitungan dilakukan oleh sistem.
Pembuatan SR-RAB ini dibuat menggunakan bahasa pemograman python dengan

18
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
framework Django, untuk Framework CSS menggunakan Bootstrap5.

Gambar 3.13. Bagian 3 - Loginpage SR-RAB

Berikut adalah tampilan login page untuk SR-RAB, dan harus dibuat secara
responsive.

Gambar 3.14. Bagian 3 - NavbarSidebar SR-RAB

Berikut adalah tampilan navbar dan juga sidebar untuk SR-RAB dimana
terdapat perbedaan pada home antara user yang sudah login dan belum login, dan
harus dibuat secara responsive.

Gambar 3.15. Bagian 3 - Profileuser dan Editprofileuser SR-RAB

19
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Berikut adalah tampilan profile user dan juga edit profile user untuk SR-
RAB, pada halaman ini user dapat melihat data diri user dan melakukan edit profile.

3.2.15 Responsive Login Page,Navbar, dan Sidebar

Tugas berikutnya adalah membuat front-end untuk halaman login page,


navbar dan juga sidebar dengan menggunakan HTML, selain itu menggunakan
framework CSS juga yaitu bootstrap5 dan disertai dengan CSS yang dibuat secara
manual, agar tampilan lebih presisi

Gambar 3.16. Bagian 3 - Login Page

Pada gambar 3.16 bagian 3 menampilkan halaman login yang dibuat


menggunakan HTML, CSS dan Bootstrap5 dan url diatas menandakan bahwa
halaman login sudah diintegrasikan ke dalam framework Django.

20
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.17. Bagian 3 - Responsive Login

Pada gambar 3.17 bagian 3 menampilkan halaman login yang sudah

21
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
responsive dengan menggunakan CSS manual, yaitu menggunakan media query.

Gambar 3.18. Bagian 3 - Navbar,Sidebar

Pada proyek SR-RAB terdapat 2 homepage yang disertai juga dengan navbar
dan sidebar yang berbeda pada saat sebelum dan sesudah user melakukan login, dan
pada gambar 3.18 ini merupakan tampilan untuk homepage untuk user yang belum
melakukan login.

Gambar 3.19. Bagian 3 - Navbar,Sidebar

Berikutnya untuk gambar 3.19 bagian 3 ini, merupakan tampilan navbar


dan sidebar ketika user sudah melakukan login baik itu untuk adminpun akan
menampilkan tampilan yang sama seperti user cuma terdapat beberapa perbedaan
fitur didalamnya dan terdapat juga button dropdown untuk memberikan opsi logout
untuk user.

22
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.20. Bagian 3 - Navbar,Sidebar

Berikutnya untuk gambar 3.20 bagian 3 ini, merupakan tampilan navbar dan
sidebar secara responsive, dengan menggunakan media query.

3.2.16 database SR-RAB

Tugas berikutnya adalah membuat database untuk proyek SR-RAB


menggunakan draw.io, pembuatan database ini bertujuan untuk mendapat
gambaran mengenai data yang akan digunakan untuk mengerjakan proyek SR-
RAB untuk database django sendiri sudah terdapat didalam framework itu sendiri,
pengguna hanya perlu membuat modelnya.

23
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.21. Bagian 3 - Database SR-RAB

Pada gambar 3.21 bagian 3, merupakan database dari proyek SR-RAB,


terdapat beberapa entitas , seperti software, catalogue, catalogue type, tenaga kerja,
budget, client, hardware, comments dan user, dengan masing-masing atribut di
dalamnya.

3.2.17 Login, Registrasi, Grouping

Tugas beriktunya adalah membuat backend untuk login dan juga registrasi
user, pada bagian ini, sistem login harus sudah dapat membedakan baik itu user
maupun admin, karena masing-masing roles memiliki permissions yang berbeda.

24
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.22. Bagian 3 - User Registration

Pada gambar 3.22 merupakan tampilan untuk admin yang ingin menambah
user, hal ini sama seperti sistem registrasi, hanya saja melewati admin dan hanya
admin yang dapat menambah user. Pada halaman ini terdapat opsi role yang
nantinya berguna untuk membedakan seorang pengguna itu adalah user atau admin.

25
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.23. Bagian 3 - Admin Site

Pada gambar 3.23 merupakan tampilan untuk admin site yang merupakan
bagian dari framework django pada halaman ini, terdapat database dan kita dapat
melihat grouping untuk role user maupun admin.

Gambar 3.24. Bagian 3 - Models User

Pada gambar 3.24 bagian 3 merupakan tampilan untuk modesl user,


pembuatan model, merupakan langkah pertama sebelum membuat forms dan juga
views, karena models sangat diperlukan , yang nantinya akan dipanggil ke dalam
views dan juga forms.

26
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.25. Bagian 3 - Forms Sign Up

Pada gambar 3.25 bagian 3 merupakan tampilan SignUpForm yang


dipanggil pada views untuk new user, tujuan dibuatnya forms sendiri mempermudah
pengguna, karena data akan langgsung terhubung masuk ke dalam database, dan
tentu ini mempermudah serta menghemat waktu pengerjaan.

Gambar 3.26. Bagian 3 - New User

Pada gambar 3.26 bagian 3 merupkan tampilan code untuk add new
user, pada bagian views pemanggilan data menggunakan post dan get,dimana
variabel yang yang dinamai data1 merupakan variabel untuk mendapatkan role, dan
berikutnya yang dicek adalah jika pengisian form sudah benar, dan proses get yang

27
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
dicek berdasarkan variabel data1 sudah berhasil juga, maka proses penambahan
pengguna berdasarkan role sudah berhasil.

Gambar 3.27. Bagian 3 - Login

Pada gambar 3.27 merupakan code pada views untuk login, sama seperti
registrasi, views login juga menggunakan method get dan post, pada view login
yang dicek adalah username dan password pengguna, pengguna akan dicek, apa
sudah terautentikasi atau belum, apabila belum terautentikasi, maka tidak akan
dapat melakukan proses login dan bila sudah terautentikasi, maka pengguna dapat
masuk ke index sesuai dengan rolenya dan models yang digunakan adalah models
user.

Gambar 3.28. Bagian 3 - Grouping

pada gambar 3.28 bagian 3, merupakan tampilan code untuk melakukan


grouping sidebar dan navbar, diawali dengan if user is authenticated,
yang menunjukan bahwa paramaternya adalah seorang pengguna yan sudah

28
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
terautentikasi, yang dapat masuk dan if user.groups.all.0.name == user adalah
untuk membagi berdasarkan role dimana, seorang user akan masuk kedalam section
yang sudah dibatasi saja, sebaliknya juga dengan admin.

3.2.18 Profile User, Edit Profile User

Tugas berikutnya adalah membuat backend dan frontend untuk profile user
dan edit profile user page, pada halaman ini akan menampilkan informasi pengguna
atau user dan juga halaman untuk melakukan edit informasi pengguna.

Gambar 3.29. Bagian 3 - Profile User

Pada gambar 3.29 bagian 3 merupakan tampilan untuk user profile yang
sudah dibuat secara responsive juga, halaman ini menampilkan informasi user
mulai dari nama lengkap, email, kota, nomor telepon, tanggal lahir dan juga waktu

29
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
registrasi. Terdapat juga icon pensil untuk mengarahkan ke halaman edit profile.

Gambar 3.30. Bagian 3 - Profile User Views

Pada gambar 3.30 pada bagian 3, merupakan tampilan code untuk


memanggil halaman profile user, untuk memanggilnya menggunakan email yang
terdapat pada models user, dan context memiliki fungsi untuk memberi nama value
sesuai dengan yang terdapat pada database.

30
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.31. Bagian 3 - Context

Pada gambar 3.31 bagian 3, merupakan tampilan code untuk memanggil


data sesuai dengan yang terdapat di dalam models user sehingga dapat
memunculkan data seperti pada gambar 3.29 bagian 3.

31
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.32. Bagian 3 - Edit Profile

Pada gambar 3.32 bagian 3 merupakan tampilan edit profile user yang sudah
dibuat secara responsive pada halaman ini bertujuan apabila seorang user ingin
melakukan edit atau update terhadap informasi data dirinya.

32
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.33. Bagian 3 - Edit Profile Views

Berikutnya adalah membuat views untuk page edit profile user, hal pertama
adalah memanggil models user, lalu memanggil UserUpdateForm sehingga setiap
input dapat langgsung masuk ke dalam database dan terdapat context untuk
menampilkan informasi pengguna sebelumnya juga.

3.3 Uraian Pelaksanaan Magang

Pelaksanaan Magang dimulai pada tanggal 22 Agustus 2022 hingga 6


Januari 2023, proses pelaksanaan magang dilakukan secara online atau Work For
Home, dan untuk waktu pengerjaan adalah fleksibel, tetapi biasanya diadakan
mulai pukul 08.00 hingga 17.00. Proses pengerjaan magang diawali dengan proses
pembelajaran terlebih dahulu, yang beirkutnya diberikan tugas dengan deadline
selama satu minggu. Sedangkan untuk proses komunikasi dengan supervisi
dilakukan melalui grup whatsapp. Pada proses pengerjaan magang, banyak terjadi
perubahaan terhadap tugas yang dikerjakan, hingga akhirnya terdapat tugas akhir,
dengan proses pengerjaan sesuai dengan fitur yang sudah dibagi. Pelaksanaan kerja
magang diuraikan seperti pada Tabel 3.1

33
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Tabel 3.1. Pembelajaran yang dilakukan setiap minggu selama pelaksanaan Magang

Minggu Ke - Pembelajaran yang dilakukan


1
• Briefing Mengenai peraturan serta tugas-tugas yang akan
dikerjakan selama proses magang

• Mempelajari cara kerja fitur evaluasi

• Mempelajari cara membuat dan mengembangkan fitur


evaluasi untuk website Merdeka 2.0 Universitas Multimedia
Nusantara

2
• Melanjutkan pembelajaran untuk pengembangan fitur
evaluasi

• Menentukan bahasa pemograman, framework, serta CSS


Framework yang akan digunakan

• Mempelajari framework React js

3
• Membuat flowchart untuk fitur evaluasi

• Melanjutkan pembelajaran framework React js

4
• Membuat sitemap untuk fitur evaluasi

• Melanjutkan pembelajaran framework React js

5
• Melakukan konsolisasi sitemap untuk fitur evaluasi dengan
supervisi

• Membuat fitur analytics pada fitur evaluasi

• Melanjutkan pembelajaran framework React js

34
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Tabel 3.1. Proses pengerjaan yang dilakukan selama pelaksanaan magang(Lanjutan)

6
• Membuat wireframe untuk fitur evaluasi

• Melanjutkan pembelajaran framework React js

7
• Mempelajari fitur baru yaitu penanangan kendala pada web
Merdeka UMN 2.0

• Melanjutkan pembelajaran framework React js

8
• Mempertajam pemahaman untuk fitur penanganan kendala

• Membuat sitemap untuk fitur penanganan kendala

9
• Membuat wireframe untuk fitur penanganan kendala

10
• Memperbaiki wireframe untuk fitur penanganan kendala

• Membuat mockup untuk fitur penaganan kendala

11
• Mempelajari proyek baru yaitu SR-Bridge

12
• Memperdalam mengenai alur dan skema proyek SR-Bridge

• Membuat flowchart untuk SR-Bridge

35
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Tabel 3.1. Proses pengerjaan yang dilakukan selama pelaksanaan magang(Lanjutan)

13
• Memperbaiki flowchart SR-Bridge

• Membaut sitemap untuk SR-Bridge

14
• Membuat Wireframe untuk SR-Bridge

• Mempelajari framework Django

15
• Memahami dan mempelajari proyek baru SR-RAB

• Membuat wireframe untuk SR-RAB

16
• Membuat halaman login,navbar,sidebar untuk SR-RAB
secara responsive

• Mempelajari framework Django

17
• Membuat database untuk proyek SR-RAB

• Melakukan setup untuk migrasi ke dalam framework django

• Melakukan migrasi dari hard code HTML kedalam


framework django

18
• Mengerjakan fitur login disertai dengan autentikasi

• Mengerjakan fitur registasi/add new user

36
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Tabel 3.1. Proses pengerjaan yang dilakukan selama pelaksanaan magang(Lanjutan)

19
• Mengimplementasikan grouping untuk admin dan user

• Mengimplementasikan grouping untuk navbar dan sidebar

20
• Membuat halaman profile user dan edit profile user secara
responsive

• Mengerjakan fitur profile user

• Mengerjakan fitur edit profile user

3.4 Pengujian Fitur Website SR-RAB

Pengujian website biasanya digunakan untuk mengetes keoptimimalan suatu


fungsi dari website tersebut, memeriksa apakah adanya error dan bug pada salah
satu fungsinya, selain itu memberikan informasi kepada stakeholders dan juga
menetapkan standar kualitas suatu website.

37
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Gambar 3.34. Bagian 3 - Web Testing

Pada gambar 3.34 adalah hasil pengujian fitur untuk membuktikan hasil
optimasi website SR-RAB. Hasil pengujian menunjukan bahwa fitur untuk user
sudah dapat berjalan dengan baik, mulai dari proses login yang sudah dapat berjalan
sesuai dengan data yang dibuat pada saat proses registrasi, berikutnya ada proses
grouping yang sudah dapat berjalan berhasil membuat section baik untuk user dan
juga admin , berikutnya ada profile user dan edit profile user, proses pemanggilan
dan penampilan data dari database juga sudah berhasil, disertai dengan edit dan
update juga sudah sesuai yang diharapkan, meskipun terdapat hasil yang kurang
memuaskan pada fitur registrasi, dimana proses pengisian phone number masih
terbatas dan harus sesuai dengan contoh yang diberikan, berikutnya pihak dari
PT MDN juga akan membantu dalam proses pengerjaan, sehingga website yang
dihasilkan lebih optimal.

3.5 Kendala dan Solusi yang Ditemukan

3.5.1 Kendala yang ditemukan pada saat melakukan studi independen :

1. Kurangnya pengetahuan pada framework django sehingga menhambat proses


pengerjaan.

38
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
2. Komunikasi cukup terkendala pada saat proses magang berlanggsung.

3. Proses pengerjaan proyek akhir masih mengalami kendala, karena anggota


tim memiliki kesibukan masing-masing.

3.5.2 Solusi atas Kendala yang Ditemukan pada saat melakukan studi
independen :

1. Mengeksplor dan mempelejari lagi mengenai framework django.

2. berinisiatif untuk mengempulkan setiap masalah yang ditemukan, sehingga


dapat disampaikan, pada meeting berikutnya.

3. Berusaha untuk membagi waktu dan juga memprioritaskan hal yang lebih
penting, dan tetap mengerjakan kewajiban yang dimiliki.

39
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
BAB 4
SIMPULAN DAN SARAN

4.1 Kesimpulan

Proses pengerjaan proyek SR-RAB, atau website planning budgeting system


masih dalam tahap pengerjaan, proses pengerjaan backend dan frontend dibagi
sesuai dengan fitur yang sudah ditentukan, untuk proses pengerjaan proyek
menggunakan bahasa pemograman python dengan framework django dan CSS
framework menggunakan Bootstrap5. Tampilan pada website dibuat semenarik
mungkin, dan untuk fungsi-fungsi pada website juga dibuat secara efektif dan
efesien, sehingga user dapat dengan mudah dan nyaman menggunakannya.

4.2 Saran

Terdapat beberapa saran yang ditemukan selama proses magan di PT


Multimedia Digital Nusantara, yang sekiranya dapat menjadi pertimbangan bagi
masa depan PT Multimedia Digital Nusantara sendiri, berikut beberapa saran yang
ditemukan :

1. Pemberian tugas yang kurang spesifik dan deadline yang tidak sesuai, karena
beberapa kali terjadi pemberian tugas yang kurang spesifik, lalu di luar jam
kerja magang dan waktu pengumpulan yang kurang sesuai.

2. Menambah waktu untuk proses pengerjaan proyek akhir, karena proses


pengerjaan proyek akhir cukup singkat dan harus menyesuaikan waktu
dengan angggota tim lainnya.

3. Terdapat juga saran untuk penambahan fitur change password, agar lebih
aman baik dari sisi user, karena pada saat ini, hanya ada fitur edit profile.

40
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
DAFTAR PUSTAKA

[1] H. Rahmat, Cara Praktis Membangun Website Gratis : Pengertian Website.


PT Elex Media Komputindo Kompas.

[2] M. I. a. y. Rudiana Dewi, Indah Pusphitasari, “Disain sistem informasi


websitejurusan komputerisasi akuntansi d-iii pada perguruan tinggi raharja,”
vol. 05, no. 01, p. 277–282, 2017.

41
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Lampiran 1. Form Bimbingan

Form Bimbingan Internship Report


Program Studi Informatika
Semester Gasal 2022/2023

Nama : Leonardo Martine


NIM : 00000033749
Angkatan : 2019
Dosen Pembimbing : Adhi Kusnadi, S.T., M.Si.

Meeting Tanggal Jam Keterangan Tanggal Approval


Membahas kriteria-kriteria yang diperlukan
27 untuk penulisan laporan, deadline
1 September 14:10 pengerjaan laporan, dan juga menceritakan 17 Oktober 2022
2022 proses pengerjaan magang yang sedang
dilakukan
Pengumpulan untuk progress pengerjaan
11 Oktober laporan magang bab1, yang berisikan latar
2 10:12 17 Oktober 2022
2022 belakang dari proses pengerjaan laporan
magang
Perubahan judul laporan magang beserta
01 Januari
3 10:54 isinya, dikarenakan peruabhan projek yang 01 Desember 2022
2023
terjadi pada tempat magang
19 Desember Memperbaharui judul laporan, bab1 yang
4 16:30 21 Desember 2022
2022 berisikan latar belakang dan juga bab 2
Membahas proses pengerjaan laporan
21 Desember
5 07:20 untuk mulai menyelesaikan bab 3 hingga 21 Desember 2022
2022
selesai dengan judul yang baru.
02 Januari Revisi untuk abstrak, latar belakang dan
7 10:38 05 Januari 2023
2023 kesimpulan
Melakukan revisi untuk sumber struktur
organisasi dengan menambahkan
06 Januari penjelasan, berikutnya memberikan
8 10:25 10 Januari 2023
2023 penjelasan tugas it intern, dan mengubah
serta memperbaiki font untuk flowchart
dan sitemap .
09 Januari Revisi terakhir, untuk memperbaiki dan
9 22:14 10 Januari 2023
2023 merapihkan lampiran

42
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Lampiran 43.
MBKM01

MBKM-01 Cover Letter MBKM Internship Track 2

Tangerang, January 04th 2023

No : 58/UMN/TI/Internship Track 2/IX/2022


Subject : Student's Application for MBKM Internship Track 2

Dear. Head of Human Resource Department

PT Multimedia Digital Nusantara

Universitas Multimedia Nusantara’s providing the MBKM Internship Track 2, 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 2, in the company to learn
solving problems based on knowledge that gained in campus, to link and match Internship Track
2 program with the curriculum as preparation for their future careers.

We pleased to inform the student with the following details:

Student ID : 00000033749
Student Name : Leonardo Martine
Academic Program : Informatics
Email : leonardo.martine@student.umn.ac.id
Mobile Phone 6281317171896

Company will be received the student as an employee and Internship Track 2 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 2 program from
your company. We thank you and look forward to hear employment acceptance letter of our student’s.

Sincerely,

Head of Departement Informatics Program


Multimedia Nusantara University

Digitally signed
by Marlinda
Vasty Overbeek
Date: 2023.01.10
12:52:18 +07'00'

( Marlinda Vasty Overbeek, S.Kom., M.Kom. )

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

43
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Lampiran 44.
MBKM02

MBKM-02 MBKM Internship Track 2 Card

MBKM INTERNSHIP TRACK 2 CARD

Name : Leonardo Martine Student ID : 00000033749

Address : jl Dr sitanala no 67 Mobile Phone : 6281317171896

MBKM Internship Track 2 Acceptance Letter No: - Letter Date : 04-08-2022

Advisor's Name : Adhi Kusnadi, S.T., M.Si.

Company Name : PT Multimedia Digital Nusantara

Company Address : Jl. Scientia Boulevard, Curug Sangereng, Kec. Klp. City : Tangerang
Dua, Kabupaten Tangerang, Banten 15810 Postal Code: 15810

Company Website : https://www.mmdn.co.id/ Company Phone : 021 5422 0808

Supervisor's Name : Andrew Willis Supervisor's Position : Manager of UMN


Supervisor's Phone : 081285670346 Technology
Supervisor's Email : Andrew.willis@mmdn.co.id Supervisor's Ext. : -

Department : IT Position : IT

Acceptance Date : 22-08-2022

This MBKM Internship Track 2 Card has been completed with my real information and can be accounted for. I am
ready to be disqualified if the data given are incorrect.

Tangerang, October 10th 2022 Supervisor’s signature &


Student’s signature Company stamp

Leonardo Martine Andrew Willis

44
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Lampiran 45.
MBKM03

MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Approved at 21
Briefing mengenai visii, misi
1 22/08/2022 08:00 17:00 Oktober 2022
pengerjaan melalui zoom
05:31

Approved at 21
2 23/08/2022 08:00 17:00 Membahas sistem pengerjaan evaluasi Oktober 2022
05:31

Approved at 21
Membagi kelompok untuk divisi yang
3 24/08/2022 08:00 17:00 Oktober 2022
mengerjakan fitur evaluasi
05:31

Membahas mengenai skema pengerjaan, Approved at 21


4 25/08/2022 08:00 17:00 seperti penyesuaian jam, weekly Oktober 2022
meeting dan sebagainya 05:31

Approved at 21
Mendiskusikan jenis bahasa pemograman
5 26/08/2022 08:00 17:00 Oktober 2022
yang akan digunakan nantinya.
05:31

Approved at 21
Dibagikan bussiness requiretment dan
6 29/08/2022 08:00 17:00 Oktober 2022
juga alur untuk pembuatan flowchart
05:31

Mulai membuat flowchart, dan membahas Approved at 21


7 30/08/2022 08:00 17:00 alur serta skema requiement yang Oktober 2022
tersedia 05:31

Melanjutkan pengerjaan flowchart, Approved at 21


8 01/09/2022 08:00 17:00 untuk membahas lebih pasti lagi Oktober 2022
mengenai skema alur flowchart 05:31

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

45
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Approved at 21
9 02/09/2022 08:00 17:00 Memastikan dan mengumpulkan Oktober 2022
pengerjaan flowchart
05:31

Memastikan pengerjaan dan juga Approved at 21


10 05/09/2022 08:00 17:00 membahas segala masalah teknis mulai Oktober 2022
dari kelompok, pengerjaan, jadwal
05:31
meeting dan sebagainya.

Approved at 21
11 06/09/2022 08:00 17:00 mulai mengerjakan sitemap Oktober 2022
05:31

Approved at 21
12 07/09/2022 08:00 17:00 Mengecek apakah kebutuhan yang Oktober 2022
diperkulan untuk mengerjakan sitemap
05:31

Approved at 21
13 08/09/2022 08:00 17:00 Memastikan kembali pengerjaan sitemap Oktober 2022
05:31

Approved at 21
14 09/09/2022 08:00 17:00 crosscheck kembali hasil sitemap yang Oktober 2022
telah dibuat
05:31

Approved at 21
15 12/09/2022 08:00 17:00 Mulai mempelajari react js dan juga Oktober 2022
node js
05:31

Approved at 21
16 13/09/2022 08:00 17:00 mengulang kembali hasil pembelajaran Oktober 2022
mengenai react js
05:31

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

46
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Approved at 21
17 14/09/2022 08:00 17:00 memperdalam materi node js Oktober 2022
05:31

Approved at 21
18 15/09/2022 08:00 17:00 mempelajari lebih dalam mengenai Oktober 2022
komponen yang terdapat pada react js
05:31

Approved at 21
19 16/09/2022 08:00 17:00 memperlajari komponen-komponen yang Oktober 2022
terdapat pada node js
05:31

Approved at 21
20 19/09/2022 08:00 17:00 merevisi kembali hasil sitemap Oktober 2022
05:31

Approved at 21
21 20/09/2022 08:00 17:00 crosscheck dan mengumpulkan hasil Oktober 2022
sitemap yang baru
05:32

Approved at 21
22 21/09/2022 08:00 17:00 mulai mempelajari bahasa django Oktober 2022
05:32

Approved at 21
23 22/09/2022 08:00 23:00 memperdalam basic dari bahasa django November 2022
dan mulai melakukan beberapa tutorial
11:08

mempelajari libraries yang ada di Approved at 21


24 23/09/2022 08:00 20:00 django dan mulai mengerjakan basic November 2022
untuk membuat projek dengan django 11:08

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

47
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Approved at 21
self learning, mulai membuat CRUD
25 24/09/2022 08:00 17:00 November 2022
singkat menggunakan django
11:08

Approved at 21
belajar mengenai database dalam
26 26/09/2022 08:00 17:00 November 2022
django
11:08

Approved at 21
Memperdalam sintak-sintak yang
27 25/10/2022 08:00 17:00 November 2022
terdapat pada bahasa django
11:08

mengesklplor lebih jauh lagi mengenai Approved at 21


28 28/09/2022 08:00 18:00 keefektifan serta kelebihan dan November 2022
kekurangan dari bahasa django 11:08

Approved at 21
29 29/09/2022 08:00 17:00 Mempelajari sitemap MKBKM November 2022
11:08

Approved at 21
Mendiskusikan serta menentukan
30 30/09/2022 08:00 19:00 November 2022
sitemap yang akan dibuat untuk MBKM
11:08

Menentukan bahan yang akan dimasukan Approved at 21


31 01/10/2022 08:00 19:00 dalam proses pembuatan project November 2022
requirement 11:08

masih melanjutkan diskusi mengenai Approved at 21


32 02/10/2022 08:00 17:00 kejelasan dan ketentuan requiremtn November 2022
yang akan dimasukkan 11:08

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

48
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Mendiskusikan kembali mengenai Approved at 21


33 03/10/2022 08:00 19:00 ketentuan requirement yang sudah November 2022
dibuat 11:08

Menambahkan beberapa ketentuan untuk Approved at 21


34 04/10/2022 08:00 22:00 memperjelas dalam proses pengerjaaan November 2022
nantinya 11:08

Mengurangi beberapa ketentuan yang Approved at 21


35 05/10/2022 08:00 19:00 memang kurang jelas dalam proses November 2022
menentukan project requirement 11:08

mendiskusikan kembali, apakah proses Approved at 21


36 06/10/2022 08:00 17:00 pengerjaan sudah maksimal atau masih November 2022
perlu melakukan revisi 11:08

proses pengerjaan untuk menentukan Approved at 21


37 07/10/2022 08:00 17:00 project requirement selesai, dan November 2022
melakukan proses pengumpulan 11:08

Melakukan rapat offline untuk Approved at 21


38 12/10/2022 08:00 20:00 menentukan serta mendiskusikan arah November 2022
pengerjaan projek bersama pihak UMN 11:08

Approved at 21
menjelaskan hasil rapat dan perubahan
39 13/10/2022 08:00 17:00 November 2022
arah pengerjaan project
11:08

Approved at 21
Pengerjaan tugas yang baru, mendesign
40 14/10/2022 08:00 17:00 November 2022
figma
11:08

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

49
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Rapat mengenai tugas baru yaitu Approved at 21


41 17/10/2022 08:00 20:00 membuat Bussiness requierment, sistem November 2022
analis dan juga UI/UX 11:08

Approved at 21
Mulai mendiskusikan untuk mengerjakan
42 18/10/2022 08:00 21:00 November 2022
feature Guide untuk user dan lecturer
11:08

Mengerjakan user guide untuk company,


Approved at 21
dibagi per point dikerjakan oleh 1
43 19/10/2022 08:00 18:00 November 2022
orang yang akan disusun di
11:08
spreadsheet

Masi melanjutkan proses pengerjaan Approved at 21


44 20/10/2022 08:00 19:00 feature code, dengan penjelasn fitur November 2022
di setiap pagenya 11:08

Approved at 21
Proses pengerjaan untuk lecturer
45 21/10/2022 08:00 17:00 November 2022
masih belanjut
11:08

Approved at 21
46 24/10/2022 08:00 17:00 Proses revisi pengerjaan feature code November 2022
11:08

Approved at 21
47 26/10/2022 08:00 17:00 Menentukan tema project berikutnya November 2022
11:08

Approved at 21
48 28/11/2022 08:00 20:00 Mulai membuat prototype di figma November 2022
11:08

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

50
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Approved at 21
49 27/10/2022 08:00 20:00 Masih melanjutkan pembuatan protype November 2022
di figma
11:08

Approved at 21
50 31/10/2022 08:00 20:00 Menyusun kembali coloring untuk November 2022
design
11:08

Approved at 21
51 01/11/2022 14:00 19:00 Mulai melakukan polling untuk November 2022
menentukan projek beriktunya
11:08

Approved at 21
52 02/11/2022 08:00 18:00 mulai menyusun desain menggunakan November 2022
figma yang dibagi untuk beberapa page
11:08

masih melanjutkan pembuatan desain Approved at 21


53 03/11/2022 08:00 17:00 untuk projek yang nantinya akan November 2022
dikerjaakan 11:08

Approved at 21
54 04/11/2022 08:00 17:00 melakukan finishing untuk setiap page November 2022
11:08

Approved at 21
55 07/11/2022 08:00 17:00 Mencatat setiap fitur yang masih November 2022
kurang jelas arahnya dan fungsinya
11:08

Approved at 21
56 08/11/2022 08:00 19:00 Membuat table database untuk projek November 2022
yang akan dikerjakan
11:08

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

51
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Approved at 21
57 09/11/2022 08:00 19:00 Merevisi pengerjaan dalam pembuatan November 2022
database
11:08

Approved at 21
58 10/11/2022 08:00 17:00 Membuat Flowchart untuk projek yang November 2022
sedang dikerjakan
11:08

Approved at 21
59 11/11/2022 08:00 17:00 Menyelesaikan flowchart yang sedang November 2022
dikerjakan
11:08

Approved at 22
60 12/11/2022 08:00 20:00 Mulai membagi tugas untuk membuat UI Desember 2022
SR Bridge
16:33

Approved at 22
61 13/11/2022 08:00 20:00 Menentukan framework dan juga CSS Desember 2022
framework yang akan dipilih
16:33

Approved at 22
62 14/11/2022 08:00 19:00 Mulai mengerjakan UI pada bagian Desember 2022
login form
16:33

Approved at 22
63 15/11/2022 08:00 17:00 Menyelesaikan tampilan UI untuk login Desember 2022
page
16:33

Approved at 22
64 16/11/2022 08:00 20:00 Membuat Navbar untuk setiap page Desember 2022
16:33

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

52
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Approved at 22
Menyelesaikan pengerjaan Navbar untuk
65 17/11/2022 08:00 17:00 Desember 2022
setiap page
16:33

Approved at 22
Membuat Feature details untuk UMN
66 18/11/2022 08:00 20:00 Desember 2022
Merdeka 2.0
16:33

Merevisi pembuatan feature details Approved at 22


67 19/11/2022 08:00 20:00 UMN Merdeka 2.0 agar sesuai dengan Desember 2022
wireframe yang sudah diberikan 16:33

Menyelesaikan revisi untuk feature Approved at 22


68 20/11/2022 08:00 20:00 details dan juga membuat sitemap Desember 2022
untuk Merdeka 2.0 16:33

Menyelesaikan revisi untuk feature Approved at 22


69 21/11/2022 08:00 20:00 details dan juga membuat sitemap Desember 2022
untuk Merdeka 2.0 16:33

Approved at 22
Melanjutkan revisi untuk feature
70 22/11/2022 08:00 20:00 Desember 2022
merdeka 2.0
16:33

Approved at 22
Mulai mengerjakan front end untuk
71 23/11/2022 08:00 20:00 Desember 2022
projek SR-Bridge
16:33

Approved at 22
72 24/11/2022 08:00 20:00 Menentukan CSS dan bahasa pemograman Desember 2022
16:33

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

53
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Approved at 22
73 25/11/2022 08:00 20:00 Perubahan project, kembali Desember 2022
mengerjakan SR-Bridge
16:33

Approved at 22
74 29/11/2022 08:00 17:00 Merencanakan pengerjaan projek Desember 2022
16:33

Approved at 22
75 30/11/2022 08:00 20:00 Mulai mempelajari BR yang diberikan Desember 2022
16:33

Approved at 22
76 01/12/2022 08:00 21:00 Masih mempelajari BR yang diberikan Desember 2022
16:33

Approved at 22
77 02/12/2022 08:00 20:00 Menelaah BR yang diberikan agar dapat Desember 2022
membuat wireframe
16:33

self learning mulai memplejari django Approved at 22


78 03/12/2022 08:00 20:00 mulai dati set up dan juga Desember 2022
pengaplikasiinya menggunakan vscode 16:33

Approved at 22
79 04/12/2022 08:00 19:00 Masih melanjutkan pembelajaran untuk Desember 2022
django
16:33

Approved at 22
80 05/12/2022 08:00 20:00 Mencoba membuat projek sederhana Desember 2022
menggunakan django
16:33

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

54
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Approved at 22
81 06/12/2022 08:00 20:00 Masih melanjutkan proses pembuatan Desember 2022
projek sederhana django
16:33

Approved at 22
82 07/12/2022 08:00 20:00 Mulai merencakan pembuatan wireframe Desember 2022
16:33

Approved at 22
83 08/12/2022 08:00 20:00 proses pengerjaan wireframe untuk Desember 2022
planning budge system
16:33

Approved at 22
84 09/12/2022 08:00 20:00 penyelesaian proses pengerjaan Desember 2022
wireframe
16:33

Approved at 22
85 10/12/2022 08:00 22:00 Mulai mengerjakan frontend untuk Desember 2022
login page
16:33

Approved at 22
86 11/12/2022 08:00 22:00 mengerjakan sistem authenticaton dan Desember 2022
multilogin system pada login page
16:33

Approved at 22
87 12/12/2022 08:00 20:00 Membuat sidebar dan juga navbar pada Desember 2022
setiap menu
16:33

Approved at 22
88 13/12/2022 08:00 20:00 Memahami sistem pembuatan login Desember 2022
16:33

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

55
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
MBKM-03 Daily Task - Internship Track 2

Daily Task
STUDENT ID : 00000033749
STUDENT NAME : Leonardo Martine
COMPANY NAME : PT Multimedia Digital Nusantara

Supervisor’s
No Date In Out Duties /Responsibilities
Sign

Approved at 22
89 14/12/2022 08:00 20:00 Mulai mencoba membuat sistem login Desember 2022
menggunakan user authentication
16:33

Approved at 22
90 15/12/2022 08:00 20:00 Membuat model dan juga views untuk Desember 2022
login
16:33

Approved at 22
91 16/12/2022 08:00 20:00 Membuat template global untuk setiap Desember 2022
url setiap page
16:33

Approved at 22
92 17/12/2022 08:00 20:00 menyabungkan login dengan index based Desember 2022
on role user dan juga admin
16:33

Approved at 22
93 18/12/2022 08:00 20:00 membuat user authentication dan juga Desember 2022
logout untuk user
16:33

Notes:

1. Copied Form must be attached in report when registering for exam

In witness whereof the company,

Andrew Willis
Manager of UMN Technology
Please sign along with the Company’s stamp

56
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Lampiran 5. MBKM04

MBKM-04 Verification Form of Internship Report MBKM Internship Track 2

VERIFICATION FORM OF INTERNSHIP REPORT


MBKM INTERNSHIP TRACK 2

Student's Internship Track 2 Advisor

Name : Adhi Kusnadi, S.T., M.Si.

I , who signed below

Name : Andrew Willis

Position : Manager of UMN Technology

Company : PT Multimedia Digital Nusantara

had received, read and approved the Internship Report from

Student ID : 00000033749

Student Name : Leonardo Martine

Period : January 2023

Report Title : Designing a Website Planning Budgeting


System in PT MULTIMEDIA DIGITAL
NUSANTARA

Tangerang 10 Januari 2023 Tangerang 5 Januari 2023


……………… , ………………….. ……………… , …………………..

Adhi Kusnadi, S.T., M.Si. Andrew Willis


Student Advisor Supervisor
Sign along with the Company’s stamp

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

57
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Lampiran 6. Turnitin

Magang_leonardomartine
ORIGINALITY REPORT

8 %
SIMILARITY INDEX
8%
INTERNET SOURCES
1%
PUBLICATIONS
3%
STUDENT PAPERS

PRIMARY SOURCES

1 kc.umn.ac.id
Internet Source 5%
2
Submitted to Institut Teknologi Nasional
Malang
1%
Student Paper

3
www.utakatikotak.com
Internet Source <1 %
4
www.dewaweb.com
Internet Source <1 %
5 journal.nurulfikri.ac.id
Internet Source <1 %
6
eprints.polbeng.ac.id
Internet Source <1 %
7 Submitted to Dewan Perwakilan Rakyat
Student Paper <1 %
8
Submitted to Fakultas Ekonomi Universitas
Indonesia
<1 %
Student Paper

9
e-journal.uajy.ac.id

58
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
Internet Source

<1 %
10
etheses.uin-malang.ac.id
Internet Source <1 %
11
www.scribd.com
Internet Source <1 %
12
digilib.uinsgd.ac.id
Internet Source <1 %
13
kerma.esaunggul.ac.id
Internet Source <1 %
14 repository.unika.ac.id
Internet Source <1 %
15
www.logique.co.id
Internet Source <1 %

Exclude quotes On Exclude matches < 7 words


Exclude bibliography On

59
Rancang Bangun Website Budgeting Planning System..., Leonardo Martine, Universitas
Multimedia Nusantara
HALAMAN PENGESAHAN

Magang dengan judul

RANCANG BANGUN WEBSITE BUDGETING PLANNING SYSTEM


PADA PT MULTIMEDIA DIGITAL NUSANTARA

oleh

Nama : Leonardo Martine


NIM : 00000033749
Program Studi : Informatika
Fakultas : Fakultas Teknik dan Informatika

Telah diujikan pada hari Kamis, 19 Januari 2022


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

Dosen Pembimbing Penguji

(Marlinda Vasty Overbeek, S.Kom., (Michael Wijaya Saputra, S.Kom.,


M.Kom.) M.Sc.)
NIDN: 0818038501 NIDN: 0309069206

Ketua Program Studi Informatika,

(Marlinda Vasty Overbeek, S.Kom., M.Kom.)


NIDN: 0818038501

iv
Rancang Bangun Website Budgeting Planning System ..., Leonardo Martine, Universitas
Multimedia Nusantara

Anda mungkin juga menyukai