In this chapter, we will develop a Single Page Application (SPA) with information about a person. Let's call it the "Personal" page. Before we begin to analyze examples, we need to do some preparatory work.
In Chapter 1, Introduction to Knockout.js, we examined the MVVM (Model-View-ViewModel) design pattern. For a better understanding of this approach to application architecture, we will split each example into three parts, corresponding to the three layers of MVVM.
In a real application, the data will be placed on the server (the Model layer of our MVVM pattern), but we will not consider client-server interaction. So, let's assume that the Model layer is a separated JavaScript object. All operations (such as viewing and editing) will be performed with data in the ViewModel, without any relation to the server. Let's start with a simple blank HTML page (PersonalPage-Blank.html):
<!DOCTYPE html>
<html lang="en">
<head>
<meta...