Rancang Bangun Aplikasi Php
Generator
Berbasis
Web
1
Anie Rose Irawati, 2 Dwi Sakethi, 3Ayu Izaddarwazah 1
Jurusan Ilmu Komputer FMIPA Unila 2 Jurusan Ilmu Komputer FMIPA Unila 3 Jurusan Ilmu Komputer FMIPA Unila
Abstract
In this research was developed a web-based application PHP Generator. The development aims to produce an application which can minimize the time in making of web-based information systems. This application was built using PHP programming language integrated with MySQL database and supported by javascript and jQuery. The research method which is used in this research is action research and prototyping as its software development method. This application can generate php files to add, view, edit, delete, and search data that has been stored in the database,either the entire data of a table or only the filtered data. It can display the form input elements that user wants to be generated file such as textfields, textarea, password, radio button, select option, or checkbox. In addition, this application was also completed with data validation functions for file to be generated
.
Keywords: data validation, javascript, jQuery, MySQL, PHP generator, web-based.
1
Pendahuluan
Aplikasi berbasis web telah menjadi primadona dalam beberapa waktu terakhir [6]. Hal tersebut yang
membuat pengembang tertarik untuk mengembangkan sistem informasi berbasis web. Namun dalam
pembuatan sistem berbasis web tersebut masih terdapat beberapa masalah yang umumnya dihadapi
oleh pengembang yaitu sering ditemukannya penulisan query yang sama dan berulang sehingga menghabiskan waktu yang cukup lama untuk membuatnya. Untuk mengatasi permasalahan tersebut,
pada penelitian ini akan dikembangkan Aplikasi PHP Generator berbasis web. Pertimbangan dalam
memilih PHP sebagai output hasil generate adalah karena banyaknya aplikasi berbasis web yang
dikembangkan menggunakan PHP, selain itu bahasa pemrograman PHP lebih mudah untuk dipahami dan dipelajari.
Pada penelitian sebelumnya, Rahmawyanet (2012) membangun suatu aplikasi form builder berbasis
web [5]. Aplikasi form builder dibangun dengan menggunakan teknologi web seperti Jquery, Ajax dan
Javascript serta menggunakan bahasa pemrograman PHP. Aplikasi tersebut menghasilkan suatu form
dan report sesuai dengan database yang telah dibuat. Form dan report tersebut nantinya dapat
dimasukkan ke dalam aplikasi web yang dibuat oleh pengguna. Dalam aplikasi form builder tersebut
sudah menggunakan komponen HTML berupa string, password, text area, combo box, radio button,
date picker, date time picker, time picker, dan upload namun masih belum menggunakan komponen atau fungsi checkbox. Selain itu, aplikasi tersebut juga tidak menggunakan tipe data serial, binary, varbinary, tinyblob, mediumblob, blob, longblob, enum, set, geometry, point, linestring, polygon, multipoint, multilinestring, multipolygon, geometrycollection.
Aplikasi PHP Generator berbasis web yang akan dibangun ini dapat memfasilitasi pengguna dalam
membuat halaman tambah data, tampil data, edit data dan hapus data, serta cari data yang sudah
Pada penelitian ini, metode penelitian yang digunakan adalah metode action research yang terdiri dari lima tahapan yaitu [1] :
2.1
Diagnosis
Untuk pengembangan aplikasi PHP Generator, pada tahap diagnosis ini dilakukan pengumpulan data
yang berkaitan dengan penelitian melalui buku atau jurnal penelitian sebelumnya, selain itu juga dilakukan pengidentifikasian kebutuhan pengguna, yaitu dengan cara melakukan diskusi dengan
pengembang aplikasi berbasis web.
2.2
Perencanaan Tindakan (
Action Planning
)
Pada tahap ini dilakukan analisa terhadap aplikasi yang akan dibuat yang disesuaikan dengan
kebutuhan pengembang web dan analisa data yang akan diolah yaitu data-data pengembang web yang
telah tersimpan di dalam database sebelumnya. Selain itu juga mulai dibuat sketsa awal dan
ditentukan isi yang akan ditampilkan pada aplikasi dengan memperhatikan kebutuhan pengembang
web. Sketsa awal tersebut digambarkan melalui flowchart pada Gambar 1.
2.3
Intervensi (
Action Taking
)
Dengan menerapkan action planning yang telah disusun kemudian dilakukan intervensi atau action
taking yaitu pengembangan aplikasi. Dalam pengembangan aplikasi ini digunakan metode
prototyping dengan membangun aplikasi dalam sebuah model yang tahapannya dapat dilakukan
dengan iterasi (berulang). Jenis prototype yang digunakan pada pengembangan aplikasi ini adalah
prototype evolusioner yang akan terus menerus disempurnakan sampai memenuhi seluruh
fungsionalitas yang dibutuhkan pengembang web. Tahapan metode prototyping yang diterapkan
dalam penelitian ini adalah sebagai berikut [3]:
2.3.1
Identifikasi Kebutuhan Pengembang
Web
Seperti yang telah dijelaskan pada tahapan metode penelitian sebelumnya yaitu tahapan diagnosis,
identifikasi kebutuhan pengembang web dilakukan dengan melakukan diskusi dengan responden yang
dalam hal ini merupakan praktisi pengembang web yang sudah cukup profesional dalam bidang
pengembangan sistem informasi berbasis web. Hasil dari tahap tersebut adalah sebagai berikut :
a. Kebutuhan Pengembang Web
Kebutuhan pengembang web dijelaskan dalam bentuk aktivitas-aktivitas yang dapat dilakukan
pengembang web terhadap aplikasi yang akan dikembangkan yang dapat dilihat pada Gambar 2.
Gambar 2 Use Case Pengembang Web
b. Kebutuhan Sistem
Kebutuhan sistem ini meliputi kebutuhan hardware, tools dan data yang harus dimiliki oleh
pengembang web untuk menjalankan aplikasi PHP Generator.
2.3.2
Membuat
Prototype
Dalam tahap pembuatan prototype ini juga mencakup perancangan desain aplikasi dan pengodean di
dalamnya karena jenis prototype yang digunakan sudah berupa coding program yang merupakan
bagian dari aplikasi sesungguhnya. Perancangan desain proses dan desain data pada aplikasi PHP
Gambar 3 Diagram Konteks Proses Generate
Gambar 4 Entity Relational Diagram (ERD) Pada Menu Memilih Elemen Input Form Aplikasi PHP Generator
Pembuatan prototype yang pertama menghasilkan aplikasi yang sudah dapat membangkitkan file php.
Namun file php yang dihasilkan hanya file php untuk tampil data, edit data, hapus data, serta tambah
data, selain itu fungsi aplikasi belum dilengkapi dengan fungsi filtering field. Kemudian prototype
kedua dibangun dengan melengkapi fungsi-fungsi yang belum ada pada prototype pertama. Secara
detail, hasil prototype yang kedua ditampilkan pada antarmuka dengan penjelasan berikut :
1. Halaman Koneksi Database
Halaman koneksi database merupakan halaman utama dari aplikasi PHP Generator. Tampilan
Gambar 5 Tampilan Halaman Koneksi Database
2. Halaman Memilih Tabel
Halaman memilih tabel merupakan halaman yang akan muncul setelah pengembang web
menekan tombol submit dan koneksi ke database yang diinputkan berhasil. Tampilan halaman
memilih database dapat dilihat pada Gambar 6.
Gambar 6 Tampilan Halaman Memilih Tabel
3. Halaman Filtering Field
Halaman filteringfield akan muncul setelah pengembang web memilih satu tabel pada halaman
Gambar 7 Tampilan Halaman Filtering Field
4. Halaman Memilih Elemen Input Form
Halaman memilih elemen input form merupakan halaman yang akan tampil setelah pengembang
web memilih field yang ingin dibangkitkan. Tampilan halaman memilih elemen input form dapat
dilihat pada Gambar 8.
Gambar 8 Tampilan Halaman Memilih Elemen Input Form
5. Halaman Insert Option Checkbox dan Select Option
Halaman ini merupakan halaman untuk menentukan pilihan bila pengembang web memilih
elemen input form checkbox atau select option pada halaman memilih elemen input form.
Gambar 9 Tampilan Halaman Insert Option Checkbox dan Select Option
6. Halaman GenerateFile PHP
Halaman generate merupakan halaman yang akan muncul setelah semua data yang diinputkan
pengembang web berhasil diproses. Tampilan halaman generate dapat dilihat pada Gambar 10.
Gambar 10 Tampilan Halaman Generate File PHP
7. Halaman Download File Hasil Generate
Halaman ini merupakan yang akan muncul setelah proses generate file selesai dan berhasil.
Gambar 11 Tampilan Halaman Download File Hasil Generate
2.3.3
Menentukan Apakah
Prototype
dapat Diterima
Setelah prototype selesai dibuat, maka tahap selanjutnya adalah mengevaluasi apakah prototype sudah
sesuai dengan kebutuhan pengembang web. Evaluasi dilakukan dengan uji coba prototype oleh
responden atau praktisi pengembang web. Jika setelah dievaluasi ternyata prototype tersebut masih
belum memenuhi spesifikasi yang dibutuhkan pengembang web maka akan dilakukan kembali
identifikasi kebutuhan pengembang web yaitu dengan menganalisis hasil uji coba prototype dan
saran-saran yang diberikan responden untuk ditampilkan pada prototype selanjutnya.
Setelah analisis kebutuhan pengembang web dilakukan, tahapan berlanjut ke membuat atau
membangun prototype yang kedua yaitu dengan menambahkan fungsi-fungsi aplikasi yang belum
dilengkapi oleh prototype sebelumnya dan menambahkan masukan-masukan yang diinginkan
pengembang web dari hasil uji coba prototype 1. Setelah itu kembali dilakukan evaluasi atau uji coba
prototype 2 oleh responden seperti pada prototype 1. Ringkasan prototype yang dihasilkan pada
penelitian ini ditunjukkan pada Tabel 1. Tabel 1 diperoleh dari penyimpulan hasil uji coba prototype 1
dan 2 yang dilakukan oleh responden yang merupakan praktisi pengembang web.
Tabel 1. Ringkasan Prototype
Prototype Fungsi yang Dihasilkan Hasil Pengujian Keterangan
1 1. Fungsi untuk membuat koneksi
database yang telah tersimpan di komputer pengembang web.
2. Fungsi menampilkan tabel yang
terdapat di dalam database yang telah
terkoneksi untuk dipilih oleh
pengembang web.
3. Fungsi menampilkan detail tabel dari database dan pilihan elemen input form yang ingin di-generate (textfield, textarea, password, radiobutton). 4. Fungsi generate file php (tampil data,
edit data, hapus data, dan tambah data)
Semua prosedur dari setiap fungsi yang ada sudah berjalan dengan cukup baik,
namun masih terdapat
masukan dari pengembang web yaitu agar prototype dapat juga menampilkan elemen input form checkbox dan select option pada hasil generate, selain itu pada fungsi generate file diminta juga agar dapat melakukan
Prototype 1
dikerjakan dalam
rentang waktu sekitar tiga bulan. Bagian
tersulit dari
pembuatan prototype ini terletak pada
pembuatan fungsi
generate file php (tampil data, edit data, hapus data, dan tambah data).
dengan fungsi untuk mengunduh dan menyimpan hasil generate dan file hasil generate dilengkapi dengan validasi data.
2 Fungsi yang dihasilkan merupakan fungsi-fungsi dari prototype 1 ditambah dengan fungsi :
1. Fungsi filtering field yang ingin dibangkitkan oleh pengembang web.
2. Fungsi untuk dapat menampilkan
pilihan elemen input form checkbox dan select option.
3. Fungsi generate file php dilengkapi dengan generatefile cari data.
4. Fungsi untuk mendownload dan
menyimpan hasil generate dalam bentuk .zip.
Semua prosedur dari setiap fungsi yang sudah berjalan dengan baik dan
fungsi-fungsi yang ada pada
prototype 2 sudah sesuai dengan yang dibutuhkan pengembang web sehingga
tidak diperlukan lagi
membuat prototype
berikutnya.
Prototype 2
dikerjakan dalam
rentang waktu sekitar satu bulan. Bagian
tersulit dari
pembuatan prototype ini terletak pada
pembuatan fungsi
untuk dapat
menampilkan pilihan elemen input form checkbox dan select option serta fungsi untuk mendownload dan menyimpan hasil
generate dalam
bentuk .zip.
Karena hasil evaluasi prototype kedua menyatakan bahwa prototype sudah cukup memenuhi
kebutuhan pengembang web maka pembuatan prototype dapat dihentikan dan kemudian dilakukan
pengujian terhadap setiap prosedur dalam prototype tersebut. Pengujian prototype 2 dilakukan dengan
menggunakan metode white box dengan teknik basis path testing [2]. Pengujian dilakukan oleh
pembuat program aplikasi PHP Generator. Pengujian dilakukan terhadap empat prosedur yaitu
prosedur menampilkan tabel, menampilkan field yang akan di-filter, prosedur menampilkan detail
tabel dan memilih elemen input form, dan prosedur generate file PHP. Gambar 12 merupakan contoh
Gambar 13 Flowgraph Prosedur Program Detail Tabel dan Memilih Elemen Input Form
Gambar 13 merupakan flowgraph dari Gambar 12. Setelah dibuat flowgraph, selanjutnya dilakukan
perhitungan cyclomatic complexity terhadap flowgraph tersebut dengan rumus sebagai berikut [2] :
V(G) = Region (R) (1)
V(G) = Predicate Node (P) + 1 (2)
V(G) = Edge (E) – Node (N) + 2 (3)
Dari Gambar 13 didapatkan bahwa nilai Region (R) adalah 4, Predicate Node (P) adalah 3, Edge (E)
adalah 15, dan Node (N) adalah 13 maka didapatkan cyclomatic complexity sebagai berikut dengan
menggunakan rumus (1), (2), dan (3) : V(G) = R = 4
V(G) = P + 1 = 3 + 1 = 4
V(G) = E - N + 2 = 15 - 13 + 2 = 4
Dari hasil perhitungan cyclomatic complexity, terdapat 4 IndependentPath yaitu :
(a) Path 1 : 1-2-3-12-13
(b) Path 2 : 1-2-3-4-5-6-7-10-11-3-12-13
(c) Path 3 : 1-2-3-4-5-6-8-9-10-11-3-12-13
(d) Path 4 : 1-2-3-4-5-6-8-10-11-3-12-13
rumus (4) [4]. Berdasarkan perhitungan cyclomatic complexity, didapatkan bahwa jalur independen
untuk flowgraph prosedur program detail tabel dan memilih elemen input form berjumlah 4 jalur. Uji
test case dilakukan pada setiap jalur tersebut. Test case dapat dilihat pada Tabel 2.
Tabel 2Test case Flowgraph Prosedur Program Detail Tabel dan Memilih Elemen Input Form
Path Input Output
1-2-3-12-13 $tabel = job_record $nomor = 10 a. Button “proses” 1-2-3-4-5-6-7-10-11-3-12-13 $tabel = job_record $nomor = 1 a. 1 b. $baris[‘Field’] = id_job c. $baris[‘Type’] = int d. $baris[‘Key’] = Primary Key e. Select option elemen input form f. Button “proses” 1-2-3-4-5-6-8-9-10-11-3-12-13 $tabel = job_record $nomor = 2 a. 2 b. $baris[‘Field’] = id_karyawan c. $baris[‘Type’] = varchar d. $baris[‘Key’] = Foreign Key e. Select option elemen input form f. Button “proses” 1-2-3-4-5-6-8-10-11-3-12-13 $tabel = job_record $nomor = 4 a. 4 b. $baris[‘Field’] = masalah c. $baris[‘Type’] = varchar d. Select option elemen input form e. Button “proses”
Test case prosedur program detail tabel dan memilih elemen input form dilakukan berdasarkan
Gambar 12. Pada Tabel 2 dijelaskan bahwa pada path uji yang pertama yaitu 1-2-3-12-13, jika
diberikan input berupa $tabel = job record dan $nomor = 10 maka output yang diharapkan adalah program dapat mencetak data pada baris ke 10 dari tabel job record, namun karena tidak ada data
pada baris tersebut sehingga program hanya mencetak sebuah button dengan value ”proses”. Begitu
juga pada path-path lainnya yang diberikan input tertentu dan menghasilkan output sesuai dengan yang diharapkan seperti yang telah dirincikan pada Tabel 2.
Keempat prosedur yang terdapat pada prototype sudah efektif dan efisien karena nilai V(G) sama
dengan jumlah Region (R) pada hasil perhitungan rumus (1) dan nilai V(G) dari hasil perhitungan
rumus (2) sama dengan nilai V(G) dari hasil perhitungan rumus (3) serta dapat menghasilkan output
yang sesuai dengan input yang diberikan berdasarkan test case yang dilakukan.
2.3.4 Menggunakan
Prototyping
Prototype kedua sudah dapat digunakan sebagai sistem operasional sesungguhnya karena pada uji
coba yang dilakukan oleh pengembang web, prototype kedua sudah memenuhi elemen penting dari
kebutuhan pengembang web yaitu prototype sudah dapat menjalankan fungsi aplikasi generate file
tampil data, edit data, hapus data, serta tambah dan cari data dengan baik dan pengembang web sudah
tidak memberi masukan untuk pembuatan prototype selanjutnya.
2.4
Penilaian (
Evaluating
)
Prototype kedua yang dihasilkan pada penelitian ini sudah dianggap sesuai dengan yang dibutuhkan
melakukan generate untuk beberapa tabel di dalam database dalam setiap penggunaannya, serta dapat
dilakukan pengembangan dengan menambahkan fungsi pembuatan database, sehingga pengembang
web tidak lagi membutuhkan aplikasi lain untuk membuat database sebelum menggunakan aplikasi
PHP Generator.
3
Pembahasan
Prototype kedua yang dihasilkan pada penelitian ini sudah sesuai dengan yang dibutuhkan
pengembang web. Selain dari kelengkapan fungsi-fungsi yang ada, pengujian yang dilakukan pun
sudah membuktikan bahwa prototype berjalan dengan benar karena keempat prosedur pada prototype
yang diuji sudah efektif dan efisien. Sehingga tidak diperlukan lagi pembuatan prototype yang ketiga
pada penelitian ini dan prototype kedua sudah sistem yang sesungguhnya atau merupakan Aplikasi
PHP Generator.
Aplikasi ini dapat menjawab kebutuhan pengembang web yang telah dipaparkan sebelumnya yaitu
aplikasi dapat menghasilkan form tambah, tampil, edit, hapus, dan cari data yang tersimpan di dalam
database secara otomatis sehingga pengembang web tidak perlu membuat query yang berulang-ulang
dan tidak perlu menghabiskan banyak waktu dalam membangun aplikasi web. Selain itu aplikasi PHP
Generator ini dapat memfasilitasi pengembang web untuk
memilih field-field yang ingin ditampilkan dari suatu tabel di dalam database. Pengembang web dapat
memilih elemen input form yang ingin ditampilkan sesuai dengan keinginan yaitu textfield, textarea,
password, radio button, select option, atau checkbox. Serta aplikasi PHP Generator dapat membantu
pengembang web dalam meminimalisasi kesalahan input data karena dilengkapi dengan fungsi
validasi data pada file hasil generate.
Aplikasi PHP Generator ini dapat mengolah beberapa tipe data diantaranya tipe numerik yaitu int, tinyint, smallint, mediumint, bigint, decimal, float, double, real, tipe data date and time yaitu date, time, datetime, time, timestamp, year, dan tipe data string yaitu char, varchar, tinytext, text, mediumtext, longtext, enum. Sedangkan tipe data yang belum didukung oleh aplikasi ini yaitu bit, bool, serial, binary, varbinary, tinyblob, mediumblob, blob, longblob, set, geometry, point, linestring, polygon, multipoint, multilinestring, multipolygon, dan geometrycollection.
Aplikasi ini juga masih memiliki beberapa kekurangan lain diantaranya pengembang web hanya dapat
melakukan generate untuk satu tabel di dalam database dalam setiap penggunaannya, sehingga bila
pengembang web ingin melakukan generate beberapa tabel di dalam database, pengembang web
harus melakukannya berulang-ulang. Selain itu aplikasi PHP Generator hanya dapat membangkitkan
file-file php dari database yang telah dibuat sebelumnya, aplikasi belum dilengkapi fungsi pembuatan
database, sehingga pengembang web masih membutuhkan aplikasi lain untuk membuat database
4
Kesimpulan
Berdasarkan hasil penelitian yang telah dilakukan dapat disimpulkan beberapa hal sebagai berikut :
1. Aplikasi PHP Generator telah berhasil dibangun dan dapat membantu pengembang web dalam
meminimalisasi waktu dalam membuat suatu sistem informasi berbasis web karena tidak perlu
membuat query yang sama berulang-ulang seperti pada pengembangan secara manual.
2. Fitur aplikasi PHP Generator yang dibangun adalah sebagai berikut :
a. Aplikasi PHP Generator dapat membangkitkan file-file php untuk menambah, menampilkan,
mengedit, menghapus, dan mencari data yang telah tersimpan di dalam database.
b. Aplikasi PHP Generator dapat menampilkan keseluruhan data ataupun data yang telah dipilih
dari suatu tabel yang dipilih pengembang web.
c. Aplikasi PHP Generator dapat menampilkan elemen-elemen input form yang diinginkan
pengembang web yaitu textfield, textarea, password, radio button, select option, atau
checkbox.
d. File hasil generate dari aplikasi PHP Generator dilengkapi dengan fungsi validasi data.
Namun masih terdapat hal-hal yang perlu dikembangkan pada aplikasi ini diantaranya :
1. Aplikasi dapat melakukan generate file untuk beberapa tabel di dalam suatu database dalam
setiap pengoperasiaannya.
2. Aplikasi dapat dikembangkan dengan dilengkapi fungsi pembuatan database.
3. Aplikasi dapat mendukung lebih banyak lagi tipe data.
5
Daftar Simbol
E = Edge N = Node P = Predicate Node R = Region V(G) = Cyclomatic Complexity6
Refference
[1] Davison, R.M., Martinsons, M.G. & Kock N., Principles of Canonical Action Research, Info
System J14, 65-86 (2004).
[2] Khan, Ehmer Mohd, Different Approaches to White Box Testing Technique for Finding Errors,
International Journal of Software Engineering and Its Applications, Vol. 5 No. 3 (2011).
[3] McLeod, Raymond & Schell, George P., Sistem Informasi Manajemen, Edisi 10, Salemba
Empat (2008).
[4] Myers, Glendford J., The Art of Software Testing, Second Edition, New Jersey : John Wiley &
Sons, Inc (2004).
[5]
Rahmawyanet, Mahsa Elvina,
Perancangan dan Pembuatan Aplikasi Form Builder
Berbasis Web Versi 2
, Institut Teknologi Sepuluh Desember (2012).
[6] Anonymous, Pengembangan Aplikasi Web Membantu Apakah Better Business,