KnockoutJS by Example

Develop rich, interactive, and real-world web applications using knockout.js

About This Book

• Master the full range of features provided by knockout.js such as declarative binding, automatic refresh, dependency tracking, and templating using this project based guide
• Tackle real-world problems such as page navigation, forms, composite UI components, maps integration, server interaction for CRUD operations, and application security
• Discover the power of knockout.js as you build applications with complexity ranging from beginner to advanced
• Extend and customize knockout.js to harness its full potential
• Integrate with third party libraries and APIs to build fully featured applications

Who This Book Is For

This book is intended for designers and developers who want to learn how to use Knockout to develop rich, interactive, and modular web applications. The book assumes no prior knowledge of the Knockout library but basic familiarity with HTML, CSS, and JavaScript would be helpful.

What You Will Learn

• Explore the basic concept behind the Model-View-View Model (MVVM) design pattern and how it is implemented by Knockout
• Develop a modular application skeleton based on the module pattern that can be used as a template for your projects
• Create single page, rich, interactive, modular, real-world applications using Knockout
• Use knockout.js with other libraries and APIs such as JQuery, Bootstrap, and Google Maps API to give your users a richer experience
• Create a real-world dynamic web form to capture user information and learn how Knockout makes it easier to capture, validate, and submit form data
• Develop and use dynamic UI components such as grids, tabs, dialogs, and wizards
• Extend knockout.js to add custom extenders, binding handlers, and observables
• Communicate with the backend server using JSON over restful web services
• Secure your single page application using token-based authentication

In Detail

Knockout is an open source JavaScript library that lets you develop rich, interactive, and modular web applications. It reduces the complexities of JavaScript and HTML development by following the Model-View-View Model (MVVM) design pattern. It allows you to efficiently develop highly scalable, testable, and maintainable web applications that are rich and interactive. Knockout is a pure JavaScript library and supports all major browsers.

This book starts with introducing the key features and concepts of knockout.js. It helps you create an application skeleton and a hello world application. You will develop a To-Do list application that aims to show the basic features of knockout.js in action such as data binding and observables, following which you will develop a dynamic online customer registration form that captures and validates customer information.

This book will further walk your way to develop a customer banking portal, which demonstrates the use of knockout.js with components such as navigation bars, tabs, carousel, master details view, panels, forms, wizards, and modal dialogs. You will also discover to use token-based authentication and authorization to secure the customer banking portal and move on to creating an editable products grid with CRUD operations. Finally, you will explore using the Google maps api with knockout.js.

By working along with the examples, this book will not only leave you with the basic understanding of knockout.js fundamentals but you will also have a web application ready instantly.

Style and approach

The book takes an iterative approach in explaining and building the sample applications. The applications are built in small portions with each portion delivering a set of features. It is an easy-to-follow yet comprehensive hands-on guide, which is full of real-world applications.

Table of Contents

Chapter 1. Getting Started
Chapter 2. Creating a To-do List Application
Chapter 3. Creating an Online Customer Registration Form
Chapter 4. Adding Validation to the Customer Registration Form
Chapter 5. Creating a Customer Banking Portal
Chapter 6. Enhancing the Customer Banking Portal
Chapter 7. Securing the Customer Banking Portal
Chapter 8. Building an Editable Products Grid with CRUD Operations
Chapter 9. Using Google Maps APIs with Knockout