Knockout.js
Hands on introduction
Who am I?
Why a “Who am I?”
• Aymeric Gaurat-Apelli
• .NET developer/consultant since beta
• Worked in France, Australia (...
What is Knockout.js?
• Javascript MVVM library
• Declarative data binding
• Templating
• http://knockoutjs.com
MVV What?
Model
View
Model
View
Knockout.js
love
Javascript
object
Portion
of HTML
Javascript
object
Server
side
Basics
ko.applyBindings(viewModel, domElement);
Hey Knockout.js
Apply my view model here
HTML Page
No problem!
Basics
ko.applyBindings(myViewModel, domElement);
Hey Knockout.js
Apply my view model here
HTML Page
No problem!
Observables
Can have subscribers
Raise an event when the value changes
You can have observable arrays too
<input type=“tex...
Enough bla bla.
Let’s code…
Upcoming SlideShare
Loading in...5
×

Knockout (support slides for presentation)

382

Published on

You can find the mini project I wrote during the presentation here: https://bitbucket.org/AymericG/taskboard

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
382
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
10
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Knockout (support slides for presentation)

  1. 1. Knockout.js Hands on introduction
  2. 2. Who am I? Why a “Who am I?” • Aymeric Gaurat-Apelli • .NET developer/consultant since beta • Worked in France, Australia (Readify) and Thailand • Web entrepreneur • Facebook games (1M users/day) • http://taskarmy.com • http://weekplan.net (knockout.js SPA) • Employee at Jetabroad (Thailand)
  3. 3. What is Knockout.js? • Javascript MVVM library • Declarative data binding • Templating • http://knockoutjs.com
  4. 4. MVV What? Model View Model View Knockout.js love Javascript object Portion of HTML Javascript object Server side
  5. 5. Basics ko.applyBindings(viewModel, domElement); Hey Knockout.js Apply my view model here HTML Page No problem!
  6. 6. Basics ko.applyBindings(myViewModel, domElement); Hey Knockout.js Apply my view model here HTML Page No problem!
  7. 7. Observables Can have subscribers Raise an event when the value changes You can have observable arrays too <input type=“text” data-bind=“value: personName” /> Two way binding
  8. 8. Enough bla bla. Let’s code…
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×