T1 672012017 Full text

(1)

Perancangan Aplikasi

Petty Cash

Berbasis

Web

Menggunakan

CodeIgniter

dan

jQuery EasyUI

(Studi Kasus PT Indomarco Prismatama)

Artikel Ilmiah

Diajukan kepada Fakultas Teknologi Informasi

untuk memperoleh Gelar Sarjana Komputer

Peneliti:

Tri Maulana Putra Handoyo (672012017)

Ramos Somya, S.Kom., M.Cs.

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

(2)

(3)

(4)

(5)

Perancangan Aplikasi

Petty Cash

Berbasis

Web

Menggunakan

CodeIgniter

dan

jQuery EasyUI

(Studi Kasus PT Indomarco Prismatama)

Artikel Ilmiah

Oleh:

Tri Maulana Putra Handoyo NIM :672012017

Telah disetujui untuk direview

Tanggal : ……….

Pembimbing

(6)

1

Perancangan Aplikasi

Petty

Cash

Berbasis

Web

Menggunakan

CodeIgniter

dan

jQuery

EasyUI

(Studi Kasus PT Indomarco Prismatama)

1) _{Tri Maulana Putra Handoyo, 2}) _{Ramos Somya}

Fakultas Teknologi Informasi Universitas Kristen Satya Wacana Jl. Diponegoro 52-60, Salatiga 50771, Indonesia

Email: 1) _{672012017@student.uksw.edu,}2) _{ramos.somya@staff.uksw.edu}

Abstract

Indomarco Prismatama Inc. has Petty Cash system which used to help company daily activity. The system desktop based and has several deficiencies, such as an installation trouble, and some specific requirements. This research done in order to developt the Petty Cash system using CodeIgniter framework and jQuery EasyUI. The system was developed using prototyping method. The test results showed that design of Petty Cash application which web based help the Petty Cash management system, and decrease the installation adversity when the application desktop based without leaving user interface of desktop based application characteristic.

Keywords: Petty Cash, PHP, CodeIgniter Framework, jQuery EasyUI, Indomarco Prismatama

Abstrak

PT Indomarco Prismatama memiliki sistem kas kecil (Petty Cash) yang digunakan untuk menunjang kegiatan perusahaan. Sistem ini namun masih berbasis desktop dan memiliki beberapa kekurangan, seperti susahsnya instalasi di cabang serta mengharuskan adanya beberapa requirement khusus. Pada penelitian ini dilakukan pengembangan dari sistem tersebut dengan framework CodeIgniter dan jQuery EasyUI. Sistem dikembangkan menggunakan metode prototyping. Hasil pengujian menunjukkan bahwa perancangan aplikasi Petty Cash yang berbasis web membantu pengelolaan sistem Petty Cash yang ada, dan mengurangi kesulitan instalasi yang ada saat aplikasi masih berbasis desktop tanpa meninggalkan tampilan khas aplikasi dekstop.

Kata Kunci: Petty Cash, PHP, Framework CodeIgniter, jQuery EasyUI, Indomarco Prismatama.

1) _{Mahasiswa Fakultas Teknologi Informasi Jurusan Teknik Informatika, Universitas Kristen Satya}

Wacana Salatiga.

(7)

2 1. Pendahuluan

Teknologi informasi dimanfaatkan oleh banyak pihak untuk menunjang segala aktivitas pada hampir semua aspek kehidupan terutama pada bidang bisnis. Persaingan bisnis perusahaan yang semakin ketat membutuhkan adanya sistem yang baik untuk mendukung dan menunjang aktivitas perusahaan agar tidak tertinggal dengan pesaing-pesaing yang ada. Dibutuhkan sistem yang sudah terkomputerisasi untuk menunjang bisnis pada perusahaan [1].

Indomaret adalah jaringan minimarket yang menyediakan kebutuhan pokok dan kebutuhan sehari-hari. Indomaret sendiri merupakan merk dagang yang dimiliki oleh PT. Indomarco Prismatama. Saat ini Indomaret berkembang pesat dengan jumlah gerai mencapai lebih dari 11.285 gerai yang tersebar di wilayah Indonesia yang didukung dengan sistem informasi teknologi yang andal.

