diff --git a/model-view-viewmodel/README.md b/model-view-viewmodel/README.md
new file mode 100644
index 000000000..6df1ea5d7
--- /dev/null
+++ b/model-view-viewmodel/README.md
@@ -0,0 +1,145 @@
+---
+layout: pattern
+title: Model-View-ViewModel
+folder: model-view-viewmodel
+permalink: /patterns/model-view-viewmodel/
+categories: Architectural
+tags:
+ - Decoupling
+---
+
+## Also known as
+
+Model–View–Binder
+
+## Intent
+
+To apply "[Separation of Concerns](https://java-design-patterns.com/principles/#separation-of-concerns)" to separate the logic from the UI components and allow developers to work on UI without affecting the logic and vice versa.
+
+## Explanation
+
+Wikipedia says
+
+> Model–view–viewmodel (MVVM) is a software architectural pattern that facilitates the separation of the development of the graphical user interface (the view) – be it via a markup language or GUI code – from the development of the business logic or back-end logic (the model) so that the view is not dependent on any specific model platform. 
+
+**Programmatic Example**
+
+Zkoss implementation:
+
+> ViewModel will hold the business logic and expose the data from model to View
+
+```java
+public class BookViewModel {
+  @WireVariable
+  private List<Book> bookList;
+  private Book selectedBook;
+  private BookService bookService = new BookServiceImpl();
+  
+  public Book getSelectedBook() {
+    return selectedBook;
+  }
+
+  @NotifyChange("selectedBook")
+  public void setSelectedBook(Book selectedBook) {
+    this.selectedBook = selectedBook;
+  }
+
+  public List<Book> getBookList() {
+    return bookService.load();
+  }
+  
+  /** Deleting a book.
+   */
+  @Command
+  @NotifyChange({"selectedBook","bookList"})
+  public void deleteBook() {
+    if (selectedBook != null) {
+      getBookList().remove(selectedBook);
+      selectedBook = null;
+    }
+}
+```
+
+> View will have no logic, only UI elements
+
+```xml
+<zk>
+<window title="List of Books" border="normal" width="600px" apply="org.zkoss.bind.BindComposer" viewModel="@id('vm') @init('com.iluwatar.model.view.viewmodel.BookViewModel')">
+    <vbox hflex="true">
+        <listbox model="@bind(vm.bookList)" selectedItem="@bind(vm.selectedBook)" height="400px" mold="paging">
+            <listhead>
+                <listheader label="Book Name"/>
+                <listheader label="Author"/>               
+            </listhead>
+            <template name="model" var="book">
+                <listitem >
+                    <listcell label="@bind(book.name)"/>
+                    <listcell label="@bind(book.author)"/>
+                </listitem>
+            </template>
+        </listbox>
+    </vbox>
+    <toolbar>
+        <button label="Delete" onClick="@command('deleteBook')" disabled="@load(empty vm.selectedBook)" />
+    </toolbar>
+    <hbox style="margin-top:20px" visible="@bind(not empty vm.selectedBook)">
+		<vbox>
+			<hlayout>
+				Book Name : <label value="@bind(vm.selectedBook.name)" style="font-weight:bold"/>
+			</hlayout>
+			<hlayout>
+				Book Author : <label value="@bind(vm.selectedBook.author)" style="font-weight:bold"/>
+			</hlayout>
+			<hlayout>
+				Book Description : <label value="@bind(vm.selectedBook.description)" style="font-weight:bold"/>
+			</hlayout>
+		</vbox>
+	</hbox>
+</window>
+</zk>
+```
+
+Note: 
+* To deploy this, go to model-view-viewmodel folder and run: 
+* mvn clean install
+* mvn jetty:run -Djetty.http.port=9911
+* In browser, http://localhost:9911/model-view-viewmodel/
+
+## Class diagram
+
+![alt text](./etc/model-view-viewmodel.png "MVVM pattern class diagram")
+
+## Applicability
+
+* When looking for clean architecture, with better reusability, testability and maintainability.
+
+## Tutorials
+
+* [Zkoss Demo](https://www.zkoss.org/zkdemo/getting_started/mvvm)
+* [Learn MVVM](https://www.learnmvvm.com/)
+* [Android Developer CodeLabs](https://codelabs.developers.google.com/codelabs/android-databinding)
+
+## Typical Use Case
+
+* Android apps
+* .NET framework applications
+* JavaScript applications
+
+## Real world examples
+
+* ZK Framework [zkoss.org](https://www.zkoss.org/)
+* KnockoutJS [knockoutjs.com](https://knockoutjs.com/)
+
+## Consequences
+
+* John Gossman has criticized the MVVM pattern and its application in specific uses, stating that MVVM can be "overkill" when creating simple user interfaces. For larger applications, he believes that generalizing the viewmodel upfront can be difficult, and that large-scale data binding can lead to lower performance - Ref: [MVVM-Wiki](https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93viewmodel)
+
+* Can be hard to design ViewModel for larger applications.
+* For complex databinding, debugging can be difficult.
+
+## Credits
+
+* [ZK MVVM](https://www.zkoss.org/wiki/ZK%20Developer's%20Reference/MVVM)
+* [GeeksforGeeks  MVVM Intro](https://www.geeksforgeeks.org/introduction-to-model-view-view-model-mvvm/)
+* [ZK MVVM Book](http://books.zkoss.org/zk-mvvm-book/9.5/)
+* [Microsoft MVVM](https://docs.microsoft.com/en-us/archive/msdn-magazine/2009/february/patterns-wpf-apps-with-the-model-view-viewmodel-design-pattern)
diff --git a/model-view-viewmodel/etc/model-view-viewmodel.png b/model-view-viewmodel/etc/model-view-viewmodel.png
new file mode 100644
index 000000000..a775ec49f
Binary files /dev/null and b/model-view-viewmodel/etc/model-view-viewmodel.png differ
diff --git a/model-view-viewmodel/etc/model-view-viewmodel.urm.puml b/model-view-viewmodel/etc/model-view-viewmodel.urm.puml
new file mode 100644
index 000000000..8cd7cb4b8
--- /dev/null
+++ b/model-view-viewmodel/etc/model-view-viewmodel.urm.puml
@@ -0,0 +1,43 @@
+@startuml
+package com.iluwatar.model.view.viewmodel {
+  class Book {
+    - author : String
+    - description : String
+    - name : String
+    + Book(name : String, author : String, description : String)
+    # canEqual(other : Object) : boolean
+    + equals(o : Object) : boolean
+    + getAuthor() : String
+    + getDescription() : String
+    + getName() : String
+    + hashCode() : int
+    + setAuthor(author : String)
+    + setDescription(description : String)
+    + setName(name : String)
+    + toString() : String
+  }
+  interface BookService {
+    + load() : List<Book> {abstract}
+  }
+  class BookServiceImpl {
+    - designPatternBooks : List<Book>
+    + BookServiceImpl()
+    + load() : List<Book>
+  }
+  class BookViewModel {
+    - bookList : List<Book>
+    - bookService : BookService
+    - selectedBook : Book
+    + BookViewModel()
+    + deleteBook()
+    + getBookList() : List<Book>
+    + getSelectedBook() : Book
+    + setSelectedBook(selectedBook : Book)
+  }
+}
+BookViewModel -->  "-bookService" BookService
+BookServiceImpl -->  "-designPatternBooks" Book
+BookViewModel -->  "-bookList" Book
+BookViewModel -->  "-selectedBook" Book
+BookServiceImpl ..|> BookService 
+@enduml
\ No newline at end of file
diff --git a/model-view-viewmodel/lombok.config b/model-view-viewmodel/lombok.config
new file mode 100644
index 000000000..a23edb413
--- /dev/null
+++ b/model-view-viewmodel/lombok.config
@@ -0,0 +1,2 @@
+config.stopBubbling = true
+lombok.addLombokGeneratedAnnotation = true
\ No newline at end of file
diff --git a/model-view-viewmodel/pom.xml b/model-view-viewmodel/pom.xml
new file mode 100644
index 000000000..971ae59f7
--- /dev/null
+++ b/model-view-viewmodel/pom.xml
@@ -0,0 +1,115 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project xmlns="http://maven.apache.org/POM/4.0.0"
+	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
+	<modelVersion>4.0.0</modelVersion>
+	<parent>
+		<artifactId>java-design-patterns</artifactId>
+		<groupId>com.iluwatar</groupId>
+		<version>1.24.0-SNAPSHOT</version>
+	</parent>
+	<groupId>com.iluwatar</groupId>
+	<artifactId>model-view-viewmodel</artifactId>
+	<version>1.24.0-SNAPSHOT</version>
+	<properties>
+		<zk.version>9.0.0</zk.version>
+		<guava.version>19.0</guava.version>
+		<jetty-maven-plugin.version>9.4.28.v20200408</jetty-maven-plugin.version>
+		<maven-war-plugin.version>2.1.1</maven-war-plugin.version>
+		<maven-assembly-plugin.version>2.2</maven-assembly-plugin.version>
+		<maven.build.timestamp.format>yyyy-MM-dd</maven.build.timestamp.format>
+		<packname>-${project.version}-FL-${maven.build.timestamp}</packname>
+	</properties>
+	<packaging>war</packaging>
+	<name>model-view-viewmodel</name>
+	<description>model-view-viewmodel</description>
+	<licenses>
+		<license>
+			<name>GNU LESSER GENERAL PUBLIC LICENSE, Version 3</name>
+			<url>https://www.gnu.org/licenses/lgpl.html</url>
+			<distribution>repo</distribution>
+		</license>
+	</licenses>
+	<repositories>
+		<repository>
+			<id>ZK CE</id>
+			<name>ZK CE Repository</name>
+			<url>https://mavensync.zkoss.org/maven2</url>
+		</repository>
+		<repository>
+			<id>ZK EVAL</id>
+			<name>ZK Evaluation Repository</name>
+			<url>https://mavensync.zkoss.org/eval</url>
+		</repository>
+	</repositories>
+	<pluginRepositories>
+		<pluginRepository>
+			<id>zkmaven</id>
+			<name>ZK Maven Plugin Repository</name>
+			<url>https://mavensync.zkoss.org/maven2/</url>
+		</pluginRepository>
+	</pluginRepositories>
+	<dependencies>
+		<dependency>
+			<groupId>org.zkoss.zk</groupId>
+			<artifactId>zkbind</artifactId>
+			<version>${zk.version}</version>
+		</dependency>
+		<dependency>
+			<groupId>org.junit.jupiter</groupId>
+			<artifactId>junit-jupiter-engine</artifactId>
+			<scope>test</scope>
+		</dependency>
+		<dependency>
+			<groupId>com.google.guava</groupId>
+			<artifactId>guava-testlib</artifactId>
+			<version>${guava.version}</version>
+			<scope>test</scope>
+		</dependency>
+	</dependencies>
+	<build>
+		<finalName>${project.artifactId}</finalName>
+		<plugins>
+			<!-- Run with Jetty -->
+			<plugin>
+				<groupId>org.eclipse.jetty</groupId>
+				<artifactId>jetty-maven-plugin</artifactId>
+				<version>${jetty-maven-plugin.version}</version>
+				<configuration>
+					<webApp>
+						<contextPath>/${project.artifactId}</contextPath>
+						<allowDuplicateFragmentNames>true</allowDuplicateFragmentNames>
+					</webApp>
+					<scanIntervalSeconds>5</scanIntervalSeconds>
+				</configuration>
+			</plugin>
+			<!-- Build war -->
+			<plugin>
+				<artifactId>maven-war-plugin</artifactId>
+				<groupId>org.apache.maven.plugins</groupId>
+				<version>${maven-war-plugin.version}</version>
+			</plugin>
+			<!-- Pack zips -->
+			<plugin>
+				<artifactId>maven-assembly-plugin</artifactId>
+				<version>${maven-assembly-plugin.version}</version>
+				<executions>
+					<execution>
+						<id>webapp</id>
+						<phase>package</phase>
+						<goals>
+							<goal>single</goal>
+						</goals>
+						<configuration>
+							<finalName>model-view-viewmodel${packname}</finalName>
+							<appendAssemblyId>false</appendAssemblyId>
+							<descriptors>
+								<descriptor>src/main/assembly/webapp.xml</descriptor>
+							</descriptors>
+						</configuration>
+					</execution>
+				</executions>
+			</plugin>
+		</plugins>
+	</build>
+</project>
diff --git a/model-view-viewmodel/src/main/assembly/webapp.xml b/model-view-viewmodel/src/main/assembly/webapp.xml
new file mode 100644
index 000000000..153904efc
--- /dev/null
+++ b/model-view-viewmodel/src/main/assembly/webapp.xml
@@ -0,0 +1,25 @@
+<assembly
+	xmlns="http://maven.apache.org/plugins/maven-assembly-plugin/assembly/1.1.0"
+	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+	xsi:schemaLocation="http://maven.apache.org/plugins/maven-assembly-plugin/assembly/1.1.0 http://maven.apache.org/xsd/assembly-1.1.0.xsd">
+	<id>webapp</id>
+	<formats>
+		<format>zip</format>
+	</formats>
+	<fileSets>
+		<fileSet>
+			<directory>${project.basedir}/src/main/java</directory>
+			<outputDirectory>/${project.artifactId}/src</outputDirectory>
+		</fileSet>
+		<fileSet>
+			<directory>${project.basedir}/src/main/webapp</directory>
+			<outputDirectory>/${project.artifactId}/WebContent</outputDirectory>
+		</fileSet>
+	</fileSets>
+	<files>
+		<file>
+			<source>${project.build.directory}/${project.artifactId}.war</source>
+			<outputDirectory>/</outputDirectory>
+		</file>
+	</files>
+</assembly>
diff --git a/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/Book.java b/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/Book.java
new file mode 100644
index 000000000..b2a924152
--- /dev/null
+++ b/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/Book.java
@@ -0,0 +1,37 @@
+/*
+ * The MIT License
+ * Copyright © 2014-2021 Ilkka Seppälä
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+package com.iluwatar.model.view.viewmodel;
+
+import lombok.AllArgsConstructor;
+import lombok.Data;
+
+@AllArgsConstructor
+@Data
+public class Book {
+
+  private String name;
+  private String author;
+  private String description;
+
+}
diff --git a/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/BookService.java b/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/BookService.java
new file mode 100644
index 000000000..f01066960
--- /dev/null
+++ b/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/BookService.java
@@ -0,0 +1,10 @@
+package com.iluwatar.model.view.viewmodel;
+
+import java.util.List;
+
+public interface BookService {
+  /* List all books
+   * @return all books
+   */
+  public List<Book> load();
+}
diff --git a/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/BookServiceImpl.java b/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/BookServiceImpl.java
new file mode 100644
index 000000000..e9b440843
--- /dev/null
+++ b/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/BookServiceImpl.java
@@ -0,0 +1,38 @@
+package com.iluwatar.model.view.viewmodel;
+
+import java.util.ArrayList;
+import java.util.List;
+
+public class BookServiceImpl implements BookService {
+  private List<Book> designPatternBooks = new ArrayList<>();
+
+  /** Initializes Book Data.
+  * To be used and passed along in load method
+  * In this case, list design pattern books are initialized to be loaded.
+  */
+  public BookServiceImpl() {
+    designPatternBooks.add(new Book(
+        "Head First Design Patterns: A Brain-Friendly Guide",
+        "Eric Freeman, Bert Bates, Kathy Sierra, Elisabeth Robson",
+        "Head First Design Patterns Description"));
+    designPatternBooks.add(new Book(
+        "Design Patterns: Elements of Reusable Object-Oriented Software",
+        "Erich Gamma, Richard Helm, Ralph Johnson, and John Vlissides",
+        "Design Patterns Description"));
+    designPatternBooks.add(new Book(
+        "Patterns of Enterprise Application Architecture", "Martin Fowler",
+        "Patterns of Enterprise Application Architecture Description"));
+    designPatternBooks.add(new Book(
+        "Design Patterns Explained", "Alan Shalloway, James Trott",
+        "Design Patterns Explained Description"));
+    designPatternBooks.add(new Book(
+        "Applying UML and Patterns: An Introduction to "
+         + "Object-Oriented Analysis and Design and Iterative Development",
+        "Craig Larman", "Applying UML and Patterns Description"));
+  }
+
+  public List<Book> load() {
+    return designPatternBooks;
+  }
+
+}
diff --git a/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/BookViewModel.java b/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/BookViewModel.java
new file mode 100644
index 000000000..6563df723
--- /dev/null
+++ b/model-view-viewmodel/src/main/java/com/iluwatar/model/view/viewmodel/BookViewModel.java
@@ -0,0 +1,43 @@
+package com.iluwatar.model.view.viewmodel;
+
+import java.util.List;
+
+import org.zkoss.bind.annotation.Command;
+import org.zkoss.bind.annotation.NotifyChange;
+import org.zkoss.zk.ui.select.annotation.WireVariable;
+
+public class BookViewModel {
+  
+  @WireVariable
+  private List<Book> bookList;
+  private Book selectedBook;
+  private BookService bookService = new BookServiceImpl();
+  
+  public Book getSelectedBook() {
+    return selectedBook;
+  }
+
+  @NotifyChange("selectedBook")
+  public void setSelectedBook(Book selectedBook) {
+    this.selectedBook = selectedBook;
+  }
+
+  public List<Book> getBookList() {
+    return bookService.load();
+  }
+  
+  /** Deleting a book.
+   * When event is triggered on click of Delete button, 
+   * this method will be notified with the selected entry that will be referenced
+   * and used to delete the selected book from the list of books. 
+   */
+  @Command
+  @NotifyChange({"selectedBook","bookList"})
+  public void deleteBook() {
+    if (selectedBook != null) {
+      getBookList().remove(selectedBook);
+      selectedBook = null;
+    }
+  }
+
+}
diff --git a/model-view-viewmodel/src/main/webapp/META-INF/MANIFEST.MF b/model-view-viewmodel/src/main/webapp/META-INF/MANIFEST.MF
new file mode 100644
index 000000000..4e0a32ad6
--- /dev/null
+++ b/model-view-viewmodel/src/main/webapp/META-INF/MANIFEST.MF
@@ -0,0 +1,8 @@
+Manifest-Version: 1.0
+Specification-Title: ZK Application
+Specification-Version: 1.0
+Specification-Vendor: 
+Implementation-Title: 
+Implementation-URL: http://your-website/
+Implementation-Version: 1.0
+Implementation-Vendor: 
diff --git a/model-view-viewmodel/src/main/webapp/WEB-INF/web.xml b/model-view-viewmodel/src/main/webapp/WEB-INF/web.xml
new file mode 100644
index 000000000..24af77bbb
--- /dev/null
+++ b/model-view-viewmodel/src/main/webapp/WEB-INF/web.xml
@@ -0,0 +1,114 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<web-app version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"
+ xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+ xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"> 
+
+	<description><![CDATA[My ZK Application]]></description>
+	<display-name>model-view-viewmodel</display-name>
+
+	<!-- ZK -->
+	<listener>
+		<description>ZK listener for session cleanup</description>
+		<listener-class>org.zkoss.zk.ui.http.HttpSessionListener</listener-class>
+	</listener>
+	<servlet>
+		<description>ZK loader for ZUML pages</description>
+		<servlet-name>zkLoader</servlet-name>
+		<servlet-class>org.zkoss.zk.ui.http.DHtmlLayoutServlet</servlet-class>
+
+		<!-- Must. Specifies URI of the update engine (DHtmlUpdateServlet).
+		It must be the same as <url-pattern> for the update engine.
+		-->
+		<init-param>
+			<param-name>update-uri</param-name>
+			<param-value>/zkau</param-value>
+		</init-param>
+		<load-on-startup>1</load-on-startup><!-- Must -->
+	</servlet>
+	<servlet-mapping>
+		<servlet-name>zkLoader</servlet-name>
+		<url-pattern>*.zul</url-pattern>
+	</servlet-mapping>
+	<servlet-mapping>
+		<servlet-name>zkLoader</servlet-name>
+		<url-pattern>*.zhtml</url-pattern>
+	</servlet-mapping>
+	<servlet>
+		<description>The asynchronous update engine for ZK</description>
+		<servlet-name>auEngine</servlet-name>
+		<servlet-class>org.zkoss.zk.au.http.DHtmlUpdateServlet</servlet-class>
+	</servlet>
+	<servlet-mapping>
+		<servlet-name>auEngine</servlet-name>
+		<url-pattern>/zkau/*</url-pattern>
+	</servlet-mapping>
+	<session-config>
+		<session-timeout>60</session-timeout>
+	</session-config>
+
+	<!-- [Optional] MIME mapping -->
+	<mime-mapping>
+		<extension>doc</extension>
+		<mime-type>application/vnd.ms-word</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>gif</extension>
+		<mime-type>image/gif</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>htm</extension>
+		<mime-type>text/html</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>html</extension>
+		<mime-type>text/html</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>jpeg</extension>
+		<mime-type>image/jpeg</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>jpg</extension>
+		<mime-type>image/jpeg</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>js</extension>
+		<mime-type>text/javascript</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>pdf</extension>
+		<mime-type>application/pdf</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>png</extension>
+		<mime-type>image/png</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>txt</extension>
+		<mime-type>text/plain</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>xls</extension>
+		<mime-type>application/vnd.ms-excel</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>xml</extension>
+		<mime-type>text/xml</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>zhtml</extension>
+		<mime-type>text/html</mime-type>
+	</mime-mapping>
+	<mime-mapping>
+		<extension>zul</extension>
+		<mime-type>text/html</mime-type>
+	</mime-mapping>
+
+	<welcome-file-list>
+		<welcome-file>index.zul</welcome-file>
+		<welcome-file>index.zhtml</welcome-file>
+		<welcome-file>index.html</welcome-file>
+		<welcome-file>index.htm</welcome-file>
+	</welcome-file-list>
+</web-app>
diff --git a/model-view-viewmodel/src/main/webapp/index.zul b/model-view-viewmodel/src/main/webapp/index.zul
new file mode 100644
index 000000000..9cdab7144
--- /dev/null
+++ b/model-view-viewmodel/src/main/webapp/index.zul
@@ -0,0 +1,34 @@
+<zk>
+<window title="List of Books" border="normal" width="600px" apply="org.zkoss.bind.BindComposer" viewModel="@id('vm') @init('com.iluwatar.model.view.viewmodel.BookViewModel')">
+    <vbox hflex="true">
+        <listbox model="@bind(vm.bookList)" selectedItem="@bind(vm.selectedBook)" height="400px" mold="paging">
+            <listhead>
+                <listheader label="Book Name"/>
+                <listheader label="Author"/>               
+            </listhead>
+            <template name="model" var="book">
+                <listitem >
+                    <listcell label="@bind(book.name)"/>
+                    <listcell label="@bind(book.author)"/>
+                </listitem>
+            </template>
+        </listbox>
+    </vbox>
+    <toolbar>
+        <button label="Delete" onClick="@command('deleteBook')" disabled="@load(empty vm.selectedBook)" />
+    </toolbar>
+    <hbox style="margin-top:20px" visible="@bind(not empty vm.selectedBook)">
+		<vbox>
+			<hlayout>
+				Book Name : <label value="@bind(vm.selectedBook.name)" style="font-weight:bold"/>
+			</hlayout>
+			<hlayout>
+				Book Author : <label value="@bind(vm.selectedBook.author)" style="font-weight:bold"/>
+			</hlayout>
+			<hlayout>
+				Book Description : <label value="@bind(vm.selectedBook.description)" style="font-weight:bold"/>
+			</hlayout>
+		</vbox>
+	</hbox>
+</window>
+</zk>
\ No newline at end of file
diff --git a/model-view-viewmodel/src/test/java/com/iluwatar/model/view/viewmodel/BookTest.java b/model-view-viewmodel/src/test/java/com/iluwatar/model/view/viewmodel/BookTest.java
new file mode 100644
index 000000000..40a4d89d0
--- /dev/null
+++ b/model-view-viewmodel/src/test/java/com/iluwatar/model/view/viewmodel/BookTest.java
@@ -0,0 +1,108 @@
+/*
+ * The MIT License
+ * Copyright © 2014-2021 Ilkka Seppälä
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+package com.iluwatar.model.view.viewmodel;
+
+import static org.hamcrest.CoreMatchers.is;
+import static org.hamcrest.CoreMatchers.not;
+import static org.junit.Assert.assertThat;
+import static org.junit.jupiter.api.Assertions.assertEquals;
+import static org.junit.jupiter.api.Assertions.assertFalse;
+import static org.junit.jupiter.api.Assertions.assertNotNull;
+import static org.junit.jupiter.api.Assertions.assertNull;
+import static org.junit.jupiter.api.Assertions.assertTrue;
+import java.util.List;
+import org.junit.jupiter.api.BeforeEach;
+import org.junit.jupiter.api.Test;
+import com.google.common.testing.EqualsTester;
+
+class BookTest {
+
+  BookViewModel bvm;
+  Book testBook;
+  List<Book> testBookList;
+  Book testBookTwo;
+  Book testBookThree;
+  
+  @BeforeEach
+  void setUp() {
+    bvm = new BookViewModel();
+    testBook = new Book("Head First Design Patterns: A Brain-Friendly Guide",
+    		"Eric Freeman, Bert Bates, Kathy Sierra, Elisabeth Robson",
+    		"Head First Design Patterns Description");
+    testBookList = bvm.getBookList();
+    testBookTwo = new Book("Head First Design Patterns: A Brain-Friendly Guide",
+	  		"Eric Freeman, Bert Bates, Kathy Sierra, Elisabeth Robson",
+	  		"Head First Design Patterns Description");
+    testBookThree = new Book("Design Patterns: Elements of Reusable Object-Oriented Software",
+            "Erich Gamma, Richard Helm, Ralph Johnson, and John Vlissides",
+            "Design Patterns Description");
+  }
+
+  @Test
+  void testBookModel() {
+	assertNotNull(testBook);
+  }
+  
+  @Test
+  void testEquals() {
+    new EqualsTester().addEqualityGroup(testBook, testBookTwo).testEquals();
+  }
+
+  @Test
+  void testToString() {
+    assertThat(testBook.toString(), is(testBookTwo.toString()));
+    assertThat(testBook.toString(), is(not(testBookThree.toString())));
+  }
+  
+  @Test
+  void testHashCode() {
+    assertTrue(testBook.equals(testBookTwo) && testBookTwo.equals(testBook));
+    assertEquals(testBook.hashCode(), testBookTwo.hashCode());
+  }
+  
+  @Test
+  void testLoadData() {
+    assertNotNull(testBookList);
+    assertTrue(testBookList.get(0).toString().contains("Head First Design Patterns"));
+  }
+
+  @Test
+  void testSelectedData() {
+	bvm.setSelectedBook(testBook);
+    assertNotNull(bvm.getSelectedBook());
+    assertEquals(testBook.toString(), bvm.getSelectedBook().toString());
+    assertTrue(true, bvm.getSelectedBook().toString());
+  }
+
+  @Test
+  void testDeleteData() {
+    bvm.setSelectedBook(testBook);
+    assertNotNull(bvm.getSelectedBook());
+    assertTrue(testBookList.get(0).toString().contains("Head First Design Patterns"));
+    bvm.deleteBook();
+    assertNull(bvm.getSelectedBook());
+    assertFalse(testBookList.get(0).toString().contains("Head First Design Patterns"));
+  }
+
+}
\ No newline at end of file
diff --git a/pom.xml b/pom.xml
index 60dae1679..12a448464 100644
--- a/pom.xml
+++ b/pom.xml
@@ -75,6 +75,7 @@
         <directory-maven-plugin.version>0.3.1</directory-maven-plugin.version>
         <license-maven-plugin.version>3.0</license-maven-plugin.version>
         <urm-maven-plugin.version>1.4.8</urm-maven-plugin.version>
+	<commons-io.version>2.6</commons-io.version>
 
         <!-- SonarCloud -->
         <sonar.host.url>https://sonarcloud.io</sonar.host.url>
@@ -222,6 +223,7 @@
         <module>special-case</module>
         <module>parameter-object</module>
         <module>active-object</module>
+        <module>model-view-viewmodel</module>
     </modules>
 
     <repositories>
@@ -369,9 +371,13 @@
                 <version>${system-lambda.version}</version>
                 <scope>test</scope>
             </dependency>
-        </dependencies>
+		    <dependency>
+			    <groupId>commons-io</groupId>
+			    <artifactId>commons-io</artifactId>
+			    <version>${commons-io.version}</version>
+		        </dependency>
+            </dependencies>
     </dependencyManagement>
-
     <dependencies>
         <dependency>
             <groupId>org.slf4j</groupId>