mvc - Better User Experience with Kendo UI


Published on

Webinar from Telerik India - ASP.NET MVC - Better User Experience with Kendo UI.

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide mvc - Better User Experience with Kendo UI

  1. 1. THE WAY OF HTML5
  2. 2. Who am I ? Lohith G N – Developer Evangelist – Telerik, – – Bangalore Dot Net (BDotNet) User Group Lead, – Microsoft MVP, – @kashyapa, –,
  3. 3. Agenda ASP.NET Introduction to Building Apps MVC Kendo UI with Kendo UI
  4. 4. ASP.NET MVC- Primer @telerik
  5. 5. What is ASP.NET MVC- Powerful, Pattern Based way to build dynamic websites- Enables clean separation of concerns- Full control over markup- TDD friendly development
  6. 6. /Home/Index Controll er Model View
  7. 7. Kendo UI- Introduction @telerik
  8. 8. What is Kendo UI ?Everything you need to build HTML5 + JavaScript sites & APPS“Kendo UI solves an important problem faced by JavaScript andHTML5 developers. It delivers a unified framework backed byprofessional support. Its easier to learn, easier to upgrade, ultimatelymaking it easier to build apps with HTML5.” -Todd Anglin, VP – HTML5 Web & Mobile Tools, Telerik
  9. 9. Kendo UI Blocks ASP.NET MVC Wrappers Kendo UI Kendo UI Kendo UI Web DataViz Mobile Kendo Framework Elements
  10. 10. Kendo Building Blocks a.k.a F/W DataSource Validation Globalization Templating MVVM Drag & Drop
  11. 11. Everything you need in oneplace,Not hundreds of plug-ins- UI Widgets- MVVM Framework- Datasource- Templates- Themes
  12. 12. Ready for Touch- Full support for Touchscreen- D & D also Touch Enabled
  13. 13. Fast JavaScript forperformance- Every aspect built from ground up- Not another Jquery UI Clone- Lightweight, templating library faster than jquery templates- Optimized animations
  14. 14. Great UX across devices and browsers- IE7+- FF ESR- Chrome- Safari 4+- Opera 10+
  15. 15. Manage rich views andmodels the MVVM way- Inbuilt MVVM framework- Declarative binding, two-way sync- Can be used with other lib like Backbone.js
  16. 16. Customize themesCustomize themesto match the look & feelof your site and app- ThemeBuilder tool to customize
  17. 17. Kendo UI Widgets DateTimePick AutoComplete Calendar ComboBox DatePicker er DropDownList Editor Grid ListView Menu NumericTextB PanelBar Slider Splitter TabStrip ox TimePicker TreeView Upload Window
  18. 18. Using Kendo UI1. Download Kendo UI2. Configure page to use Kendo UI Scripts & Styles, Define basic HTML3. Initialize with JavaScript4. Use rich API to configure behavior, handle events 1. Attribute Based 2. JavaScript Based
  19. 19. DEMO @telerik
  20. 20. Kendo UI Wrappers forASP.NET MVC @telerik
  21. 21. Power ofJavaScript,Productivity ofServerSimply program on the server and theKendo UI wrappers will handle theHTML and JavaScript
  22. 22. Simple server-sidedata binding andCRUDserver-wrappers help configureJavaScript data sources to work directlywith your data, even for CRUDoperations.
  23. 23. Complete Server& Client-side APIsComplete control via complete server-side APIs. Server wrappers outputKendo UI JavaScript.You have full access to the Kendo UIclient-side API for maximum control inthe browser
  24. 24. • Supports ASP.NET MVC 3+• Use with any ViewEngine (Razor, ASPX)• Automate AJAX data binding• Visual Studio helpers for faster configuration
  25. 25. Q3 2012Demo
  26. 26. Q&A @telerik
  27. 27. Resources Kendo UI Mobile Home Page  Kendo UI Mobile Demos  Kendo UI Mobile Documentation  Kendo UI Dojo 