Pengendalian internal yang baik terhadap kas yaitu setiap penerimaan dan pengeluaran harus tercermin dalam rekening koran. Namun demikian, transaksi yang jumlahnya besar seperti penggajian karyawan, pembelian peralatan, dan lain-lain akan lebih aman apabila dilakukan melalui bank. Akan tetapi, pembayaran rutin yang jumlahnya relatif kecil seperti pembayaran uang parkir, pembayaran karcis tol, pembayaran uang bensin dan lain-lain akan kurang efektif apabila dilakukan melalui bank. Agar lebih efektif maka pengeluaran yang terjadi setiap hari dan jumlahnya relatif kecil tersebut perlu disediakan dana khusus yang dibentuk oleh perusahaan. Dana yang disediakan oleh perusahaan untuk membiayai pengeluaran-pengeluaran rutin dengan jumlahnya yang relatif kecil disebut kas kecil atau Petty Cash. Sesuai dengan namanya kas kecil, merupakan akun yang khusus dipergunakan untuk mendanai transaksi-transaksi kecil dan rutin [4].

PT. Indomarco Prismatama sebenarnya sudah memiliki sebuah aplikasi untuk menangani sistem Petty Cash, namun karena masih berbasis dekstop sehingga terdapat kekurangan, mulai dari susahnya instalasi di cabang, dibutuhkannya beberapa requirement khusus (.Net Framework, Crystal Report, dan lain-lain.) bahkan beberapa data yang sering tidak terkirim.

Berdasarkan permintaan user dari PT. Indomarco Prismatama melalui sebuah wawancara, dirancanglah sebuah aplikasi yang memanfaatkan teknologi web. Perancangan dan pengimplementasian program tersebut menggunakan framework CodeIgniter dan jQuery EasyUI, yang berguna untuk membantu meningkatkan kinerja dari kasir guna melancarkan jalannya sistem Petty Cash PT. Indomarco Prismatama. CodeIgniter merupakan framework yang support PHP 4 dan PHP 5, memiliki ukuran yang kecil, dan menerapkan konsep MVC (Model, View, Controller) dengan baik, sedangkan untuk jQuery EasyUI merupakan framework yang digunakan untuk mempercantik tampilan, penulis tidak perlu menuliskan sebuah kode javascript yang panjang untuk membuat layout web atau aplikasi dengan menggunakan jQuery EasyUI ini.

Rumusan masalah dalam penelitian ini adalah bagaimana merancang aplikasi

Petty Cash berbasis web menggunakan CodeIgniter dan jQuery EasyUI. Batasan masalah yang ada dalam penelitian ini adalah : 1) Aplikasi dibangun dengan basis

web. 2) Aplikasi dibangun dengan menggunakan framework CodeIgniter sebagai

(8)

3

(BKK) dan pembuatan Kas Bon Sementara (KBS) yang masing – masing memiliki fungsi tambah, edit, hapus dan pencetakan laporan (report).

2. Kajian Pustaka

Penelitian mengenai petty cash saat ini mulai banyak dilakukan. Penelitian ini dilatarbelakangi oleh keadaan pencatatan yang dilakukan dengan cara menulis di atas kertas. Salah satu penelitian yang menarik adalah mengenai pembuatan aplikasi

petty cash yang terkomputerisasi sebagai ganti dari sistem pembukuan yang masih manual [1]. Pencatatan terkomputerisasi mampu mencegah kemungkinan aktivitas penggelapan dana yang dapat terjadi ketika menggunakan sistem pencatatan manual. Pentingnya peran sekretaris sebagai salah satu pihak yang menangani keuangan dalam sebuah perusahaan memicu munculnya penelitian mengenai bagaimana cara menangani keuangan perusahaan (petty cash) dari sisi sekretaris. Penelitian ini membahas dengan jelas cara penangangan keuangan perusahaan (petty cash) terutama bagi seorang sekretaris karena keuangan merupakan bagian yang sensitif bagi perusahaan dan membutuhkan penanganan yang baik [4].

