Knockout js

2,987 views

Published on

Knockout JS is a new JavaScript library that utilizes that MVVM pattern to build rich web applications. In this talk we will introduce Knockout JS as well as the MVVM pattern. This will be a code heavy presentation as we illustrate the various features of the framework. Using Knockout, you can easily build responsive, maintainable and testable JavaScript applications.We'll explore testing in Javascript and look at how you can use Knockout JS with Jasmine, a Javascript BDD library. I'll show you how to build rich JavaScript applications using a Test Driven Development approach. We'll also look into how you can extend Knockout by creating custom bindings and using it side by side with JQuery. Lastly we'll examine how you can interact with Knockout via ASP.NET applications and go over some best practices for validation and storage of data.

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,987
On SlideShare
0
From Embeds
0
Number of Embeds
30
Actions
Shares
0
Downloads
90
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Knockout js

  1. 1. HattanShobokshi<br />JavaScript MVVM with Knockout JS<br />
  2. 2. Housekeeping<br />Stuttering is a communication disorder involving disruptions, or “disfluencies,” in a person’s speech.<br />Across all cultures, roughly 1% of people currently has a stuttering disorder.<br />http://westutter.org/<br />
  3. 3. HattanShobokshi<br />Senior Software Engineer<br />www.hattanshobokshi.com<br />hattan@gmail.com<br />http://speakerrate.com/hattanhttp://www.slideshare.net/shobokshi<br />Who am I?<br />
  4. 4. <ul><li>What is MVVM & Knockout JS ?
  5. 5. Why Knockout JS?
  6. 6. Testing JavaScript
  7. 7. Customization
  8. 8. Best Practices
  9. 9. ASP.NET</li></ul>Goals for this talk<br />
  10. 10. What is MVVM?<br /><ul><li>Architectural pattern targeting rich UI
  11. 11. Separate Business Logic from UI logic
  12. 12. Separation of Concerns
  13. 13. Originally Introduced for WPF and Silverlight</li></li></ul><li>
  14. 14. What is Knockout?<br /><ul><li>Elegant dependency tracking - automatically updates the right parts of your UI whenever your data model changes
  15. 15. Declarative bindings - a simple and obvious way to connect parts of your UI to your data model
  16. 16. Flexible and sophisticated templating- construct a complex dynamic UI easily using arbitrarily nested templates
  17. 17. Trivially extensible - implement custom behaviors as new declarative bindings for easy reuse in just a few lines of code</li></li></ul><li>Why Knockout?<br /><ul><li>Isn’t JQuery enough?
  18. 18. Isn’t JavaScript developer horrible? Tools?
  19. 19. Community Project
  20. 20. Easier to Unit Test
  21. 21. Purely Client side
  22. 22. Automatic Two way Binding
  23. 23. Easy to set up via NuGet</li></li></ul><li>Demo<br />
  24. 24. Testing<br /><ul><li>Test Driven Development
  25. 25. Behavior Driven Development
  26. 26. JASMINE </li></li></ul><li>ASP.NET MVC Integration<br /><ul><li>Json Model Binding support in MVC3
  27. 27. Data Bind attribute conversion in MVC3 Helper
  28. 28. Works with standard MVC binding
  29. 29. Validation</li></li></ul><li>What did we just talk about?<br /><ul><li>What is MVVM?
  30. 30. Why Knockout?
  31. 31. What is Knockout?
  32. 32. ASP.NET MVC Integration
  33. 33. DEMO</li></li></ul><li>www.hattanshobokshi.com<br />hattan@gmail.com<br />Thank You! <br />

×