diff --git a/aoc-day14/index.html b/aoc-day14/index.html
new file mode 100644
index 0000000..dfb9dc8
--- /dev/null
+++ b/aoc-day14/index.html
@@ -0,0 +1,57 @@
+
+
+
+
+ MVC with XmlView
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/aoc-day14/index.js b/aoc-day14/index.js
new file mode 100644
index 0000000..cdf07f3
--- /dev/null
+++ b/aoc-day14/index.js
@@ -0,0 +1,16 @@
+sap.ui.define(["sap/ui/core/mvc/Controller", "sap/ui/core/mvc/XMLView", "sap/ui/model/json/JSONModel", "sap/m/MessageToast"],
+ function (Controller, XMLView, JSONModel, MessageToast) {
+ Controller.extend("myController", {
+ onInit: function () {
+ var model = new JSONModel();
+ this.getView().setModel(model);
+ },
+ onGenericTagPress: function () {
+ MessageToast.show("The GenericTag is pressed.");
+ }
+ });
+
+ XMLView.create({definition: jQuery('#myXml').html()}).then(function (oView) {
+ oView.placeAt("content");
+ });
+ });
\ No newline at end of file
diff --git a/aoc-day14/readme.md b/aoc-day14/readme.md
new file mode 100644
index 0000000..5c613e5
--- /dev/null
+++ b/aoc-day14/readme.md
@@ -0,0 +1,17 @@
+
+### Basics of Page, ToolBar and Bar
+* https://ui5.sap.com/#/api/sap.m.Page
+
+In this example, we are using index.html and index.js with boiler template to render the display of Page, Toolbar and also Bar together in one single page
+
+
+### References & Examples
+* https://ui5.sap.com/#/entity/sap.m.Page/sample/sap.m.sample.Page/code
+* https://ui5.sap.com/#/entity/sap.m.Page
+
+
+
+
+Disclaimer
+---
+Note: The examples provided are intended to help you learn step-by-step how to use UI5 controls. When designing an actual project, it should be based on the Node.js module.