Penerapan Arsitektur Model View Controller (MVC) Dalam Perancangan Ekstensi Sebuah Content Management System
Penerapan Arsitektur Model View Controller (MVC) Dalam Perancangan Ekstensi Sebuah Content Management System Arief Hidayat Program Studi Sistem Informasi STMIK PROVISI, Semarang
[email protected] Abstract Design of extension will be more easily developed if it applies design patterns of model view controller (MVC) architecture. This architecture divides an application into three separate parts; model, view, and controller, each of which can be developed separately from one another, so that changes in one part has a minimal impact on other parts. Parts of the model are used to define a way in which data can be accessed, the view produces an output when given the data, and the controller receives the command and sets the application to the task and the corresponding view. Keywords: extension, CMS (content management system), MVC (model view controller)
1.
Pendahuluan
Dewasa ini banyak pihak/organisasi yang menginginkan suatu situs web yang bersifat dinamis yang berarti situs tersebut dapat menerima umpan balik dari pengunjung situs atau dengan kata lain bersifat interaktif. Sebagai contoh adalah situs akademik suatu universitas, pihak universitas tidak hanya ingin menampilkan informasi kampus, tetapi juga mengadakan KRS online, yang tentu saja akan menerima input dari pengunjung situs, dalam hal ini adalah mahasiswa dan dosen. Oleh karena itu kebutuhan akan fasilitas untuk pembuatan situs web yang bersifat dinamis pun semakin meningkat. Banyak kendala yang dialami oleh beberapa pihak/institusi/perusahaan dalam mengelola situs web yang dimiliki. Salah satu permasalahan yang sering terjadi adalah apabila webmaster berhalangan atau tidak ada di tempat, perusahaan atau organisasi akan kesulitan dalam melakukan update terhadap konten dari situs web (Rachdian, 2006). Seiring dengan semakin meluasnya pemanfaatan website, semakin banyaknya informasi yang diproses di dalam website, semakin cepatnya perubahan informasi, semakin banyaknya kontributor konten, kiranya perlu adanya suatu sistem yang dapat mempermudah para pengguna dalam mengelola konten yang ada pada website. Kemudahan yang dimaksud diantaranya kemudahan dalam proses pembuatan website, update konten, edit konten, konsistensi tampilan dan lain-lain. Kemudahan ini dapat diperoleh dengan pemanfaatan content
management system (CMS) dalam membangun situs web. Pembuatan dan pengelolaan suatu website akan semakin dimudahkan dengan adanya framework CMS. CMS merupakan suatu sistem yang digunakan untuk membuat dan mengelola konten dari suatu website (Luthfie, 2005). Fitur dari CMS bermacam-macam, tapi sebagian besar CMS memiliki fasilitas publikasi berbasis web, kontrol revisi, pembuatan indeks, pencarian dan pengarsipan. Salah satu CMS yang saat ini banyak digunakan adalah joomla. Joomla merupakan salah satu opensource CMS yang memberikan kemudahan dalam membangun dan mengelola website dan aplikasi online yang lain (JoomlaTeam, 2005). Joomla sudah digunakan di seluruh dunia dan menjadi basis dari beberapa macam website mulai dari website sederhana sampai yang kompleks. Kemudahan dan kelebihan yang dimiliki joomla telah membuat joomla menjadi CMS yang banyak digunakan di internet. Tetapi seringkali website joomla yang sudah dibangun masih belum memenuhi kebutuhan yang direncanakan pada end-user karena adanya keterbatasan pada joomla, misalnya fasilitas pencarian pada joomla yang hanya bisa melakukan pencarian berdasar pengarang dan deskripsi suatu artikel. Fungsi-fungsi standar seperti sistem konten,manajemen layout, web links, contact forms, pengaturan hak akses, pembuatan indeks, pencarian yang ada pada joomla masih dianggap terlalu
17
Jurnal Teknologi Informasi dan Komunikasi Vol. 3 No.1 Maret 2012 sederhana jika dilihat dari sudut pandang end-user. Untuk dapat memanfaatkan joomla secara maksimal, perlu adanya penyesuaian dengan website yang akan dibangun/dikelola. Untuk menambah fungsionalitas program inti joomla, diperlukan aplikasi ekstensi dari CMS yang sesuai dengan keperluan. Aplikasi tersebut bisa berupa komponen, modul atau mambots (Rachdian, 2006). Komponen merupakan program add-on yang biasanya ditulis dalam bahasa pemrograman PHP. Komponen-komponen yang terdapat pada joomla saat ini belum tentu sesuai dengan apa yang dibutuhkan oleh suatu website. Oleh karena itulah kemampuan dalam membuat dan menambahkan komponen pada joomla sangatlah penting. Contoh komponen ekstensi joomla yang sudah ada di internet dan sudah banyak digunakan adalah phpshop. Phpshop merupakan komponen yang dapat menambahkan kemampuan e-commerce. Contoh komponen yang lain adalah IFPortfolio yang merupakan komponen yang memiliki kemampuan untuk membuat, meng-update atau memodifikasi suatu direktori kecil yang berisi hasil-hasil pekerjaan. 2.
CMS
2.1 Definisi CMS CMS merupakan singkatan dari Content Management System. CMS adalah sebuah perangkat lunak yang menyediakan tools / perangkat untuk pembuatan, penerbitan/publishing maupun pengelolaan website (Robertson, 2003). Di dalam sebuah website terdapat konten/isi yang berisi informasi atau pengetahuan yang disajikan untuk pengguna. Konten merupakan suatu unit informasi digital yang digunakan untuk mengisi sebuah webpage (TreeWorks, 2005). Konten yang dimaksud bisa meliputi file-file elektronik, gambar-gambar, file-file audio, video atau dokumen-dokumen elektronik. CMS banyak digunakan di internet , baik untuk website pribadi maupun umum. Beberapa contoh penggunaan CMS untuk pribadi adalah untuk personal website dan blog. Contoh lain penggunaan CMS adalah untuk website perusahaan, organisasi, institusi pendidikan atau komunitas tertentu, portal, galeri foto, dan aplikasi e-commerce serta aplikasi elearning.
18
Saat ini, terdapat beberapa CMS yang bisa digunakan. Beberapa diantaranya ada yang bersifat komersial seperti stellent, vignette, documentum dan lainnya. Sebagian pengguna CMS memanfaatkan CMS yang bersifat open source karena keuntungan – keuntungan yang dimiliki oleh perangkat lunak open source. Beberapa diantara software CMS tersebut adalah drupal, joomla, mambo, wordpress, phpnuke, impresscms, typo3, zope, wordpress dan xoops. 2.2 Anatomi CMS Anatomi CMS dapat menggambarkan aktivitas – aktivitas yang bisa dilakukan berkaitan dengan fungsi yang disediakan oleh suatu CMS. Anatomi CMS yang dapat dilihat pada Gambar 1.
Gambar 1. Anatomi CMS (Robertson, 2003) Pada Gambar 1, terdapat 3 lingkaran yang masing-masing lingkaran mewakili penciptaan konten, manajemen konten dan presentasi konten. CMS menyediakan lingkungan pembuatan konten memudahkan pengguna sehingga dapat digunakan oleh seseorang yang bahkan tidak memiliki keahlian dalam pemrograman web. Konten yang telah dibuat akan disimpan di tempat peyimpanan tertentu dalam basis data CMS dan CMS menyediakan fasilitas manajemen konten untuk mengelola. Presentasi merupakan bagian terakhir dari anatomi CMS, dimana bagian ini bertugas mengatur format tampilan konten. 2.3 Ekstensi CMS Salah satu keuntungan dari CMS adalah adanya fasilitas untuk menambah fungsionalitas pada CMS. Kemampuan atau fungsionalitas tambahan pada CMS ini dikenal dengan istilah ekstensi (extension) (Compass Design Team, 2005). Ekstensi merupakan suatu perangkat lunak tambahan pada CMS yang di-install pada CMS dan berguna untuk menambah fungsionalitas pada CMS tersebut. Ekstensi merupakan perangkat lunak yang tidak bisa berdiri sendiri. Ekstensi harus di-install
Penerapan Arsitektur Model View Controller (MVC) Dalam Perancangan Ekstensi Sebuah Content Management System
pada perangkat lunak yang akan ditambah fungsionalitasnya, dalam hal ini pada aplikasi web yang menggunakan perangkat lunak CMS yang sesuai dengan ekstensi yang akan ditambahkan. Ekstensi akan berintegrasi dengan perangkat lunak CMS dan memberikan layanan atau fungsi yang bisa dinikmati oleh pengguna atau pengunjung website tempat dimana ekstensi tersebut di- install. 3.
Arsitektur MVC (Model-View-Controller)
Model-View-Controller (MVC) adalah sebuah konsep yang diperkenalkan oleh penemu Smalltalk (Trygve Reenskaug) untuk mengenkapsulasi data bersama dengan pemrosesan (model), mengisolasi dari proses manipulasi (controller) dan tampilan (view) untuk direpresentasikan pada sebuah user interface (Deacon, 2009). MVC mengikuti pendekatan yang paling umum dari Layering. Layering hanyalah sebuah logika yang membagi kode kita ke dalam fungsi di kelas yang berbeda. Pendekatan ini mudah dikenal dan yang paling banyak diterima. Keuntungan utama dalam pendekatan ini adalah penggunaan ulang (reusability) kode (Satish, 2004). Definisi teknis dari arsitektur MVC dibagi menjadi tiga lapisan (Burbeck, 1992) 1. Model, digunakan untuk mengelola informasi dan memberitahu pengamat ketika ada perubahan informasi. Hanya model yang mengandung data dan fungsi yang berhubungan dengan pemrosesan data. Sebuah model meringkas lebih dari sekedar data dan fungsi yang beroperasi di dalamnya. Pendekatan model yang digunakan untuk komputer model atau abstraksi dari beberapa proses dunia nyata. Hal ini tidak hanya menangkap keadaan proses atau sistem, tetapi bagaimana sistem bekerja. Sebagai contoh, programmer dapat menentukan model yang menjembatani komputasi back-end dengan front-end GUI (graphical user interface). 2. View, bertanggung jawab untuk pemetaan grafis ke sebuah perangkat. View biasanya memiliki hubungan 1-1 dengan sebuah permukaan layar dan tahu bagaimana untuk membuatnya. View melekat pada model dan me-render isinya ke permukaan layar. Selain itu, ketika model berubah, view secara otomatis menggambar ulang bagian layar yang terkena perubahan
untuk menunjukkan perubahan tersebut. Terdapat kemungkinan beberapa view pada model yang sama dan masing-masing view tersebut dapat me-render isi model untuk permukaan tampilan yang berbeda. 3. Controller, menerima input dari pengguna dan menginstruksikan model dan view untuk melakukan aksi berdasarkan masukan tersebut. Sehingga, controller bertanggung jawab untuk pemetaan aksi pengguna akhir terhadap respon aplikasi. Sebagai contoh, ketika pengguna mengklik tombol atau memilih item menu, controller bertanggung jawab untuk menentukan bagaimana aplikasi seharusnya merespon. Model, view dan controller sangat erat terkait, oleh karena itu, mereka harus merujuk satu sama lain. Gambar 1. mengilustrasikan hubungan dasar Model-View-Controller:
Gambar 2. Hubungan antara model, view, dan controller (Gulzar, 2002) Arsitektur MVC memiliki manfaat yaitu pemisahan antara model dan view memungkinkan beberapa view menggunakan model yang sama. Akibatnya, komponen model sebuah aplikasi lebih mudah untuk diterapkan, diuji, dan dipelihara, karena semua akses ke model berjalan melalui komponen ini (Balani, 2002).. 4.
Pembahasan Arsitektur MVC diimplementasikan dalam setiap ekstensi, misalnya komponen. Setiap komponen memiliki satu model, satu controller, dan beberapa view. Berikut ini akan dijelaskan implementasi arsitektur MVC pada component review, yaitu suatu komponen yang berfungsi mereview sebuah restoran berdasarkan komentar.
19
Jurnal Teknologi Informasi dan Komunikasi Vol. 3 No.1 Maret 2012 4.1 Model Model perlu dibuat sebelum mulai memisahkan view untuk mendapatkan informasi yang akan kita tampilkan. Bagian front-end digunakan untuk user, sedangkan bagian back-end digunakan untuk administrator. Berikut ini adalah penggalan script untuk menampilkan data review secara tunggal dari bagian front-end seperti yang ditunjukkan dalam Gambar 3.
dari kata Model lalu diikuti oleh nama komponen dan nama file model Fungsi member tunggal getReview() mengecek untuk melihat apakah data review telah di-load berdasarkan id-nya, di dalamnya terdapat perintah untuk melakukan query terhadap database. Simbol prefix #__ pada awal nama tabel untuk menjamin penggunaan prefix yang benar. Hasil query di-load dengan menggunakan metode loadObject().
4.2 View Proses selanjutnya setelah model dibuat, yaitu diperlukan beberapa kode yang akan menampilkan informasi tersebut. Sejauh ini, file dengan akhiran. html.php telah berfungsi dengan baik untuk melakukan tugas ini. Namun, desain yang sudah ada agak kaku, class output HTML disertakan dan layar yang inginkan dipanggil untuk ditampilkan. Melalui penggunaan view, dapat membuka layar tersebut sampai dengan tingkat admin sebagai pilihan.
jimport( 'joomla.application.component.model' ); class ModelReviewsOpinion extends JModel { var $_review = null; var $_comments = null; var $_id = null; function __construct() { parent::__construct(); $id = JRequest::getVar('id', 0); $this->_id = $id; } function getReview() { if(!$this->_review) { $query = "SELECT * FROM #__reviews WHERE id = '" . $this->_id . "'"; $this->_db->setQuery($query); $this->_review = $this->_db>loadObject(); if(!$this->_review->published) { JError::raiseError( 404, "Invalid ID provided" ); } } return $this->_review; } function getComments() { if(!$this->_comments) { $query = "SELECT * FROM #__reviews_comments WHERE review_id = '" . $this->_id . "' ORDER BY comment_date"; $this->_comments = $this>_getList($query, 0, 0); } return $this->_comments; }
Gambar 3. Script kode model untuk data review secara tunggal Pertama, mengimpor library model data Joomla, kemudian mendeklarasikan class model dengan nama ModelReviewsOpinion sebagai ekstensi dari Jmodel. Nama class model harus terdiri
20
Penerapan Arsitektur Model View Controller (MVC) Dalam Perancangan Ekstensi Sebuah Content Management System getModel(); $user =& JFactory::getUser(); $review = $model->getReview(); $comments = $model->getComments(); $pathway =& $mainframe->getPathWay(); $backlink = JRoute::_('index.php?option=' . $option . '&view=all' ); $params = &$mainframe->getParams(); $currency = $params>get('currency_symbol', '$'); $review->review_date = JHTML::Date($review->review_date); if($review->smoking == 1) { $review->smoking = "Yes"; } else { $review->smoking = "No"; } for($i = 0; $i < count($comments); $i++) { $row =& $comments[$i]; $row->comment_date = JHTML::Date($row->comment_date); } $pathway->addItem($review->name, ''); $this->assignRef('review', $review); $this->assignRef('comments', $comments); $this->assignRef('backlink', $backlink); $this->assignRef('option', $option); $this->assignRef('name', $user->name); $this->assignRef('currency', $currency); parent::display($tpl); } } ?>
Gambar 4. Script kode view untuk menampilkan data review tunggal Keseluruhan output dalam file tunggal mulai ditinggalkan, sebagai gantinya dibuat folder secara terpisah untuk masing-masing view. Folder tersebut akan memuat sub folder untuk beberapa jenis view yang akan ditampilkan, dan masing-masing sub folder tersebut terdapat sub folder tmpl untuk template. Setiap view dapat menyertakan beberapa template, akan tetapi perlu sebuah objek view untuk mengelola template tersebut yaitu sebuah file view.html.php, sebagai contoh file view.html.php dibawah folder
component/com_reviews/views/opinion seperti yang ditunjukkan dalam Gambar 4. Nama dari class view harus terdiri dari kata view lalu diikuti oleh nama komponen, dan nama folder view. View dibuat dengan mewarisi view dari class Jview, untuk itu harus mengimpor class-nya. Alur dari sebuah view adalah pertama, mengambil model yang namanya sesuai dengan controller yaitu model review, kemudian mengeksekusi metode getReview() dalam model review dan memberikan hasilnya ke variabel $review, setelah itu memberikan variabel review yang berisi $review ke layout, dan terakhir mengeksekusi metode display dari class Jview yang akan mengeksekusi template berdasarkan isi dari variabel $tpl dan jika isinya kosong (null) maka metode ini akan mengeksekusi file default.php yang terdapat dalam direktori tmpl. 4.3 Controller Controller bekerja berdasarkan task apa yang telah diminta dan berdasarkan task tersebut maka controller mengambil data dari model dan mengirimkan data dari model tersebut ke view. Jadi tugas controller adalah bekerja berdasarkan inputan user yang kemudian dikenal dengan nama task, memanggil metode pada model untuk memanipulasi data pada tabel, dan mengirimkan data dari model ke view untuk ditampilkan pada browser. Gambar 5 menunjukkan sebagian script kode sebuah controller kuis yang akan mengendalikan alur program . Nama dari class controller harus terdiri dari nama komponen lalu diikuti oleh kata Controller. Controller dibuat dengan mewarisi model dari class Jcontroller, untuk itu harus mengimpor class-nya. Fungsi display() dipanggil secara default ketika controller dieksekusi, dengan alur yaitu pertama, mendapatkan sebuah objek view dengan melewatkan nama view, dan menuliskan ke dalam fungsi member getView(), kemudian memilih model untuk view dengan metode getModel() dan mengaturnya dalam view dengan metode setModel(), terakhir menampilkan layout view yang diinginkan.
21
Jurnal Teknologi Informasi dan Komunikasi Vol. 3 No.1 Maret 2012
meningkatkan fleksibilitas dan modularitas sistem perangkat lunak.
jimport( 'joomla.application.component.controller' );
Daftar Pustaka:
class ReviewController extends JController { function display() { $document =& JFactory::getDocument(); $viewName = JRequest::getVar('view', 'all'); $viewType = $document->getType(); $view = &$this->getView($viewName, $viewType, 'View'); $model =& $this->getModel( $viewName, 'ModelReviews' ); if (!JError::isError( $model )) { $view->setModel( $model, true ); } $view->setLayout('default'); $view->display(); } } ?>
Gambar 5. Script kode sebuah controller Berikut ini adalah hasil dari perancangan ekstensi review dalam CMS Joomla dengan menerapkan arsitektur model-view-controller (MVC) seperti ditunjukkan dalam gambar 6.
Balani, Naveen. 2002. Web services architecture using MVC style, (Online), (http://www.webifysolutions.com?subject=Web services architecture using MVC style, diakses tanggal 1 April 2010) Burbeck, Steven. 1992. Application Programmings in Smaltalk's 80 ™ : How To Use MVC, (Online), (http://st-www.cs.illinois.edu/users/smarch/stdocs/mvc.html, diakses tanggal 10 Maret 2010). Compass Design Team, 2005, Content Management Systems and Joomla, Compass Design, http://www.compassdesigns.net/joomla-blog/Whatis-a-Content-Management-System-CMS-.html, diakses pada 5 Januari 2011 Deacon, John. 2009. Model-View-Controller Architecture, (Online), (http://www.jdl.co.uk/briefings/index.html/#mvc, diakses tanggal 10 Maret 2010) Gulzar, Nadir. 2002. Fast track to struts : what it does and how, (Online), (http://media.techtarget.com/tss/static/articles/conten t/StrutsFastTrack/StrutsFastTrack.pdf, diakses tanggal 1 April 2010) JoomlaTeam, 2005, What is Joomla, Joomla Official Site, http://www.joomla.org/content/view/12/26/, diakses pada tanggal 10 Januari 2012. Luthfie, A. , 2005, Mudah Membuat Website dengan Aura CMS, Andi, Yogyakarta
Gambar 6. Hasil ekstensi review 5.
Kesimpulan
Penerapan arsitektur model-view-controller (MVC) dalam perancangan ekstensi ini dapat meningkatkan modularitas dan reusabilitas dari sistem. Hal ini dimungkinkan karena source code menjadi lebih rapi dan pemisahan antara logika bisnis dan antarmuka pengguna yang lebih eksplisit. Kesimpulannya dengan menggunakan arsitektur ini, kompleksitas dari kode dalam perangkat lunak dapat dikurangi secara signifikan, dengan demikian,
22
Rachdian,A., Sikumbang,A., 2006, Mastering CMS dengan Mambo/Joomla, PT. Elex Media Komputindo, Jakarta. Robertson James, 2003, So What is Content Management System?, KM Coloumn, http://www.steptwo.com.au/papers/kmc_what/, diakses pada 26 Januari 2012. TreeWorks, 2005, Content Management System, Bucuresti, Romania, http://www.scribd.com/doc/17748/ContentManagement-Systems-TreeWorks-White-Paper, diakses pada 22 Januari 2012.