Perancangan sistem petty cash berbasis web memerlukan sebuah framework

yang mampu mempermudah pembuatan sistemnya. Pernyataan ini didukung dengan adanya penelitian mengenai bagaimana mengendalikan kios-kios dalam melakukan transaksi, bagaimana mengetahui persediaan masing-masing kios dengan realtime, bagaimana melakukan transformasi barang yang berlebih dan yang kurang antar kios, bagaimana menyediakan kebutuhan barang antar kios sesuai dengan kebutuhan pelanggan dan bagaimana mendapatkan laporan transaksi di setiap kios [6]. Perancangan aplikasi dari penelitian di atas menggunakan framework CodeIgniter.

Penggunaan CodeIgniter sebagai framework yang baik untuk membangun sebuah aplikasi berbasis web, terdapat dalam penelitian pembuatan aplikasi untuk memudahkan proses survei dan pengolahan datanya. Aplikasi pengumpulan data survei ini dibuat menggunakan bahasa pemrograman PHP dengan framework CodeIgniter, javascript, serta basis data MySQL untuk penyimpanan data [7].

Berdasarkan penelitian-penelitian yang pernah dilakukan terkait petty cash, maka dilakukan penelitian yang membahas tentang perancangan dan pengimplementasian pettycash berbasis web. Aplikasi yang dibangun menggunakan

framework CodeIgniter yang berfungsi untuk membangun sistem dan framework jQuery EasyUI yang berfungsi untuk mempercantik tampilan usernya. Penelitian ini diharapkan dapat membantu dan memudahkan kinerja dari kasir sehingga dapat memberikan hasil yang optimal.

Hal yang membedakan antara penelitian ini dengan penelitian sebelumnya adalah adanya penggunaan dua framework yang masih jarang dikombinasikan. Penggunaan framework jQuery EasyUI masih jarang digunakan untuk saat ini, sehingga penulis ingin mencoba mengombinasikannya dengan framework CodeIgniter yang sudah populer.

(9)

4

melalui dana kecil adalah pengeluaran-pengeluaran yang jumlah tidak besar, pengeluaran-pengeluaran lain dilakukan dengan bank dengan cek [1].

PHP, singkatan dari Hypertext Preprosesor, merupakan sebuah scripting language yang digunakan untuk menghasilkan halaman web. PHP bermula dari sebuah scripting yang dikembangkan oleh Rasmus Lerdorf pada tahun 19951, kemudian dari bahasa tersebut dikembangkan menjadi PHP (PHP 3.0) oleh Andi Gutmans dan Zeev Suraski pada tahun 1997. Bentuk ini merupakan bentuk yang mirip seperti digunakan sekarang ini. Tahun 1998, mereka berdua mulai mengembang core dari mesin PHP yang dikenal dengan nama Zend Engine. Setahun kemudian versi 4.0 dari PHP menggunakan mesin ini sebagai intinya. Kemudian setelah pengembangan yang cukup lama, pada akhirnya diperkenalkanlah PHP 5.0 dengan Zend Engine II. Mesin ini mempunyai fitur tambahan seperti pemrograman berorientasi objek dan banyak fungsi serta fitur lainnya [3].

CodeIgniter merupakan framework atau alat bantu yang berisi berbagai macam fungsi/class yang dibutuhkan dalam pembuatan website, CodeIgniter menawarkan kemudahan pembuatan sebuah program web based yang dinamis dengan konsep MVC (Model, View, Controller). Tujuan dari pembuatan framework CodeIgniter

adalah meminimalkan pembuatan kode pada saat pembuatan website sehingga memudahkan developer untuk membuat aplikasi web dengan lebih cepat dan mudah dibandingkan dengan membuatnya dari awal [8].

jQuery EasyUI adalah sebuah framework yang membantu membuat halaman

