Learning KnockoutJS
3.5 (16 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
143 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Learning KnockoutJS to your Wishlist.

Add to Wishlist

Learning KnockoutJS

Create powerful data-driven web applications using KnockoutJS, with the help of real-world examples
3.5 (16 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
143 students enrolled
Created by Packt Publishing
Last updated 9/2015
Current price: $12 Original price: $75 Discount: 84% off
4 days left at this price!
30-Day Money-Back Guarantee
  • 2 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion

Training 5 or more people?

Get your team access to Udemy's top 2,000 courses anytime, anywhere.

Try Udemy for Business
What Will I Learn?
  • Use the Model-View-ViewModel software design pattern to build amazing web applications and powerful user interfaces
  • Configure your application to track the changes in the UI and update data automatically
  • Enhance the functionality of your app and make it more interactive by extending the components of your code
View Curriculum
  • Some understanding of jQuery and AJAX would be helpful, but is not necessary.

Among the various JavaScript libraries available to developers, KnockoutJS really stands out due to the diverse features it provides and also because it promotes the use of the Model-View-ViewModel (MVVM) design pattern to build data-driven web applications. Construct power-packed apps without compromising on its flexibility and build rich user interfaces, which will update in real-time when the data model state changes, eliminating the need to refresh pages.

Learning KnockoutJS will walk you through all of the key features of KnockoutJS and make it easy for you to quickly and easily build feature-and data-rich web applications that are easy to extend and maintain.

We start off with a brief introduction to KnockoutJS, and its various benefits, and explore the different design patterns in context of KnockoutJS to make your JavaScript code cleaner and more manageable. After that, we will walk through and understand the relationship between Models, Views, and ViewModels, as well as creating them.

Along with that, you will also learn how we can use the different data binding attributes to manipulate the output. We will also discuss and implement various important concepts such as two way data binding and dependency tracking to update your UI in real-time and to separate the components of your application into logical parts.

We will analyze Knockout's template feature to help you deal with data context in most scenarios. Then, we will take a look at how to track the changes in dependencies and subscribe to them using computed observables and subscriptions. Furthermore, you will also learn how to customize bindings and functions as well as using extenders to create our own set of Knockout tools. Finally, we will take a look at some advanced features of KnockoutJS to take your knowledge to the next level!

Learning KnockoutJS is more than just an introduction; it's a complete course on one of JavaScript's innovative libraries.

About The Author

Robert Gaut is a father, husband, musician, photographer, martial artist, and software developer. He began his career teaching application and database development at a technical college. After several years teaching, he spent more than a decade developing web-based content management systems for the automotive industry. He currently works for a large public school district where he develops business applications and data integration processes using Microsoft technologies.

Who is the target audience?
  • If you have ever wanted to create rich, responsive, and dynamic user interfaces without mixing a lot of script, this course will give you everything you need to accomplish that goal with Knockout.JS. Users will need basic knowledge of JavaScript and HTML.
Compare to Other KnockoutJS Courses
Curriculum For This Course
21 Lectures
Introducing KnockoutJS
4 Lectures 18:35

This video will provide an overview of what will be taught in this course. We will orient the viewer on what KnockoutJS is and what it can accomplish for them; also, a sample project will be demonstrated.

The Course Overview

We will explain the MVVM software design pattern in relation to other MV* patterns (such as MVC and MVP). Describe how KnockoutJS uses MVVM in a web environment.

The MVVM Design Pattern

Describe the Observer software design pattern and how KnockoutJS implements it using the observable and observableArray data types.

The Observer Design Pattern

There are many ways to get JavaScript to mimic the class structure of OOP languages. Examine several popular methods and then introduce the Module pattern and Revealing Module Pattern.

JavaScript Closures and the Module Pattern
Displaying Data Using KnockoutJS
3 Lectures 16:24

We will create a website with the necessary Models, Views, and ViewModels to establish a KnockoutJS application.

Preview 08:26

In order to display our model's data, we need to add data-binding syntax to the markup in our View.

Displaying Model Data in a View

There are several ways to data-bind attributes on HTML elements with KnockoutJS. We will take a look at three ways of manipulating attributes with KnockoutJS.

Data Binding HTML Attributes
Two-way Data Binding in KnockoutJS
3 Lectures 26:16

We will take a closer look at how to update the View Model from an HTML form element as well as populate an HTML form element with data from the View Model.

Preview 06:17

Investigate how to data-bind various HTML form elements with KnockoutJS.

Data Binding Form Fields

Demonstrate additional bindings that can help control the appearance and functionality of HTML form elements.

Controlling Form Fields with Data Binding
Understanding Context in KnockoutJS
3 Lectures 21:28

Context is fundamental to the MVVM pattern and data-binding. Yet, it's often misunderstood. Demonstrate and explain the commonly used context objects in KnockoutJS.

Preview 09:22

Templates allow Knockout developers to consolidate and share UI elements among many data-binding scenarios. Templates create a new binding context; it's necessary to understand how to deal with the new context.

Binding with Templates

Sometimes, it's necessary to use multiple ViewModels in a single View. We examine a few methods to compose a View and View Model using multiple ViewModels.

Using Multiple and Nesting ViewModels
Using Computed Observables and Subscriptions
2 Lectures 13:39

There are times when you want to bind to a different representation of your data than what is provided in the raw data. Using computed and pureComputed observables, you can accomplish this task.

Preview 07:54

Subscribing to observables allows you to intercept changes made to them and perform additional tasks.

Subscribing to Observables
Custom Bindings, Custom Functions, and Extenders
3 Lectures 18:36

You can attach custom functions to Knockout's core value types to extend their functionality.

Preview 04:21

Extenders allow you to augment the functionality of observables by adding new properties.

Creating Extenders

Custom bindings are a way of encapsulating behavior and exposing it in the same way in which you use 'text' or 'foreach' bindings.

Interacting with jQuery in Custom Bindings
Previewing Advanced KnockoutJS
3 Lectures 10:40

Components and custom elements allow you to consolidate often-used code into a single, reusable unit.

Preview 02:54

AMD module loaders make it easy to modularize your code and load dependencies.

Using AMD Module Loaders

Durandal is a framework that uses KnockoutJS and RequireJS to build single-page applications.

Examining Durandal to Build Single Page Applications (SPA)
About the Instructor
Packt Publishing
3.9 Average rating
8,274 Reviews
59,143 Students
687 Courses
Tech Knowledge in Motion

Packt has been committed to developer learning since 2004. A lot has changed in software since then - but Packt has remained responsive to these changes, continuing to look forward at the trends and tools defining the way we work and live. And how to put them to work.

With an extensive library of content - more than 4000 books and video courses -Packt's mission is to help developers stay relevant in a rapidly changing world. From new web frameworks and programming languages, to cutting edge data analytics, and DevOps, Packt takes software professionals in every field to what's important to them now.

From skills that will help you to develop and future proof your career to immediate solutions to every day tech challenges, Packt is a go-to resource to make you a better, smarter developer.

Packt Udemy courses continue this tradition, bringing you comprehensive yet concise video courses straight from the experts.