BAB 3
PELAKSANAAN KERJA MAGANG
3.1 Kedudukan dan Organisasi
Magang Merdeka Track 1 yang dilaksanakan selama kurang lebih 5 bulan dari 15 Februari 2023 hingga 16 Juni 2023 ini, penulis diberi tanggung jawab sebagai web programmer. Selama menjalani masa kegiatan kerja magang, penulis sudah melakukan Jobdesk sebagai web programmer yaitu menjadi full stack web programmer yang dapat membuat aplikasi yang dapat digunakan, dalam hal ini aplikasi tersebut adalah Helpdesk Ticketing berbasis web dan mendapatkan bimbingan dari Bapak Yuniawan agar sesuai dengan kebutuhan dan desain. Beberapa kewajiban tugas yang perlu dilaksanakan oleh penulis antara lain adalah ; Menyelesaikan aplikasi, Melakukan demo aplikasi dan konsultasi dengan supervisor agar aplikasi ini sesuai kebutuhan, dan membantu tim Produksi (tim IT) atau tim Makrketing yang membutuhkan bantuan..
3.2 Tugas yang Dilakukan
Selama Pelaksanaan kerja magang sebagai Web Programmer, tugas dan tanggung jawab adalah sebagai berikut :
• Membuat aplikasi helpdesk ticketing berbasis web menggunakan Bootstrap danCodeignitersebagai objektif utama dalam kegiatan magang ini.
• Membantu tim marketing dalam pengeditan web wordpress dengan menggunakanHTMLdanCSS.
• Membantu tim produksi untuk membuat templateemailmenggunakanHTML dan CSS
3.3 Uraian Pelaksanaan Magang
Pelaksanaan kerja magang diuraikan seperti pada Tabel 3.1.
Tabel 3.1. Pekerjaan mingguan yang dilakukan selama periode magang berlangsung
Minggu Kegiatan
Minggu Ke - Pekerjaan yang dilakukan
1 Perkenalan pelaksana kerja magang di PT. Integra Teknologi Solusi dan briefing project yang akan dikerjakan selama magang oleh supervisor, mencoba beberapa aplikasi helpdesk ticketing yang ada di web, dan mencoba membuat aplikasi ticketing dari plugin yang ada di wordpress..
2 Riset mengenai project helpdesk ticketing yang akan dikerjakan, memulai pembuatan project, penginstallan aplikasi serta aset-aset yang dibutuhkan, dan pembuatan tampilan UI aplikasi.
3 Melanjutkan pengerjaan aplikasi dari bagian UI dan backend, mempersiapkan database yang dibutuhkan, dan menyiapkan template adminlte dari Bootstrap sebagai tampilan utama website.
4 Mendownload aset-aset yang dibutuhkan untuk membuat tampilan web lebih menarik, menyertakan css pendukung untuk tampilan website, dan sembari melanjutkan UI dan backend aplikasi.
5 Mengerjakan CRUD tabel tiket agar pengguna dapat memproses tiket yang kemudian akan ditangani oleh admin dan sembari melanjutkan UI dan backend aplikasi.
6 Melanjutkan UI dan backend aplikasi, demo aplikasi kepada supervisor, dan saran penambahan fitur-fitur yang dibutuhkan . 7 Melanjutkan pengerjaan UI dan backend aplikasi.
8 Bug/Error fixing dan Checking terhadap aplikasi dan sembari melanjutkan UI dan backend aplikasi.
9 Membuat tabel CRUD pada beberapa halaman aplikasi agar user dapat dengan mudah memproses informasi pribadi mereka dan sembari melanjutkan UI dan backend aplikasi.
10 Membuat update terhadap tampilan website sesuai dengan yang sudah dikonsultasikan dengan supervisor, dan sembari melanjutkan UI dan backend aplikasi.
11 Proses pembuatan fitur-fitur baru pada halaman landing page untuk non-user.
Lanjut halaman berikutnya
Tabel 3.1 Pekerjaan mingguan yang dilakukan selama periode magang berlangsung
Minggu Kegiatan
12 Pembuatan fitur knowledge base untuk tiket-tiket yang sudah tuntas, agar pengguna dapat melihat apakah keluhan merekam sudah pernah dibahas sebelumnya.
13 Pengecekan dan bug/error terdapat aplikasi yang ada di website dan sembari melanjutkan UI dan backend aplikasi.
14 Membuat fitur tiket instan dengan fungsi SMTP email Codeigniter agar user yang belum mendaftar akunnya, tetap dapat menggunakan aplikasi dan sembari melanjutkan UI dan backend aplikasi.
15 Melanjutkan fitur-fitur baru dan tampilan aplikasi yang belum selesai, dan memperbaiki error ataupun bug yang ditemukan.
16 Membantu tim marketing mengubah halaman kontak website wordpress Integra menggunakan HTML dan CSS, dan sembari melanjutkan UI dan backend aplikasi.
17 Checking dan Bug/Error terdapat aplikasi yang ada di website, melanjutkan UI dan backend aplikasi, dan meeting dengan client untuk membahas kinerja aplikasi inOffice.
18 Melanjutkan UI atau backend yang masih error, dan membantu tim produksi membuat template email dengan HTML dan CSS, dan mengupload aplikasi ke server PT. Integra Teknologi Solusi.
19 Finishing aplikasi dan melanjutkan fitur-fitur yang masih error.
20 Penutupan magang di PT. Integra Teknologi Solusi dan penyerahan aplikasi manajemen proyek karyawan ke client.
3.4 Pembuatan aplikasi
Adapun proses implementasi pembuatan website meliputi pembuatan database, coding pembuatan UI aplikasi, serta coding backend aplikasi untuk menghubungkan UI dan database.
3.4.1 Database aplikasi
Database adalah data-data yang saling dihubungkan dan dirancang dengan tujuan memenuhi keperluan informasi daripada sebuah organisasi [3]. Database
yang digunakan pada aplikasi ini adalah MariaDB. MariaDB merupakan turunan dari dari MySQL [4] , sehingga memiliki kemiripan dengan MySQL. Terdapat juga PHPMyadmin yang mempermudah proses administrasi data kedatabaseyang dioperaasikan oleh pembuat aplikasi melalui visual platform yang berjalan berupa browser [5]. Gambar berikut adalah tampilan database aplikasi, menggunakan mariadb diakses melalui localhost/phpmyadmin.
Gambar 3.1. Database aplikasi helpdesk ticketing
Pada gambar 3.1 adalah database aplikasi helpdesk ticketing, di dalamnya terdapat 6 tabel yang nantinya akan dihubungkan dengan tampilan UI aplikasi, sehingga pengguna dapat melihat dan memproses data mereka.
Berikut salah satu contoh tampilan tabel di database, yaitu tabel detail tiket
Gambar 3.2. Tabel Detail Tiket
3.4.2 Antarmuka (UI) aplikasi
Pada antarmuka (UI) aplikasi yang baik perlu adanya keseimbangan antara estetika dan interaktivitas [6]. Perlu adanya desain yang baik agar pengguna dapat menikmati tampilan web beserta fungsionalitasnya. Berikut adalah tampilan antarmuka (UI) dari beberapa halaman di aplikasi helpdesk ticketing, dibuat menggunakan framework Bootstrap (HTML, CSS, Javscript). Pemilihan framework Bootstrap didasari oleh kemudahan implementasi Bootstrap untuk menghasilkan dan mentransformasi tampilan sebuah web tanpa harus mengeluarkan usaha yang besar pada code, style, ataupun scriptnya [7].
Gambar 3.3 merupakan tampilan landing page dari aplikasi helpdesk ticketing. Landing page merupakan salah satu bagian penting dari sebuah website, oleh karena itu meningkatkan dan mengoptimalkan landing page adalah hal yang esensial dalam membangun sebuah aplikasi berbasis web [8]. Pada landing page terdapat beberapa fitur. Fitur-fitur yang ada pada landing page diantaranya adalah : Tiket instan dimana pengguna bisa mengirim tiket tanpa harus mendaftar akun atau login. Knowledge base yang dibuat menggunakan fitur plugin dari jQuery yang berguna untuk menghasilkan tabel interaktif dengan beberapa fitur seperti search, pagination, sort, dan fitur lainnya [9], dimana pada tabel tersebut pengguna dapat melihat keluhan-keluhan yang sudah tuntas sehingga pengguna bisa melihat apakah keluhan yang sedang dialaminya sudah pernah dibahas atau belum tanpa perlu login. Help adalah form yang berisi tutorial singkat bagaimana cara menggunakan aplikasi helpdesk ticketing. Pada gambar dapat terlihat bagaimana tombol-tombol dari navbar pada landing page memiliki icon, itu dapat dicapai dengan menggunakan Bootstrap dan dikombinasikan dengan font awesome yang bisa dipanggil dengan menggunakan style prefix dan nama dari icon tersebut [10].
Gambar 3.3. Halaman Landing Page
Gambar 3.4 adalah tampilan halaman yang akan muncul setelah pengguna login ke aplikasi, yaitu halaman dashboard dari sisi user, di halaman ini terdapat tombol yang berisikan info tiket pengguna dan juga tabel knowledge base.
Gambar 3.4. Halaman Dashboard
Gambar 3.5 adalah tampilan fitur utama dari aplikasi helpdesk ticketing, yaitu halaman proses tiket, di halaman ini terdapat tombol tambah tiket yang jika ditekan akan memunculkan form agar pengguna dapat mengisi informasi keluhannya, lalu icon mata yang berfungsi untuk membawa pengguna ke halaman detail tiket dimana pengguna dapat melihat detail dari tiket yang terdiri dari rincian keluhan tiket tersebut, tanggal submit tiket, dan file pendukung dari tiket.
Gambar 3.5. Halaman Proses Tiket
Gambar 3.6 adalah adalah tampilan halaman cetak tiket dimana user dapat menentukan rentang tanggal dan saat user menekan print, akan diarahkan ke halaman baru yang berisi tiket-tiket yang sudah tuntas (gambar 3.7) dimana terdapat pilihan untuk print atau print as pdf.
Gambar 3.6. Cetak Tiket
Gambar 3.7. Cetak Tiket
3.5 Kendala dan Solusi yang Ditemukan
Berikut adalah uraian kendala dan solusi selama pengerjaan aplikasi helpdesk ticketingPT. Integra Teknologi Solusi;
3.5.1 Kendala Saat Pengerjaan
1. Keterbatasan menggunakan dalam proses belajar menggunakan bahasa pemrograman baru sepertiCodeigniter
2. Keterbatasan menggunakan aplikasi baru seperti filezilla dan mysql workbench
3.5.2 Solusi atas Kendala yang ditemukan
1. Memperbanyak riset dan belajar mandiri menggunakan sumber-sumber yang ada (youtube, google, w3school, dll).
2. Melihat tutorial yang tersedia di google dan bertanya dengan rekan kerja dan rekan magang.