web menjadi lebih mudah. jQuery EasyUI menawarkan koleksi lengkap komponen datagrid, menu control panel, dan dynamictab di halaman web [9].

3. Metode dan Perancangan Sistem

Pada penelitian ini, akan dilakukan beberapa tahapan penelitian yang secara garis besar terbagi ke dalam lima tahapan, yaitu : 1) Analisis kebutuhan dan pengumpulan data yang diperlukan. 2) Perancangan Sistem. 3) Perancangan aplikasi/program. 4) Implementasi dan pengujian sistem, serta analisis hasil pengujian. 5) Penulisan laporan hasil penelitian [5]. Tahapan-tahapan yang dilakukan dalam penelitian ini dapat dilihat pada Gambar 1.

(10)

5

Berdasarkan bagan pada Gambar 1 dapat dijelaskan bahwa tahapan penelitian yang dilakukan adalah sebagai berikut : 1) Tahap pertama : analisis dan pengumpulan data, di mana pihak developer mencari tahu kebutuhan client dalam pembuatan aplikasi. Tahap ini dilakukan dengan melakukan wawancara dengan pengembang Aplikasi Petty Cash sekaligus web manager yaitu bapak Bayu Anggar Kusuma. Tahap kedua, ketiga dan keempat dilakukan perancangan Aplikasi Petty Cash menggunakan metode pengembangan sistem Prototype. Sedangkan tahap kelima dilakukan penulisan laporan penelitian dan artikel ilmiah.

Metode pengembangan sistem yang digunakan pada penelitian ini adalah adalah metode prototyping, karena dalam pembuatan sistem ini dilakukan komunikasi yang intensif dengan pengguna aplikasi. Metode ini digunakan untuk membantu pengembangan perangkat lunak dalam membentuk model dari perangkat lunak yang harus dibuat. Metode ini dilakukan secara bertahap, yaitu dengan mengembangkan suatu prototype yang sederhana terlebih dahulu baru kemudian dikembangkan dari waktu ke waktu sampai perangkat lunak selesai dikembangkan.

Prototype merupakan bentuk dasar atau model awal dari suatu sistem atau subsistem. Tahap-tahap dalam metode Prototyping ditunjukkan pada Gambar 2.

Gambar 2 Metode Prototyping [11]

Tahap pengumpulan kebutuhan dilakukan untuk mengetahui dan menerjemahkan semua permasalahan serta kebutuhan perangkat lunak dan kebutuhan sistem yang dibangun. Analisis kebutuhan dilakukan dengan melakukan pencarian data-data serta informasi-informasi yang dibutuhkan oleh sistem. Ada empat analisis kebutuhan dalam perancangan sistem yaitu analisis kebutuhan sistem, analisis kebutuhan data, analisis kebutuhan perangkat keras dan analisis kebutuhan perangkat lunak.

(11)

6

Perancangan sistem dalam penelitian ini dibuat dalam bentuk diagram UML. Diagram UML meliputi diagram use case, diagram activity, diagram sequence dan diagram class. Berikut ini akan dijelaskan masing-masing diagram yang telah dibuat.

Gambar 3Use CaseDiagram Sistem

Gambar 3 merupakan diagram use case dari aplikasi yang dibuat. Terdapat 2 (dua) aktor dalam aplikasi, yaitu aktor administrator, dan user. Aktor administrator merupakan pemilik hak akses tertinggi, di mana bisa melakukan pengelolaan data

user, data cabang, data role user, data Bukti Kas Kecil (BKK), dan data (Kas Bon Sementara) KBS. Hak akses user memiliki 2 (dua) use case, yaitu mengelola (Bukti Kas Kecil) BKK, dan mengelola (Kas Bon Sementara) KBS.

(12)

7

Gambar 4 menjelaskan tentang aktivitas admin dimana dalam kolom admin

mulai atau start, kemudian sistem merespon dengan menampilkan halaman login

