003 BackboneJS Architecture

BackboneJS is a JavaScript library to manage large code in a smart way. BackboneJS separate business logic and user interface logic and makes the code clean , structured and maintainable.BackboneJS is a kind of design practices that you would to help design better , basically helps organize your code and separate their concerns.
The Below  image show the architecture of .BackboneJS have several modules

• HTTP request 
• Router 
• View 
• Events  
• Models 
• Collections 
• Data source

HTTP Request : In a BackboneJS application , client request to server via http request. The request can be for file ,document ,image through HTTP protocol. The request message can be come from browser or search engine ect.


Router :It is used for routing the client side applications and connects them to actions and events using URL's.Based on the url fragments you can choose to 'route' your applications logic,you can choose what functions to invoke so you effectively 'route' to the right set of methods based on your logic.


View : BackboneJS create model according to business logic. No HTML markup associated with JavaScript code. When model changes, corresponding view automatically changes without reloading the pages. BackboneJS follow MVC architecture, view and module communicate via event. When a model is changed and event is trigged corresponding view also changes.

Events : Events is the most important part of the BackboneJS application. View and modules communicate via events. BackboneJS bind custom element to an application event can be mixed to any object capable of  binding and triggering object.

Models : Models contain data of an application. Model contain business entity with validation a business logic. Model is responsible to supply data to view  and get data from view for storage. Model is core object of in JavaScript application.

Collections : A collection is a number of  model used  bind event. You can loop through collections and made change respective models. Collection support sorting and filtering. A model structure and instance should be created before creating a collection.Beside from their own events, collections also proxy through all of the events that occur to models within them.

Data source : Data sourc do connection set up to a database from a server and contains the information that is requested from the client. Below is the steps of flow 

       1)User requests for the data using the router, that routes applications to the events using the URL's.

      2)View represents the model's data to the user.

       3)Model and collection retrieves and populates the data from the database by binding custom events.

002 BackboneJS Setup

BackboneJS is a JavaScript library. No installation is required. You can use BackboneJS by downloading the library or add link of CDN  to the project page. You can download library from official website of BackboneJS or you can download it CDN.

1. Downloading library from official website.
2. Downloading library from CDNs.

The advantage of CDN download is that, once in library downloaded from CDN , when the visitor came to that page again no need to download again because the copy of that previous download already there.

You can download BackboneJS library from http://backbonejs.org/, you have noticed that ,there are three option for download.

Development Version : Development Versus gives us the full JavaScript library source ,you can right click and choose "Save as" option to get the development version.

Production Version : Production Version is the minified version of BackboneJS .You will notice file size is too small compared to the development version. This makes file to download faster when application runs, time consume for download is almost negligible.

Edge Version : Edge Version is under development, message inform you , that you can use it at your own risk, the version is not released yet. To download this version , just right click and choose "Save as" option.


BackboneJS has dependencies

Underscore.js − Hard dependency which must to be included. 

jQuery.js − For RESTful persistence, history support via Backbone.Router and DOM manipulation with Backbone.View. 

json2.js − For older Internet Explorer support. 

Here is the link you need to include in your application , if you are using CDN    

<script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>

           <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"

type="text/javascript"></script>

           <script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"

type="text/javascript"></script>

      

   
BackboneJS Simple Application Step by Step

1)Write the page HTML

<!DOCTYPE html>

<html>

<head>

<title>Model Example</title>

....

...

</head>

</html>

2)Include the  BackboneJS library

<script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"

type="text/javascript"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"

type="text/javascript"></script>

<script type="text/javascript">

3) Add BackboneJS Code

<script type="text/javascript">

   var myObj = Backbone.Model.extend({ message: "Hellow World" });

   var myObj2 = new myObj();

    document.write(myObj2.message);

</script>

Now the Complted Source is here

<!DOCTYPE html>

<html>

<head>

<title>Model Example</title>

            <script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>

           <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"

type="text/javascript"></script>

           <script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"

type="text/javascript"></script>

<script type="text/javascript">

         var myObj = Backbone.Model.extend({ message: "Hellow World" });

         var myObj2 = new myObj();

        document.write(myObj2.message);

</script>

</head>

</html>

 

Output :

001 BackboneJS Introduction

BackboneJS is a lightweight JavaScript library for single page application. The main objective of BackboneJS is to simplify code which is very complex. BackboneJS helps to separate business logic and user interface logic with the help of view , model ,event etc.
BackboneJS support MVC framework with abstract data into model and DOM into view , events binds  models. This is done by supplying models with custom events and key value binding.

BackboneJS is open source  component ,annotated source code are 
available in the internet. It is free and developed by Jeremy Ashkenas , initial release was  October'13 2010.

As we have discussed earlier , BackboneJS help to reduce complication of source code. If you building a very complicated single page application with jquery and JavaScript and you are adding or replacing DOM element or the application showing some animation , maintaining source code is become very complicated, here comes BackboneJS. BackboneJS is used to reduce complications by using models , view , events etc.

