Intro to Knockout.JS for Salesforce1

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