On Sep 11 2014, we conducted a webinar titled “Best of Both Worlds – Kendo UI Integration with Angular JS”. This webinar is part of the series of webinar we do here in Telerik India for India time zone.

About Kendo UI:

Kendo UI is a flag ship product from Telerik. It is a HTMl5 based JavaScript client side UI framework. Kendo UI provide Web Widgest, Data Vizualization Widgets and Mobile Widgets. Kendo UI also has certain framework elements namely Kendo UI DataSource, MVVM, Templating, Gloabalization, Validation, Drag & Drop support, Effects and SPA. You can know more about Kendo UI here.

About Angular JS:

Angular JS is a popular JavaScript framework and is developed by folks at google. Angular pretty much is the community choice as of now when it comes to using a client side framework. It is very popular among the front end developers today.

Kendo UI + Angular JS Integration:

As part of Kendo UI framework we now fully support Angular JS. What this means is when using Angular in your project you can make use of Kendo Directives to create Kendo UI widgets. We have out of the box support for Kendo Angular Directives and the directives are available for Web, DataViz & Mobile widgets. You can continue using Angular as the back bone of your app while you can make use of Kendo UI as the front end control choice. Thats why we called this webinar “best of both the worlds”.

 

 

 

 

Slide Deck:

Here is the slide deck that was used in the webinar:

 

Video:

Here is the video recording of the webinar:

 

Q & A:

Q: Is Kendo UI With Angular is free?
A: Kendo UI comes in two flavours – Kendo UI Core which is a OSS & free and Kendo UI Professional (paid). Kendo UI Angular support is available in both – the Core & Professional editions.

Q: Is Angular JS different than Backbone JS and Knockout JS?
A: Yes. Knockout deals with only data binding. Angular provides data binding plus many more things as a framework.

Q: What do you mean by Hybrid Applications in JavaScript?
A: Mobile Apps developed using HTML/CSS/JS are known as Hybrid Applications.

Q: why did you use visual studio? is it so specific?
A: No. Speaker is familiar with Visual Studio and hence using the same. VS is not a prerequisite for this. You can use notepad, sublime text or any other editor.

Q: Is Telerik Test Studio Supports Angular Components, I am sure it supports Kendo UI?
A: Test Studio has native support for Kendo UI components. Any web page developed using Angular can also be tested using Test Studio. However, native support for Angular doesn’t exist right now.

Q: Whats your view on Open Source Ionic Framework?
A: Our team has written about it. http://developer.telerik.com/featured/supercharge-app-development-ionic-appbuilder/

Q: do we need Kendo libraries or only Kendo scripts in order to work with Kendo?
A: Kendo UI is all about 2 style sheets and 1 JavaScript file 🙂

Q: Will it helps in SharePoint ?
A: Sure. These are both client side frameworks (no server side requirements). So, it is supported by SharePoint.

Q: Is Kendo UI fully client side ?
A: Yes it is fully client side.

Q: Kendo UI is based on ?
A: It takes a dependency on jQuery. It is written from scratch for performance and functionality.

Q: DataSource is like database?
A: No. Kendo UI DataSource is a client side framework object that can connect to any web service and be leveraged by binding it to any Kendo widget & charts.

Q: If I install Kendo UI Library using Nuget in Visual Studio then do I need need to pay for that?
A: Kendo UI Core is the OSS from Telerik. It is available on NuGet as KendoUICore. Kendo UI Core is free for personal as well as commercial projects.

Q: In Core all these are available?
A: Core doesn’t have some widgets like Grid and the whole charting library. More details here: http://www.telerik.com/kendo-ui/comparison

Q: Whether Kendo UI supports all Browser?
A: List of supported browsers: http://docs.telerik.com/kendo-ui/browsers-support

Q: Can i get the document related to Kendo UI and their usage?
A: Kendo UI Documentation can be found at – http://docs.telerik.com/kendo-ui.

Q: If we need only 1 or 2 element (i.e. Calender or slider) so we have to add whole Kendo UI CSS and JS file?
A: No. You can simply use the specific js file for those specific widgets. There is a custom script builder also available at: http://www.telerik.com/download/custom-download

Q: Does Kendo-Core provide support for responsive layout like Bootstrap?
A: Kendo UI as a framework does not reinvent the wheel for providing a responsive layout. Instead all Kendo UI widgets are responsive in nature out of the box.

Q: I was under impression that Kendo UI is for Mobile apps. if true why we are using regular browser and not a emulator ?
A: Kendo UI comes in 3 flavors namely – Kendo UI Web for Web Apps/Sites, Kendo UI DataVix for visualization and Kendo UI Mobile for hybrid mobile applications. In the demo we are taking Kendo UI Web and hence the browser check.

