Embed Size (px)
Citation preview
Pengembangan Jurnal Elektronik FTI UKSW Berbasis Web
menggunakan Framework CodeIgniter
Artikel Ilmiah
Diajukan kepada
Fakultas Teknologi Informasi
untuk memperoleh Gelar Sarjana Komputer
Peneliti:
Kevin Johan Prasetya (672011017)
Ramos Somya, S.Kom., M.Cs.
Program Studi Teknik Informatika
Fakultas Teknologi Informasi
Universitas Kristen Satya Wacana
Salatiga
Maret 2016
1
2
3
4
5
1. Pendahuluan
Teknologi informasi dapat digunakan untuk membantu dalam peningkatan
kinerja suatu bisnis atau organisasi. Untuk mengoptimalkan proses bisnisnya,
perusahaan memanfaatkan teknologi informasi melalui pembangunan aplikasi, di
mana aplikasi-aplikasi tersebut diharapkan dapat membuat proses bisnis perusahaan
menjadi lebih efisien. Sistem informasi telah menjadi salah satu faktor penting dalam
sebuah organisasi seperti perguruan tinggi. Sistem informasi yang ada dalam suatu
perguruan tinggi dapat terbagi menjadi beberapa bidang sesuai dengan kebutuhan,
misalnya Sistem Informasi Akademik, Sistem Informasi Keuangan, Sistem Informasi
Kepegawaian, dan lainnya.
Fakultas Teknologi Informasi Universitas Kristen Satya Wacana (FTI UKSW)
merupakan salah satu fakultas yang sudah memanfaatkan sistem informasi dalam
kegiatan proses bisnisnya. Salah satu sistem informasi yang ada adalah Sistem
Informasi Jurnal Elektronik yang dapat diakses melalui alamat
http://ftiuksw.org/ejournal. Elektronik Jurnal ini digunakan untuk menerbitkan jurnal
FTI UKSW yang bernama Jurnal AITI. Melalui jurnal elektronik ini, pengguna dapat
mengakses artikel-artikel yang ditulis oleh dosen dan mahasiswa baik dari FTI
UKSW maupun dari universitas lain secara online. Pengguna juga dapat mencari
jurnal berdasarkan kriteria pencarian yang ada sekaligus dapat mengunduh jurnal
tersebut.
Berdasarkan analisis yang dilakukan terhadap pengembang jurnal elektronik di
FTI UKSW didapatkan beberapa kekurangan yang terdapat pada sistem tersebut.
Jurnal Elektronik FTI UKSW belum memiliki fitur khusus untuk pengelolaan jurnal.
Selama ini untuk proses penambahan data jurnal, penulis jurnal dan data-data lainnya
masih dilakukan secara langsung lewat cpanel, yaitu melalui PHPMyAdmin. Hal ini
menyebabkan pengelola jurnal kesulitan dalam hal pengelolaan data jurnal, karena
belum tersedia bagian front-end yang dapat digunakan untuk mengelola jurnal
dengan mudah.
Jurnal elektronik tersebut juga belum memiliki fitur responsive, sehingga
hanya dapat diakses melalui layar komputer atau laptop. Jika dibuka melalui tablet
maupun smartphone, maka tampilan tidak dapat menyesuaikan dengan layar. Hal ini
menyulitkan pengguna, mengingat pada waktu ini para pengguna juga menggunakan
tablet dan smartphone dalam mengakses jurnal elektronik tersebut.
Jurnal elektronik yang sudah ada juga masih menyimpan file jurnal dalam
bentuk database, sehingga data yang di-upload oleh pengelola jurnal harus diubah ke
binear. Barulah data dapat masuk ke dalam database, sedangkan jika pengunjung
ingin mendownload file tersebut sistem akan mengkonversi kembali dari kode binear
ke dalam format file. Hal ini tidak efektif sehingga pada penelitan ini dirubah ke
skema yang lebih simple, yaitu penyimpanan jurnal disimpan langsung pada folder.
Sehingga tidak perlu dirubah dulu kedalam kode binear seperti pada jurnal
sebelumnya.
Berdasarkan latar belakang yang telah dijelaskan, pada penelitian ini akan
dilakukan pengembangan dari jurnal elektronik FTI UKSW untuk mengatasi
permasalahan yang ada. Jurnal elektronik akan dikembangkan menggunakan
framework CodeIgniter (CI) sebagai kerangka kerjanya, sedangkan untuk membuat
menjadi responsive web akan digunakan juga library Bootstrap. Pengembangan
6
dilakukan dengan mengubah basis data yang digunakan. Pemilihan penggunaan
framework CodeIgniter adalah karena framework tersebut tergolong ringan sehingga
tidak memberatkan kerja server. Selain itu framework CI juga mendukung Model
View Controller (MVC), sehingga pengembangan aplikasi akan menjadi lebih
terorganisir dengan baik. Framework CI juga menyediakan library yang dapat
membantu dalam pengembangan aplikasi, seperti library session dan library MVC
yang akan digunakan dalam penelitian ini.
Batasan masalah dalam penelitian ini adalah: 1) Pengembangan dilakukan
dengan membuat ulang sistem elektronik jurnal, karena sistem yang lama
dikembangkan dengan teknik pemrograman terstruktur, 2) Basis data diganti dengan
skema baru yang lebih ringkas, 3) Elektronik jurnal ini digunakan hanya untuk
mengelola data jurnal yang telah lolos review dan sudah dinyakatakan lolos untuk
dilakukan publikasi, 4) Tidak membahas tentang proses seleksi dan review jurnal, 5)
Tidak membahas keamanan data, 6) Tidak terdapat fitur membaca artikel online.
Alasan tidak menggunakan OJS (Open Journal Systems) adalah karena untuk
mendapatkan full service dari OJS harus mengeluarkan biaya. Biaya hosting dan
pembelian tema tergolong mahal. Tidak dapat merubah tema atau template yang
sudah ada. Jika akan dirubah salah satu akan merubah template yang lainnya.
2. Kajian Pustaka
Penelitian yang digunakan sebagai acuan dalam penelitian ini ada 2. Penelitian
terdahulu yang pertama dilakukan pada tahun 2003, yaitu pada penelitian tersebut
dilakukan pembuatan Sistem Online Journal menggunakan teknologi Active Server
Pages dengan sistem database Microsoft Access 2000. Untuk mengimplementasikan
sistem, terlebih dilakukan survey mengenai proses publikasi jurnal pada Jurnal
Elektro. Hasil pengujian sistem menunjukkan bahwa interface Online Journal telah
user friendly karena menu untuk masing-masing user group telah disesuaikan dengan
kebutuhan dari tiap user [1].
Penelitian terdahulu yang kedua dilakukan pada tahun 2010. Pada penelitian
tersebut dilakukan pembuatan Jurnal Elektronik Fakultas Matematika dan Ilmu
Pengetahuan Alam Universitas Sebelas Maret. Jurnal Elektronik dikembangkan
menggunakan PHP dan basis data MySQL. Website jurnal elektronik fakultas
Mathematika dan Ilmu Pengetahuan Universitas Sebelas Maret memiliki fasilitas
diantaranya menampilkan data jurnal, penelitian, proceeding, melakukan searching,
men-download, dan meng-upload data jurnal maupun karya tulis ilmiah lainnya [2].
Sistem informasi adalah suatu sistem dalam suatu organisasi yang
mempertemukan kebutuhan pengolahan transaksi harian yang mendukung fungsi
operasi organisasi yang bersifat manajerial dengan kegiatan strategi dari suatu
organisasi untuk dapat menyediakan kepada pihak luar tertentu dengan informasi
yang diperlukan untuk pengambilan keputusan. Sistem informasi dalam suatu
organisasi dapat dikatakan sebagai suatu sistem yang menyediakan informasi bagi
semua tingkatan dalam organisasi tersebut kapan saja diperlukan. Sistem ini
menyimpan, mengambil, mengubah, mengolah dan mengkomunikasikan informasi
yang diterima dengan menggunakan sistem informasi atau peralatan sistem lainnya
[3].
7
Web adalah suatu metode untuk menampilan informasi di internet, baik berupa
teks, gambar, suara maupun video yang interaktif dan mempunyai kelebihan untuk
menghubungkan (link) satu dokumen dengan dokumen lainnya (hypertext) yang
dapat diakses melalui sebuah browser. Secara umum situs web mempunyai beberapa
fungsi, yaitu fungsi komunikasi, fungsi informasi, fungsi hiburan dan fungsi
transaksi [4].
Pada konteks penelitian ini, framework dapat diartikan sebagai alat yang
digunakan untuk membantu dan memudahkan dalam pembuatan situs web.
Framework juga dapat didefinisikan sebagai kumpulan script (terutama class dan
function) yang dapat membantu developer dalam menangani berbagai masalah dalam
pemrograman seperti koneksi ke basis data, pemanggilan variable dan fungsi-fungsi
lainnya sehingga developer dapat lebih fokus dan lebih cepat membangun aplikasi
[5]. Sebuah framework umumnya telah menyertakan perintah-perintah siap pakai
yang dibutuhkan dalam membuat suatu aplikasi, namun pihak developer tetap harus
menulis kode sendiri dan harus menyesuaikan dengan lingkungan framework yang
digunakan.
CodeIgniter (CI) adalah salah satu framework PHP yang tangguh dan popular.
CodeIgniter tergolong framework dengan ukuran kecil dan cukup mudah dikuasai. CI
juga datang dengan manual yang tergolong lengkap. CodeIgniter merupakan aplikasi
sumber terbuka yang berupa framework PHP dengan model MVC (Model, View,
Controller) untuk membangun website dinamis dengan menggunakan PHP.
CodeIgniter memudahkan developer untuk membuat aplikasi web dengan cepat
mudah dibandingkan dengan membuatnya dari awal. CodeIgniter dirilis pertama kali
pada 28 Februari 2006. Versi stabil terakhir adalah versi 3.0.4 [6].
Istilah Responsive Web Design sendiri pertama kali diperkenalkan oleh Ethan
Marcotte dalam bukunya yang berjudul “Responsive Web Design”. Dibahas
mengenai 3 teknik yang digunakan dalam membangun sebuah Responsive Web
Design, yaitu: flexible grid layout, flexible images dan media queries. Flexible grid
yaitu sebuah konsep ukuran elemen halaman dengan pilihan satuan persen daripada
satuan absolut seperti pixel atau point, flexible images yaitu sebuah teknik mencegah
agar media gambar, video, object, tidak melewati batas dari elemen container, media
queries merupakan modul CSS3 memungkinkan render konten untuk beradaptasi
dengan kondisi seperti resolusi. Sebuah media queries terdiri dari jenis media dan 1
atau lebih ekspresi. Hasil dari media queries dinyatakan benar, jika perangkat dalam
media queries sesuai maka, stylesheet yang sesuai akan diterapkan [7].
Bootstrap sendiri merupakan framework yang biasa digunakan untuk membuat
aplikasi web ataupun situs web responsive secara cepat, mudah dan gratis. Twitter
Bootstrap adalah framework CSS open source yang awalnya dikembangkan oleh tim
twitter untuk para web designer yang terdiri dari CSS dan HTML untuk menghasilkan
Grid, Layout, Typography, Table, Form, Navigation dan lain-lain. Selain itu, di
dalam Bootstrap juga sudah terdapat jQuery plugins untuk menghasilkan komponen
User Interface yang lebih menarik seperti Transitions, Modal, Dropdown, Scrollspy,
Tooltip, Tab, Alert dan lain-lain [8].
Jurnal elektronik adalah terbitan serial seperti bentuk tercetak tetapi dalam
bentuk elektronik. Biasanya terdiri dari tiga format yaitu : text, grafik, dan full image
(dalam bentuk PDF). Jurnal elektronik memiliki beberapa kelebihan, di antaranya
8
dari segi kemutakhiran, kecepatan penerimaan, penyimpanan, pemanfaatan,
kesempatan akses, waktu penelusuran lebih cepat, lebih aman, manipulasi dokumen
sangat mudah, dapat berlangganan dengan dana yang sama, dan harga total
langganan yang jauh lebih murah. Jurnal elektronik sering kali sudah terbit sebelum
jurnal cetak diterbitkan sehingga dalam kecepatan penerimaan informasi jauh lebih
menguntungkan [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 [10]. Tahapan-tahapan yang
dilakukan dalam penelitian ini dapat dilihat pada Gambar 1.
Gambar 1 Tahapan Penelitian
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 Jurnal Elektronik FTI UKSW. Berdasarkan wawancara didapatkan
informasi jika selama ini belum ada fasilitas front-end untuk pengelolaan data jurnal,
sehingga harus dilakukan melalui PHPMyAdmin. Selain itu jurnal elektronik
tersebut belum mempunyai fitur responsive, sehingga tidak bisa menyesuaikan
dengan berbagai ukuran layar di mana jurnal elektronik tersebut diakses. Tahap
kedua, ketiga dan keempat dilakukan perancangan jurnal elektronik 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. 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 [11]. Tahap-tahap dalam metode
prototyping ditunjukkan pada Gambar 2.
9
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.
Supaya aplikasi yang dibuat dapat memenuhi kebutuhan pengguna, maka
diperlukan suatu analisis kebutuhan sistem. Analisis kebutuhan sistem ini dilakukan
dengan melakukan pengelola Jurnal Elektronik FTI UKSW. Berdasarkan wawancara
didapatkan bahwa dibutuhkan sistem yang dapat memenuhi kebutuhan berikut ini: a)
kebutuhan administrator mencakup: dapat mengelola data jurnal, dapat mengelola
data penulis, dapat mengelola data pengelola jurnal (user) dan dapat mengelola data
berita atau pengumuman. b) kebutuhan pengelola jurnal mencakup: dapat mengelola
data jurnal, dapat mengelola data penulis dan dapat mengelola pengumuman. c)
sedangkan kebutuhan pengunjung jurnal elektronik mencakup: dapat melihat daftar
jurnal, dapat mengunduh jurnal dalam format PDF, dapat melakukan pencarian data
jurnal dan dapat melihat pengumuman seputar jurnal AITI.
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.
10
tambah jurnalhapus jurnal ubah jurnal
tambah pengumuman
hapus pengumuman
ubah pengumuman
tambah user
lihat user
ubah user
hapus user
mengelola jurnal
mengelola pengumuman
mengelola user
extendsextends
extends
extends
extendsextends extends
extends
extends
extends
extendsextends
extends
mengunduh jurnal
mencari jurnal
lihat pengumunan
lihat jurnal
pengunjung
lihat penulis
tambah penulis ubah penulis
hapus penulis
pengelola jurnaladministrator
mengelola penulisextends
extends extends
extends
Gambar 3 Use Case Diagram Sistem
Gambar 3 merupakan diagram use case dari aplikasi yang dibuat. Terdapat 3
(tiga) aktor dalam aplikasi, yaitu aktor administrator, pengelola jurnal dan
pengunjung. Aktor administrator merupakan pemilik hak akses tertinggi, di mana
bisa melakukan pengelolaan data jurnal, data penulis, data user dan data
pengumuman. Hak akses pengelola memiliki 3 (tiga) use case, yaitu mengelola
jurnal, data penulis dan mengelola pengumuman. Sedangkan aktor pengunjung
memiliki use case melihat data artikel jurnal, mengunduh artikel, mencari artikel dan
melihat pengumuman.
mulai
selesai
pilih link
create new
mengisi data
jurnal
menekan
tombol save
menampilkan
daftar jurnal
menyimpan
data jurnal
basis dataejournalpengelola j urnal
Gambar 4 Activity Diagram Tambah Artikel
Gambar 4 merupakan diagram activity untuk proses menambahkan artikel yang
dilakukan oleh pengelola jurnal. Aktivitas dimulai dengan memilih link create new.
Pengelola jurnal kemudian memasukkan data artikel yang terdiri dari volume jurnal,
nomor dan tahun jurnal, judul jurnal, penulis, abstrak, kata kunci dan file artikel
dalam format PDF. Data jurnal kemudian akan tersimpan dalam basis data setelah
pengelola jurnal menekan tombol save.
11
mulai
selesai
memilih volume
jurnal
memilih
nomor jurnal
memilih judul
jurnal
mengunduh
jurnal
ejournalpengunjung
Gambar 5 Diagram Activity Unduh Artikel
Gambar 5 merupakan diagram activity untuk proses unduh artikel yang
dilakukan oleh pengunjung jurnal. Pengunjung jurnal pertama kali memilih volume
jurnal, nomor jurnal dan judul artikel yang akan diunduh. Proses unduh akan berjalan
setelah pengunjung memilih link download pada halaman web.
mulai
selesai
memilih menu
pengumuman
memilih link
create new
menuliskan
pengumuman
menekan
tombol save
menampilkan daftar
pengumuman
menyimpan data
pengumuman
basis dataejournalpengelola jurnal
Gambar 6 Diagram Activity Tambah Pengumuman Gambar 6 merupakan diagram activity untuk proses tambah pengumuman yang
dilakukan oleh pengelola jurnal. Pengelola jurnal memilih menu pengumuman pada
halaman utama. Selanjutnya dipilih link create new. Pengelola jurnal selajutnya
memasukkan isi pengumuman pada form yang ditampilkan. Data pengumuman ini
berupa judul pengumuman, isi pengumuman dan file yang disisipkan. Data
pengumuman selanjutnya akan disimpan dalam basis data.
12
: pengelola jurnal
insertView jurnalController jurnalModel basis data
1: mengisi data jurnal (volume,
nomor, judul, penulis, kata kunci,
abstrak, pdf)
2: memanggil fungsi
insert() 3: memanggil
model jurnal4: memproses
insert jurnal
5: menyimpan data jurnal
Gambar 7 Sequence Diagram Proses Tambah Artikel
Gambar 7 merupakan diagram sequence untuk proses menambah data artikel
yang dilakukan oleh pengelola jurnal. Pengelola jurnal mengisikan data artikel yang
terdiri dari volume jurnal, nomor jurnal, judul, penulis, kata kunci, abstrak dan file
PDF. Setelah tombol save ditekan, fungsi insert yang berada di file controller jurnal
akan dipanggil. Pada fungsi insert ini dilakukan pemanggilan model jurnal untuk
memerintahkan menyimpan data artikel yang telah dimasukkan tadi ke dalam basis
data.
: pengunjungviewJurnal jurnalController jurnalModel basis data
1: memilih judul
jurnal 2: meminta data
jurnal yang
dipilih 3: memanggil
model jurnal
4: select jurnal
5: mengambil data
jurnal yang dipilih
6: mengirimkan data jurnal
7: mengirimkan data jurnal
8: mengirimkan data jurnal
9: menampilkan data jurnal
10: mengunduh jurnal
Gambar 8 Sequence Diagram Proses Unduh Artikel
Gambar 8 merupakan diagram sequence untuk proses unduh artikel yang
dilakukan oleh pengunjung. Pengunjung pertama kali memilih judul artikel yang
akan diunduh. File jurnal controller akan dipanggil dan memanggil model jurnal
13
untuk memerintahkan basis data mengambil data artikel yang dipilih. Data artikel
dari basis data kemudian akan ditampilkan pada halamam view. Pengunjung
kemudian dapat mengunduh artikel tersebut dalam format PDF.
: pengelola jurnal
insertView pengumumanController pengumumanModel basis data
1: memasukkan data
pengumuman (judul, isi dan
file) 2: memanggil fungsi insert
pengumuman3: memanggil model
pengumuman4: mengeksekusi
perintah insert
5: menyimpan data pengumuman
Gambar 9 Sequence Diagram Proses Tambah Pengumuman
Gambar 9 merupakan diagram sequence untuk proses tambah pengumuman
yang dilakukan oleh pengelola jurnal. Pengisian data pengumuman dilakukan
melalui halaman insert view. Data pengumuman terdiri dari judul pengumuman, isi
pengumuman dan file yang akan disisipkan. Perintah selanjutnya adalah memanggil
fungsi insert yang berada di file jurnal controller. Fungsi insert akan memanggil
model jurnal untuk melakukan perintah simpan ke dalam basis data. Basis data
kemudian menyimpan data pengumuman tersebut dalam tabel pengumuman.
Gambar 10 Class Diagram Aplikasi
Gambar 10 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 4 (empat) Model Class, yaitu JurnalModel,
PenulisModel, PengumumanModel dan UserModel. Sedangkan Controller Class
bertugas untuk menghubungkan bagian view dengan bagian Model Class. Pada
aplikasi ini terdapat 4 (empat) Controller Class, yaitu JurnalController,
PenulisController, PengumumanController dan UserController. Bagian view tidak
14
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 dua kali dan dilakukan dengan
mendemokan aplikasi kepada pengguna aplikasi (administrator dan pengelola jurnal).
Penjelasan setiap tahap evaluasi prototyping adalah sebagai berikut : Evaluasi tahap
pertama dilakukan bersama user aplikasi yaitu kepada administrator dan pengelola
jurnal. Pada evaluasi ini dilakukan penambahan fasilitas untuk memberikan berita
atau pengumuman kepada pengujung jurnal. Hal ini berguna untuk memberikan
informasi seperti panduan penulisan jurnal, pengumuman akan diadakannya
publikasi jurnal dan pengumuman penting lainnya. Evaluasi tahap kedua dilakukan
dengan memperbaiki beberapa bagian aplikasi yang masih ada bug, seperti tidak
munculnya pagination pada halaman home dan mengubah tampilan daftar jurnal
dengan format list supaya terlihat lebih rapi.
4. Hasil Implementasi dan Pembahasan
Implementasi dari pengembangan jurnal elektronik FTI UKSW ini dilakukan
dengan framework CodeIgniter. Terdapat beberapa pengaturan yang harus dilakukan
pertama kali saat pembuatan, yaitu pengaturan koneksi ke basis data MySQL dan
pengaturan route file. Pengaturan koneksi basis data dilakukan pada file database
yang terletak pada folder config. 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 MySQL. 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
folder controller.
1. $db['default'] = array( 2. 'dsn' => '',
3. 'hostname' => 'localhost',
4. 'username' => 'root',
5. 'password' => 'admin',
6. 'database' => 'ejournal_db',
7. 'dbdriver' => 'mysqli',
8. 'dbprefix' => '',
9. 'pconnect' => FALSE,
10. 'db_debug' => FALSE,
1. $route['default_controller'] = home;
2. $route['404_override'] = '';
3. $route['translate_uri_dashes'] = FALSE;
15
Gambar 11 Halaman Home Elektronik Jurnal FTI UKSW
Gambar 11 merupakan halaman depan dari sistem elektronik jurnal FTI
UKSW. Halaman ini akan menampilkan daftar jurnal yang sudah dimasukkan dalam
basis data. Sistem elektronik jurnal ini dikembangkan dari sistem sebelumnya
menjadi lebih responsive dalam sisi tampilan. Gambar 12 merupakan tampilan
elektronik jurnal ketika dibuka di web browser pada tablet.
Gambar 12 Halaman Home Elektronik Jurnal FTI UKSW pada Tablet
Gambar 12 merupakan tampilan elektronik jurnal ketika dibuka melalui
browser tablet. Halaman web akan terlihat menyesuaikan dengan layar device di
mana web tersebut diakses. Proses ini dilakukan dengan memanggil CSS yang
terdapat pada library Bootstrap. Kode Program 3 Pemanggilan CSS Bootstrap
Kode Program 3 merupakan perintah dalam pemanggilan CSS Bootstrap dan
1. <link rel="stylesheet" href="<?= base_url(); ?>assets/css/bootstrap.css" rel="stylesheet">
2. <link rel="stylesheet" href="<?= base_url(); ?>assets/css/responsive.css" rel="stylesheet">
16
responsive yang merupakan bagian dari library Bootstrap. File ini diletakkan di
dalam folder assets, sedangkan pemanggilannya dilakukan di file header yang
diletakkan pada folder layout di bagian view.
Pengunjung jurnal dapat melihat daftar jurnal yang ada berdasarkan volume
dan tahun. Jurnal AITI ini terbit setiap tahun, di mana setiap tahun terdiri dari 2
nomor. Nomor 1 terbit pada bulan Februari dan nomor 2 terbit pada bulan Agustus.
Masing-masing nomor jurnal terdiri dari 7 jurnal. Gambar 13 merupakan tampilan
daftar jurnal AITI untuk volume 4, nomor 1 tahun 2007.
Gambar 13 Daftar Jurnal AITI dalam menu Volume
Untuk menampilkan daftar jurnal pada Gambar 13, digunakan dengan prinsip
Model View Controller (MVC). Pada proses ini, pertama kali akan dipanggil fungsi
list_jurnal yang terdapat pada file Home (terletak di bagian controller). Fungsi
list_jurnal ini akan melakukan pemanggilan fungsi get_all yang terdapat di file
Jurnal_model (terletak di bagian model). Fungsi get_all ini bertugas melakukan
query untuk mengambil data jurnal dari basis data berdasarkan nomor dan volume.
Selanjutnya bagian fungsi list_jurnal pada controller Home akan meneruskan data
jurnal yang didapat dari pemanggilan fungsi get_all ke bagian view list_jurnal
sehingga tersaji seperti Gambar 13. Kode Program 4 merupakan perintah pada fungsi
list_jurnal pada bagian Home controller. Kode Program 5 merupakan perintah fungsi
get_all pada bagian model dan Kode Program 6 merupakan perintah pada bagian
view list_jurnal. Kode Program 4 Fungsi list_jurnal pada Home Controller
Kode Program 5 Fungsi get_all pada Jurnal Model
Kode Program 6 Perintah pada Bagian View list_jurnal
3. $data['jurnals'] = $this->jurnal_model->get_all('nomor', $data['nomor'], $limit, $start);
4. $this->load->view('home/list_jurnal', $data);
1. function get_all($type_search, $value_search, $offset, $limit) {
2. $this->db->select('*'); 3. $this->db->from('jurnal'); 4. $this->db->limit($limit, $offset); 5. $this->db->order_by('volume', 'asc');
1. foreach ($jurnals as $jurnal): 2. ?><a href="<?= base_url('home/view_jurnal/' . $jurnal->id);
?>"><h3><?= $numb . '. ' . $jurnal->judul; ?></h3></a>
<?php $numb++;
3. endforeach;
17
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 sistem elektronik jurnal ini, pengunjung dapat melihat detail dari jurnal
yang dipilih dan dapat juga mengunduh jurnal tersebut dalam format PDF. File PDF
ini disimpan dalam folder assets pada directory project. Pada sistem yang lama, file
PDF ini disimpan dalam tabel jurnal pada basis data, sehingga memberatkan kinerja
sistem karena harus melakukan konversi dari file binary ke file PDF. File PDF jika
disimpan dalam tabel pada basis data akan disimpan dalam bentuk binary, sehingga
untuk menampilkan atau mengunduhnya harus dilakukan proses konversi dari file
binary ke file PDF. Gambar 14 merupakan halaman lihat detail jurnal.
Gambar 14 Halaman Lihat Jurnal
Pengembangan berikutnya dilakukan dengan menambahkan halaman
administrator untuk melakukan pengelolaan data jurnal. Pada sistem elektronik jurnal
sebelumnya belum memiliki halaman untuk mengelola data jurnal. Data jurnal
sebelumnya dikelola melalui halaman PHPMyAdmin sehingga merepotkan dalam
proses penambahan dan perubahan data jurnal.
18
Gambar 15 Halaman Untuk Mengelola Data Jurnal
Pengelola jurnal dapat menambah, mengubah dan menghapus data jurnal
melalui halaman kelola jurnal yang dapat diakses melalui halaman admin. Proses ini
membutuhkan validasi login ke dalam halaman admin.
Gambar 16 Halaman Untuk Memasukkan Data Jurnal
Proses penambahan jurnal baru dapat dilakukan melalui form yang disediakan
oleh sistem elektronik jurnal ini, sehingga pengelola jurnal tidak perlu membuka
halaman PHPMyAdmin. Form untuk menambah jurnal baru ditunjukkan pada
Gambar 16.
Pengembangan sistem elektronik jurnal juga dilakukan dengan menambahkan
halaman untuk mengelola data pengumuman. Hal ini diperlukan untuk memberikan
informasi kepada pengunjung seputar jurnal AITI. Pihak pengelola jurnal dapat
memberikan informasi tentang tata cara penulisan jurnal sesuai dengan format jurnal
19
AITI dan dapat memberikan pengumuman penting lainnya melalui halaman
pengumuman.
Gambar 17 Halaman Untuk Mengelola Pengumuman
Gambar 17 merupakan halaman untuk mengelola data pengumuman. Pengelola
jurnal dapat membuat pengumuman baru, mengubah dan menghapus pengumuman
yang sudah ada. Pengumuman yang telah dimasukkan akan ditampilkan kepada
pengunjung melalui menu pengumuman.
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 Username dan password
salah maupun kosong
Sukses login
Gagal login
Sukses login
Gagal login
Valid
Tambah data jurnal Form diisi dengan benar Form diisi beberapa atau
kosong
Sukses tambah data Gagal tambah data
Sukses tambah data Gagal tambah data
Valid
Ubah data jurnal Form diisi dengan benar Sukses ubah data Sukses ubah data Valid Hapus data jurnal Pilih salah satu jurnal Sukses hapus data Sukses hapus data Valid
Load data jurnal Buka halaman jurnal Sukses load data Sukses load data Valid
Load data pengumuman
Buka halaman pengumuman
Sukses load data Sukses load data Valid
Load data user Buka halaman user Sukses load data Sukses load data Valid
Unduh jurnal PDF Pilih salah satu jurnal 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
20
aplikasi. Pengujian beta dilakukan dengan menggunakan kuesioner, yaitu dengan
membagikan kuesioner kepada sample user. Sample user berjumlah 30 responden
dan dipilih secara acak, sample user pada pengujian ini kebanyakan adalah
mahasiswa FTI UKSW tingkat akhir yang juga sedang mencari referensi artikel
ilmiah. Hasil jawaban kuesioner dapat dilihat pada Tabel 2. Tabel 2 Hasil Jawaban Kuesioner
No Pernyataan STS TS CS S SS
1 Aplikasi aplikasi ini mudah digunakan 1 0 4 14 11
2 Tampilan, huruf dan gambar dari aplikasi ini dapat dilihat
dengan jelas
0 1 3 15 11
3 Menu-menu pada aplikasi ini mudah dipahami dan tidak
membingungkan
1 0 4 16 9
4 Aplikasi ini membantu memberikan informasi tentang jurnal
AITI FTI UKSW
0 1 6 10 13
5 Aplikasi ini bermanfaat untuk mengunduh file jurnal AITI
FTI UKSW dalam format PDF.
0 2 5 9 14
Setelah semua jawaban diketahui maka yang dilakukan adalah menghitung
presentase jawaban responden yang telah mengisi kuesioner. Hasil analisis data
untuk pertanyaan 1 menunjukkan sebanyak 36,67% responden menjawab sangat
setuju, 46,67% responden menjawab setuju dan 13,33% responden menjawab cukup
setuju. Jadi disimpulkan bahwa aplikasi ini mudah untuk digunakan.
Hasil analisis data untuk pertanyaan 2 menunjukkan sebanyak 36,67%
responden menjawab sangat setuju, 50,00% responden menjawab setuju dan 10,00%
responden menjawab cukup setuju. Jadi disimpulkan bahwa tampilan aplikasi ini
dapat dilihat dengan jelas.
Hasil analisis data untuk pertanyaan 3 menunjukkan sebanyak 30,00%
responden menjawab sangat setuju, 53,33% responden menjawab setuju dan 13,33%
responden menjawab cukup setuju. Jadi disimpulkan bahwa menu-menu pada
aplikasi ini mudah dipahami dan tidak membingungkan.
Hasil analisis data untuk pertanyaan 4 menunjukkan sebanyak 43,33%
responden menjawab sangat setuju, 33,33% responden menjawab setuju dan 20,00%
responden menjawab cukup setuju. Jadi disimpulkan bahwa aplikasi ini membantu
dan mempermudah pengguna dalam mencari informasi tentang jurnal yang terbit di
jurnal AITI FTI UKSW.
Hasil analisis data untuk pertanyaan 5 menunjukkan sebanyak 46,67%
responden menjawab sangat setuju, 30,00% responden menjawab setuju dan 16,67%
responden menjawab cukup setuju. Jadi disimpulkan bahwa aplikasi ini bermanfaat
untuk digunakan oleh pengguna dalam mendapatkan jurnal dalam format PDF.
Pengujian manfaat juga dilakukan dengan wawancara kepada pengembang
sistem elektronik jurnal AITI FTI UKSW sebelumnya yaitu bapak Ramos Somya.
Berdasarkan wawancara tersebut didapatkan bahwa sistem elektronik jurnal yang
baru dapat membantu dan mempermudah dalam pengelolaan data jurnal AITI karena
disediakan halaman khusus untuk mengelola data jurnal. Selain itu pengelola jurnal
juga dimudahkan untuk memberikan pengumuman terkait dengan jurnal AITI kepada
pengunjung jurnal, karena terdapat halaman untuk menuliskan pengumuman
tersebut.
21
5. Simpulan
Berdasarkan penelitian yang telah dilakukan, maka dapat diambil kesimpulan
bahwa pengembangan sistem elektronik jurnal FTI UKSW dapat dikembangkan
dengan framework CodeIgniter (CI) dan library Bootstrap. 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 library Bootstrap membantu dalam
membuat sistem elektronik jurnal ini menjadi responsive, sehingga dapat diakses dari
berbagai ukuran layar device.
Hasil pengujian juga menunjukkan bahwa pengembangan sistem elektronik
jurnal FTI UKSW ini membantu dalam mempermudah proses pengelolaan jurnal,
karena disediakan halaman khusus untuk menambah, mengubah dan menghapus
jurnal. Sistem elektronik jurnal yang baru juga dilengkapi dengan pengumuman yang
berguna untuk membantu pihak pengelola jurnal dalam menyampaikan informasi
kepada pengunjung web. Hasil pengujian kepada para pengunjung sistem elektronik
jurnal juga menunjukkan jika sistem ini dapat membantu dalam memperoleh jurnal
dalam format PDF.
6. Pustaka
[1] Daisy, Anita, Perencanaan dan Pembuatan Online Journal Berbasis Web,
2003, Surabaya: Bachelor Thesis Petra Christian University.
[2] Kurniawan, Didik, 2010, Pembuatan Jurnal Elektronik Fakultas Matematika
dan Ilmu Pengetahuan Alam Universitas Sebelas Maret, Surakarta: Tugas
Akhir Fakultas Matematika dan Pengetahuan Alam,
http://repository.petra.ac.id/5090/, diakses tanggal 16 Februari 2016.
[3] Jogiyanto, 2003, “Sistem Teknologi Informasi”, Yogyakarta.
[4] Yuhefizar. Membangun Toko Online Itu Mudah. 2013. Graha Ilmu.
[5] Isaknudin, Muhammad Surya. 2009. Apa dan mengapa Harus Framework,
http://www.kuliah-informatika.com/2009/10/framework-apa-dan-mengapa-
harus.html. Diakses tanggal 5 Januari 2015.
[6] Sofwan, Akhmad. 2007. Belajar PHP dengan Framework CodeIgniter. Ilmu
Komputer, http://mcd.bis.telkomuniversity.ac.id/file/CodeIgniter/belajar-php-
dengan-framework-code-igniter.pdf. Diakses tanggal 1 Maret 2016.
[7] Marcotte, Ethan. 2011. Responsive Web Design, http://ebookbrowsee.net.
Diakses tanggal 16 Desember 2015.
[8] Alatas, Husein, 2013, Responsive Web Design dengan PHP & Bootstrap,
Yogyakarta: Loko Media.
[9] Tresnawan, Arief Dj, 2004, Disampaikan pada acara Silaturahmi dan Seminar
Sehari “Kiat Sukses Mengembangkan Perpustakaan”, IPI Cabang Bandung
dengan UPT Perpustakaan ITB, Rabu, 29 Desmber 2004.
22
[10] Hasibuan, Zainal A. 2007. Metodologi Penelitian Pada Bidang Ilmu Komputer
dan Teknologi Informasi : Konsep, Teknik, dan Aplikasi. Jakarta : Ilmu
Komputer Univesitas Indonesia.
[11] Pressman, R.S, 2001, Software Engineering : A Practitioner’s Approach,
Amerika Serikat : R.S. Pressman and Associates.
