Today we are going to talk to you about Kendo UI, a JavaScript library distributed by the company Telerik. In case you did not know, kendo is a modern Japanese martial art akin to fencing, and it is precisely on that image that the tool we are going to talk about is based. No, we are not going to talk to you about competitive sport, but about a tool to save you time when you develop a web application.
Kendo UI, one JavaScript library and 4 different frameworks
Kendo UI actually comes in 4 distinct JavaScript libraries, each optimised for one of your favourite frameworks! By the way, if you do not know which JavaScript framework to choose, we advise you to read our article on the subject: which are the best frameworks for your website 😉 The good news is that if you manage your front end with jQuery, Angular, React or Vue.js, Kendo UI offers you a list of completely self-contained, customisable components for managing your user interfaces. Why is that useful? Because the tool saves you a great deal of time! Kendo states that it worked for more than 15 years to develop this JavaScript library. It is a solution that competes with jQuery UI but is more complete and more up to date.
Attractive JavaScript components, responsive and customisable
Through its libraries, Kendo offers a whole series of components that will allow you, among other things, to create attractive charts, grids and editing areas as well as other elements likely to complete your user interfaces. You should also know that this JavaScript library was built taking modern web standards into account (HTML5, CSS3). Along the same lines, Kendo meets current requirements in terms of UX: it is compatible with all browsers and its components are optimised for use on the different categories of device (desktop, mobile, tablet). The screenshot shown just above presents the components offered by the Kendo jQuery library, which is the one with the most. Note that these components also allow you to do data binding. To sum up, this is, among other things, what is used in Angular to link your view to the logic layer (the DOM). If you are not familiar with Angular, data binding allows you to manipulate HTML elements by means of JavaScript controllers; it is in a way managed by the controllers.
A few examples of Kendo UI in use:
Kendo offers an online showcase of examples of its components in use. If you click on the name of a component, you will therefore reach a page presenting the feature with an example and a code excerpt. But in addition to that, Kendo has made available a few more concrete examples of how to use this JavaScript library:
- an SPA project, with a sushi booking site
- a stock management dashboard
- a user interface showing sales statistics
A light open-source version, and a licence for a more complete service
Kendo UI Core: the free, open-source alternative
There is indeed an open-source version of Kendo called Kendo UI Core; it is in fact a light version of the library, compatible only with jQuery. But… this open-source version has no support and offers only around forty components! For so-called “classic” projects, this solution can be worthwhile. It is a licence based on Apache 2.0 and it nonetheless contains interesting components such as:
- calendar
- formatting editors
- components related to event management
- others related to navigation
- etc.
However, if you want a more complete version with the famous charts and data grids, you will have to move to the “paid” version.
Access to support, cross-project use and training with the paid version
The full version of Kendo UI is available through 4 paid licences. The first is available from $899. For that price, you have access to the various JavaScript libraries (jQuery, Angular, Vue.js and React) as well as to support by means of 10 ticket submissions with a response time of 72 hours. A small bonus: 30 hours of training to familiarise yourself with Kendo is available on request! The difference with the other types of licence is based solely on a more complete package with access to the other tools of the company Telerik and to more responsive support. Note that all the licences offered are tied to one person, but valid indefinitely — that is to say, for all your different projects! If limited access to support is a problem for you, you should also know that a forum is maintained for each JavaScript library on the Kendo site and administered by support engineers.
Roadmap and evolution of the Kendo libraries
The bad news is that some components are not yet available for all the frameworks mentioned above. Do not panic: it is only a few components; the majority are available in each JavaScript library.
This is explained in particular by Kendo’s development roadmap:
- the first Kendo JavaScript library to see the light of day was the jQuery one, on 29 February 2012
- in January 2017, it was Angular whose library was released
- in September 2017, it was Vue.js’s turn
- and since August 2018 React has also had its own library of Kendo components.
To sum up, Kendo first offered compatibility of its JavaScript component library with jQuery because in 2012 it was the most fashionable JavaScript library! Then the samurai-styled brand adapted on seeing the enthusiasm generated by React, Angular and Vue.js.
Even though the Kendo React library is the newest, it nonetheless has the main components, including:
- the grid system (Grid)
- the text editor (Editor)
- the diary (Scheduler)
- charts (sparkline, bar chart, etc.)
- drop-down list (DropDownList)
- pop-up (Window)
- widget for sending files (Upload)
- file manager (TreeView)
- and many more!
Looking at Kendo’s latest new features, we can see that the most recent additions concern the React Kendo library — that is to say, the JavaScript framework that is popular at the moment! Let us also note that the changes made before those for React were the jQuery ones. We can therefore conclude that Kendo is not the type to abandon a framework along the way, and it is perhaps for that reason that it carefully chooses what its tool is compatible with. Watch this space: perhaps one day Mithril.js will be a compatible framework 😉
