Autoplay
Autocomplete
Previous lesson
Complete and Continue
Defeat Knockout.js in Magento 2
Getting Started with Knockout.js Development
What is Knockout.js?
Preview
7:16
Build a Knockout.js component outside of Magento
5:25
Set up Magento environment for JavaScript development
3:40
Requirements for the Inventory Fulfillment module
Preview
4:51
How Magento initializes & bootstraps Knockout.js
Preview
3:58
Create a Magento module skeleton, route, and controller
4:02
Create a Magento layout block and display it on a page
2:46
Create a Magento UI Component to instantiate a Knockout.js view model
8:53
Debug UI components & Knockout.js view models in Google Chrome
4:54
Knockout.js ViewModels & Views
Why link a UI Component to a Knockout.js view model in Magento?
4:06
Execute code upon loading a Knockout.js ViewModel
2:07
What is a Knockout.js virtual element?
4:21
Display a Knockout.js template from a UI Component
Preview
4:49
Knockout.js Data Binding & Event Handlers
Bind & display text within a Knockout.js rendered template
5:00
Create a reactive, observable variable in Knockout.js
Preview
3:04
When to use or avoid Knockout.js observables
3:15
Create a form submission in Knockout.js with a click handler
2:10
Create a form submission in Knockout.js with a submit handler
1:40
Call the Magento API to get product data for a SKU
2:23
Create a basic Ajax request for a Knockout.js template
Preview
3:59
Handle Ajax success & error responses in Knockout.js
4:06
Knockout.js Rendering & Views
Use a Knockout.js style data binding attribute for reactive inline styling
3:53
Add a loading spinner to Ajax requests in Knockout.js
3:28
Translate text in Magento Knockout.js JavaScript files
5:20
Translate text in Magento Knockout.js template files
5:59
Guidelines for using jQuery & KnockoutJS together
Create multiple Knockout.js templates to organize complex views
5:40
Knockout.js Observable Arrays & Context
Create a Knockout.js observable array
2:08
Render a Knockout.js observable array with foreach
3:09
Get the index of a Knockout.js observable array item
2:23
Render a Knockout.js observable array with a virtual element
2:54
Build and render multi-dimensional observable arrays in Knockout.js
2:28
Get & specify the context of a Knockout.js observable array item
4:18
Understand $root & $parent in Magento's Knockout.js implementation
4:49
Build a complex observable array in Knockout.js
2:08
Bind input fields to complex observableArrays in Knockout.js
5:42
Create a Knockout.js click event handler
3:03
Bind context to a Knockout.js click handler
6:15
Create a Knockout.js submit event handler
2:11
Styling Knockout.js with CSS
Style a Knockout.js template with CSS
6:21
Style a Knockout.js template with Magento CSS variables
3:12
Advanced Knockout.js Concepts
Understand local & external JavaScript state management in Magento
Preview
Share data between multiple Knockout.js templates with external state
4:21
Refactor Knockout.js view model handlers into model actions
4:42
Subscribe to changes of Knockout.js observable values
3:24
Create a Knockout.js computed function
7:27
Exercise: Create a Knockout.js computed function
Write a custom Knockout.js extender to validate & enforce data integrity
8:58
Optimize computed functions with pureComputed
2:36
Client-side Ajax form validation with jQuery
7:22
Persist Ajax form validation with Knockout.js observables
2:03
Create dynamic attributes with Knockout.js
4:33
Challenge! 🚀 Create a UI Component, Knockout.js template and model
Challenge Review: Create a UI Component, Knockout.js template and model
14:17
Using reduce within a Knockout.js computed function
5:53
Refactoring a Knockout.js computed function to an external model
2:27
Exercise: Using reduce within a Knockout.js computed function
Control visibility & disable elements with KnockoutJS
7:32
Nesting issues using the KnockoutJS containerless control flow syntax
2:25
Working with Data in Knockout.js
Overview of Knockout.js custom data binding handlers
3:16
Challenge! 🚀 Build your own Knockout.js custom data binding
Get familiar with Knockout.js utilities
1:36
Save JSON data with Knockout.js and a standard form post
7:03
Save JSON data with Knockout.js and an Ajax form post
4:18
Create a controller action to handle a form post submission
3:43
Completion
Downloadable archive of the InventoryFulfillment module
Course feedback & certificate for the Defeat Knockout.js in M2 course
Save JSON data with Knockout.js and an Ajax form post
Lesson content locked
If you're already enrolled,
log in to access this lesson
.
Enroll in Course to Unlock