Uncategorized

Backbone.js – bagian 1

Logo versi 0.9.x lebih bagus dibanding versi 0.5.x😀

 

 

 

 

Halo semua🙂

Di post ini penulis ingin membahas singkat mengenai backbone.js, sebuah framework MVC Javascript yang dibangun di atas underscore.js. Di dalam Backbone, terdapat 7 komponen dasar, yaitu :

  • Backbone.Events,
  • Backbone.Model,
  • Backbone.Collection,
  • Backbone.Router,
  • Backbone.History,
  • Backbone.View,
  • Backbone.sync

Dari 7 komponen dasar yang disediakan, penulis akan memfokuskan pembahasan pada Backbone.Model, Backbone.Collection, dan Backbone.View, representasi murni MVC pada Backbone. Namun, sebelum masuk ke pembahasan utama, mari dibuka dulu pertanyaan pertama :

Apa itu Backbone?

Backbone adalah sebuah framework Javascript yang menggunakan design-pattern Model-View-Controller. Sebagaimana alasan sebuah framework diciptakan, Backbone diciptakan untuk mengatasi kerumitan dalam membangun sebuah thick web application (aplikasi web dengan business logic yang cukup padat — hey RPLL :D). Praktisnya, Backbone mampu mengatasi kerumitan-kerumitan seperti  :

  • memisahkan logic dengan interaksi DOM,
  • mengabstraksi koneksi client ke database menggunakan AJAX,
  • mempermudah representasi kepingan-kepingan html ke dalam sebuah object wrapper,
  • menjadi control flow sebuah single page web application,
  • Bahkan, Backbone dapat dengan mudah mengabstraksi koneksi yang dibangun client menggunakan websocket (d sini websocket yang digunakan sudah dibungkus oleh socket.io)

Backbone.View

Merupakan representasi ‘kepingan-kepingan’ html pada Backbone.  Inti dari sebuah Backbone.View adalah bagaimana sebuah view dapat sinkron dengan representasi data yang menjadi tanggung jawabnya, serta bagaimana aksi-aksi user pada sebuah view dapat diubah menjadi aksi-aksi pada data (model) yang sesuai.

Beberapa fitur yang menarik dari Backbone.View adalah kemudahan Backbone.View dalam mengelola user-triggered event serta keluwesan penggunaan library javascript untuk manipulasi DOM (jQuery atau Zepto, bisa dipilih :D). Ya, Backbone tidak meninggalkan kenyataan bahwa developer mungkin saja sudah terbiasa menggunakan librari untuk manipulasi DOM. Hal ini akhirnya diakomodasi dalam Backbone.View, di mana handler untuk manipulasi DOM dikembalikan ke developer mana yang paling cocok dengan kebutuhan developer. Sebuah view pada Backbone secara umum memiliki sebuah property yang mereferensi sebuah elemen html di aplikasi, yang digunakan sebagai root element view tersebut.Adanya root element tadi memudahkan Backbone dalam mengelola user-triggered event pada sebuah Backbone.View dengan memanfaatkan event delegation pada sebuah element.

Terkait view, salah satu tren yang berkembang adalah penggunaan javascript templating, di mana sebuah template html dikelola oleh javascript. Template-template ini terinspirasi dari html templating di bahasa-bahasa pemrograman di backend (PHP, Ruby, Perl) yang sudah memiliki fitur templating. Dengan adanya templating developer tidak harus melakukan string concatenation untuk me-render sebuah variabel menjadi representasi html yang sesuai. Di luar sana (halah) sudah banyak javascript templating yang bisa dipilih, seperti underscore.js template() method, handlebars.js dan mustache.

— bersambung —

4 thoughts on “Backbone.js – bagian 1

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s