Backbone
Backbone.js is a JavaScript library with a RESTful JSON interface and is based on the model–view–controller
application design paradigram. Backbone is known for being lightweight, as its only hard dependency is on one
JavaScript library, Underscore.js, plus jQuery for use of the full library.
Model
Models are the heart of any JavaScript application, containing the interactive data as well as a large part of the
logic surrounding it: conversions, validations, computed properties, and access control. You extend Backbone.
Model with your domain-specific methods, and Model provides a basic set of functionality for managing changes.
view
Backbone views are almost more convention than they are code — they don't determine anything about your HTML or
CSS for you, and can be used with any JavaScript templating library. The general idea is to organize your interface
into logical views, backed by models, each of which can be updated independently when the model changes, without
having to redraw the page. Instead of digging into a JSON object, looking up an element in the DOM, and updating
the HTML by hand, you can bind your view's render function to the model's "change" event — and now everywhere that
model data is displayed in the UI, it is always immediately up to date.
Collection
Collections are ordered sets of models. You can bind "change" events to be notified when any model in the collection
has been modified, listen for "add" and "remove" events, fetch the collection from the server, and use a full suite of
Underscore.js methods.
Installation
We need to downlaod Backbone/ Jquery/ and Underscore.js to run the bacbone frame work. After downlaod, we need to
save files together in one drive.
There are three different links that we can download Jquery/Backbone and Underscore.js. For:
Bacbone site : https://backbonejs.org/
Jquery site : https://jquery.com/
Underscore site : https://underscorejs.org/
Welcome to Application
Application Design
There are 4 navigation bars which are:
Home for the main home page
University bar for the search for universities
Application bar for the Applications that applied, and we can edit and delete in this site
And Tutoring page for the explanation of the applicaiotn and detial of Backbone framework.
Downloading
We downloaded Backbone , Jquery and Underscore and save in the HTML folder.
Code part
There are two classes in the application. One is University class and Applicaiton.
You can use "var SearchRender = Backbone.View.extend" for search function. And there is also $(document).ready(function ()
You also can see in the picture. it has view , collection, search , add , edit and delete function.
The search bar can let student search universities that they are looking for , and with their major that they like.
There are also edit and delete funciton which allow applicaiotns go to the site edit and delete application that
they already applied.
There are edit and delete button close next to the school that they added. So, students can edit and delete the school
by just click on the button.
Conclusion
Bacbone is really nice and easy to code. It just need more framework to work with such as "Jquery and Underscore.js"
it provides different types of building blocks like models, views, events, routers and collections for assembling client
side web applications.
Thank you so much for visitng us. I hope you enjoy the tutorial.