Master KnockoutJS : Knockout JS - JavaScript MVVM

Learn KnockoutJS - JavaScript implementation of the MVVM-Model View View Model with easy to understand examples.

Created bySkillBakery Studio

Last updated 7/2016

English

What you'll learn

Introduction to KnockoutJS
Advanced Data Binding
Custom Components and Templates
Integration and Best Practices

Course content

11 sections • 39 lectures • 2h 19m total length

Introduction to KnockoutJS5:48
This lecture introduces you to KnockoutJS and MVVM Pattern
Downloading and Installing1:09
In this lecture we will see how we can download and install knockoutjs in our projects.
This lecture also shows how you can make use of Manage Nuget Packages to download and install knockoutJs in case you are using Microsoft Visual Studio IDE
MVVM with Knockout - Code Demo4:50
In this lecture we will understand MVVM - Model-View-ViewModel Pattern with knockoutJS
Things with and without KnockoutJS2:53
In this lecture we will see how things are with and without KnockoutJS

The click binding2:56
In this lecture we will explore click binding in knockoutjs
The event binding2:32
In this lecture we will explore event binding in knockout js
The submit binding2:42
In this lecture we will explore how submit binding works in knockoutjs
The enable binding1:37
In this lecture we will explore how enable binding works in knockoutjs
The disable binding1:11
In this lecture we will see how disable binding works in knockoutjs
The value binding2:01
In this lecture we will explore how value binding works in knockoutjs
The hasFocus binding2:02
In this lecture we will see how hasFoucs binding works in knockoutjs
The checked binding2:09
In this lecture we will see how checked binding works in knockoutjs
The options binding4:04
In this lecture we will see how we can make use of options binding in knockoutjs
The selectedOptions binding2:42
In this lecture we will see how selectedOptions bindings work in knockoutjs
The uniqueName binding1:57
In this lecture we will see how we can use uniqueName binding in knockoutjs

Introduction to Components1:44
In this chapter we will be knowing what exactly components are in knockout.js
Component Lifecycyle2:32
This chapter explains component lifecycle, you can skip this if you want to get to the practical aspect of components
Registering Components , Component Binding and Custom Element usage11:09
We will be covering how to create a component and register them, make use of those components in our application in different ways
Auto Module Detection6:08
We will be learning a bit about require.js and then using that we will see how we can externally load our components template asynchronously using require.js
Template Only Components3:13
In this chapter we will learn how to create template only components
Components - Using createViewModel4:31
In this chapter we will see how to make use of CreateViewModel to pass viewmodel to our components
Components Slides & Code Samples6:00

Loading and Saving JSON Data4:02
In this lecture we will see how we can convert our view model to JSON or plain js object using ko.toJSON and ko.toJS methods. We will also see how we can send data to server and populate our view model using data received from the server
Extending Observables3:01
In this lecture we will see how we can extend observables in knockoutJS
Throttle Extender1:48
In this lecture we will see how we can make use of throttle extender in knockoutJS
Add custom function using fn2:56
In this lecture we will see how we can make custom functions in knockoutJS using fn

Requirements

HTML, CSS, and JavaScript Fundamentals
Understanding of the Document Object Model (DOM):
Basic Programming Knowledge
Text Editor or Integrated Development Environment (IDE)
Web Browser
Optional: jQuery Knowledge

Description

Are you ready to take your web development skills to the next level and create dynamic, data-driven web applications? The "Master Knockout.js" course is designed to equip you with the knowledge and hands-on experience needed to become proficient in Knockout.js—a powerful JavaScript library for building interactive and responsive user interfaces.

Course Objectives:

By the end of this course, you will:

Master Knockout.js Fundamentals: Gain a deep understanding of Knockout.js and the Model-View-ViewModel (MVVM) architectural pattern. Learn how to leverage Knockout.js to separate your application's data from its presentation, resulting in cleaner and more maintainable code.
Data Binding Mastery: Become proficient in data binding techniques. Discover how to effortlessly bind UI elements to data models, ensuring real-time synchronization and a seamless user experience. You'll learn to create dynamic interfaces that respond to user input and data changes.
Creating Custom Components: Explore the art of creating custom components and templates in Knockout.js. Learn how to encapsulate functionality, making your code more modular and reusable. Develop a library of custom components that can be easily integrated into your web projects.
Advanced Topics: Dive into advanced topics, including dependency tracking, computed observables, and handling complex data scenarios. Understand how to efficiently manage and manipulate data within your applications.
Integration with Other Technologies: Learn how to integrate Knockout.js with other front-end technologies and libraries such as jQuery and AJAX to extend your application's capabilities.
Best Practices and Performance Optimization: Discover best practices for structuring and organizing your Knockout.js codebase. Optimize your applications for performance and responsiveness, ensuring a smooth user experience.
Real-World Projects: Apply your knowledge to real-world projects and use cases. Work on hands-on assignments and develop interactive web applications that showcase your skills.

Prerequisites:

Proficiency in HTML, CSS, and JavaScript fundamentals.
Basic understanding of the Document Object Model (DOM).
Familiarity with programming concepts like variables, functions, and conditional statements.
Access to a text editor or integrated development environment (IDE).
A modern web browser for testing and debugging.

Who Should Take This Course:

Front-end developers looking to enhance their skill set and build interactive web applications.
Web developers interested in adopting the MVVM pattern and data-binding techniques.
UI/UX designers aiming to create dynamic and responsive user interfaces.
Students and aspiring developers seeking to enter the web development field.
Experienced developers who want to add Knockout.js to their toolkit.
JavaScript enthusiasts and hobbyists eager to explore modern web development.

Course Format:

Instructor-led sessions with hands-on coding exercises.
Real-world projects and assignments.
Q&A sessions for clarifying doubts and discussing best practices.
Access to course materials and resources.

Duration: 2.5 Hours | 11 sections | 39 lectures

Certification: Upon successful completion of the course, you will receive a "Master Knockout.js" certificate to showcase your expertise. The certificate will be provided by Udemy.

Join us on a journey to master Knockout.js and revolutionize your web development skills. Enroll now and build the interactive web applications of tomorrow!

Who this course is for:

Professional Web Application Developers
Students and Aspiring Developers
Front-End Developers
UI/UX Designers
JavaScript Enthusiasts
Tech Entrepreneurs

Master KnockoutJS : Knockout JS - JavaScript MVVM

What you'll learn

Explore related topics

Course content

KnockoutJS4 lectures • 15min

Observables3 lectures • 22min

Bindings1 lecture • 11min

Bindings - Control Flow4 lectures • 12min

Bindings - Woking with Forms11 lectures • 26min

Rendering templates1 lecture • 2min

Binding syntax2 lectures • 4min

Creating custom bindings1 lecture • 6min

Components in KnockoutJS7 lectures • 35min

Miscellaneous4 lectures • 12min

Requirements

Description

Who this course is for: