PENGEMBANGAN BACK-END SYSTEM PADA APLIKASI INTERACTIVE E-BOOK READER DI ANDROID MENGGUNAKAN FRAMEWORK PHONEGAP Cindy Realitha Jurusan Teknik Informatika Fakultas Teknologi Industri , Universitas Gunadarma Jl. Margonda Raya No. 100 Depok E-mail:
[email protected]
ABSTRAKSI Penelitian ini membahas mengenai pengembangan back-end sistem ebook reader pada mobile device Android. Penulis tertarik mengembangkan aplikasi ebook ini dikarenakan semakin pesatnya perkembangan teknologi pada saat ini. Adanya smart phone membuat segala sesuatu dapat dikerjakan secara mobile, dimana saja dan kapan saja. Pembuatan ebook ini didukung oleh library Monocle, tetapi karena Monocle tidak dapat mengambil fungsi-fungsi native (asli) secara offline, maka digunakan Phonegap sebagai sarana untuk menjembatani aplikasi mobile web dengan aplikasi Android. Uji coba telah dilakukan pada emulator 2.2 dan emulator 2.3.3. Sedangkan implementasi program dilakukan pada Galaxy Tab 7. Secara umum, hasil yang ditampilkan dari emulator dan Galaxy Tab 7 tidak jauh berbeda, hanya saja Android dengan versi yang lebih tinggi memiliki kecepatan akses yang lebih cepat. Kata Kunci: E-book reader, android, phonegap, back-end system. 1. PENDAHULUAN 1.1 Latar Belakang Masalah Teknologi digital yang saat ini berkembang cukup pesat, salah satunya adalah ebook (electronic book). Sebelum teknologi tersebut ada, membaca hanya dapat dilakukan melalui dokumen fisik. Tetapi, saat ini membaca dapat dilakukan dimana saja dan kapan saja (mobile) dengan memanfaatkan ebook (electronic book ), karena bentuknya yang berupa dokumen digital memungkinkan pengunanya pada alat elektronik seperti komputer, laptop dan mobile phone. Format ebook yang berkembang saat ini ada beberapa macam, diantaranya PDF dan ePub. Format ePub (Electronic Publication) merupakan format ebook yang popular saat ini karena merupakan standar terbuka yang terus berkembang. Selain itu ePUB juga mendukung adanya Scripted Content Document yang bisa menyajikan animasi, video, dan
interaktivitas kepada pengguna melalui Javascript. Format ePUB pada dasarnya merupakan dokumen terkompresi dengan format zip, dengan algoritma kompresi tertentu. Sedangkan di dalamnya terdapat dokumen-dokumen berupa file berformat HTML yang bisa disisipkan Javascript dan CSS, dimana konten ebook-nya dimasukkan ke dalam dokumen-dokumen HTML tersebut. Salah satu cara membaca ebook adalah dengan menggunakan library Monocle. Monocle adalah library Javascript yang dapat digunakan pada semua platform, baik web maupun mobile termasuk platform Android. Penulisan ini akan memfokuskan pada pengembangan aplikasi di atas platform Android yang menggunakan framework PhoneGap untuk membaca ebook reader yang sudah dipublikasikan pada aplikasi ebook publisher yang dikerjakan oleh anggota lain dalam kelompok penelitian ini.
Pada penelitian tersebut telah dijelaskan bagaimana menampilkan ebook yang di dukung oleh Monocle. Dalam menjalankan aplikasi tersebut sebagai aplikasi offline, maka aplikasi tersebut harus bisa mengakses fungsi-fungsi native (fungsi asli) dari Android secara langsung, misalnya untuk membaca file dokumen ebook, mengakses koneksi internet jika hendak tersambung ke server, dan sebagainya. Caranya adalah menggunakan framework PhoneGap yang bisa menjembatani antara aplikasi mobile web app dan sistem operasi Android. Jadi, penelitian ini akan membahas mengenai pengembangan back - end sistem pada aplikasi ebook reader yang menggunakan PhoneGap versi 1.0 untuk mengakses fungsi-fungsi native Android dengan bantuan Sencha Touch versi 1.1.0 dan Monocle versi 2.0.0 1.2
Tujuan Penelitian Penelitian ini bertujuan untuk menghasilkan suatu back-end sistem yang dapat mengakses ebook dari sistem client Android untuk aplikasi interactive ebook reader clientserver.
2. LANDASAN TEORI 2.1 PhoneGap Phonegap adalah cross platform mobile framework, yaitu alat pengembang open source untuk membuat aplikasi mobile dengan menggunakan JavaScript. Phonegap berperan sebagai jembatan yang menghubungkan aplikasi berbasis web dengan aplikasi berbasis mobile. Phonegap dapat digunakan untuk membuat aplikasi mobile pada perangkat iPhone, Android, BlackBerry, Symbian, dan Windows Mobile dengan memanfaatkan SDK masingmasing mobile platform tersebut. Phonegap, awal mulanya hanya dapat digunakan untuk membuat aplikasi mobile untuk iPhone dan sekarang Phonegap sudah dapat digunakan untuk membuat aplikasi mobile untuk
Android dan BlackBerry. Sedangkan saat ini Phonegap masih mengembangkan tools-nya agar dapat digunakan untuk
membuat aplikasi mobile pada platform Symbian dan Windows Mobile. Phonegap dapat mengakses device yang terdapat di dalam perangkat mobile sehingga Phonegap dapat memanfaatkan fasilitas yang ada pada perangkat mobile, seperti Geolocation, Vibration, Accelerometer, Sound, dan Contact Support. 2.2
Throwaway Prototyping Throwaway prototyping merupakan metodologi yang memasukkan pengembangan prototype. Namun, throwaway prototyping dilakukan pada waktu yang berbeda dalam sistem development lifecycle. Throwaway prototyping memiliki fase analisis yang cukup detail yang digunakan untuk mengumpulkan informasi dan mengembangkan ide untuk konsep sistem. Biasanya digunakan jika fitur-fitur yang digunakan pengguna belum bisa dimengerti dan mungkin ada permasalahan teknis yang harus diselesaikan. Setiap masalah diperiksa dengan menganalisis, mendesain, dan membangun prototype desain. Prototype desain bukan sistem yang sudah bekerja, melainkan produk yang merepresentasikan bagian dari sistem yang membutuhkan perbaikan lebih lanjut dan hanya mengandung cukup detail untuk membuat pengguna memahami permasalahan yang dihadapi. Sistem yang dikembangkan menggunakan tipe metodologi ini bersandar pada beberapa prototype desain selama analisis desain. Setiap prototype digunakan untuk meminimalisasi resiko yang berkaitan dengan sistem dengan cara mengkonfirmasikan bahwa permasalahanpermasalahan penting dapat dimengerti sebelum sistem yang nyata dibuat. Setelah permasalahan dipecahkan, projek maju ke tahap desain dan implementasi. Pada tahap ini, prototype desain tidak digunakan lagi. Oleh karena itu disebut Throwaway Prototyping.
2.3
SQLite SQLite merupakan sebuah sistem manajemen basis data relasional yang bersifat ACID dan memiliki ukuran yang relative kecil, ditulis dalam bahasa C. SQLite merupakan proyek yang bersifat domain umum yang dikerjakan oleh D. Richard Hipp. Tidak seperti pada paradigma clientserver umumnya, inti SQLite bukanlah sebuah sistem yang mandiri yang berkomunikasi dengan sebuah program, melainkan sebagai bagian integral dari sebuah program secara keseluruhan. Sehingga protokol komunikasi utama yang digunakan adalah melalui pemanggilan API secara langsung melalui bahasa pemrograman. Mekanisme seperti ini tentunya membawa keuntungan karena dapat mereduksi overhead, latency times, dan secara keseluruhan lebih sederhana. Seluruh elemen basis data (definisi data, tabel, indeks, dan data) disimpan sebagai sebuah file. Kesederhanaan dari sisi disain tersebut bisa diraih dengan cara mengunci keseluruhan file basis data pada saat sebuah transaksi dimulai.
3. ANALISIS DAN PEMBAHASAN 3.1 Analisis Masalah Aplikasi yang dikembangkan adalah aplikasi ebook reader pada mobile device, berikut adalah bagan dari proses pengembangan aplikasi tersebut
Gambar 3.1 Bagan Analisis Masalah Bagan pada gambar 3.1 di atas menjelaskan proses aplikasi ingin dikembangkan, yaitu aplikasi ebook reader pada mobile device. Pada aplikasi ebook publisher-nya disediakan web service untuk mengakses ebook yang telah
dipublikasikan. Data ebook yang telah dipublikasikan tersebut memberikan informasi untuk mengakses file ebook yang dapat diunduh. File ebook tersebut menggunakan format HTML dan memanfaatkan library Javascript Monocle agar dapat dibaca dengan mudah pada web browser. Aplikasi yang dikembangkan tersebut adalah aplikasi yang tampak seperti aplikasi native (asli) pada mobile sistem Android. Namun, karena bentuk file ebook-nya berbasis HTML dan library Monocle pun berbasis javascript, membuat pengembangan aplikasi tersebut akan sulit jika menggunakan library native dari Android. Salah satu cara mengatasinya adalah dengan menggunakan library yang juga berbasis HTML dan JavaScript, sehingga pembacaan file ebook reader tersebut menjadi lebih mudah. Pada penulisan lainnya, library Sencha Touch digunakan sebagai basis aplikasi yang menggunakan HTML dan JavaScript untuk menyediakan user interface yang menarik. Tetapi, library Sencha Touch tidak memiliki fungsi untuk mengakses fungsi-fungsi native dari Android, seperti akses database sqlite, akses file sistem dan pengaksesan status network internet dari Android. Oleh karena itu, dibutuhkan penghubung antara Sencha Touch dan Android agar dapat berfungsi seperti aplikasi native Android. Framework PhoneGap merupakan framework yang berbasis HTML dan JavaScript serta memiliki fungsi untuk mengakses fungsi native Android. Sehingga, PhoneGap inilah yang akan digunakan untuk menghubungkan antara Sencha Touch dan Android. Jadi, aplikasi ebook reader yang dikembangkan menggunakan framework Sencha Touch dan PhoneGap ini harus memiliki empat fungsi utama yaitu: 1. Mengakses data ebook yang telah dipublikasi secara online 2. Menyimpan file ebook yang dikehendaki oleh pengguna
3. Menampilkan data ebook yang telah disimpan 4. Membaca file ebook yang dikehendaki oleh pengguna 3.2
Teknik Requirements Determination
Requirements determination bertujuan untuk mengubah kebutuhan pengguna dalam bentuk permintaan ke dalam suatu daftar yang lebih tepat. Sebelum menentukan requirements, terlebih dahulu akan dilakukan requirements gathering dengan menggunakan teknik observasi dan dokumen analisis. Teknik ini dilakukan pada sistem ebook reader pada Android. Ebook reader pada Android dipilih karena sudah banyak smart phone dengan sistem Android saat ini. Pada sistem ebook tersebut, pengguna dapat melihat ebook apa saja yang disediakan publisher melalui daftar buku yang disediakan. Selain itu, pengguna juga dapat mengunduhnya jika ingin membaca buku tersebut. Animasi saat pengguna membaca ebook tersebut pun telah disediakan agar pengguna tidak jenuh saat membaca buku. Berdasarkan analisis masalah dan observasi pada ebook reader Android, maka ditentukan sistem yang dibuat. Sistem yang dibuat mirip dengan sistem ebook reader yang telah ada pada sistem Android. Adapun sistem yang dibuat adalah sebagai berikut: a) Pengguna dapat mengakses dan membaca dimana saja. Hal tersebut dikarenakan aplikasi ebook reader yang disediakan berupa aplikasi yang menggunakan mobile device. b) Pengguna dapat melihat ebook yang telah disediakan dan telah diunggah oleh publisher pada daftar buku secara online. Selain itu, pengguna dapat melihat dari ebook yang tersedia sebelum mengunduhnya c) Jika ingin membaca ebook, pengguna dapat mengunduh ebook tersebut secara online. Hal tersebut sekaligus akan
menyimpan ebook yang diunduh ke dalam memori pada sistem Android. d) Setelah selesai mengunduh ebook, maka user harus kembali ke offline ebook agar dapat membaca ebook yang telah diunduh. Ebook akan disediakan menggunakan library Monocle. 3.3
Perancangan Sistem Perancangan sistem yang digunakan adalah functional modeling yang bertujuan untuk mendeskripsikan proses dan interaksi suatu sistem terhadap lingkungan sekitar sistem. Interaksi tersebut digambarkan dengan beberapa activity diagram. Activity diagram tersebut adalah sebagai berikut : a) Activity Diagram Apps b) Activity Diagram Book Model c) Activity Diagram Book Detail d) Activity Diagram Download Ebook e) Activity Diagram OffBook Detail 3.3.1 Apps Apps merupakan namespace yang dimiliki oleh Sencha Touch. Namespace tersebut secara otomatis akan terbentuk pada controllers, models, dan views. Isi dari apps ini merupakan bagian terpenting ketika program dijalankan. Apabila PhoneGap dan Sencha Touch telah siap, maka barulah aplikasi ini dapat berjalan. Proses pertama yang dilakukan adalah membuka database lalu membuat tabel “book” untuk menyimpan ebook yang diunduh oleh pengguna. Proses ini hanya dilakukan saat pertama kali program dijalankan. Apabila sudah ada database dan tabel yang dimaksud, maka akan dilanjutkan dengan mengecek koneksi internet untuk mengunduh Monocle Source Code dalam bentuk .zip yang kemudian akan di unzip. Monocle Source Code merupakan library Monocle yang akan digunakan untuk membaca ebook reader. Berikut pada gambar 3.2 adalah gambaran dari activity diagram apps
3.3.3 Book Detail Book detail merupakan tampilan dimana pengguna dapat melihat detail dari buku yang diinginkan. Activity diagramnya adalah seperti gambar 3.4 berikut
Gambar 3.2 Activity Diagram Apps 3.3.2 Book Model Book model merupakan tahap dimana akan dijalankannya transaksi data setelah database dibuka. Semua data yang ada pada tabel “book” akan dimasukkan satu per satu ke dalam result row dalam bentuk array yang kemudian akan ditampilkan pada daftar buku. Proses ini akan dilanjutkan oleh Sencha Touch Model yang dibahas pada penelitian lain. Gambar 3.3 berikut merupakan gambaran dari activity diagram book model.
Gambar 3.2 Activity Diagram Book Model
Gambar 3.4 Activity Diagram Book Detail 3.3.4 Download Ebook Tahap ini merupakan tahap dimana file ebook diunduh dalam bentuk zip kemudian di unzip oleh sistem. Saat file telah diunduh, file tersebut akan dibaca sebagai zip file. Kemudian sistem akan mengecek satu per satu isi dari zip file tersebut. Setelah itu, sistem akan membuat file tersebut atau dengan kata lain menulis ulang file yang telah di unzip ke dalam file objek. Apabila dalam zip file tersebut terdapat direktori, maka akan dibuat pula direktori sesuai dengan yang ada. Proses pengecekan isi file zip ini akan terus berlangsung sampai semua file yang ada di dalam zip file habis. Jika semua file telah terunzip, maka file zip yang diunduh akan dihapus. Gambar 3.5 di bawah ini merupakan gambar dari diagram activity dari proses unduh file sampai proses unzip.
Gambar 3.5 Activity Diagram Download Ebook 3.3.5 Offbook Detail Proses ini merupakan tahap untuk membaca ebook yang telah diunduh. Ketika sistem menerima inputan dari button save, maka sistem akan meminta file sistem root untuk mengambil data ebook. Setelah sukses maka akan dilanjutkan dengan mengambil direktori secara asynchronous. Dimulai dari direktori DroidCemara, direktori ebook dan direktori book id. Apabila pengambilan direktori secara asynchronous tersebut berhasil, maka akan dilanjutkan dengan mengambil file index.html dari ebook yang ingin dibaca. File tersebut akan dibuka melalui child browser, yaitu plugin untuk menampilkan suatu link agar terbuka pada halaman yang sama, tanpa harus membuka browser baru. Setelah itu, file dapat dibaca dengan bantuan library Monocle. Berikut pada gambar 3.6 merupakan gambar activity diagram dari offbooks detail atau proses untuk menampilkan ebook.
Gambar 3.6 Activity Diagram OffBook Detail Perancangan Database Database atau basis data merupakan salah satu bagian yang penting dalam aplikasi ini, terutama untuk pengaksesan ebook secara offline. Database digunakan untuk menyimpan data ebook yang telah diunduh oleh pengguna dan jenis database yang digunakan adalah SQLite. Tabel yang ada pada database di dalam aplikasi ini hanya terdiri dari satu buah tabel yaitu tabel dengan nama “BOOK”. Tabel tersebut memiliki enam buah field dengan skema seperti pada table 3.1 berikut ini Tabel 3.1 Rancangan Database 3.4
3.5
Pembuatan Program Pembuatan program dalam aplikasi ini dilakukan dalam beberapa tahap. Tahap-tahap tersebut diantaranya install software, membuat project Phonegap, membuat database dan tabel, mengunduh dan mengunzip Monocle, dan lain-lain. Lebih jelasnya, proses pembuatan aplikasi ini dapat terlihat pada gambar 3.7 di bawah ini
Application. Berikut adalah tampilan saat program dijalankan pada emulator 2.2
Gambar 3.8 Offline Books List
Gambar 3.7 Activity Diagram Pembuatan Program 3.6
Pengujian Dan Implementasi Setelah program selesai dibuat, terakhir adalah proses uji coba aplikasi ke dalam perangkat Lunak. Uji coba aplikasi dilakukan pada emulator Android 2.2 serta Android 2.3.3. Sedangkan implementasi program dilakukan pada galaxy tab 7 dengan sistem Android 2.2 atau froyo. 3.6.1 Pengujian Pada Emulator v2.2 Uji coba pertama dilakukan pada emulator 2.2 yang dilakukan dengan menjalankan program sebagai android application, langsung pada editor eclipse. Sebelum program dijalankan, harus dipastikan bahwa emulator telah dibuat. Jika belum, maka emulator dapat dibuat dengan cara mengklik icon AVD pada toolbar eclipse. Setelah memilih icon tersebut, maka akan muncul window baru, kemudian pilih new. Setelah emulator berhasil dibuat, program dijalankan dengan cara klik kanan pada aplikasi Run As Android
Gambar 3.9 Offbook Detail
Gambar 3.10 Ebook Reader Pada Emulator 3.6.2 Pengujian Pada emulator v2.3.3 Uji coba yang dilakukan di emulator android 2.3.3 tidak berbeda caranya dengan uji coba pada emulator 2.2. Buat emulator dengan cara yang telah dijelaskan, hanya saja nama, versi dan size nya berbeda.
3.6.3 Implementasi Program Implementasi program dilakukan pada smart phone dengan sistem operasi Android yaitu Samsung Galaxy Tab 7. Sebelum mengimplementasikan program ke dalam galaxy tab tersebut, terlebih dahulu harus mengirim file .apk dari projek yang telah dibuat. File .apk terdapat di dalam folder projek yang dibuat yang berada di dalam workspace. Misalnya projek yang dibuat bernama DroidCemara maka file .apk dapat diambil di C://Users/user/workspace/DroidCemara/bi n/DroidCemara.apk. file .apk tersebut dapat dikirim melalui Bluetooth, setelah itu dapat langsung di install pada galaxy tab 7 tersebut, hasilnya akan sama persis dengan emulatornya. Berikut adalah gambaran pada pengujian di galaxy tab 7
Gambar 3.13 Offline Books List
Gambar 3.14 Offline Book Detail
Gambar 3.11 Online Books List
Gambar 3.12 Online Book Detail
Gambar 3.15 Ebook Reader Pada Galaxy Tab 7
4. KESIMPULAN DAN SARAN 4.1 Kesimpulan Setelah melakukan pengembangan pada back-end sistem pada mobile device Android, pengembangan tersebut telah berhasil dilakukan. Phonegap berhasil menjembatani antara web browser dengan sistem Android, terutama saat diakses secara offline. Proses tersebut dilakukan dengan menggunakan metode Throwaway prototyping, yaitu dengan menanalis, mendesain dan membangun prototype desain. Pengujian telah dilakukan pada beberapa emulator dengan versi Android yang berbeda dan perangkat mobile dengan sistem Android, tetapi terdapat perbedaan dalam kecepatan mengakses data. Hal tersebut tergantung kepada versi Android tersebut. Adapun perangkat yang dijadikan uji coba yaitu emulator 2.2, emulator 2.3.3, dan Samsung Galaxy Tab 7. Hasilnya sesuai dengan yang direncanakan, back–end sistem dapat mengakses ebook dari sistem client android. 4.2 Saran Aplikasi ebook reader pada mobile Android dapat dikembangkan lagi dengan mengganti proxy yang dipakai saat online menjadi proxy berbasis Phonegap. Metode yang digunakan pun dapat diganti dengan metode lain, selain throwaway prototyping. Selain itu, pengembangan juga dapat dilakukan dengan mengaplikasikan program pada Android dengan versi dan merk yang berbeda serta pada device lain seperti pada iphone. DAFTAR PUSTAKA [1] Damon Oehlman dan Sebastien Blanc, Pro Android Web Apps: Develop for Android Using HTML5, CSS3 & JavaScript, www.apress.com, 2011
[2] Dennis, Alan., et al., Systems Analysis and Design with UML Version 2.0 : An Object Oriented Approach, 2nd ed., John Willey & Sons, Inc., Hoboken, 2005.
[3]
[4]
[5]
[6]
Jonathan Stark, Building Android Apps, O’Reilly Media, Inc., 1005 Gravenstein Highway North, 2010 Object Management Group (OMG), “Documents Associated with UML version 2.3”, http://www.omg.org/spec/UML/2.3/, Tanggal Akses: 27 Januari 2011.
UML-Diagrams.Org Team., “UML”, http://www.uml-diagrams.org/, Tanggal Akses : 18 Januari 2011.
de Koch, N. P., “Software Engineering for Adaptive Hypermedia Systems”, http://www.pst.informatik.unimuenchen.de/~kochn/PhDThesisNor aKoch.pdf, 2000, Tanggal Akses : 18 Januari 2011. [7] URL: http://www.creativebrain.web.id/me dia.php?action=readnews&id=178&t itle=Membuat%20Aplikasi%20Smar tphones%20dengan%20PhoneGap, Tanggal Akses: 18 Agustus 2011 [8]. URL: http://docs.phonegap.com/phonegap _connection_connection.md.html Tanggal Akses: 18 Agustus 2011 [9] URL: http://setiawanputu.blogspot.com/20 10/07/pengertian-html-5-danelemen-elemennya.html Tanggal Akses: 18 Agustus 2011
