Carl Bergenhem
Product Manager @KendoUI. Web developer, speaker, and video gaming aficionado.
Kendo UI Overview
Introductions
Carl Bergenhem
Progress Software
Manager, Sales Engineering
@carlbergenhem
Carl Bergenhem
Progress Software
Manager, Sales Engineering
@carlbergenhem
Mike Guerra
Progress Software
Inside Sales Representative
Michael.Guerra@progress.com
Carl Bergenhem
Progress Software
Manager, Sales Engineering
@carlbergenhem
Joseph Mello
Progress Software
Inside Sales Representative
joseph.mello@progress.com
Agenda
- Introductions
- What is Kendo UI?
- Kendo UI for Angular
- Q & A
What is Kendo UI?
- Originally 70+ jQuery-based UI widgets in one toolset
- Rich UI components like Grids, Scheduler, and dropdowns
- Extensive data visualization support
- Adaptive/responsive rendering
- Integration with other JS frameworks
- AngularJS & Angular, React, and more to come!
- Everything you may need for your UX dev all in one package
- Three major updates a year (minor ones between)
- Fully supported through a support ticketing system
Kendo UI Flavors
-
Kendo UI was originally built against jQuery
- The default for JS dev during the beginnings of Kendo UI
- "If you know jQuery you know Kendo UI"
-
Created server-side wrappers for ASP.NET MVC, JSP, and PHP
- UI for ASP.NET MVC
- UI for ASP.NET Core
- UI for JSP
- UI for PHP
-
Currently working on native components for Angular and React
- Kendo UI for Angular
- Kendo UI for React
Kendo UI for Angular
History of Kendo UI for Angular
- Initially an AngularJS 1.x wrapper that was community driven
- Eventually official wrappers of jQuery edition implemented
- This served as our official AngularJS support for a while
- Initial beta of support for Angular 2.0 in November 2015
- Between beta to first RC, Angular 2.0 changed A LOT
- Initial RC of "Kendo UI for Angular" dropped in January 2017
- RTM released early May 2017
Kendo UI for Angular
- Truly native UI components for Angular
- Built from the ground up
- Contains:
- Grid, Charts, Buttons, DateInputs, DropDowns, Inputs
- Charts, gauges, and other data visualizations
- And more!
- Integrates with a lot of Angular core framework items
- Angular Forms for Grid editing
- Supports AoT Comp., Universal Rendering, and Tree Shaking
- More Angular integration, UI widgets, and features to come
- All handled through NPM packages
Getting Started
Set up your Angular project
Add the Kendo UI styles package
Add the Kendo UI Package of choice to your project
npm install -g @angular/cli;
ng new my-first-angular2-project --style=scss;
cd my-first-angular2-project;npm install -S @progress/kendo-angular-buttons
// Import the ButtonsModule...
import { ButtonsModule } from '@progress/kendo-angular-buttons';npm install --save @progress/kendo-theme-default
/* In src/styles.scss */
@import "~@progress/kendo-theme-default/scss/all";Demo Time!
Roadmap
- Large focus on "completing" the Grid and including features that still are not available
- Emphasis on form components including more date pickers etc.
- Additional chart types (catching up to the jQuery edition)
- Material theme integration
- Other large components (TreeView, Scheduler, etc.)
Q & A
Kendo UI for Angular Overview
By Carl Bergenhem
Kendo UI for Angular Overview
Overview of the Kendo UI for Angular JavaScript library serving as a quick intro to the library.
