1
Introduction to KnockoutJS
What We’re Going to Do
• Get our hands dirty with KnockoutJS• Some basic knowledge of Javascript, Apex and Visualforce
would be beneficial• We’re going to build a simple, fast, contact viewer
KnockoutJS?
• KnockoutJS is a Javascript framework for building quick, single-page applications
• Requires less boilerplate that a lot of frameworks, and is conceptually simpler than many
• Turns out it’s very easy to use with Javascript remoting!
KnockoutJS Architecture
• Knockout uses a Model – View – View Model (MVVM) pattern
• The Model is our Salesforce schema and data• The View displays data from, and triggers actions on the
view model• The View Model is pure code that interacts with the
model, and provides data and actions for the View
View Model and Bindings
• The View Model has properties called observables:self.name = ko.observable(‘Bob’);• The View can bind to these:<span data-bind=“text: name”/>• When the observable value changes, the view changes!
Learn More!
• You’re probably hooked by now, so check out these resources to learn more about KnockoutJS:–Interactive tutorials at http://learn.knockoutjs.com/–RTFM! It’s simply written, comprehensive, and logical
(something all to rare these days) http://knockoutjs.com/documentation/introduction.html