Q: Is Angular-Kendo version released?
A: Yes. This is officially supported. http://docs.telerik.com/kendo-ui/AngularJS/introduction

Q: Hey Kendo UI Core can be used on production as it is free or any licensing issue?
A: Completely free with Apache v2 license. Good for commercial and open source projects.

Q: From where we can download free version of Kendo UI + Angular.JS ?
A: You can get the pre built package of Kendo UI Core here. Angular JS support is out of the box.

Q: what is difference between kendo.web.min.js and kendo.all.min.js?
A: Kendo Web is a part of Kendo framework. Kendo.all contains the full framework components – DataViz, Mobile and Web

Q: what are the performance issues in building hybrid apps using Kendo UI?
A: We have worked very hard to get the performance up for Kendo. You will experience a very smooth performance with Kendo in Hybrid Apps.

Q: can u please show the example of Kendo UI DropDown list?
A: Demos can be found here: http://demos.telerik.com/kendo-ui/dropdownlist/index

Q: Does same code written for Kendo UI widget (desktop web)run on mobiles also?
A: Yes, it will. Kendo UI widgets are responsive by default.

Q: Are you using Knockout JS for MVVM in Kendo?
A: No. Kendo has a native MVVM framework.

Q: Is data-role option avaliable in core ui? or only in proferssional?
A: data-role is used to convert a simple HTML element into specific widgets (e.g. Grid, ListView). It is available for all widgets that are available in Kendo UI Core. Kendo UI Professional contains additional widgets and charts.

Q: what about the row template?
A: Kendo Grid supports row templates written as Kendo Template (very simple javascript syntax).

Q: I was not able to use two panel bar controls in same page as its being tracked by ID..Ex- <Ul id=”panelbar” ?
A: You need to make sure that each widget has an unique ID

Q: Whats the role of row template here?
A: If you want to display data in a specific way from the incoming data, you can use the row template e.g. an image from simply the image URL

Q: Is Server Paging possible?
A: you can enable Kendo UI DataSource to request this from server. However, it will also need to be supported by the underlying service.

Q: Is it possible to create Angular or Kendo based website in Visual Studio 2010 ?
A: Yes absolutely. You can use any other IDE/ Editor as well.

Q: Can we use it with asp.net MVC 5?
A: Yes you can. Kendo UI comes with bindings for ASP.NET MVC 5. http://www.telerik.com/aspnet-mvc

Q: Any Kendo map file for WebStorm for code completion?
A: Sorry not available at this time. Please submit this at the feedback portal: http://kendoui-feedback.telerik.com/forums/127393-telerik-kendo-ui-feedback

Q: how can we provide locale support for multiple culture to kendo date picker with angular?
A: Locale Support is availabl for all Kendo widgets. More details: http://docs.telerik.com/kendo-ui/framework/globalization/overview

Q: my company wants to create an application on asp.net MVC. some Views should be able to work on phone also. Do u recommend me to use Kendo UI?
A: I think yes. Kendo UI specializes in making apps cross platform.

Q: Do we have widgets for pop-up dialogs?
A: Yes window widget. Demo here: http://demos.telerik.com/kendo-ui/window/index

Q: Do we have themeb uilder for kendo UI?
A: Yes, we do. http://demos.telerik.com/kendo-ui/themebuilder/

Q: Can I show google map from Kendo UI?
A: http://demos.telerik.com/kendo-ui/map/index

Q: How does kendo support these many browsers? Does it not make the framework heavy? Can we download a tailored copy that would only work for modern browsers so that the framework weight is light?
A: I am not sure if we allow only support for modern browsers. You can however use our custom script builder for only the components you require. http://www.telerik.com/download/custom-download

Q: Is kendo-UI supports rendering images/graphics/text on canvas?
A: http://demos.telerik.com/kendo-ui/drawing/index

Q: can we do animation with Kendo UI?
A: Supported via FX. Sample: http://demos.telerik.com/kendo-ui/fx/expand

On our website you can see a high level description of the integration between Kendo UI and AngularJS.

T-Shirt Giveaway:

Since we had an overwhelming response to this webinar, we decided to pick 3 winners for the T-Short giveaway instead of regular 2 winners. So here are the 3 names:

1. Prolay Sarkar
2. Vishal Sanchihar
3. Kapil Chhabra

Congratulations to the winners. We will contact you over email and will ship the t-shirts to your address. Rest of the folks dont worry, we still have a lot of webinars lined up. So keep joining us for every webinar.

Till next time – Happy Coding !!!