Kendo UI for Angular + NativeScript

Introductions

Agenda

  • What is Kendo UI?
  • History of Kendo UI for Angular
  • Kendo UI for Angular
  • Demo - Kendo UI for Angular
  • Kendo UI for Angular Roadmap
  • Q & A (Angular)
  • What is NativeScript?
  • Demo - NativeScript
  • Q & A (NativeScript)

What is Kendo UI?

  • 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

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 AngularJS 2.0 in November 2015
  • Between beta to first RC, AngularJS 2.0 changed A LOT
    • (Even between RC to RC)
    • AngularJS 2.0 is now just "Angular"
  • Initial RC of "Kendo UI for Angular" dropped in January 2017
  • Initial RTM released on May 2017

Kendo UI for Angular

  • V1 Released on May 2017
  • Contains:
    • Grid, Charts, Buttons, DateInputs, DropDowns, Inputs
    • 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 Progress NPM registry

Add the Kendo UI Package to your project

npm install -g @angular/cli
ng new my-first-angular2-project
cd my-first-angular2-project
npm login --registry=https://registry.npm.telerik.com/ --scope=@progress
npm view @progress/kendo-angular-grid versions
npm install --save @progress/kendo-angular-buttons

// Import the ButtonsModule...
import { ButtonsModule } from '@progress/kendo-angular-buttons'

Demo Time!

(Kendo UI for Angular)

Roadmap

  • Large focus on "completing" the Grid and including features that still are not available
  • Emphasis on form components. Particularly around Calendar, DatePicker, TimePicker, etc.
  • Material Design Support
  • Improved PDF Exporting
  • 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

Demo Time!

(NativeScript)

Q & A

(NativeScript)

Made with Slides.com