untuk admin jika login non valid maka sistem akan mengembalikan proses ke halaman login. Jika login valid maka sistem akan menampilkan menu utama kepada

admin. Setelah admin selesai melakukan proses penambahan data cabang, admin

dapat logout.

Gambar 5 Diagram ActivityUpdate Data Cabang

admin. Setelah admin selesai update data cabang, admin dapat logout.

(13)

8

admin. Setelah admin selesai melakukan hapus cabang, admin dapat logout.

Gambar 7 SequenceDiagram Hapus Data User

Gambar 7 merupakan diagram sequence untuk proses menghapus data user. Administrator pertama kali mencari data user yang ingin dihapus. Setelah data didapat, data akan diproses.

Gambar 8SequenceDiagram Proses Tambah BKK

(14)

9

data sudah selesai diinput maka sistem akan memberikan konfirmasi data berhasil disimpan

Gambar 9ClassDiagram Aplikasi

Gambar 9 merupakan diagram class yang menggambarkan Model Class dan

Controller Class pada aplikasi. Model Class merupakan bagian aplikasi yang bertugas untuk mengendalikan fungsi-fungsi yang berhubungan dengan basis data. Pada aplikasi yang dibuat terdapat 5 (lima) Model Class, yaitu Mod_User, Mod_Branch, Mod_Role, Mod_BKK dan Mod_KBS. Sedangkan Controller Class

bertugas untuk menghubungkan bagian view dengan bagian Model Class. Pada aplikasi ini terdapat 5 (lima) Controller Class, yaitu Con_User, Con_Branch, Con_Role, Con_BKK dan Con_KBS. Bagian view tidak ikut digambarkan dalam diagram class karena bagian view di dalam aplikasi bukan dalam bentuk class tetapi berupa tag HTML untuk menampilkan informasi pada halaman web.

Proses evaluasi prototyping dilakukan sebanyak satu kali dan dilakukan dengan mendemokan aplikasi kepada pengguna aplikasi (administrator dan user). Penjelasan setiap tahap evaluasi prototyping adalah sebagai berikut : Evaluasi tahap pertama dilakukan bersama user aplikasi yaitu kepada administrator dan user yaitu manager Software Development 6 PT. Indomarco Prismatama. Pada evaluasi ini dilakukan dengan mengecek apakah masih ada bug, seperti otentikasi keamanan, parsing antar

(15)

10

Implementasi dari pengembangan aplikasi Petty Cash ini dilakukan dengan

framework CodeIgniter. Terdapat beberapa pengaturan yang harus dilakukan pertama kali saat pembuatan, yaitu pengaturan koneksi ke basis data PostgreSQL dan pengaturan route file. Pengaturan koneksi basis data dilakukan pada file database

yang terletak pada folderconfig. Pengaturan ini ditunjukkan pada Kode Program 1.

Kode Program 1 Koneksi Framework CodeIgniter dengan Basis Data

Kode Program 1 merupakan perintah untuk melakukan pengaturan koneksi dari

framework CodeIgniter ke basis data PostgreSQL. Pada pengaturan ini dilakukan pengisian untuk hostname, username, password dan nama dari basis data yang digunakan. Sedangkan pengaturan untuk route ditunjukkan pada Kode Program 2.

Kode Program 2 Pengaturan File Route CodeIgniter

Kode Program 2 bertugas untuk menentukan controller apa yang akan dijalankan pertama kali ketika web diakses dari browser. Pengaturan ini dilakukan pada baris ke 1, yaitu dengan mengisikan nama controller pada default_controller.

Controller yang pertama kali dipanggil adalah beranda. Controller ini berada pada

foldercontroller.

1. $route['default_controller'] = 'con_Home'; 2. $route['404_override'] = '';

(16)

11

Gambar 10 Halaman Home Aplikasi Petty Cash

Gambar 10 merupakan halaman depan dari Aplikasi Petty Cash. Halaman ini akan menampilkan login form untuk digunakan sebagai pengecekan apakah user

tersebut memiliki hak untuk menggunakan aplikasi ini, sekaligus mengecek role usernya.