• BackboneJS  has meet front end development much easier by using JavaScript functions.

• View in HTML update automatically when any model changes.

• BackboneJS has soft dependency on jquery and hard dependency with underscore.js.

• BackboneJS help to be organized single page web application or mobile application with all structure format.

• BackboneJS communicate by event with view and model, this makes code clean , safe , structured format.

• BackboneJS is free and open source , lots of example are available in the internet.

• BackboneJS represent data as model, you can create , validate destroy or save to server depending upon your UI action.

• With the model attribute changes, model trigger change event, that reason re-render new information with DOM.

025 Weekend Tour Kalimpong

Kalimpong hill station is under the state of West Bengal , India. It is a hill station at around attitude 4100 feet. Kalimpong district is situated at the north of West Bengal , being heal station the weather of Kalimpong is mild and pleasant. Kalimpong is around 2.5 hour journey from Siliguri.

 

Durpin Monastery : Tibetan Monastery located at the top of durpin Hills. From the terrace of the monastery, you will get a magnificent view of hills and Kalimpong city. If the weather is clear, you can experience the view of Kanchenjunga also.

Delo Park : Delo does attract The Tourist most. Delo is another hill just opposite side of Durpin monasty. Delo is the highest point of Kalimpong , beautiful garden with flowers , multi cuisine restaurant, you will spend hours after hours here.

 

Army Golf Club : A beautiful Golf course and splendid view of mountain seems like a picture. A scenic 9-hole golf course  maintained by Army authorities. You can experience the view of Lolegaon , if the sky is clear.

Morgan house : Just opposite of Army golf club , old property converted to a hotel . The building typical colonial architecture and there are many stories around this building .

Jelepla View Point : A magnificent , viewpoint, Confluence of river Teesta, Reang and Relli , you will see from high heel top.

 

Pineview Nursery : A great collection of cactus  other trees.  You will see some unknown cactus and flower. The place is beautifully maintained and well decorated and lots of flower. This place is a private place,the entry fee is 20/-.

Kalimpong is well connected with New Jalpaiguri and Siliguri. A small car take around 2100/- to reach Kalimpong.Share care take around 120/- to reach Kalimpong. Bus services available , ticket fare is 100/- to the per person.

For Kalimpong sightseeing , it take around 1500/- and 4 hours for complete sightseeing.

You can reach Lava from Kalimpong by car, small car charge around 1000/-.

You can reach Lolegaon , small car charge around 1000/-.

New Jalpaiguri is well connected with Kolkata and Assam.Several
train are available from Kolkata and Assam to reach New Jalpaiguri.

A lot of hotels are available in Kalimpong, you can book previously or you can come here and book hotel.

024 Weekend Tour Darjeeling

Darjeeling is a hill station  in the state of West Bengal, India. Darjeeling is a district situated and hilly area. Darjeeling is very popular for tourism, mainly people from West Bengal. Darjeeling is popular for its scenic beauty and pleasant weather and tea garden. Weather are very comfortable all around year , in the month of December and January , Darjeeling experience snowfall for few days.

Darjeeling is famous for tea cultivation, Darjeeling tea is famous  for its quality to all around the world. The main attraction of Darjeeling is Mall. Darjeeling Mall situated on the Mall Road , a plane surface  on the hill. Tourist  spend their time hours after hours by sitting on the mall.You will see the magnificent scenic beauty of hills all Around the mall. You will enjoy the scenic beauty with sip of tea or coffee  by sitting on  Mall. You will see that people are riding horse, playing different games, singing with instruments. All Around The Mall there is restaurants, tea shop, food stall ,home decoration element shop etc.


 

 

Troy Train : It is very attractive  for tourist. Is very old heritage, it is come under UNESCO. Troy Train has two  compartment. Ghoom is the world highest station. Generally ,tourist ride Troy Train from Darjeeling to Ghoom and Batasia loop and back again.I have found that the Troy Train is still use coal as fuel.

 

Tea garden:  Darjeeling is famous for its tea production. World highest quality tea are found here. You will notice tea garden all around Darjeeling. The valley of the Darjeeling are full of tea garden , make the scenery more beautiful, you can plunk tea, take photo, you can purchase it from local shop.

 

Padmaja Naidu Himalayan Zoological Park :It is a small zoo with well maintained in hill area. The zoo have  Panda ,Leopard ,Jackal, Bird etc. The entry fee of zoo is RS 60/-. But we could not found a large animals like elephant , horse , crocodile . The main attraction of the zoo is red panda. You will find aquarium and snake house here also.

 
Ghoom Monastery : It is a Buddhist Monastery.You will large Budda idle inside the Monastery.

 

Batasia Loop : Batasia loop is a war Memorial, surrounded buy a loop of Troy train line. Troy train move like a loop here.This is a beautiful place, hill all around the place. If sky is clear , you can see Kanchenjunga and Nepal border from here.



 


