Many times now a days we hear about Signal-R , so today i started going through what exactly it is. I read couple of Article on it and it seems to be very interesting topic and good technology to go with if we want to implement some application which require broadcasting or if we want to send any updates to Clients from server.
I remember years back when WCF was new in the market and one of my client wanted a Push mechanism to send updates to client from server , where we used WCF nettcp Bindings for this.
Here the implementation that we did was when client get active it use to send the message to server and then we used to capture the details of client in dictionary. when any updates happen we used to send the updates to client.
So after reading this Signal-R and going through the Signal-R Chat application it seems the things has become much simpler as no need to worry about Bindings and network level protocol every things a re handled by Signal-R .Net library .
Aslo good this about the is say if we want to broadcast something to all users who is visiting your website you just need to add 2 to 3 lines of code and you are done.
Following are the reference that i used to learn this.
Name: Kendo UI Cookbook
My Rating: ★★★★
Buy From :
As Title “Kendo UI Cookbook” describes itself, this book is for those who have been working in kendo UI and are eager to learn more in depth concept and ease of use using Kendo control, this book helps in understanding from basics to advance level of How to do things in easiest way.
I liked the content that has been covered in this book and the author has explained. Below are my thought on the chapters that are covered in this book.
Chapter 1 this book has explained with the very basic example about uses of the syntax like #= # and others. It covers how we can render the Html Pages by filling the data using the given syntax. Focus of the chapter 1 on using templates, how to implement using MVVM and how bindings work. Also I like the way author has explained the Built-in validator [Pg no 11]
Chapter 2 has covered in depth for How to use Kendo Grid , implementing filters, binding with data source(local and Remote) [Pg no 15], Customizing the look and feel of the Grid, implementing shorting and filtering of data. Shorting and filtering of Grid are covered from [Pg no 16]
In this chapter the Author has covered all the points that I have mentioned above and he has beautifully explained syntax and uses of the control.
Chapter 4 covers about the Kendo Editor using which you can create rich html content. This chapter explains how you can add/edit /update text creating bullets, inserting tables and images. Also this chapter has explained how to enable/disable/add/remove the tools when initializing the control.
Chapter 5 explains about the how you can utilize the power of the Panel Bar, it covers binding the Data Source objects, Customization and use of Ajax to load the panel content. Here we can see how panel Bar can work with multilevel hierarchical data [pg no 34].
Chapter 7 covers the Popup window; this chapter also covers how we can set widow to modal and how we can customize the window.
Chapter 8 & 9 covers how we can use the Kendo UI in Mobile application development and how to use Widgets, these chapter details of Mobile Framework. Here you can learn about how to implement the touch, swipe, tap, and double tap hold features [Pg no 53], the widgets section covers ListView, ScrollView, ActionSheet, TabStrip, SplitView and Navbar. Author has beautifully explain the use of hierarchical list, use of HierrachicalDataSource and hierarchicalTemplate [pg no 60]
Chapter 10 & 11 These chapters will help the developer to learn the use of Charts and Advance charting using DataViz, how user can dynamically generate charts based on the remote data source, how you can change the theme of chart dynamically. The use of multi axis chart is explained at [pg no 70], we can make charts interactive by using the events provided by DataViz [Pg no 72], personally I like the way the Radial Gauge widget is explained at [pg no 77].
In many application if we are working on Warehouse management application, we need our application be capable to reading the barcode data, here author has explained the use of Kendo Barcode, kendoQRCode [Pg no 79-80]. The flow diagram [Pg 81] covers the good example explaining how we can create a flow chart and using kendo Diagram how we can create organization chart [pg no 82].Finally a good example on the Kendo Map using Geo jSON.
You can get the Book from : Kendo UI CookBook
What is MVVM?
Model View ViewModel (MVVM) is a design pattern which helps developers to separate the Model (the data) from the View (the UI). The ViewModel part of MVVM is responsible for exposing the data objects from the Model in such a way that those objects are easily consumed in the View.
MVVM Using Kendo
So let’s get right to it with a few simple examples to see how we can use MVVM pattern of Kendo.
First add a script references for jQuery and Kendo UI, here are some links for Microsoft’s and Telerik CDN’s for these scripts.
<!DOCTYPE html> <html> <head> <title>Kendo UI Web MVVM</title> <script src="http://code.jquery.com/jquery-1.7.1.min.js"> </script> <script src="http://cdn.kendostatic.com/2012.2.710/js/ kendo.all.min.js"> </script> </head> <body></body> </html>
Let’s create a simple form which will have some input text and button. And we will provide the binding (mapping) information, which will map our controls to our ViewModel. The beauty here is we will do this declaratively with without code
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-1.7.1.min.js"> </script> <script src="http://cdn.kendostatic.com/2012.2.710/js/ kendo.all.min.js"></script> </head> <body> <div id="formContainer"> <h1>Kendo MVVM Web View!</h1> <form id="myForm" action=""> <label>First Name</label> <input type="text" data-bind="value: firstName" /> <label>Last Name</label> <input type="text" data-bind="value: lastName" /> <label>Email</label> <input type="text" data-bind="value: email"/> <label>Address</label> <input type="text" data-bind="value: address" /> <label>City</label> <input type="text" data-bind="value: city" /> <label>State</label> <input type="text" data-bind="value: state" /> <label>Zip</label> <input type="text" data-bind="value: zip" /> <label>Country</label> <input type="text" data-bind="value: country" /> <label>Occupation</label> <select data-bind="source: occupations, value: occupation"></select> <input type="button" value="Reset"/> </form> </div> </body> </html>
We will also add some methods to our View Model so that we can bind our button that are on our view too. Now let’s demonstrate binding our buttons to methods on our ViewModel, will demonstrate the reset button.
- reset, will clear out our View
Here we have added data-bind attribute to Reset button.
<input type="button" value="Reset" data-bind="click: reset" />
And now we will update our ViewModel to add the reset function and its implementation
Hitting the [Reset] button will simply invoke the reset method on our ViewModel which clears out all our properties by setting them null values and again our View is automatically updated because it is bound to our View Model.
Here we saw how easily we can implement the MVVM framework using KendoUI with minimal amount of coding. Here to explain MVVM I have used textbox and list. There are other controls provided by kendo which can be bounded using View Model. For reference you can visit