Wednesday 14 November 2018

What is MVVM (Model View- ViewModel) in Knokout JS?

KnockoutJS is based on MVVM pattern. It is an architectural pattern used to design software applications.
MVVM was developed by Microsoft Architect John Gossman in 2005.
The biggest benefit of the model is that it separates the business logic from graphical user interface.
Derived from ViewModel Controller Pattern, this very model makes it very easy to manage and represent data by allowing you to handle underlying data easly.
The ViewModel and Model classes do not know that the view classes exist and the vice versa. Similarly, Model has no idea that both the View and ViewModel exist.

View:
View is a Graphical User Interface created using markup language to represent data.
View is communicating to ViewModel layer through data binding. If any changes in ModelView layer automatically it will reflect to view layer. 

Model:
Model is domain data or business object, which holds real-time data. It’s responsible for managing state of the application in object(s).
It also comprises of business Logic which operates on the state.
Also it has a data access layer responsible for persisting and fetching model object.

View Model:
ViewModel is the main processing unit of the MVVM and holds dynamic data. It’s the one which binds Model and View together.
It retrieves data from the model (M) and exposes it to the view (V) as properties in a form that the view can easily can consume.
Note that this is not the UI itself: it does not have any concept of buttons or display styles.
In KO, view models are pure JavaScript objects that hold no knowledge of HTML.

Thanks..!!

Tuesday 13 November 2018

What is Knockout JS? Features and why KO?

Introduction:
  • Knockout(KO) is JavaScript library that helps us to create rich, responsive and interactive user interface with a data model of an application.
  • It has declarative bindings, which allows us to bind the html elements of UI to any data model in a simple and convenient way.
  • It is based on MVVM architecture which fosters separation of concerns by separating application into application model, view and view model.
  • Unlike jQuery which is mostly for animation or event handling, Knockout.js is focused only on designing scalable and data-driven UI.
KO main features:
  • Language: As the Knockout.js framework is written with pure JavaScript, it is easily rendered on most browsers, and gels up easily with server-side technologies such as Java, .NET, RoR, or PHP
  • Declarative Binding: It is very simple to bind application data with html UI elements via simple and easy data-binding syntax. This helps improve responsiveness of the application.
  • Automatic view Refresh: With the two-way binding, the changes on the data model automatically update the view components (HTML UI) with the newer values.
  • Dependency Tracking: It automatically updates the UI whenever your data model changes. The same behavior in other words we can say “Tow way data binding”.
  • UI Template: Rapid template generation for the data model-driven UI component tree structure.
  • Trivially Extensible: implement custom behaviors as now declarative binding for easy reuse in just a few line of code.
  • Easily Enhanced: you can easily add new features to knockoutJS applications.
Why Knockout JS?
  • It is absolutely free and open source.
  • It library is very light weight and puts no extra load on the webpage.
  • It is pure java script library
  • It can be added on top of your existing application
  • It works on any mainstream browser.

Thanks..!!