Upload
lohith-gn
View
2.257
Download
4
Embed Size (px)
DESCRIPTION
Webinar from Telerik India - ASP.NET MVC - Better User Experience with Kendo UI.
Citation preview
THE WAY OF HTML5
Lohith G N– Developer Evangelist – Telerik, – [email protected] – Bangalore Dot Net (BDotNet) User Group Lead, – Microsoft MVP, – @kashyapa, – http://kashyapas.com,
Who am I ?
www.telerikhelper.net
Agenda
ASP.NET MVC
Introduction to Kendo UI
Building Apps with Kendo UI
facebook.com/telerik
@telerik
- Primer
ASP.NET MVC
- Powerful, Pattern Based way to build dynamic websites
- Enables clean separation of concerns
- Full control over markup
- TDD friendly development
What is ASP.NET MVC
/Home/IndexControl
ler
Model View
facebook.com/telerik
@telerik
- Introduction
Kendo UI
Everything you need to build HTML5 + JavaScript sites & APPS
What is Kendo UI ?
“Kendo UI solves an important problem faced by JavaScript and HTML5 developers. It delivers a unified framework backed by professional support. It's easier to learn, easier to upgrade, ultimately making it easier to build apps with HTML5.”
-Todd Anglin, VP – HTML5 Web & Mobile Tools, Telerik
Kendo UI Blocks
Kendo Framework Elements
Kendo UI Web Kendo UI DataViz Kendo UI Mobile
ASP.NET MVC Wrappers
Kendo Building Blocks a.k.a F/W
DataSource
Validation
Globalization
Templating MVVM Drag &
Drop
- UI Widgets- MVVM Framework- Datasource- Templates- Themes
Everything you need in one place,Not hundreds of plug-ins
- Full support for Touchscreen- D & D also Touch Enabled
Ready for Touch
- Every aspect built from ground up
- Not another Jquery UI Clone
- Lightweight, templating library faster than jquery templates
- Optimized animations
Fast JavaScript for performance
- IE7+- FF ESR- Chrome- Safari 4+- Opera 10+
Great UX across devices and browsers
- Inbuilt MVVM framework
- Declarative binding, two-way sync
- Can be used with other lib like Backbone.js
Manage rich views andmodels the MVVM way
Customize themesto match the look & feelof your site and app- ThemeBuilder tool
to customize
Customize themes
Kendo UI WidgetsAutoComple
teCalendar ComboBox DatePicker
DateTimePicker
DropDownList
Editor Grid
ListView MenuNumericText
BoxPanelBar
Slider Splitter TabStrip TimePicker
TreeView Upload Window
1. Download Kendo UI2. Configure page to use
Kendo UI Scripts & Styles, Define basic HTML
3. Initialize with JavaScript4. Use rich API to configure
behavior, handle events1. Attribute Based2. JavaScript Based
Using Kendo UI
facebook.com/telerik
@telerik
DEMO
facebook.com/telerik
@telerik
Kendo UI Wrappers for ASP.NET MVC
Power of JavaScript, Productivity of Server
Simply program on the server and the Kendo UI wrappers will handle the HTML and JavaScript
Simple server-side data binding and CRUD
server-wrappers help configure JavaScript data sources to work directly with your data, even for CRUD operations.
Complete Server & Client-side APIs
Complete control via complete server-side APIs. Server wrappers output Kendo UI JavaScript. You have full access to the Kendo UI client-side API for maximum control in the browser
• Supports ASP.NET MVC 3+
• Use with any ViewEngine (Razor, ASPX)
• Automate AJAX data binding
• Visual Studio helpers for faster configuration
Q32012
Demo
facebook.com/telerik
@telerik
Q & A
Kendo UI Mobile Home Page http://www.kendoui.com/mobile.aspx
Kendo UI Mobile Demos http://demos.kendoui.com/mobile/overview/index.html
Kendo UI Mobile Documentation http://docs.kendoui.com/api/mobile
Kendo UI Dojo http://www.kendoui.com/dojo.aspx
Resources