Have it Your Way with the R3 2017 Kendo UI Release-2_870x220

The R3 2017 release of Kendo UI is with huge updates—like support for React and Vue.js—plus new components and features across the board.

Do you feel it? That special kind of feeling that only comes around three times a year. That's right, it's time for a new release! Today I am thrilled to announce the R3 2017 release of Kendo UI! We have an enormous set of enhancements for Kendo UI coming at you, including support for two of the most popular JavaScript frameworks out there: React and Vue.js. On top of that existing flavors of Kendo UI have had new components and features added to them—so no matter what frameworks you're developing with there will be something new for you to add to your apps.

Continue to read the highlights below and see how the Kendo UI components will unleash the JavaScript warrior within you!

There's a lot of content in this blog post so here's a table of contents for you to navigate through everything a little easier.

Table of Contents

  1. React and Vue.js support comes to Kendo UI
  2. Kendo UI for Angular gets even better
  3. ASP.NET Core 2.0 Support Added
  4. More enhancements to the jQuery edition
  5. New and improved support packages
  6. A brand new bundle: DevCraft UI
  7. Want to see more?
  8. Is something missing?

React and Vue.js support comes to Kendo UI

You've asked for it, and here it is! As of R3 2017 Kendo UI adds support for both React and Vue.js, adding to the impressive list of JavaScript frameworks that we support.

This means that as a Kendo UI developer you can now write applications using:

This initial release of React and Vue support are an official set of wrappers around Kendo UI that gives immediate support for the large set of Kendo UI components that already exists. The Grid, Scheduler, and many of your favorite widgets are all available with this release. Of course, this also means that you can submit support tickets on any issue you run in to with these widgets. There are some widgets that are still being worked on, but these will be rolled out as they are ready within the next couple of months.

These components are taken to the next level with support common framework integrations with React and Vue (like Redux) so they offer several improvements on top of the Kendo UI framework to ensure that developers can continue to utilize all of their favorite utilities and toolkits. We will cover this more in our sample resources but the initial feedback that we've had on the React side when showcasing this architecture of the components has been very positive!

As for native components for each of these libraries, you should stay tuned for updates to the Kendo UI roadmap. There are too many goodies in this release to cover the specifics right here.

Rather than go through each component and specific implementation details here I encourage everyone to view our getting started materials and documentation for each of these frameworks. To get access to the demos you can simply click on your favorite component and find either "React" or "Vue" in the left-hand side menu.

React

Vue

With the R3 2017 release of Kendo UI you can truly have it your way with your JavaScript development. Stay with a framework, jump from framework-to-framework, or just experiment with what else is out there! No matter the choice of framework Kendo UI has got your back.

Kendo UI for Angular Gets Even Better

Continuing to add more and more functionality to Kendo UI for Angular, our native set of Angular UI components, we have added more functionality to our already powerful Grid and ever-expanding list of form elements. Additionally, we've brought initial support for the Material theme, and we've brought our PDF rendering library to Angular.

Material theme support

Angular Material is a very popular set of components and guidelines around the design of your application offered by the official Angular team. Since Kendo UI for Angular is a native set of components it makes a lot of sense for us to offer support for the most popular design methodology that goes hand-in-hand with the Angular framework.

This release brings our first set of components that can be styled with the Material theme. This is currently a subset of the Kendo UI for Angular components but we're going to steadily be adding supported components with this theme.

This is a very deep integration with a theme by the way - no shortcuts are being taken. We've even gone as far as providing custom directives for common features of Material, like the Material ink ripple effect.

Material support

Figure 1: Material theme on some Kendo UI for Angular Components

Ripple effect

Figure 2: Material ink ripple effect at work

Always be on time with the TimePicker component

R3 2017 brings out the new TimePicker component. As the name kind of gives away, this new widget is designed to give users an intuitive way to select a time slot within a dropdown. Our design team knocked this user experience out of the park if you ask me!

Time picker

Figure 3: New TimePicker component

Grid updates

The Grid has a whole slew of new features added to it with R3 2017.

One of the most requested features was selection and we brought that with plenty of gusto! Not only do we offer traditional selection through single and multiple options, but we added support for checkbox only selection for scenarios where you only want checkbox interaction to select or deselect a row.

Grid selection

Figure 4: Grid row selection

We also added in-cell editing with this release. Not everyone wants to put entire rows in edit mode, or work with a bulky external form, just to update single cells here and there. So, now you can offer editing on a cell-by-cell level and your users can now become data-editing wizards!

Grid editing

Figure 5: The in-cell editing mode of the Grid

For the folks using the Grid with large data sets (which seems to be all of you!) we also introduced the ability to use grouping together with virtualization. These two features have traditionally not been able to be combined, but thanks to some magic from the Kendo UI engineering team you can now have grouping enabled in even the most data-intensive scenarios.

New chart type

You can never get enough charts! Based on feedback from you we continue to implement more and more chart types. This release introduces the RangeArea Chart type to the already extensive list of chart types that we offer in Angular.

What is a RangeArea chart? Well, you're probably familiar with an Area chart that fills in itself from the value to the applicable axis. The Range Area takes this approach but allows you to determine a minimum and maximum value that gets filled in. This is extremely useful in cases where you want to graphically showcase mins and maxes for a particular point.

Range area charts

Figure 6: The new RangeArea chart type

PDF exportation comes to Angular

One of our more popular features in the jQuery edition Kendo UI is the ability to export components, and generic HTML, to a PDF file. Adding to growing list of helper libraries in Angular, in this release we've now brought PDF exportation to Kendo UI for Angular with the PDF Export library.