Rock Garden : It is a beautiful place, a small stream is falling from high hill step by step. The place is well maintained and decorated by local government authority. Staircase , small road ,bridge are there to move up by walk sound of falling stream. High hill are all around area with full of tea garden create a magnificent ambience.


 

The nearest railway station of Darjeeling is New Jalpaiguri . You can hire a car or share a car. A small car from New Jalpaiguri to Darjeeling take around 2100/-,share taxi take around 150/-. New Jalpaiguri is well connected to Kolkata and Assam, a lot of train available to New Jalpaiguri from Kolkata and Assam.

There are plenty of hotels in Darjeeling , you can Book from Kolkata or book after reaching Darjeeling.

There are many more places to see  Ropeway,   Mahakal Mandir, Japanese Pagoda, local market ect.

You can visit nearby  places  Tinchuley , Lamahatta, Lepchajagat .

010 Node.js EventEmitter

EventEmitter class is used to raise and handle events. An objects  emit events but all  events  are instances of the EventEmitter class. When object emits  event ,event related functions  are called synchronously.
 
Example

const EventEmitter = require('events');

class objEmitter extends EventEmitter {}

const myEventEmitter = new objEmitter();
myEventEmitter .on('event', () => {
  console.log('an event fired!!');
});
myEventEmitter .emit('event');
 
Output :
an event fired!! 

Example Explain : 

The module 'events' included in a variable called 'EventEmitter' .Instance of 'EventEmitter' class created and assigned to 'myEventEmitter'.The eventEmitter.on() method is used to register listeners and eventEmitter.emit() method is used to fires the event.


Below are some method of EventEmitter Class

• emitter.addListener(eventName, listener)

Attach listener function to listeners array for the event named eventName.

• emitter.emit(eventName[, ...args])

Calls each of the listeners registered for the event named eventName
one by one.

• emitter.eventNames()

Returns an array listing the events for which the emitter has registered listeners.

• emitter.getMaxListeners()

Returns maximum listener value.

• emitter.listenerCount(eventName)

Returns the number of listeners listening.

• emitter.listeners(eventName)

Returns a copy of the array of listeners.

• emitter.off(eventName, listener)

Deactivate the  listener from the listener array.

• emitter.on(eventName, listener)

Attach listener function to the  listeners array for the event named eventName.By default, event listeners are invoked in a order , as they have are added.

• emitter.once(eventName, listener)

Attach listener function for one-time.If triggered again , this listener is removed and then invoked.

• emitter.prependListener(eventName, listener)

Attach the listener function to the beginning of the listeners array. 

• emitter.prependOnceListener(eventName, listener)

Attach listener function for one-time at the begining of listeners array.

• emitter.removeAllListeners([eventName])

Removes all listeners.

• emitter.removeListener(eventName, listener)

Removes the specified listener from the listener array.

• emitter.setMaxListeners(n)

Allows the limit to be modified for number of listeners

010 Node.js Process

The process object is a global object.process object provides information about the current Node.js process. You can use without using require().

Here are some process properties

arch : Returns a string identifying the operating system CPU architecture 'arm', 'ia32', or 'x64'.
 
args : Returns commands line arguments as an array.

env : Returns an object containing the user environment.

pid : Returns process id(PID) of the process.

platform : Returns a string identifying the operating system platform  'darwin', 'freebsd', 'linux', 'sunos' or 'win32'.

release : Returns the metadata for the current release.

version : Returns the node version string.

versions : Return a object listing the version strings of Node.js and its dependencies.

Example :


console.log(`Process Architecture: ${process.arch}`);
console.log(`Process Arguments: ${process.args}`);
console.log(`Process ID: ${process.pid}`);
console.log(`Process Plat Form: ${process.platform}`);
console.log(`Process Release: ${process.release}`);
console.log(`Process Version: ${process.version}`);
console.log(`Process Versions: ${process.versions}`); 

Output :

Here are some process Methods

cwd :Method returns current working directory of the Node.js process.

hrtime : Returns the current high-resolution real time in a [seconds, nanoseconds] array.

memoryUsage : Method returns an object describing information of memory usage.

process.kill : Method is used to kill process by  sends the signal to the process identified by pid.

uptime : Returns the Node.js process uptime in seconds  current Node.js process has been running.

exit : Ends the process with the specified code. If omitted, exit uses the 'success' code 0.

setgroups : method sets the supplementary group IDs for the Node.js process.

nextTick : method adds the callback to the "next tick queue".

Example :


console.log(`Starting directory: ${process.cwd()}`);
console.log(`Starting directory: ${process.hrtime()}`);
console.log(`Starting directory: ${process.memoryUsage()}`);
console.log(`Starting directory: ${process.uptime()}`);

Output :

Here are some process event


beforeExit : Fires when Node.js empties its event loop and has no additional work to schedule.

exit : Fires when the Node.js process is about to exit.

uncaughtException : Fires when an uncaught JavaScript exception bubbles all the way back to the event loop.