Kendo UI for Angular
Kendo UI for Angular
Introductions
Ignacio Fuentes
Progress Software
Sales Engineer
ignacio.fuentes@progress.com
Ignacio Fuentes
Progress Software
Sales Engineer
Joseph Mello
Progress Software
Inside Sales Representative
joseph.mello@progress.com
ignacio.fuentes@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
NativeScript
"A runtime for building and running native iOS and Android apps with a single JavaScript code base"
Why NativeScript?
- Skills reuse
- JavaScript (native APIs) and CSS (styling)
- Angular support
- Code reuse
- npm modules, 3rd-party iOS, Android, and JS libraries
- Easily use native APIs
- No wrappers to access native APIs
- Use native UI elements
- Open source
- Supported in the Telerik Platform
What NativeScript Isn't
!=
!=
No DOM
!=
No Cross-Compilation
Direct access to native APIs in JS