This works both by itself on generic HTML and is also integrated in to our other components like the Grid.

ASP.NET Core 2.0 Support Added

I'm probably not the first to tell you this, but ASP.NET Core 2.0 was released a month ago. As a part of our commitment to the ASP.NET developer landscape we have worked to ensure that our ASP.NET Core UI components (based on Kendo UI) now support ASP.NET Core 2.0!

Of course, the JavaScript flavors of Kendo UI will have no problem working with ASP.NET Core 2.0.

More Enhancements to the jQuery Edition

The jQuery flavor of Kendo UI has of course received a ton of updates as well. While this release includes a lot of hype for React, Vue.js, and Angular, we wanted to deliver a solid set of features for our jQuery widgets.

Grid improvements

Virtual Scrolling is a pretty common implementation scenario for the Kendo UI Grid. You have tons of data but you don't necessarily want your users to use the pager that comes out-of-the-box with the Grid. Virtualization has traditionally not been able to be used together with some other features, but as a part of R3 2017 we've tried to take care of that for you.

With this release you can now work with full CRUD operations while using virtualization which has been a large sticking point for some of you.

Virtualization sometimes can't be combined with other features, specifically grouping and hierarchy. However, to mitigate this and allow you as developers to combine all of these features we have now introduced a new scrolling method: Infinite Scrolling. Much like virtualization, this allows you to serve tons of data without a pager, plus you can use CRUD operations, grouping, and hierarchy functionalities all within one Grid.

Infinite scrolling

Figure 7: Infinite scrolling mode in action

We have also improved the user experience for multi-column sorting, providing a simple interface to showcase exactly in what order the columns have been sorted in.

Multi-column sorting

Figure 8: The new multi-column sorting improvements

Scheduler and Calendar improvements

The Timeline view is an extremely popular view of the Kendo UI Scheduler. However, it has been a bit limited in how it shows multi-day events. As a part of this release we have now improved how these kind of events are displayed in the Scheduler.

Timeline view multiday

Figure 9: The "Product Planning" event started is an event that started the day before

The Calendar also received an update with handling multiple day selection. Previously this was unsupported, but today we're bringing this support with all the accoutrements (programmatic selection etc.) that you have been asking for.

Calendar multi-day

Figure 10: Multiple days have been selected (shift + click). Note that Wednesdays are disabled days and the 6th is not selected!

Bootstrap v4 support

Bootstrap continues to evolve and just a few weeks ago the library went from Alpha to Beta. Kendo UI has been an early adopter of Bootstrap v4 with our Sass-based Bootstrap theme. As a part of our adoption of this framework we now support the latest version (v4.0.0-beta as of this blog post) of this extremely useful and popular toolkit.

Accessiblity updates

Accessibility in web applications is an extremely important part of how we develop for the web today, yet it's also a neglected part of the process. Kendo UI has always been on the forefront of accessibility across our components and we constantly strive to improve the accessibility within our widgets. This allows you as a developer to focus on what makes your application tick while Kendo UI helps take care of accessibility for you.

As a part of this release we did a lot of behind the scenes work on improving accessibility, including:

  • Adding true navigation to the TreeList component
  • Improved keyboard navigation in the Grid
  • WAI-ARIA and WCAG 2.0 improvements done across the board for many of the available components

Kinvey integration

Kinvey is a Backend-as-a-Service (BaaS) that is a part of the Progress family. It's designed to help get your backend up and running faster while having important features like HIPAA compliance at your disposal. If you haven't heard of Kinvey I recommend that you check out this page for more information.

As a part of this release we now have resources around integrating data-bound widgets to a Kinvey backend. For more information you can refer to this documentation article that takes you through this process step-by-step.

New and Improved Support Packages

Up until now Kendo UI has always come with one form of support that gave you access to our legendary support through our ticketing system: Priority support. Throughout the years we've received feedback on our support packages and have decided to provide more options to our users.

As of the R3 2017 release most of our individual products can be purchased with three options for technical support - Lite, Priority, and Ultimate. This gives you as a developer the ability to choose the appropriate level of support for you and your team. Don't need as much help? Maybe "Lite" is the way to go. Want some more help through phone assistance? "Ultimate" is there to help you out.

To compare all of the support packages check out this page.

A Brand New Bundle: DevCraft UI

Based on your feedback we have simplified our offering by introducing a new bundle that includes all of our UI components. This means that UI for Xamarin, which previously was only available in DevCraft Ultimate, is now available in a lower-priced bundle! This new bundle, DevCraft UI, includes everything that a .NET developer may need (including Kendo UI!) and should be a very interesting bundle for many of you. For more information you can check out this overview page.

Want to See More?

If you want to see all of these highlights in action then I recommend signing up for our upcoming webinar on September 28th, at 11 AM ET. The Kendo UI Dev Rel team will be taking everyone through the new and improved Kendo UI bits so don't miss out on that action! Seats are limited so be sure to sign up!

Is Something Missing?

Did one of your favorite components not get an update, or did a new widget not get added? Feel free to provide any and all feedback in the comments below. Additionally, you can feel free to submit feedback in our UserVoice portals for consideration in future releases.


carl-bergenhem
About the Author

Carl Bergenhem

Carl Bergenhem is the Product Manager for Kendo UI. Throughout his time at the company he’s covered the entire portfolio of products offered, but mainly spent his time in the web development arena covering ASP.NET Ajax, ASP.NET MVC, and JavaScript-based products. He’s passionate about web technologies and has been developing with products like Kendo UI and NativeScript since their inception. In his free time Carl enjoys slaying virtual monsters, snowboarding and playing his guitar.

Related Posts

Comments

Comments are disabled in preview mode.