Gambar 11 Halaman Home Aplikasi Petty Cash

Gambar 11 merupakan tampilan home aplikasi Petty Cash. Halaman diatas merupakan contoh halaman user yang telah login dengan role admin. Gambar 10 dan 11 sudah menggunakan framework jQuery EasyUI sebagai framework untuk tampilannya.

Kode Program 3 Pemanggilan CSS jQuery EasyUI

1. <link rel="stylesheet" type="text/css" href="<?php echo base_url();?>assets/easy/themes/default/easyui.css"> 2. <link rel="stylesheet" type="text/css" href="<?php echo

base_url();?>assets/easy/themes/icon.css">

3. <link rel="stylesheet" type="text/css" href="<?php echo base_url();?>assets/easy/themes/color.css">

4. <link rel="stylesheet" type="text/css" href="<?php echo base_url();?>assets/easy/demo/demo.css">

5. <link rel="stylesheet" type="text/css" href="<?php echo base_url();?>assets/css/user.css">

6. <script type="text/javascript" src="<?php echo base_url();?>assets/easy/jquery.min.js"></script> 7. <script type="text/javascript" src="<?php echo

base_url();?>assets/easy/jquery.easyui.min.js"></script> 8. <script type="text/javascript" src="<?php echo

(17)

12

Kode Program 3 merupakan perintah dalam pemanggilan CSS jQuery EasyUI

yang merupakan bagian dari framwork jQuery EasyUI. File ini diletakkan di dalam

folderassets, sedangkan pemanggilannya dilakukan di fileheader yang diletakkan di bagian view.

Admin dapat mengelola beberapa data yang ada, yaitu data user, role dan

branch. Mengelola data tersebut dapat dilakukan dengan masuk ke menu yang diinginkan, gambar 12 menampilkan halaman yang digunakan untuk menu kelola data user.

Gambar 12 Halaman Menu Data User

Untuk menampilkan data user pada Gambar 12, digunakan dengan prinsip

Model View Controller (MVC). Pada proses ini, pertama kali akan dipanggil fungsi tampil yang terdapat pada filecon_User (terletak di bagian controller). Fungsi tampil ini akan melakukan pemanggilan fungsi tampil yang terdapat di file mod_User perintah fungsi tampil pada bagian model dan Kode Program 6 merupakan perintah pada bagian view.

Kode Program 4 Fungsi tampil pada con_User

Kode Program 5 Fungsi tampil pada mod_User

1. public function tampil(){

2. $result['hasil'] = $this->mod_User->tampil(); 3. echo json_encode($result['hasil']); }

1. function tampil()

