Posts

Showing posts from 2013

MVVM in BackboneJS using Backbone.Stickit

I have been looking into various design patterns and trying to architect client side applications using it. More often than not the MVC pattern fits the requirement in most of the applications. However, I have found myself using MVVM (Model View - View Model) pattern along with MVC. I use MVVM pattern particularly when I have to maintain the state of the model on the client side. AngularJS provides great support by allowing you to extend the markup and tying the model right within the view (the markup). It also provides components that can be used to structure the application the MVC way and hence it's appropriately termed as MVW or MV* framework. However, I use BackboneJS in most of my applications and I have been able to maintain the state of the model using the Backbone.Stickit plugin.

Win a Free e-Book copy of my book - 'Instant Kendo UI Mobile'

I'm giving away two copies of my book 'Instant Kendo UI Mobile'. All you need to do is to send me a message through the 'Contact Me' form, let me know how this book will benefit you and whether you can post a review as well. You can also message me on Twitter or Facebook.

You can find out about the book here - http://www.packtpub.com/kendo-user-interface-mobile/book


My first book titled 'Kendo UI Mobile' is here!!

Image
The title says it all. I had posted a couple of entries on Kendo UI earlier and was approached by Packt publishing to write on 'Kendo UI Mobile'. Writing a book was both a personal and a professional goal that I had set for myself. Today I have realized it and I feel accomplished. For almost everyone, first things are very special. Be it their first job, paycheck, girlfriend\boyfriend, marriage, first kid and anything that happens for the first time in their life. This is my baby and I'm going to celebrate my win today.

If you are planning to build a mobile website or an app using Kendo UI Mobile, this book should get you up and running. Here's the link to the page, from where you can learn about the book and buy it -http://www.packtpub.com/kendo-user-interface-mobile/book

Backbone Collections do not emit 'reset' event after fetch

I recently upgraded my Backbone application to the 1.0 version of the library. When I ran the application, the Backbone View was not rendering anything on the browser screen. I noticed the XHR request being sent in the Network tab of Chrome Dev Tools. This meant that the Collection was fetching the data from the server. However, the 'render' function defined in Backbone View was not being called, which was attached as a callback handler for the 'reset' event on the Collection.

Para - Para - Parallax

I was listening to ColdPlay while developing a Parallax scrolling application and hence the title. Anyway, I was very much intrigued by the parallax scrolling model and wanted to try my hand on building one. The idea here was to show images of different transparency levels in such a way that when the user scrolls, one image would blend over the previous one.

Take a look at the application here.

WebRTC experiment - Recognizing hand gestures

I have created a web application that recognizes hand gestures using WebRTC's getUserMedia API. Here's how it works: when you launch the application the browser will prompt you for the permission to access the camera. Click on 'Accept',and then swipe your hand from right to left and vice versa. You would see that the next image  (or the previous image if you swipe from left to right) in the gallery slides through.

You can access the application here.

Please note, I have tested this application on Chrome only and not on other browsers. Also, I have used five images in this demo and it is obvious that no image would be shown if you swipe from right to left when the last image is being shown or when you swipe from left to right when the first image is shown. I have codenamed this application as 'Gesto' and hence the name in the URL of the application.

Client side MVC: Using Publisher - Subscriber event model to build decoupled components

Image
I've been really busy these days writing client side MVC code. A few months back I explored using Require and Backbone to build the frontend MVC structure. Since then I've been working on improving the structure of my client side code. One approach that I've used is to decouple the components. When I say decouple, the components that I build should not directly alter or affect the behavior of some other component in the page. By decoupling the components, we can ensure that these set of components can be reused and tested in isolation.

Adding beforeRender and afterRender functions to a Backbone View

I was working on a Backbone application that updated the DOM when a response was received from the server. In a Backbone View, the initialize method would perform some operations and then call the render method to update the view. This worked fine, however there was scenario where in I wanted to perform some tasks before and after rendering the view. This can be considered as firing an event before and after the function had completed its execution. I found a very simple way to do this with Underscore's wrap method.

Some useful Underscore methods

I like jQuery and I use it in all my projects. Lately I've been looking into Design Patterns and Backbone framework. Backbone has a dependency on Underscore and more often than not, people use Underscore as a client-side templating engine when using Backbone. I was looking at the Underscore documentation and came across a bunch of useful methods.

Goodbye 2012

2012 has just gone by and all I can say is that, it has been yet another eventful year. The biggest thing that happened to me was my new job at Myntra. It has been two months since I joined my new employer and I'm liking my new work. I had started last year with a few goals (I don't like calling them as resolutions) and the very first one was to reduce weight. I had met with an accident in 2011 (a terrible one) and had to stay at home for two months. And by staying at home and munching all that good food, I had put on some extra weight and wanted to loose it desperately. I think I almost cleared that goal and now I'm proud of it.