"Necessity is the mother of invention" 

- Plato                  

What is the need/necessity of having backbone.js?

            To start our course the introduction to backbone.js, let's first make note of the necessity of the technology backbone.js. To understand the necessity of backbone let's rewind our time machine before 2 decades (year created 2014).  Remember the web development technologies starting from the period 1995......

1995:
           Around this year where the Javascript, came into the picture in the development of web applications. It's more likely riding a bicycle to shift from on place to another place. ie., I'm comparing the performance of the web applications with the real life objects.

2005:
         This was the period where XMLHttpRequest, XMLHttpResponse slowly enter into the web development field. It's more likely riding a fuelled bike to move on, Of course which is something better than riding a bicycle, isn't it?

2006:
         Where came the ultimate vehicle for flying from one continent to another continent. Or in other words, a vehicle to the space, which is jQuery. Later the asynchronous javascript and xml (AJAX) technique added on top of the jQuery, to utilize the performance of the jQuery.

2010:
        Backbone.js?

Let's first understand the fact that  

 "Backbone.js is not an alternative for jQuery"

           Whereas backbone.js partially depend on jQuery. When we talk about the necessity, people decided to increase the performance of the web applications. So, they came up with the revolutionary idea the 'thin client' concept. Which is adding more functionality to the client side would drastically decrease the server tasks, Apparently increasing the performance of the server. ie., To be more specific transferring the functionality like validation, switching page contents, parsing the response and so on down the line to the client. So the server is intended to be used only for request/response over model/data.  This ideology is known as "Single Page Application" technique. On a single page (index.html) we are replacing the contents as we navigating with the hyperlinks. Adding to SPA, it enhances the MVC pattern, which is something that focuses the terminology 'separation of concerns'. With these history of web development and the necessity of backbone.js, let's move on to the introduction to backbone.js.

Introduction

                     Backbone.js is a framework for developing single page applications(SPA), introduced by Jeremy Ashkenas, in the year 2010. He is the author of Coffeescript, which is a programming language that transcompiles to javascript. Anyhow which is irrelevant to the current topic, let's not get involved in that.

                   

                   Backbone.js is not an independent framework, it depends on underscore.js framework for template and utility functionality, and on jQuery for wiring functionality.  Backbone.js also can be used with the jQuery, mustache.js and combinations like that. Of course, backbone.js is following MVC pattern, MVC can be Model-View-Controller and often it is termed as Model-View-Collection here.

Let's get into the action:

  The tools required for this course.

1. Yeoman scaffolding tool, configured with the generator-backbone
2. Netbeans latest IDE
3. Netbeans connector linked with Google Chrome browser

Configuration works: 

1. To install the Yeoman scaffolding tool, use the following command on the terminal, before that navigate to the directory in which your project wants to be exists via terminal.

           for example cd ~/Documents/your-directory/backboneApp

           $ sudo npm install -g yeoman

(Note : to install yeoman you have to be first installed node.js, to install node.js click here )

To configure with the generator-backbone, use the following command on the terminal on the same directory.

           $  sudo npm install -g generator-backbone
If you're sure that you've installed yeoman successfully, then proceed to the next required configuration.

   2. The second configuration task is downloading and installing the latest Netbeans IDE. To download the latest IDE click here.

   

    3. The final task is go to the chrome browser and search for 'netbeans connector'. Choose option with the title 'Chrome Web Store - Netbeans Connector'. Click the button 'ADD TO CHROME'. That's it the configuration works are finished now.