2. {

3. $page = $this->input->post('page') ? intval($this->input->post('page')) : 1;

4. $rows = $this->input->post('rows') ? intval($this->input->post('rows')) : 10;

5. $sort = $this->input->post('sort') ? strval($this->input->post('sort')) : 'USER_ID';

12.$where = 'where cast("'.$category.'" as text) like .$petik.'%'.$search.'%'.$petik.'';}

13.$offset = ($page - 1) * $rows;

14.$rs = $this->db->query('select count(*) as cnt from "sys_user" '.$where.' ');

(18)

13

Kode Program 6 Perintah pada Bagian View v_User

Penggunaan teknik MVC ini dilakukan dengan memanfaatkan fitur MVC yang disediakan oleh framework CodeIgniter (CI). Hal ini dilakukan dengan cara memanggil kelas induk CI_Controller dan CI_Model yang berasal dari library controller dan model CI. Kelas induk Controller dan Model ini disimpan di folder core pada bagian system. Sedangkan bagian view hanya bertugas untuk menampilkan halaman web saja.

Pada setiap bagian menu yang dibuat, sudah ditambahkan masing-masing fitur

insert, update, delete, dan search. Pembuatan menu tersebut langsung terlihat di bagian halaman yang sama membuatnya lebih mudah dalam melakukan pengelolaan data

Gambar 13 Halaman Entry BKK

1. <table id="tableUser" class="easyui-datagrid" style="width:100%;" url="con_User/tampil"

(19)

14

Halaman Entry BKK merupakan salah satu halaman inti dari program ini. Halaman ini berfungsi untuk melakukan pencatatan setiap detail dari kas kecil yang ingin dibuat. Detail terlihat di bagian bawah sedangkan bagian atas memuat detail yang berfungsi sebagai header dari Bukti Kas Kecil yang dibuat, seperti tanggal, nomor, dan lain-lain.

Gambar 14 Halaman List BKK

Halaman List BKK merupakan halaman yang berfungsi untuk menampilkan semua data BKK yang sudah tersimpan. Halaman ini mampu menampilkan data– data BKK dengan setiap detail dari nomor BKK dan mencetak laporan BKK yang telah dibuat.

Gambar 15 Halaman Paid BKK

Proses perubahan status BKK dapat dilakukan melalui halaman Paid BKK. Halaman ini berfungsi untuk menampilkan BKK yang sudah berstatus Release dan melakukan perubahan status data BKK, misalnya perubahan status dari Release

(20)

15

Gambar 16 Halaman Inquiry BKK

Gambar 16 merupakan halaman yang berfungsi untuk menampilkan semua rekapitulasi BKK yang pernah dibuat, halaman ini menampilkan semua data BKK, tidak ada pengecualian dalam hal status seperti halaman Paid BKK yang hanya menampilkan BKK dengan status Release saja.

Pengujian aplikasi dilakukan dengan menguji fungsi-fungsi dari aplikasi yang telah dibuat untuk mencari kesalahan/bug pada sistem. Pengujian aplikasi dilakukan agar sistem yang dibuat berjalan sesuai dengan yang diharapkan dan dapat memenuhi kebutuhan pengguna. Pengujian aplikasi ini menggunakan dua teknik pengujian yaitu pengujian alpha dan pengujian beta.

Pengujian alpha menggunakan metode blackbox yaitu pengujian fungsi-fungsi aplikasi secara langsung tanpa memperhatikan alur eksekusi program. Pengujian ini dilakukan dengan memperhatikan apakah fungsi telah berjalan sesuai rancangan dan sesuai yang diharapkan. Tabel 1 adalah hasil pengujian dari aplikasi yang telah dilakukan.

Tabel 1 Hasil Pengujian Blackbox

Fungsi yang diuji Kondisi Output yang

diharapkan

Output yang dihasilkan sistem

Status Pengujian

Login Username dan password

benar

Form diisi dengan benar Sukses ubah data Sukses ubah data Valid

Hapus data sys_management (user, branch, role)

Pilih salah satu data Sukses hapus data Sukses hapus data Valid

Load data sys_management (user, branch, role)

(21)

16 Tambah data BKK Form diisi dengan benar

Form diisi beberapa atau

Ubah data BKK Form diisi dengan benar Sukses ubah data Sukses ubah data Valid

Hapus BKK Pilih salah satu data Sukses hapus data Sukses hapus data Valid

Load BKK Buka halaman Sukses load data Sukses load data Valid

Unduh BKK report Pilih salah satu report File dapat diunduh Sukses unduh file Valid

Tambah data KBS Form diisi dengan benar

Form diisi beberapa atau

Ubah data KBS Form diisi dengan benar Sukses ubah data Sukses ubah data Valid

Hapus KBS Pilih salah satu data Sukses hapus data Sukses hapus data Valid

Load KBS Buka halaman Sukses load data Sukses load data Valid

Unduh KBS report Pilih salah satu report File dapat diunduh Sukses unduh file Valid

Berdasarkan pengujian yang dilakukan pada aplikasi web dapat dilihat status pengujian dari setiap fungsi valid, maka disimpulkan bahwa aplikasi ini berjalan dengan baik dan sesuai yang diharapkan. Pengujian beta adalah pengujian yang dilakukan oleh orang yang tidak ikut dalam pembuatan aplikasi atau calon pengguna aplikasi. Pengujian beta dilakukan dengan melakukan wawancara dengan manager Software Development 6(SD6) bagian web PT. Indomarco Prismatama, Jakarta. Berdasarkan wawancara tersebut didapatkan bahwa aplikasi Petty Cash yang baru dapat membantu dan mempermudah dalam pengelolaan data kas kecil karena sudah berbasis web sesuai dengan yang user minta dan dinilai memiliki tampilan yang user friendly dengan tampilannya yang seperti aplikasi desktop. Selain itu permasalahan yang sebelumnya ada di aplikasi yang berbasis desktop, sekarang sudah berkurang dengan diubahnya aplikasi ke basis web.

5. Simpulan

Berdasarkan penelitian yang telah dilakukan, maka dapat diambil kesimpulan bahwa perancangan aplikasi Petty Cash di PT. Indomarco Prismatama dapat dikembangkan dengan framework CodeIgniter (CI) dan jQuery EasyUI. Framework

CI bermanfaat dalam pengembangan aplikasi menggunakan Model View Controller

(MVC). MVC dapat dengan mudah dibuat menggunakan kelas induk Controller dan

Model yang ada di framework CI. Sedangkan framework jQuery EasyUI membantu dalam membuat tampilan user yang user friendly dan menarik.

(22)

17 6. Pustaka

[1] Aryanji, R. Membangun Aplikasi Pengendalian Intern Petty Cash Finance Berbasis Web Pada PT. Staninless Steel Primalve Maju Bersama. 2015. Jakarta: Universitas Esa Unggul.

[2] Koespradono, Suraya, & K. Rachmawati, Y. 2013. “Sistem Informasi Pengolahan Data Pertumbuhan Ekonomi dan Ketimpangan di Kabupaten Klaten (Tahun 2003-2012) Menggunakan Framework CodeIgniter”. Jurnal Script. 1 (1). 46-54.

[3] Kandaga, T., & Sarean, R. B. 2010. “Konsep dan Perancangan Code-Completion untuk PHP”. Jurnal Informatika. 6 (1). 95-103.

[4] Wiyani, N. T. 2010. “Pentingnya Pengetahuan Petty Cash bagi Seorang Sekretaris”. Tarakanita News. 9 (1). 32-40.

[5] Hasibuan, Zainal A. Metodologi Penelitian Pada Bidang Ilmu Komputer dan Teknologi Informasi : Konsep, Teknik, dan Aplikasi. 2007. Jakarta: Ilmu Komputer Univesitas Indonesia.

[6] Subchan, Nur. 2014. “Perancangan Sistem Informasi Franchise Berbasis

Android, PHP (CodeIgniter), dan MySQL”. Vokasindo (Jurnal Ilmu-Ilmu Terapan dan Hasil Karya Nyata). 2 (2). 60.

[7] Osmond, A. B., Nugroho, Lukito Edi, Kusumawardhani, Sri Suning. 2016.

“Aplikasi Pengumpulan Data Survei Memanfaatkan SMS Gateway”. Jurnal Nasional Teknik Elektro dan Teknologi Informasi. 1 (5). 1.

[8] Arifudzaki, B., Somantri, M., & R. Adian F. 2010. “Aplikasi Sistem Informasi Persediaan Barang pada Perusahaan Ekspor Hasil Laut Berbasis Web”. Transmisi (Jurnal Ilmiah Teknik Elektro). 12 (4). 138-144.

[9] Gulo, E., Rachmawati, Y., & Andayati, Dina. 2015. “Implementasi Paket Tabel jEasyUI pada Inventory (Studi Kasus Toko Bangunan UD. Tokosa)”. Jurnal Script. 2 (2). 12-19.

[10] Pangkey, F., Tinangon, J., Sabijono,. 2015. “Evaluasi Penerapan Akuntansi

Kas Kecil Pada PT. Sinar Pure Foods Bitung”. Jurnal Berkala Ilmiah Efisiensi. 15 (4). 288-299.