KnockoutJS Essentials

Jorge Ferrando

• Verlag: Packt Publishing
• Jahr: 2015
• ISBN:
  9781784395285
• Thema: Computer Science
• Thema: Computer Science General

About This Book

• Create rich Internet applications using JavaScript
• In a step-by-step manner, explore how to customize and extend KnockoutJS to take your app to the next level
• Great examples show how KnockoutJS can simplify your code and make it more robust

Who This Book Is For

If you are a JavaScript developer who has been using DOM manipulation libraries such as Mootools or Scriptaculous, and you want go further in modern JavaScript development with a simple and well-documented library, then this book is for you. Learning how to use Knockout will be perfect as your next step towards building JavaScript applications that respond to user interaction.

KnockoutJS Essentials

---

Table of Contents

KnockoutJS Essentials

Credits

About the Author

Acknowledgments

About the Reviewers

www.PacktPub.com

Support files, eBooks, discount offers, and more

Why subscribe?

Free access for Packt account holders

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Downloading the example code

Errata

Piracy

Questions

1. Refreshing the UI Automatically with KnockoutJS

KnockoutJS and the MVVM pattern

A real-world application – koCart

Installing components

The view-model

The view

The model

Observables to refresh the UI automatically

Managing collections with observables

Inserting elements in collections

Computed observables

Summary

2. KnockoutJS Templates

Preparing the project

Creating templates

The header template

The catalog template

The add-to-cart-modal template

The cart-widget template

The cart-item template

The cart template

The order template

The finish-order-modal template

Handling templates with if and ifnot bindings

Managing templates with jQuery

Managing templates with koExternalTemplateEngine

Summary

3. Custom Bindings and Components

Custom bindings

The toggle binding

The currency binding

Create a binding to debug – the toJSON binding

Being semantic with our bindings

Wrapping a jQuery plugin into a custom binding

Components – isolated view-models

Advanced techniques

Controlling descendant bindings

Using virtual elements

Preprocessing data before binding

Summary

4. Managing KnockoutJS Events

Event-driven programming

The click event

Passing more parameters

Allowing the default click action

Event bubbling

Event types

Event binding

Unobtrusive events with jQuery

Delegation pattern

Building custom events

Events and bindings

Summary

5. Getting Data from the Server

REST services

Defining CRUD

Singleton resources

Setting CRUD operations in the resource

Using resources in the view-model

Using Mockjax to mock HTTP requests

Generating mock data with MockJSON

Retrieving a product by ID

Creating a new product

Separation of concerns – behavior and data

Creating the product service

Creating the CartProduct service

Updating a product

Deleting a product

Sending the order to the server

Handling AJAX errors

Validating data

Extending the product model

Extending the customer model

Summary

6. The Module Pattern – RequireJS

Installing the Knockout context debugger extension

The console

The module pattern

Creating the Shop module

The ViewModel module

The Models module

The Resources module

The Services module

Events, bindings, and Knockout components

Updating the add-to-cart-button component

Updating events

Using RequireJS to manage dependencies

Updating the template engine

Configuring RequireJS

Using RequireJS in our project

Defining the app.js file

Converting a normal module into an AMD module

Applying RequireJS to components

Applying RequireJS to mocks

Applying RequireJS to bindings

Applying RequireJS to events

The limits of the application

Summary

7. Durandal – The KnockoutJS Framework

Installing Durandal

Durandal patterns

The index.html file

The main.js file

The shell view-model

The shell view

Durandal life cycle

The activation life cycle

The promise pattern

Compositions

Object composition

Visual composition

Router

Route parameters

Triggering navigation

Child routers

Events

Widgets

Setting up widgets

Writing the widget view

Writing the widget view-model

Registering the widget

Building a page with Durandal

Summary

8. Developing Web Applications with Durandal – The Cart Project

Introduction

Setting up the project

Routing the project – the shell view-model

The navigation and shell templates

The catalog module

The catalog view

The catalog view-model

The cart service

The log service

Adding products to the catalog

The add product view

The edit view

The add product view-model

Making mocks real

The edit view-model

The cart module

The cart view

The cart view-model

The order module

The order view

The order view-model

Grouping code by feature – managing big projects

Summary

Index

KnockoutJS Essentials

Copyright © 2015 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

First published: February 2015

Production reference: 1210215

Published by Packt Publishing Ltd.

Livery Place

35 Livery Street

Birmingham B3 2PB, UK.

ISBN 978-1-78439-707-4

www.packtpub.com

Credits

Author

Jorge Ferrando

Reviewers

Bhoomi Desai

Christian Droulers

Magesh Kuppan

Commissioning Editor

Dipika Gaonkar

Acquisition Editor

Owen Roberts

Content Development Editor

Shubhangi Dhamgaye

Technical Editor

Ruchi Desai

Copy Editors

Puja Lalwani

Laxmi Subramanian

Project Coordinator

Harshal Ved

Proofreaders

Simran Bhogal

Safis Editing

Paul Hindle

Indexer

Monica Ajmera Mehta

Graphics

Disha Haria

Production Coordinator

Nilesh R. Mohite

Cover Work

Nilesh R. Mohite

About the Author

Jorge Ferrando is a frontend developer at Uni Micro AS, Norway. He develops economy systems using JavaScript. He has experience as a PHP and C# developer working for companies such as Vigilant and Dreamstar Cash.

Jorge grew up in Callosa d'en Sarrià, Spain. He attended the University of Alicante where he discovered that web applications are his passion. He started to develop websites when he was 16 years old for a little company in his hometown. He then started practicing at Vigilant as a junior PHP...