Updated the desktop development guide

- Changed the text and QML constructs to be Qt Quick2 compliant - Replaced all links to Qt Quick1 with relevant Qt Quick 2 links - Updated the example sources to use QtQuick 2.0 Task-number: QTBUG-28831 Change-Id: I9f2b7204064857dfb644c6df4d533b66f9eb4594 Reviewed-by: Jerome Pasion <jerome.pasion@digia.com>
author: Venugopal Shivashankar <venugopal.shivashankar@digia.com> 2013-02-15 18:13:18 +0100
committer: Venugopal Shivashankar <venugopal.shivashankar@digia.com> 2013-02-27 13:42:12 +0100
commit: 625972f263fce22f65ae258b1e11bee3b49a4770 (patch)
tree: 34cf343cccfe10831e164a62b7d5cb9e98fff28d /desktop_devguide
parent: 3df3246bb4a7a64d9207f2460df884d22603c623 (diff)
78 files changed, 471 insertions, 503 deletions
diff --git a/desktop_devguide/chapter_01/index.rst b/desktop_devguide/chapter_01/index.rst
index 6811cdc..7ea32df 100644
--- a/desktop_devguide/chapter_01/index.rst
+++ b/desktop_devguide/chapter_01/index.rst
@@ -14,16 +14,16 @@ About this Guide
 Why Would You Want to Read this Guide?
 --------------------------------------
 
-This guide provides an overview of QML and Qt Quick technology in regards to developing feature-rich applications that you can deploy onto various desktop platforms.
+This guide provides an overview of QML and Qt Quick technology with regards to developing feature-rich applications that you can deploy onto various desktop platforms.
 
-The focus is on Qt Quick and how to use it efficiently for writing entire applications without any C++. It will guide you step by step from the initial setting up of the development environment to project creation to a ready-to-deploy application. We have implemented a simple application that helps users manage daily notes. This application will hereon be referred to as     NoteApp*.
+The focus is on Qt Quick and how to use it efficiently for writing entire applications without using C++. It guides you step-by-step from the initial development environment set up to project creation to a ready-to-deploy application. We have implemented a simple application (NoteApp*) that helps users manage daily notes.
 
 There are several chapters consisting of multiple steps. Each step describes specific features of the application, the development approach and the detailed QML code used.
 The application covers various aspects such as advanced UI concepts including animations, database storage and Javascript usage for application logic.
 
-The application will not look and feel like a typical or classical desktop application, meaning that common well-known UI Elements used in desktop apps such as toolbars, menus, dialogs etc will not be present. This application is inspired by the modern fluid UIs, but the deployable target is a desktop environment.
+The application will not look and feel like a typical or classical desktop application, as the common UI elements used in desktop applications such as toolbars, menus, dialogs, and so on, are not used. This application is inspired by the modern fluid UIs, but the deployable target is a desktop environment.
 
-In order to make it easy to work with the code, there is a version of     NoteApp* for each chapter with all the features implemented up to that chapter. It is recommended to always refer to that code while reading the contents of this guide.
+In order to make it easy to work with the code, there is a version of NoteApp* for each chapter with all the features implemented as described in that chapter. It is recommended to refer to that code while reading the contents of this guide.
 
 At the end of this guide, you should be able to have a solid understanding of how to develop an application using QML and Qt Quick as a technology and learn practical use of the QML language.
 
@@ -31,8 +31,7 @@ At the end of this guide, you should be able to have a solid understanding of ho
     :scale: 80%
     :align: center
 
-A screenshot of the     NoteApp* application that will be developed in this guide.
-
+A screenshot of the NoteApp* application that will be developed in this guide.
 
 .. _get-desktop-source-code:
 
@@ -41,23 +40,15 @@ Get the Source Code and the Guide in Different Formats
 
 A .zip file that contains the source code of each chapter is provided:
 
-     `Source code <http://get.qt.nokia.com/developerguides/qtquickdesktop/notezapp_src.zip>`_
+     :download:`Source code <qtquickdesktop/notezapp_src.zip>`_
 
 The guide is available in the following formats:
 
-     `PDF <http://get.qt.nokia.com/developerguides/qtquickdesktop/QtQuickApplicationGuide4Desktop.pdf>`_
-     `ePub <http://get.qt.nokia.com/developerguides/qtquickdesktop/QtQuickApplicationGuide4Desktop.epub>`_ for ebook readers. Further details can be found `here <http://en.wikipedia.org/wiki/EPUB#Software_reading_systems>`_.
-     `Qt Help <http://get.qt.nokia.com/developerguides/qtquickdesktop/QtQuickApplicationGuide4Desktop.qch>`_ for Qt Assistant and Qt Creator. In Qt Assistant under the :qt:`Preferences Dialog <assistant-details.html#preferences-dialog>`, in the `Documentation` tab (in a collapsible menu for Mac users), you click on the Add button in order to add this guide in the .qch format. We do the same in Qt Creator, under the `Options` dialog, in the `Help` section you, can add this guide in the `Documentation` tab.
-
-
-Help Us Help You
-----------------
-
-We would greatly appreciate any feedback or comments from you that can help us improve the content of this guide.
+     :download:`PDF <qtquickdesktop/QtQuickApplicationGuide4Desktop.pdf>`_
 
-Please use the form at the link below to give us your feedback:
+     :download:`ePub <qtquickdesktop/QtQuickApplicationGuide4Desktop.epub>`_ for ebook readers. Further details can be found `here <http://en.wikipedia.org/wiki/EPUB#Software_reading_systems>`_.
 
-     http://qt.nokia.com/forms/feedback/qtquickdesktop-guide
+     :download:`Qt Help <qtquickdesktop/QtQuickApplicationGuide4Desktop.qch>`_ for Qt Assistant and Qt Creator. In Qt Assistant under the :creator:`Preferences Dialog <creator-help.html#adding-external-documentation>`, in the `Documentation` tab (in a collapsible menu for Mac users), you click on the Add button in order to add this guide in the .qch format. We do the same in Qt Creator, under the `Options` dialog, in the `Help` section you, can add this guide in the `Documentation` tab.
 
 
 License
@@ -75,4 +66,4 @@ Qt and the Qt logo is a registered trade mark of Digia plc and/or its subsidiari
 
 .. rubric:: What's Next?
 
-Next you will start to prototype the     NoteApp* application and find out the power that QML offers for prototyping.
+Next, you will start to prototype the NoteApp* application and find out the power that QML offers for prototyping.
diff --git a/desktop_devguide/chapter_02/index.rst b/desktop_devguide/chapter_02/index.rst
index 9051843..de9d1e4 100644
--- a/desktop_devguide/chapter_02/index.rst
+++ b/desktop_devguide/chapter_02/index.rst
@@ -11,9 +11,9 @@
 Prototyping and Initial Design
 ==============================
 
-One of the major advantages of Qt Quick and QML is that it enables you to prototype quickly. We are considering the     Prototyping* phase as our first step for developing the *NoteApp* application mainly for two reasons. First, as mentioned in the previous chapter, QML gives us the power to prototype quickly so UI designers can easily and quickly sketch up initial UI screens to be evaluated. Secondly, prototyping allows you to work closely with designers, and therefore, the UI concepts are implemented in several short iterative processes.
+One of the major advantages of Qt Quick and QML is that it enables you to prototype quickly. We are considering the Prototyping* phase as our first step for developing the *NoteApp* application for two reasons. First, as mentioned in the previous chapter, QML gives us the power to prototype quickly so UI designers can sketch up initial UI screens to be evaluated in no time. Second, prototyping allows you to work closely with designers, so the UI concepts are implemented in several short iterative processes.
 
-Later on, this prototype will be used as our basis for further development of the application. In this chapter, we will guide you step by step through the concepts of the application including some UI concepts, the feature-set, UI interaction flows and some initial QML screens as part of our prototyping.
+Later on, this prototype will be used as our basis for further development of the application. In this chapter, we will guide you through the application development phase, including some UI concepts, the feature-set, UI interaction flows, and some initial QML screens as part of our prototyping.
 
 There will be an introduction to a few main QML concepts such as creating a QML Component and how to layout QML items.
 
@@ -24,9 +24,9 @@ There will be an introduction to a few main QML concepts such as creating a QML
 
 Here is a brief list of the main discussion points of this chapter:
 
-     UI Concepts and the feature-set for the *NoteApp*
-     Creating QML Component using Qt Creator
-     Use of Anchor and Repeater QML elements for laying out UI elements
+    * UI Concepts and the feature-set for the *NoteApp*
+    * Creating QML Component using Qt Creator
+    * Use of Anchor and Repeater QML types for laying out UI elements
 
 This chapter has the following steps:
 
diff --git a/desktop_devguide/chapter_02/src/notezapp/Marker.qml b/desktop_devguide/chapter_02/src/notezapp/Marker.qml
index a8316fb..7c749ee 100644
--- a/desktop_devguide/chapter_02/src/notezapp/Marker.qml
+++ b/desktop_devguide/chapter_02/src/notezapp/Marker.qml
@@ -38,7 +38,7 @@
 
 // Marker.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Rectangle {
     id: root
diff --git a/desktop_devguide/chapter_02/src/notezapp/MarkerPanel.qml b/desktop_devguide/chapter_02/src/notezapp/MarkerPanel.qml
index 254f376..84e355b 100644
--- a/desktop_devguide/chapter_02/src/notezapp/MarkerPanel.qml
+++ b/desktop_devguide/chapter_02/src/notezapp/MarkerPanel.qml
@@ -38,14 +38,14 @@
 
 // MarkerPanel.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Rectangle {
     id: root
     width: 50
     height: 300
 
-    // column element that anchors to the entire parent
+    // column type that anchors to the entire parent
     Column {
         id: layout
         anchors.fill: parent
diff --git a/desktop_devguide/chapter_02/src/notezapp/Note.qml b/desktop_devguide/chapter_02/src/notezapp/Note.qml
index da7ca2f..2ab5925 100644
--- a/desktop_devguide/chapter_02/src/notezapp/Note.qml
+++ b/desktop_devguide/chapter_02/src/notezapp/Note.qml
@@ -38,7 +38,7 @@
 
 // Note.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Rectangle {
     id: root
diff --git a/desktop_devguide/chapter_02/src/notezapp/NoteToolbar.qml b/desktop_devguide/chapter_02/src/notezapp/NoteToolbar.qml
index c8af70b..2edd72d 100644
--- a/desktop_devguide/chapter_02/src/notezapp/NoteToolbar.qml
+++ b/desktop_devguide/chapter_02/src/notezapp/NoteToolbar.qml
@@ -38,7 +38,7 @@
 
 // NoteToolbar.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Rectangle {
     id: root
@@ -47,7 +47,7 @@ Rectangle {
     color: "#9e964a"
 
     // declaring a property alias to the drag
-    // property of MouseArea element
+    // property of MouseArea type
     property alias drag: mousearea.drag
 
     // creating a MouseArea item
diff --git a/desktop_devguide/chapter_02/src/notezapp/Page.qml b/desktop_devguide/chapter_02/src/notezapp/Page.qml
index 97cb886..4b5df7f 100644
--- a/desktop_devguide/chapter_02/src/notezapp/Page.qml
+++ b/desktop_devguide/chapter_02/src/notezapp/Page.qml
@@ -38,7 +38,7 @@
 
 // Page.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Rectangle {
     id: root
diff --git a/desktop_devguide/chapter_02/src/notezapp/main.qml b/desktop_devguide/chapter_02/src/notezapp/main.qml
index f7b20f7..f19ca89 100644
--- a/desktop_devguide/chapter_02/src/notezapp/main.qml
+++ b/desktop_devguide/chapter_02/src/notezapp/main.qml
@@ -38,7 +38,7 @@
 
 // main.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Rectangle {
     // using window as the identifier for this item as
diff --git a/desktop_devguide/chapter_02/step_1.rst b/desktop_devguide/chapter_02/step_1.rst
index 9a8a8a0..d48ab6f 100644
--- a/desktop_devguide/chapter_02/step_1.rst
+++ b/desktop_devguide/chapter_02/step_1.rst
@@ -11,25 +11,24 @@
 Overview of the NoteApp Application
 ====================================
 
-The     NoteApp* application is a `Post-it note <http://en.wikipedia.org/wiki/Post-it_note>`_ application that will help users create notes and be able store them locally. It would be easier to manage notes if they belonged to a category so for simplicity, let's consider having three different categories that the notes can belong to. From a visual perspective, however, a category can be represented by an area where notes of the same category
-can be placed. Let's introduce the concept of the     Page* element. A *Page* is an area where notes will be created and placed.
+The NoteApp* application is a `Post-it note <http://en.wikipedia.org/wiki/Post-it_note>`_ application that helps users create notes and store them locally. It would be easier to manage notes if they belonged to a category, so let's consider having three different categories that the notes can belong to. From a visual perspective, a category can be represented by an area where notes of the same category can be placed. Let's introduce the concept of Page*. A *Page* is an area where notes will be created and placed.
 
-The user should be able to delete notes one by one as well as all of them at once. Notes can be moved freely by the user within a     Page* area. For simplicity reasons, let's suppose that there are just three predefined pages and each page is indicated by a *Marker*. Additionally, each marker can have a different color.
+The user should be able to delete notes one by one as well as all of them at once. Notes can be moved freely by the user within a Page* area. For simplicity reasons, let's define three pages and identify  each page by using *Marker*. Additionally, each marker can have a different color.
 
-An interesting feature would be to store notes locally and perhaps have this done automatically for the user then so no user prompt would be needed.
+An interesting feature would be to store notes locally and perhaps have this done automatically so that we can avoid user prompts asking to save the notes.
 
 To summarize the list of features:
 
-     Create / Delete Note items
-     Edit Notes and position them anywhere in the page
-     Store notes locally
-     Three different pages indicated by a page marker
+    * Create / Delete Note items
+    * Edit Notes and position them anywhere in the page
+    * Store notes locally
+    * Three different pages indicated by a page marker
 
 
 UI Elements
 -----------
 
-Based on the     NoteApp* concepts discussed above and feature requirements, let's start with the wire-frame design shown in the picture below. Since there could be many possible designs for the *NoteApp*, let's consider the following one as given.
+Based on the requirements discussed earlier, let's start with the wire-frame design shown in the picture below. As there could be many possible designs for the *NoteApp*, let's consider the following one.
 
 .. image:: img/prototype_drawing.png
     :align: center
@@ -40,9 +39,9 @@ The picture above gives us a good idea of what the user expects to see from the
 UI Flows
 --------
 
-As mentioned previously, there are three     Pages* that contain *Note* items. We can also see the *Marker* items on the right side. There is a toolbar on the left in *NoteApp*. It contains two tools: the `New Note` tool for creating new notes and the `Clear All` for clearing the entire page. The page markers that enable the user to switch between pages are on the right. *Note* items have a toolbar that can be used to drag notes within the page by moving the mouse while holding the left-click button down. Additionally, there is a *delete* tool in the note toolbar that enables the user to delete the note.
+As mentioned previously, there are three Pages* that can contain *Note* items. We can also see the *Marker* items on the right side and the toolbar on the left. The toolbar contains: the `New Note` tool for creating new notes and the `Clear All` tool to clear the entire page. *Note* items have a toolbar that can be used to drag notes within the page by moving the mouse while holding the left-click button down. Additionally, there is a *delete* tool in the note toolbar that enables the user to delete the note.
 
 
 .. rubric:: What's Next?
 
-Next we will work on identifying the QML Components needed to implement our features and learn how to create them.
+Next, we will work on identifying the QML components needed to implement our features and learn how to create them.
diff --git a/desktop_devguide/chapter_02/step_2.rst b/desktop_devguide/chapter_02/step_2.rst
index 5fdc2a6..c2f3e4c 100644
--- a/desktop_devguide/chapter_02/step_2.rst
+++ b/desktop_devguide/chapter_02/step_2.rst
@@ -11,47 +11,47 @@
 Creating a QML Component for UI Elements
 ========================================
 
-Once we have properly defined the feature-set and UI concepts for the     NoteApp* application and we have also identified basic initial UI elements, we can safely start to implement and prototype some initial work.
+Once we have properly defined the feature-set and UI concepts for the NoteApp* application and have identified basic UI elements, we can safely start to implement and prototype.
 
-The prototype will be a very basic UI with no functionality whatsoever, but it will provide an overview of how the application might look when finished as we go through implementation iterations.
+The prototype will be a very basic UI with no functionality whatsoever, but it will provide an overview of how the application might look when finished, as we go through implementation iterations.
 
-In this step, you will find details about how to create your first Qt Quick UI using Qt Creator, but most importantly, how to identify and create a QML Component.
+In this step, you will find details about how to create your first Qt Quick UI using Qt Creator, but most importantly, how to identify and create a QML component.
 
 
 Creating a Qt Quick UI Project in QtCreator
 -------------------------------------------
 
-When working on the prototype phase, it is important to understand that creating a Qt Quick UI project with Qt Creator is the most recommended and efficient approach. In this way, prototyping, especially developing and testing each individual QML Component, becomes so much easier. Testing each newly created component individually is very important as you are able to spot issues right away and using a Qt Quick UI project makes it easier.
+When working on the prototype phase, it is important to understand that creating a Qt Quick UI project with Qt Creator is the most recommended and efficient approach. In this way, prototyping, especially developing and testing each individual QML component is easier. Testing each newly created component individually is very important as you are able to spot issues right away, and using a Qt Quick UI project makes it easier.
 
-Please refer to the :creator:`Creating a Qt Quick UI <quick-projects.html#creating-qt-quick-ui-projects>` with QtCreator for details on how to create a project.
+Refer to the :creator:`Creating a Qt Quick UI <quick-projects.html#creating-qt-quick-ui-projects>` with QtCreator for details on how to create a project.
 
 .. note::
 
-    There is always a single QML file that is identified as the the main file to load and run in order to start the application. For     NoteApp*, we have the `main.qml` file, which has in fact been generated by Qt Creator.
+    There is always a single QML file that is identified as the the main file to load and run the application. For NoteApp*, we have the `main.qml` file, which has been generated by Qt Creator.
 
 
 Identifying QML Components as UI Elements
 -----------------------------------------
 
-If you want to make an analogy with object oriented programming, then QML Components could be considered as classes that are used to declare and instantiate objects. You could potentially write a simple application entirely in one big QML file, but that would certainly increase complexity and make code re-usability and maintenance quite difficult - sometimes even impossible.
+If you want to make an analogy with object-oriented programming, QML components could be considered as classes that are used to declare and instantiate objects. You could potentially write a simple application entirely in one big QML file, but that would certainly increase complexity and make code re-usability and maintenance quite difficult - sometimes even impossible.
 
-QML Component can be identified as a group of common UI elements. More often, it represents a single UI element with its predefined actions and properties.
+QML component can be identified as a group of common UI elements. More often, it represents a single UI element with its predefined actions and properties.
 
-Based on our UI Concept and Design, here is brief list of identified components that are obvious at first and come naturally in mind, but more will come later on as
-we go in the next iteration.
+Based on our UI Concept and Design, here is brief list of identified custom QML components that are obvious at first, but we may need more later on as
+we go to the next iteration.
 
 .. note::
 
-    Each QML Component sits in its own QML file (.qml) that has the same name as the component. For instance,     *Note** component would be in a file named **Note.qml** .
+    Each QML component sits in its own QML file (.qml) that has the same name as the component. For instance, *Note** component would be in a file named **Note.qml** .
 
-     `Note` - that represents a note item
-     `Page` - this component contains note items
-     `Marker` - represents a page marker, enables users to switch between pages using makers
-     `NoteToolbar` - the toolbar used on a note item to enable drag functionality and lay out tools
+    * `Note` - that represents a note item
+    * `Page` - this component contains note items
+    * `Marker` - represents a page marker, enables users to switch between pages using makers
+    * `NoteToolbar` - the toolbar used on a note item to enable drag functionality and layout tools
 
-Please refer to :creator:`Creating QML Components with QtCreator <quick-components.html>` for details on how to use QtCreator for creating the components mentioned above. We will go through each component in detail and learn how to implement them in the coming chapters and steps.
+Refer to :creator:`Creating QML Components with QtCreator <quick-components.html>` for details on how to use QtCreator for creating the components mentioned above. We will go through each component in detail and learn how to implement them in the coming chapters and steps.
 
 
 .. rubric:: What's Next?
 
-Next we will see how to further enhance our defined components and start implementing the prototype UI.
+Next, we will see how to further enhance our defined components and start implementing the prototype UI.
diff --git a/desktop_devguide/chapter_02/step_3.rst b/desktop_devguide/chapter_02/step_3.rst
index c10f8d1..ee4335e 100644
--- a/desktop_devguide/chapter_02/step_3.rst
+++ b/desktop_devguide/chapter_02/step_3.rst
@@ -11,18 +11,18 @@
 Anchoring QML Items and Implementing the QML Components
 =======================================================
 
-The :qt:`Rectangle QML Element <qml-rectangle.html>` is the natural choice to use for building UI blocks and the initial QML Component in the prototype phase. They are visual items that have properties that you can tweak to make it easier to prototype and test your UI concepts, which makes testing so much easier.
+The :qt5:`Rectangle QML type <qtquick/qml-qtquick2-rectangle.html>` is the natural choice to build UI blocks and the initial QML Component in the prototype phase. It is a visual type that has properties, which you can tweak to make it easier to prototype and test.
 
 .. note::
 
     It is a good practice to always give default geometry values to your defined components as it helps in testing.
 
-Let's have a close look at the code of our QML Components. At first, we start by implementing the `Note` component.
+Let's have a closer look at the code of our QML Components. At first, we start by implementing the `Note` component.
 
 
 Note and NoteToolbar Component
 ------------------------------
-First, as seen in the previous step, we have created the new QML files with Qt Creator that we can work with for implementing the required components.
+First, as seen in the previous step, we have created the new QML files that we can use to implement the required components.
 
 To match the given wire-frame design, the code for `NoteToolbar` could look as follows:
 
@@ -30,7 +30,7 @@ To match the given wire-frame design, the code for `NoteToolbar` could look as f
 
     // NoteToolbar.qml
 
-    import QtQuick 1.1
+    import QtQuick 2.0
 
     // A Rectangle element with defined geometries and color.
     Rectangle {
@@ -40,9 +40,9 @@ To match the given wire-frame design, the code for `NoteToolbar` could look as f
         color: "#9e964a"
     }
 
-The `Note` component will have a toolbar UI element and the `NoteToolbar` component will be used for that. Additionally, there is a text input element for getting the input text from the user. We will use :qt:`TextEdit QML Element <qml-textedit.html>` for this. In order to layout these items within the `Note` component, the `anchor` property will be used. This property is inherited from :qt:`Item Element <qml-item.html>`, which is the base class that every other QML Component inherits by default.
+The `Note` component will have a toolbar UI element and the `NoteToolbar` component will be used for that. Additionally, there is a text input element for getting the input text from the user. We will use the :qt5:`TextEdit QML type <qtquick/qml-qtquick2-textedit.html>` for this. In order to place these UI elements within the `Note` component, the `anchor` property is used. This property is inherited from the :qt5:`Item type <qtquick/qml-qtquick2-item.html>`, which is the base class that every other QML component inherits by default.
 
-Please refer to the :qt:`Anchor-based Layout in QML <qml-anchor-layout.html>` documentation for more details about anchoring and laying out QML items.
+Refer to the :qt5:`Anchor-based Layout in QML <qtquick/qtquick-positioning-anchors.html>` documentation for more details about anchoring and laying out QML components.
 
 .. note:: Anchor-based layouts can not be mixed with absolute positioning
 
@@ -50,7 +50,7 @@ Please refer to the :qt:`Anchor-based Layout in QML <qml-anchor-layout.html>` do
 
     // Note.qml
 
-    import QtQuick 1.1
+    import QtQuick 2.0
 
     Rectangle {
         id: root
@@ -58,7 +58,7 @@ Please refer to the :qt:`Anchor-based Layout in QML <qml-anchor-layout.html>` do
         height: 200
         color: "#cabf1b"
 
-        // creating a NoteToolbar item that will
+        // creating a NoteToolbar that will
         // be anchored to its parent on the top, left and right
         NoteToolbar {
             id: toolbar
@@ -75,7 +75,7 @@ Please refer to the :qt:`Anchor-based Layout in QML <qml-anchor-layout.html>` do
             }
         }
 
-        // creating a TextEdit item used for the text input from user.
+        // creating a TextEdit used for the text input from user.
         TextEdit {
             anchors {
                 top: toolbar.bottom
@@ -89,7 +89,7 @@ Please refer to the :qt:`Anchor-based Layout in QML <qml-anchor-layout.html>` do
 
 .. warning::
 
-    For performance reasons, you should only anchor an item to its siblings and direct parent
+    For performance reasons, you should only anchor a component to its siblings and direct parent.
 
 
 Page
@@ -102,7 +102,7 @@ Once we have the `Note` component ready, let's work on getting the `Page` compon
     :lines: 35-
 
 
-In Qt Creator, you can simply run the file above, which in fact will simply use     *qmlviewer** to load the `Page.qml`. The output result should look like this:
+In Qt Creator, you can simply run the file above, which in fact will simply use *qmlscene** to load the `Page.qml`. The output result should look like this:
 
 .. image:: img/pagesnapshot.png
    :scale: 50%
@@ -112,7 +112,7 @@ In Qt Creator, you can simply run the file above, which in fact will simply use
 Marker
 ------
 
-Same as with the rest of the components, the `Marker` component will also be just a rectangle element with predefined geometries. Later on, as described in the next chapter, we will
+Same as with the rest of the components, the `Marker` component will also use a Rectangle type with predefined geometries. Later on, as described in the next chapter, we will
 show how the `Marker` component is used.
 
 .. literalinclude:: src/notezapp/Marker.qml
@@ -121,4 +121,4 @@ show how the `Marker` component is used.
 
 .. rubric:: What's Next?
 
-In the next chapter, we will see how to use a Repeater QML Element and a Column to manage a static list of markers.
+In the next chapter, we will see how to use a Repeater QML type and a Column to manage a static list of markers.
diff --git a/desktop_devguide/chapter_02/step_4.rst b/desktop_devguide/chapter_02/step_4.rst
index b99281e..12d9906 100644
--- a/desktop_devguide/chapter_02/step_4.rst
+++ b/desktop_devguide/chapter_02/step_4.rst
@@ -11,11 +11,11 @@
 Using Repeater and Delegate to Create List of Markers
 =====================================================
 
-Previously, we saw how to create QML components such as `Note`, `NoteToolbar`, `Page` and `Marker` and how to layout these QML items using     anchors*.
+Previously, we saw how to create QML components such as `Note`, `NoteToolbar`, `Page` and `Marker`, and how to place these QML components using anchors*.
 
-Looking back at the previous chapters on design concepts, one thing we noticed is that there are three `Marker` elements laid out vertically. Using     anchors* could also work as we can anchor items with each other, but nevertheless it will increase the complexity of the code. QML has other convenient approaches, such as layout and positioning elements like :qt:`Column Element <qml-column.html>`.
+Looking back at the previous chapters on design concepts, one thing we noticed is that there are three `Marker` elements laid out vertically. Using anchors* could also work as we can anchor UI elements with each other, but nevertheless it will increase the complexity of the code. QML has other convenient approaches such as the layout and positioning types. The :qt5:`Column type <qtquick/qml-qtquick2-column.html>` is one such type, enables arranging the UI elements one below the other in a column.
 
-Since we want to lay out three `Marker` items within a :qt:`Column Element <qml-column.html>`, let's use a nifty element QML provides called :qt:`Repeater <qml-repeater.html>`.
+As we want to place the three `Marker` components within a :qt5:`Column type <qtquick/qml-qtquick2-column.html>`, let's use a nifty QML type called :qt5:`Repeater <qtquick/qml-qtquick2-repeater.html>`.
 
 Now let's have a look at the code described above:
 
@@ -36,11 +36,11 @@ Now let's have a look at the code described above:
     }
 
 
-In the code shown above, `Repeater` will generate three QML Items based on the model and will use a     *delegate** to display them. Since we want to have three `Marker` items, we simply use the `Marker` component as the delegate.
+In the code shown above, `Repeater` generates three QML components based on the model and will use a *delegate** to display them. As we want to have three `Marker` items, we simply use the `Marker` component as the delegate.
 
-Further detailed reference on `Column` and `Repeater` can be found in :qt:`Using QML Positioner and Repeater Items <qml-positioners.html>` documentation.
+For more information about positioning, refer to :qt5:`Important Concepts In Qt Quick - Positioning <qtquick/qtquick-positioning-topic.html>` documentation.
 
-Naturally the question "where in my qml files should I place the code shown above and how should I use it?" arises. Well, we need a separate QML Component for that which we'll call `MarkerPanel`. In short, `MarkerPanel` is simply a list of three `Marker` items that can easily be used as a UI element. We will later on how.
+Naturally the question "where in my qml files should I place the code shown above and how should I use it?" arises. Well, we need a separate QML Component for that which we'll call `MarkerPanel`. In short, `MarkerPanel` is simply a list of three `Marker` items that can easily be used as a UI element. We will know later on how.
 
 Here is how the `MarkerPanel` component would look:
 
@@ -50,7 +50,7 @@ Here is how the `MarkerPanel` component would look:
 
 .. note:: It is always recommended to run and test components individually in the prototype phase because you can spot the problems right away.
 
-If we run the `MarkerPanel` component using Qt Creator or load it with     *qmlviewer** then it should look as follows:
+If we run the `MarkerPanel` component using Qt Creator or load it with *qmlscene** then it should look like this:
 
 .. image:: img/markerpanel.png
    :scale: 65%
diff --git a/desktop_devguide/chapter_02/step_5.rst b/desktop_devguide/chapter_02/step_5.rst
index 706fa5f..63fc115 100644
--- a/desktop_devguide/chapter_02/step_5.rst
+++ b/desktop_devguide/chapter_02/step_5.rst
@@ -11,32 +11,32 @@
 Finalize the Prototype
 ======================
 
-We now have our QML components in place and they're ready to be used to actually build our prototype. Here is a list of the implemented components:
+We now have our QML components in place and they're ready to be used to build our prototype. Here is a list of the implemented components:
 
-     `Note`
-     `NoteToolbar`
-     `Marker`
-     `MarkerPanel`
-     `Page`
+    * `Note`
+    * `NoteToolbar`
+    * `Marker`
+    * `MarkerPanel`
+    * `Page`
 
 It is very likely that more QML components might come up as we go along in later phases.
 
-As previously mentioned, Qt Creator generates a `main.qml` file which is considered the main file to load in order to run     NoteApp*. Therefore, we will start laying out our components inside the `main.qml` file in order to compose the prototype.
+As previously mentioned, Qt Creator generates a `main.qml` file which is considered the main file to load in order to run NoteApp*. Therefore, we will start laying out our components inside the `main.qml` file to compose the prototype.
 
 
 Composing the Prototype
 -----------------------
 
-Going back to the UI concepts and looking at the design provided, we start laying out the QML items, so we have the panel of `Maker` items, the `MarkerPanel` component that is, laid out on the right and the `Page` component in the center. We haven't yet covered the toolbar UI element so let's do that now.
+Going back to the UI concepts and looking at the design provided, we start laying out the QML components. We have the panel of `Maker`, that is the `MarkerPanel` component placed on the right, and the `Page` component in the center. We haven't yet covered the toolbar so let's do that now.
 
-The toolbar contains two tools: one for creating new note items and one for clearing up the page. For simplicity, we will not create a component for this, but rather declare the items inside the `main.qml` file.
+The toolbar contains two tools: one for creating new note and one for clearing the page. For simplicity, we will not create a component for this, but rather define it inside the `main.qml` file.
 
 The code could look something like this:
 
 .. code-block:: js
 
     // using a Rectangle element to represent our toolbar
-    // it helps to align the column better with the rest of the items
+    // it helps to align the column better with the rest of the components
     Rectangle {
         id: toolbar
 
@@ -50,7 +50,7 @@ The code could look something like this:
             topMargin: 100; bottomMargin: 100
         }
 
-        // using a Column element to layout the tools of the toolbar
+        // using a Column type to place the tools
         Column {
             anchors { anchors.fill: parent; topMargin: 30  }
             spacing: 20
@@ -73,37 +73,37 @@ Now, we are ready to actually finalize our prototype. Here is how the `main.qml`
    :lines: 35-
 
 
-The following screen shows how the prototype looks when either running it using Qt Creator or     *qmlviewer**:
+The following screen shows how the prototype looks when either running it using Qt Creator or *qmlscene**:
 
 .. image:: img/prototype.png
    :scale: 65%
    :align: center
 
 
-Making Note Items Draggable Using the MouseArea QML Element
------------------------------------------------------------
+Making Note Components Draggable
+--------------------------------
 
-So far we have managed to get a very basic prototype running that will be our basis for the NoteApp UI. An interesting UI functionality we can quickly add during the prototype phase is to enable the user to drag note items within the page. To achieve this, the :qt:`MouseArea QML Element <qml-mousearea.html>` has a grouped property called :qt:`drag <qml-mousearea.html#drag.target-prop>`. We will use the     *drag.target** property by setting it to the **id** of our note item.
+So far we have managed to get a very basic prototype that will be our basis for the NoteApp UI. An interesting UI functionality we can quickly add during the prototype phase is to enable the user to drag note items within the page. To achieve this, the :qt5:`MouseArea QML Type <qtquick/qml-qtquick2-mousearea.html>` has a grouped property called :qt5:`drag <qtquick/qml-qtquick2-mousearea.html#drag.target-prop>`. We will use the *drag.target** property by setting it to the **id** of our note component.
 
-Considering that the user should use the `NoteToolbar` item for dragging the note item, the     MouseArea* Element should be inside the `NoteToolbar` component. The `NoteToolbar` component will handle the dragging operation from the user so we should set the :qt:`drag.target <qml-mousearea.html#drag.target-prop>` to the `Note` item.
+Considering that the user should use the `NoteToolbar` to drag a note, the MouseArea* type should be inside the `NoteToolbar` component. The `NoteToolbar` component handles the dragging operation by the user, so we should set the :qt5:`drag.target <qtquick/qml-qtquick2-mousearea.html#drag.target-prop>` to the `Note` component.
 
-To achieve this, we need to allow the `NoteToolbar` item used inside the `Note` component to bind the :qt:`drag.target <qml-mousearea.html#drag.target-prop>` property of `MouseArea` with the  the `Note` component's     *id**. QML provides :qt:`Property Aliases <propertybinding.html#property-aliases>` to enable this.
+To achieve this, we need to allow `NoteToolbar` used inside the `Note` component to bind the :qt5:`drag.target <qtquick/qml-qtquick2-mousearea.html#drag.target-prop>` property of `MouseArea` with the `Note` component's *id**. QML provides :qt5:`Property Aliases <qtqml/qtqml-syntax-objectattributes.html#property-aliases>` to enable this.
 
-Let's take the `NoteToolbar` component we have created so far and create a property alias for the     *drag** grouped property of `MouseArea`:
+Let's take the `NoteToolbar` component and create a property alias for the *drag** grouped property of `MouseArea`:
 
 .. literalinclude:: src/notezapp/NoteToolbar.qml
    :language: js
    :lines: 35-
 
-In the code shown above, we see the     *drag** property alias for `NoteToolbar`, which is bound to the **drag** property of *MouseArea* and now we will see how to use that in our `Note` component.
+In the code shown above, we see the *drag** property alias for `NoteToolbar`, which is bound to the **drag** property of *MouseArea*, and now we will see how to use that in our `Note` component.
 
 .. literalinclude:: src/notezapp/Note.qml
    :language: js
    :lines: 35-
 
-Detailed information on property bindings in QML can be found on the :qt:`Property Binding <propertybinding.html>` documentation page.
+Detailed information on property bindings in QML can be found on the :qt5:`Property Binding <qtqml/qtqml-syntax-propertybinding.html>` documentation page.
 
 
 .. rubric:: What's Next?
 
-Next we will start implementing the UI and basic functionality based on the prototype.
+Next, we will start implementing the UI and basic functionality based on the prototype.
diff --git a/desktop_devguide/chapter_03/index.rst b/desktop_devguide/chapter_03/index.rst
index 4411d1a..fbe0c2f 100644
--- a/desktop_devguide/chapter_03/index.rst
+++ b/desktop_devguide/chapter_03/index.rst
@@ -11,11 +11,11 @@
 Implementing the UI and Adding Functionality
 ============================================
 
-The initial prototype has introduced the basis of our UI and concepts of     NoteApp* functionality, and helped us identify which QML Component needed to be created.
+The initial prototype has introduced the basis of our UI and concepts of NoteApp* functionality, and helped us identify which QML Component is needed.
 
-Based on the prototype, we will try to build a working application reaching towards a more complete UI with some working functionality. Now we will start to compose the application's UI using the components we have implemented so far.
+Based on the prototype, we will try to build a working application reaching towards a more complete UI with some working functionality. Now, we will start composing the application's UI using the components we have implemented so far.
 
-This chapter will cover detailed steps about using graphics with QML, images and backgrounds, enhancing the UI and also about adding functionality using Javascript. You will have the chance to dive deeper into some QML elements and also get introduced to new ones while slightly increasing the level of code complexity as we continue to implement functionality.
+This chapter will cover detailed steps about using graphics with QML, images and backgrounds, enhancing the UI, and also about adding functionality using Javascript. You will have a chance to dive deeper into some QML types and also get introduced to new ones while slightly increasing the level of code complexity as we continue to implement functionality.
 
 .. note::
 
@@ -24,10 +24,13 @@ This chapter will cover detailed steps about using graphics with QML, images and
 
 These are the main points covered in this chapter:
 
-     Managing `Page` elements by introducing the *PagePanel* component and by using the `Repeater` element
-     Using graphics with QML
-     Inline Javascript code for enhancing the UI and adding functionality
-     Diving deeper into the QML elements that we are currently using
+    * Managing `Page` elements by introducing the *PagePanel* component and by using the `Repeater` element
+
+    * Using graphics with QML
+
+    * Inline Javascript code for enhancing the UI and adding functionality
+
+    * Diving deeper into the QML types that we are currently using
 
 This chapter has the following steps:
 
diff --git a/desktop_devguide/chapter_03/src/notezapp/Marker.qml b/desktop_devguide/chapter_03/src/notezapp/Marker.qml
index da267b0..4f95e98 100644
--- a/desktop_devguide/chapter_03/src/notezapp/Marker.qml
+++ b/desktop_devguide/chapter_03/src/notezapp/Marker.qml
@@ -38,9 +38,9 @@
 
 // Marker.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
-// The Image element as top level is convenient
+// The Image type as top level is convenient
 // as the Marker component simply is a graphical
 // UI with a clicked() signal.
 Image {
@@ -49,7 +49,7 @@ Image {
     // declaring the clicked() signal to be used in the MarkerPanel
     signal clicked()
 
-    // creating a MouseArea element to intercept the mouse click
+    // creating a MouseArea type to intercept the mouse click
     MouseArea {
         id: mouseArea
         anchors.fill: parent
diff --git a/desktop_devguide/chapter_03/src/notezapp/MarkerPanel.qml b/desktop_devguide/chapter_03/src/notezapp/MarkerPanel.qml
index dd5d1d8..76593eb 100644
--- a/desktop_devguide/chapter_03/src/notezapp/MarkerPanel.qml
+++ b/desktop_devguide/chapter_03/src/notezapp/MarkerPanel.qml
@@ -38,7 +38,7 @@
 
 // MarkerPanel.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Item {
     id: root
diff --git a/desktop_devguide/chapter_03/src/notezapp/Note.qml b/desktop_devguide/chapter_03/src/notezapp/Note.qml
index c71cd38..73d1e12 100644
--- a/desktop_devguide/chapter_03/src/notezapp/Note.qml
+++ b/desktop_devguide/chapter_03/src/notezapp/Note.qml
@@ -38,7 +38,7 @@
 
 // Note.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Item {
     id: root
diff --git a/desktop_devguide/chapter_03/src/notezapp/NoteToolbar.qml b/desktop_devguide/chapter_03/src/notezapp/NoteToolbar.qml
index 369a867..6bda531 100644
--- a/desktop_devguide/chapter_03/src/notezapp/NoteToolbar.qml
+++ b/desktop_devguide/chapter_03/src/notezapp/NoteToolbar.qml
@@ -38,7 +38,7 @@
 
 // NoteToolbar.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Item {
     id: root
@@ -53,7 +53,7 @@ Item {
     }
 
     // declaring a property alias to
-    // the drag property of MouseArea element
+    // the drag property of MouseArea type
     property alias drag: mousearea.drag
 
     // creating a MouseArea item
diff --git a/desktop_devguide/chapter_03/src/notezapp/Page.qml b/desktop_devguide/chapter_03/src/notezapp/Page.qml
index ec0c66a..6d20598 100644
--- a/desktop_devguide/chapter_03/src/notezapp/Page.qml
+++ b/desktop_devguide/chapter_03/src/notezapp/Page.qml
@@ -38,7 +38,7 @@
 
 // Page.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Item {
     id: root
diff --git a/desktop_devguide/chapter_03/src/notezapp/PagePanel.qml b/desktop_devguide/chapter_03/src/notezapp/PagePanel.qml
index cec8aef..1ea9d41 100644
--- a/desktop_devguide/chapter_03/src/notezapp/PagePanel.qml
+++ b/desktop_devguide/chapter_03/src/notezapp/PagePanel.qml
@@ -38,7 +38,7 @@
 
 // PagePane.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Item {
     id: root
@@ -76,7 +76,7 @@ Item {
         }
     ]
 
-    // using a BorderImage element to set
+    // using a BorderImage type to set
     // a background for the PagePanel
     BorderImage {
         id: background
diff --git a/desktop_devguide/chapter_03/src/notezapp/Tool.qml b/desktop_devguide/chapter_03/src/notezapp/Tool.qml
index c2c3270..cd1252b 100644
--- a/desktop_devguide/chapter_03/src/notezapp/Tool.qml
+++ b/desktop_devguide/chapter_03/src/notezapp/Tool.qml
@@ -38,16 +38,16 @@
 
 // Tool.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
-// Use Image as the top level element
+// Use Image as the top level type
 Image {
     id: root
 
     // defining the clicked signal
     signal clicked()
 
-    // using a MouseArea element to capture
+    // using a MouseArea type to capture
     // the mouse click of the user
     MouseArea {
         anchors.fill: parent
diff --git a/desktop_devguide/chapter_03/src/notezapp/main.qml b/desktop_devguide/chapter_03/src/notezapp/main.qml
index cbbc1be..d1315e7 100644
--- a/desktop_devguide/chapter_03/src/notezapp/main.qml
+++ b/desktop_devguide/chapter_03/src/notezapp/main.qml
@@ -38,7 +38,7 @@
 
 // main.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Rectangle {
     // using window as the identifier for this item
@@ -93,7 +93,7 @@ Rectangle {
         border { color: "#600"; width: 4 }
     }
 
-    // using a Column element to layout
+    // using a Column type to layout
     // the Tool items vertically
     Column {
         id: toolbar
diff --git a/desktop_devguide/chapter_03/step_1.rst b/desktop_devguide/chapter_03/step_1.rst
index 2321e95..f76547f 100644
--- a/desktop_devguide/chapter_03/step_1.rst
+++ b/desktop_devguide/chapter_03/step_1.rst
@@ -8,24 +8,24 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Creating PagePanel Component for Managing Pages
-===============================================
+Creating PagePanel Component
+============================
 
-To keep things simple, we have only created one     page* item using the `Page` component. We've also anchored it to its parent together with the rest of the items. The *NoteApp* concepts and requirements, however, demand three different pages and the user should be able to navigate to them using *markers* as well. We have seen how the `MarkerPanel` component helped us create and lay out three *Marker* items so let's use the same approach for our *Page* items, thus implementing the `PagePanel` component.
+To keep things simple, we have only created one page* item using the `Page` component. We've also anchored it to its parent together with the rest of the items. However, the *NoteApp* concepts and requirements demand three different pages and the user should be able to navigate to them using *markers* as well. We have seen how the `MarkerPanel` component helped us create and layout for three *Marker* items, so let's use the same approach for our *Page* items, thus implementing the `PagePanel` component.
 
 
-Using an Item QML Element as the Top Level Element for Components
------------------------------------------------------------------
+Using an Item Type
+------------------
 
-Before we go any further with our new component, it is important to understand why using the :qt:`Rectangle Element <qml-rectangle.html>` as a top level element in in a component should be avoided from now on. The main reason we've been using the `Rectangle` element is because it helped us get visual results quickly and this is what the prototype phase requires.
+Before we go any further with our new component, it is important to understand why using the :qt5:`Rectangle type <qtquick/qml-qtquick2-rectangle.html>` as a top level type in a component should be avoided from now on. The main reason we've been using the `Rectangle` element is because it helped us get visual results quickly and this is what the prototype phase requires.
 
-Once prototyping is done, however, it would make more sense to replace the `Rectangle` element with the `Item` element wherever possible, especially when considering to use graphics as backgrounds or as UI elements, which we will see in the coming chapters.
+Once prototyping is done, however, it would make more sense to replace the `Rectangle` type with the `Item` type wherever possible, especially when considering to use graphics as backgrounds or as UI elements, which we will see in the coming chapters.
 
 The `Page` component would look like this:
 
 .. code-block:: js
 
-    import QtQuick 1.1
+    import QtQuick 2.0
 
     // Page.qml
 
@@ -36,7 +36,7 @@ The `Page` component would look like this:
 
 .. warning::
 
-    From now on, it is considered that the top level element for our components is an Item QML Element. Please refer to the source code of each chapter.
+    From now on, it is considered that the top level element for our components is an Item QML type. Refer to the source code of each chapter.
 
 
 Using States
@@ -46,9 +46,10 @@ To continue with the implementation of the `PagePanel` component, we see that th
 
 There could be several ways to achieve this behavior. One would be to have an inline Javascript function that toggles the visibility of the `Page` item according to the current `Marker` clicked by the user.
 
-In     NoteApp*, we have used :qt:`State Element <qml-state.html>` to implement the intended behavior. The `PagePanel` component will have three states and each of them is bound to make  one `Page` item visible accordingly. So navigating through pages will be a matter of setting the respective state for the `PagePanel` so we need to have three states and three `Page` items inside the `PagePanel` component.
+In NoteApp*, we have used the :qt5:`State type <qml-qtquick2-state.html>` to implement the intended behavior. The `PagePanel` component will have three states and each of them is bound to make one `Page`
+visible. So navigating through pages will be a matter of setting the respective state for the `PagePanel`.
 
-First, in the `Page` component, we need to set the `opacity` property to `0.0` as the default value so the `Page` items will only be visible when the respective state is set to the `PagePanel` item because the respective state will change the `opacity` value of the page as shown below:
+First, in the `Page` component, we need to set the `opacity` property to `0.0` as the default value. This is to make the pages invisible initially and make them visible based on the respective state change. The following sections describes how this is done:
 
 .. code-block:: js
 
@@ -83,7 +84,7 @@ Here is the implementation in the `PagePanel` component:
 
 .. code-block:: js
 
-    import QtQuick 1.1
+    import QtQuick 2.0
 
     // PagePane.qml
 
@@ -128,7 +129,7 @@ Here is the implementation in the `PagePanel` component:
         Page { id: workpage; anchors.fill: parent }
     }
 
-.. note:: Setting the     *restoreEntryValues** property to true will make the changed property of the target reset to its default value, meaning that the `opacity` property of the `Page` item will be reset to `false` as initially set when the state changes.
+.. note:: Setting the *restoreEntryValues** property to true makes the changed property of the target to reset its default value, meaning that the `opacity` property of the page will be reset to `false` when the state changes.
 
 Looking at the code shown above, we see the three `Page` items created and the states that change the `opacity` property of these items. In this step, we managed to create a new component named `PagePanel` that will help us switch between pages using the three available states.
 
diff --git a/desktop_devguide/chapter_03/step_2.rst b/desktop_devguide/chapter_03/step_2.rst
index 3c90280..501d59b 100644
--- a/desktop_devguide/chapter_03/step_2.rst
+++ b/desktop_devguide/chapter_03/step_2.rst
@@ -8,23 +8,23 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Bind Marker Item with the Page Item in Repeater
-===============================================
+Binding Marker Item with the Page Item
+======================================
 
-Previously we saw the implementation of the `PagePanel` component, which uses three states to toggle the :qt:`opacity <qml-item.html#opacity-prop>` property of the `Page` items. In this step, we will see how to use the `Marker` and the `MarkerPanel` components to enable page navigation.
+Earlier we saw the implementation of the `PagePanel` component, which uses three states to toggle the :qt5:`opacity <qtquick/qml-qtquick2-item.html#opacity-prop>` property of the `Page` component. In this step, we will see how to use the `Marker` and the `MarkerPanel` components to enable page navigation.
 
-During the prototype phase, we saw that the `MarkerPanel` component is quite basic and doesn't have any functionality. It uses a :qt:`Repeater Element <qml-repeater.html>` that generates three QML Items and the `Marker` component is used as the delegate.
+During the prototype phase, we saw that the `MarkerPanel` component is quite basic and doesn't have any functionality. It uses a :qt5:`Repeater type <qtquick/qml-qtquick2-repeater.html>` that generates three QML Items and the `Marker` component is used as the delegate.
 
-`MarkerPanel` should store the current active marker, which is the marker clicked by the user. Based on the active marker of `MarkerPanel`, `PagePanel` will update its state property. We need to bind the     PagePanel* **state** property with the a new property of `MarkerPanel` that holds the current active marker.
+`MarkerPanel` should store the current active marker, which is the marker clicked by the user. Based on the active marker of `MarkerPanel`, `PagePanel` will update its state property. We need to bind the  PagePanel* **state** property with the a new property of `MarkerPanel` that holds the current active marker.
 
-Let's define a `string` property in `MarkerPanel` and call it     *activeMarker**.
+Let's define a `string` property in `MarkerPanel` and call it *activeMarker**.
 
 
 .. code-block:: js
 
     // MarkerPanel.qml
 
-    import QtQuick 1.1
+    import QtQuick 2.0
 
     Item {
         id: root
@@ -43,13 +43,13 @@ We could have a     *markerid** value stored, which we can use to uniquely ident
     :align: center
 
 
-We have a `Repeater` element that generates three     marker* items based on a model, so we can use a model to store our `markerid` values and use it in the `Repeater`.
+We have a `Repeater` element that generates three marker* items based on a model, so we can use a model to store our `markerid` values and use it in the `Repeater`.
 
 .. code-block:: js
 
     // MarkerPanel.qml
 
-    import QtQuick 1.1
+    import QtQuick 2.0
 
     Item {
         id: root
@@ -147,9 +147,9 @@ In the `main.qml` file, where we already have a `Page` item and a `MarkerPanel`
         }
     }
 
-In the code shown above, we see how the :qt:`property binding <propertybinding.html>` feature of QML helps by setting, or rather binding, the     *state** property with the **activeMarker**. This means that whatever value **activeMarker** will have during user's selection, then this value will be also assigned to the **state** property of the *PagePanel*, thus toggling the visibility of the respective page.
+In the code shown above, we see how the :qt5:`property binding <qtqml/qtqml-syntax-propertybinding.html>` feature of QML helps in binding the *state** property with the **activeMarker** property. This means that whatever value **activeMarker** will have during user's selection, the same value is also assigned to the **state** property of the *PagePanel*, thus toggling the visibility of the respective page.
 
 
 .. rubric:: What's Next?
 
-The next step will give us details on how to use graphics for our components and items in order to shape up our application's UI.
+The next step will give us details on how to use graphics for our components and items to enhance our application's UI.
diff --git a/desktop_devguide/chapter_03/step_3.rst b/desktop_devguide/chapter_03/step_3.rst
index dde2b9c..6d2461f 100644
--- a/desktop_devguide/chapter_03/step_3.rst
+++ b/desktop_devguide/chapter_03/step_3.rst
@@ -8,23 +8,23 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Adding Graphics, Image vs BorderImage Element
-=============================================
+Adding Graphics
+===============
 
-Due to the nature of QML, developers and designers are entitled to work closely throughout the development process. Nowadays, using graphics does make a big difference to the UX and how the application is perceived by users.
+Due to the nature of QML, developers and designers are entitled to work closely throughout the development cycle. Nowadays, using graphics does make a big difference to the user experience and how the application is perceived by users.
 
-QML encourages the use of graphics as much as possible when implementing the UI. The collaboration of developers with graphic designers becomes more efficient with QML because designers are be able to test their graphics right away on basic UI elements, but they can also understand from a technical perspective what a developer requires when developing new components. This helps the process of making the UI of the application more appealing and certainly easier to maintain.
+QML encourages the use of graphics as much as possible while implementing the UI. The collaboration between the developers with graphic designers is easier and efficient with QML, as designers can test their graphics right away on basic UI elements. This helps designers to understand what a developer requires while developing new components, and also makes the application's UI more appealing and certainly easier to maintain.
 
 Let's start adding graphics to our components.
 
 Setting Background Images to Components
 ---------------------------------------
 
-The :qt:`BorderImage <qml-borderimage.html>` element is recommended to be used in cases in which you would like to have the image scaled depending on user interaction and UI flow, but keep its borders unscaled. A good example of using the :qt:`BorderImage <qml-borderimage.html>` element is for having background images that have a shadowing effect for your QML item while it might be expected that this item will scale at some point and you would like to keep corners untouched.
+The :qt5:`BorderImage <qtquick/qml-qtquick2-borderimage.html>` type is recommended to be used in cases where you would like to have the image scaled, but keep its borders as is. A good use case for this type is background images that has a shadowing effect for your QML item. Your item might scale at some point but you would like to keep corners untouched.
 
-Let's see how to set a `BorderImage` element as a background for our components.
+Let's see how to set a `BorderImage` type as a background for our components.
 
-Inside the `PagePanel.qml` we add the `BorderImage` element:
+Inside the `PagePanel.qml`, we add the `BorderImage` type:
 
 .. code-block:: js
 
@@ -65,11 +65,11 @@ We do the same for the `Note` component in the `Note.qml` file:
         id: toolbar
     ...
 
-.. warning:: Make sure that the `BorderImage` element is used in the correct order within your component implementation because the arrangement of elements within a component does affect their appearance order. Items with the same `z` value will appear in the order they are declared. Further details regarding the stack ordering of items can be found in :qt:`z property <qml-item.html#z-prop>` documentation.
+.. warning:: Make sure that the `BorderImage` type is used in the correct order within your component implementation, as the implementation order defines the appearance order. Items with the same `z` value will appear in the order they are declared. Further details regarding the stack ordering of items can be found in :qt5:`z property <qtquick/qml-qtquick2-item.html#z-prop>` documentation.
 
 You may be wondering by now what would be the best approach to set a background for the `Marker` items when these items are created inside the `MarkerPanel` component. The approach is already present in the `MarkerPanel` component.
 
-There is already a `markerData` list that we are using as a model for `Repeater` in order to create `Marker` items and set `markerid` as the `activeMarker` when a marker item is clicked. We can extend the `markerData` to have a url path to an image and use the :qt:`Image <qml-image.html>` element as the top level element of the `Marker` component.
+There is already a `markerData` list that we are using as a model for the `Repeater` to create `Marker` items, and set `markerid` as the `activeMarker` when a marker item is clicked. We can extend the `markerData` to have a url path to an image and use the :qt5:`Image <qtquick/qml-qtquick2-image.html>` type as the top-level type for the `Marker` component.
 
 .. literalinclude:: src/notezapp/Marker.qml
    :language: js
@@ -116,11 +116,11 @@ So now let's see how to enhance the `MarkerPanel` component:
 
 In the code shown above, we see how the `Marker` item's `source` property is bound to our `markerData` model's `img` value.
 
-We use the `BorderImage` element for setting a background for the `NoteToolbar` component and also for setting a background for our most top level element in the `main.qml` file.
+We use the `BorderImage` type to set a background for the `NoteToolbar` component and also for the top-level type in the `main.qml` file.
 
-.. note:: Always consult with the graphics designer regarding an image's border margins and how these images should be anchored and aligned
+.. note:: Always consult with the graphics designer regarding an image's border margins and how these images should be anchored and aligned.
 
-By running the `MarkerPanel` component in Qt Creator or by simply loading it in `qmlviewer`, you should be able to get the following:
+By running the `MarkerPanel` component in Qt Creator or by simply loading it using `qmlscene`, you should be able to get the following:
 
 .. image:: img/markerpanel.png
     :scale: 80%
@@ -132,10 +132,9 @@ Now let's see how to use graphics to enhance the toolbar as proposed during the
 Creating the Tool Component
 ---------------------------
 
-When taking into consideration code re-usability then defining a new component to be used in the toolbar for the     New Note* and *Clear All* tools would make sense. This is why we have implemented a `Tool` component that will use an :qt:`Image Element <qml-image.html>` as a top level element and simply handle the mouse click from the user.
+Taking code re-usability into consideration, defining a new component to be used in the toolbar for the     *New Note* and *Clear All* tools would make sense. This is why we have implemented a `Tool` component that uses an :qt5:`Image type <qtquick/qml-qtquick2-image.html>` as a top-level type and handles the mouse click from the user.
 
-The :qt:`Image Element <qml-image.html>` is often used as an UI element on its own regardless of whether it's a static or animated image, but in any case it
-is laid out in a pixel perfect way and well defined by design requirements.
+The :qt5:`Image type <qtquick/qml-qtquick2-image.html>` is often used as an UI element on its own, regardless of whether it's a static or animated image. It is laid out in a pixel perfect way and well defined by design requirements.
 
 .. literalinclude:: src/notezapp/Tool.qml
    :language: js
diff --git a/desktop_devguide/chapter_04/index.rst b/desktop_devguide/chapter_04/index.rst
index d2827e2..342a754 100644
--- a/desktop_devguide/chapter_04/index.rst
+++ b/desktop_devguide/chapter_04/index.rst
@@ -8,14 +8,14 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Managing Note Objects Dynamically and Store Notes Locally
-=========================================================
+Managing Note Objects Dynamically
+=================================
 
-We have seen so far that QML is quite a powerful declarative language, but combining it with with Javascript makes it even more powerful. QML not only enables us to have :qt:`inline Javascript <qdeclarativejavascript.html#inline-javascript>` functions, but also to import entire Javascript libraries or files as we will see in the detailed steps of this chapter.
+We have so far seen that QML is quite a powerful declarative language, but combining it with with JavaScript makes it even more powerful. QML not only enables us to have :qt5:`inline JavaScript <qtqml/qtqml-javascript-expressions.html#custom-methods>` functions, but also to import entire JavaScript libraries or files.
 
-Part of the core functionality of     NoteApp* is to enable users to create, edit and delete notes as they like, but the application should also be able to store notes automatically without prompting them.
+Part of the core functionality of NoteApp* is to enable users to create, edit, and delete notes as they like, but the application should also be able to store notes automatically without prompting them.
 
-This chapter will guide you in detailed steps how to use Javascript to add logic to QML code and how local storage can be implemented with :qt:`Qt Quick Database API <qdeclarativeglobalobject.html>`.
+This chapter will guide you about using JavaScript to add logic to QML code, and implementing local storage using :qt5:`Qt Quick Local Storage <qtquick/qmlmodule-qtquick-localstorage2-qtquick-localstorage-2.html>`.
 
 .. note::
 
@@ -24,8 +24,9 @@ This chapter will guide you in detailed steps how to use Javascript to add logic
 
 The main topics covered in this chapter are:
 
-     Using Javascript for implementing the functionality of Dynamic Object Management
-     How to store data locally using the Qt Quick Database API
+    * Using JavaScript for implementing the functionality of Dynamic Object Management
+
+    * How to store data locally using the Qt Quick Database API
 
 This chapter has the following steps:
 
diff --git a/desktop_devguide/chapter_04/src/notezapp/Marker.qml b/desktop_devguide/chapter_04/src/notezapp/Marker.qml
index 6cac290..3774b49 100644
--- a/desktop_devguide/chapter_04/src/notezapp/Marker.qml
+++ b/desktop_devguide/chapter_04/src/notezapp/Marker.qml
@@ -36,10 +36,10 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 // Marker.qml
-// The Image element as top level is convenient
+// The Image type as top level is convenient
 // as the Marker component simply is a graphical
 // UI with a clicked() signal.
 Image {
@@ -49,7 +49,7 @@ Image {
     // be used in the MarkerPanel
     signal clicked()
 
-    // creating a MouseArea element to
+    // creating a MouseArea type to
     // intercept the mouse click
     MouseArea {
         id: mouseArea
diff --git a/desktop_devguide/chapter_04/src/notezapp/MarkerPanel.qml b/desktop_devguide/chapter_04/src/notezapp/MarkerPanel.qml
index f3c5016..0a6886a 100644
--- a/desktop_devguide/chapter_04/src/notezapp/MarkerPanel.qml
+++ b/desktop_devguide/chapter_04/src/notezapp/MarkerPanel.qml
@@ -36,7 +36,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 // MarkerPanel.qml
 
diff --git a/desktop_devguide/chapter_04/src/notezapp/Note.qml b/desktop_devguide/chapter_04/src/notezapp/Note.qml
index 3269bfd..2786b18 100644
--- a/desktop_devguide/chapter_04/src/notezapp/Note.qml
+++ b/desktop_devguide/chapter_04/src/notezapp/Note.qml
@@ -36,7 +36,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 // Note.qml
 
diff --git a/desktop_devguide/chapter_04/src/notezapp/NoteToolbar.qml b/desktop_devguide/chapter_04/src/notezapp/NoteToolbar.qml
index ec5a71d..40cb72c 100644
--- a/desktop_devguide/chapter_04/src/notezapp/NoteToolbar.qml
+++ b/desktop_devguide/chapter_04/src/notezapp/NoteToolbar.qml
@@ -36,7 +36,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 // NoteToolbar.qml
 
@@ -53,12 +53,12 @@ Item {
     }
 
     // declaring a property alias to the
-    // drag property of MouseArea element
+    // drag property of MouseArea type
     property alias drag: mousearea.drag
 
     // this default property enables us to
     // create QML Items that will be automatically
-    // laid out in the Row element and considered as toolItems
+    // laid out in the Row type and considered as toolItems
     default property alias toolItems: layout.children
 
     MouseArea {
@@ -66,7 +66,7 @@ Item {
         anchors.fill: parent
     }
 
-    // using a Row element for laying out tool items
+    // using a Row type for laying out tool items
     // to be added when using the NoteToolbar
     Row {
         id: layout
diff --git a/desktop_devguide/chapter_04/src/notezapp/Page.qml b/desktop_devguide/chapter_04/src/notezapp/Page.qml
index 322d8c2..fae6340 100644
--- a/desktop_devguide/chapter_04/src/notezapp/Page.qml
+++ b/desktop_devguide/chapter_04/src/notezapp/Page.qml
@@ -35,8 +35,7 @@
 ** $QT_END_LICENSE$
 **
 ****************************************************************************/
-
-import QtQuick 1.1
+import QtQuick 2.0
 import "noteDB.js" as NoteDB
 
 // Page.qml
@@ -64,7 +63,7 @@ Item {
         Note { }
     }
 
-    // creting an Item element that will be
+    // creting an Item type that will be
     // used as a note container
     Item { id: container }
 
@@ -73,7 +72,7 @@ Item {
     // to load notes from the database
     Component.onCompleted: loadNotes()
 
-    // a helper Javascript function that is reads
+    // a helper JavaScript function that is reads
     // the note data from DB
     function loadNotes() {
         var noteItems = NoteDB.readNotesFromPage(markerId)
@@ -82,7 +81,7 @@ Item {
         }
     }
 
-    // a Javascript helper function for creating Note QML objects
+    // a JavaScript helper function for creating Note QML objects
     function newNoteObject(args) {
         //calling the createObject() function on previously
         //declared Note Component the container will be the
@@ -93,8 +92,8 @@ Item {
         }
     }
 
-    // a Javascript helper function for iterating through
-    // the children elements of the
+    // a JavaScript helper function for iterating through
+    // the children types of the
     // container item and calls destroy() for deleting them
     function clear() {
         for (var i=0; i<container.children.length; ++i) {
@@ -102,7 +101,7 @@ Item {
         }
     }
 
-    // this Javascript helper function is used to create,
+    // this JavaScript helper function is used to create,
     // not loaded from db, Note items
     // so that it will set the markerId property of the note.
     function newNote() {
diff --git a/desktop_devguide/chapter_04/src/notezapp/PagePanel.qml b/desktop_devguide/chapter_04/src/notezapp/PagePanel.qml
index 52c1761..e873afb 100644
--- a/desktop_devguide/chapter_04/src/notezapp/PagePanel.qml
+++ b/desktop_devguide/chapter_04/src/notezapp/PagePanel.qml
@@ -36,7 +36,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 import "noteDB.js" as NoteDB
 
 // PagePane.qml
@@ -109,7 +109,7 @@ Item {
 
     Component.onDestruction: saveNotesToDB()
 
-    // a javascript function that saves all notes from the pages
+    // a JavaScript function that saves all notes from the pages
     function saveNotesToDB() {
         //clearing the DB table before populating with new data
         NoteDB.clearNoteTable();
diff --git a/desktop_devguide/chapter_04/src/notezapp/Tool.qml b/desktop_devguide/chapter_04/src/notezapp/Tool.qml
index e761578..8274b3d 100644
--- a/desktop_devguide/chapter_04/src/notezapp/Tool.qml
+++ b/desktop_devguide/chapter_04/src/notezapp/Tool.qml
@@ -36,10 +36,10 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 // Tool.qml
 
-// Use Image as the top level element
+// Use Image as the top level type
 Image {
     id: root
     signal clicked()
diff --git a/desktop_devguide/chapter_04/src/notezapp/main.qml b/desktop_devguide/chapter_04/src/notezapp/main.qml
index 0a28235..31a7c41 100644
--- a/desktop_devguide/chapter_04/src/notezapp/main.qml
+++ b/desktop_devguide/chapter_04/src/notezapp/main.qml
@@ -36,7 +36,8 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
+import QtQuick.LocalStorage 2.0
 import "noteDB.js" as NoteDB
 
 // main.qml
@@ -94,7 +95,7 @@ Rectangle {
         border { color: "#600"; width: 4 }
     }
 
-    // using a Column element to layout the Tool items vertically
+    // using a Column type to layout the Tool items vertically
     Column {
         id: toolbar
         spacing: 16
diff --git a/desktop_devguide/chapter_04/src/notezapp/noteDB.js b/desktop_devguide/chapter_04/src/notezapp/noteDB.js
index 0b0015a..0625cd9 100644
--- a/desktop_devguide/chapter_04/src/notezapp/noteDB.js
+++ b/desktop_devguide/chapter_04/src/notezapp/noteDB.js
@@ -38,13 +38,13 @@
 
 // making the nodeDB.js a stateless library
 .pragma library
-
+.import QtQuick.LocalStorage 2.0 as Sql
 // declaring a global variable for storing the database instance
 var _db
 
 function openDB() {
     print("noteDB.createDB()")
-    _db = openDatabaseSync("StickyNotesDB","1.0","The stickynotes Database",1000000);
+    _db = Sql.LocalStorage.openDatabaseSync("StickyNotesDB","1.0","The stickynotes Database",1000000);
     createNoteTable();
 }
 
diff --git a/desktop_devguide/chapter_04/step_1.rst b/desktop_devguide/chapter_04/step_1.rst
index 88ad28b..2586899 100644
--- a/desktop_devguide/chapter_04/step_1.rst
+++ b/desktop_devguide/chapter_04/step_1.rst
@@ -8,12 +8,12 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Create and Manage Note Item Objects Dynamically
-===============================================
+Create and Manage Note Items
+============================
 
-The user should be able to create and delete notes on the fly and this means that our code should be able to dynamically create and delete     Note* items. There are several ways to create and manage QML objects. In fact, we have seen one already using the :qt:`Repeater <qml-repeater.html>` element. Creating a QML object means that the component has to be created and loaded before creating instances of that component.
+The user should be able to create and delete notes on the fly and this means that our code should be able to dynamically create and delete Note* items. There are several ways to create and manage QML objects. In fact, we have seen one already using the :qt5:`Repeater <qtquick/qml-qtquick2-repeater.html>` type. Creating a QML object means that the component has to be created and loaded before creating instances of that component.
 
-QML objects can be created by calling the :qt:`createObject(Item parent, object properties ) <qml-component.html#createObject-method>` Javascript function on the component, which will create the object for us. Please refer to :qt:`Dynamic Object Management in QML <qdeclarativedynamicobjects.html>` for further details.
+QML objects can be created by calling the :qt5:`createObject(Item parent, object properties) <qtqml/qml-qtquick2-component.html#createObject-method>` JavaScript function on the component. Refer to :qt5:`Dynamic Object Management in QML <qtqml/qtqml-javascript-dynamicobjectcreation.html>` for further details.
 
 Let's see how we can create note item objects in our components.
 
@@ -21,7 +21,7 @@ Let's see how we can create note item objects in our components.
 Note Object Creation Dynamically
 --------------------------------
 
-We know that a `Note` item belongs to a `Page` item so the `Page` component is responsible for note object creation as well as for loading notes from the database as we will see in the next step.
+We know that a `Note` item belongs to the `Page` component, which is responsible for the note object creation as well as to loading notes from the database.
 
 As mentioned before, we first load the `Note` component in the `Page` component:
 
@@ -37,7 +37,7 @@ As mentioned before, we first load the `Note` component in the `Page` component:
     }
      ...
 
-Now let's define a Javascript function that will help us create QML `Note` objects. We need to take into consideration that, when creating a QML object, a set of arguments is passed and one of them is the parent of the this object. Considering to have a `Note` item container within the `Page` component would be a good idea for managing our note objects - especially for later on as we would like to save these notes in a database.
+Now let's define a Javascript function that will creates QML `Note` objects. While creating a QML object, we must ensure that one of the arguments is the parent of the `this` object. Considering to have a `Note` item container within the `Page` component would be a good idea for managing our note objects, as we would like to save these notes in a database.
 
 .. code-block:: js
 
@@ -60,9 +60,9 @@ Now let's define a Javascript function that will help us create QML `Note` objec
     }
     ...
 
-So in the code shown above, we see how a new     note* item object can be created in the *newNoteObject()* function. The newly created note objects will belong to the *container* item.
+So in the code shown above, we see how a new note* item object can be created in the *newNoteObject()* function. The newly created note objects will belong to the *container* item.
 
-Now we would like to call this function when the     new note* tool is pressed on the toolbar which is created in the `main.qml` file. Since the `PagePanel` component is aware of the current visible *page* item, we can create a new property in `PagePanel` that stores that page.
+Now we would like to call this function when the new note* tool is pressed on the toolbar, which is created in the `main.qml` file. As the `PagePanel` component is aware of the current visible *page* item, we can create a new property in `PagePanel` to store that page.
 
 We will access this property in the `main.qml` file and call the function to create new note items.
 
@@ -121,7 +121,7 @@ We will access this property in the `main.qml` file and call the function to cre
 
 We modify our three states for setting the appropriate value for the `currentPage` property.
 
-In the `main.qml` file, let's see how to call the function for creating new note objects when the     new note* tool is clicked:
+In the `main.qml` file, let's see how to call the function for creating new note objects when the new note* tool is clicked:
 
 .. code-block:: js
 
@@ -153,16 +153,16 @@ In the `main.qml` file, let's see how to call the function for creating new note
 Deleting Note Objects
 ---------------------
 
-Deleting the `Note` objects is a more straightforward process because the QML :qt:`Item <qml-item.html>` element provides a Javascript function called :qt:`destroy() <qdeclarativedynamicobjects.html#deleting-objects-dynamically>`. As we already have a container item whose children are all `Note` items, we can simply iterate through the list of children and call :qt:`destroy() <qdeclarativedynamicobjects.html#deleting-objects-dynamically>`  on each of them.
+Deleting the `Note` objects is a more straightforward process because the QML :qt5:`Item <qtquick/qml-qtquick2-item.html>` type provides a JavaScript function called :qt5:`destroy() <qtqml/qtqml-javascript-dynamicobjectcreation.html#deleting-objects-dynamically>`. As we already have a container item whose childrens are `Note` items, we can simply iterate through the list of children and call :qt5:`destroy() <qtqml/qtqml-javascript-dynamicobjectcreation.html#deleting-objects-dynamically>` on each of them.
 
-In the `Page` component, let's define a function that will perform this operation for us:
+In the `Page` component, let's define a function to perform this operation for us:
 
 .. code-block:: js
 
     // Page.qml
     ...
 
-    // a Javascript helper function for iterating through the children elements of the
+    // a JavaScript helper function for iterating through the children elements of the
     // container item and calls destroy() for deleting them
     function clear() {
         for(var i=0; i<container.children.length; ++i) {
@@ -186,7 +186,7 @@ In the `main.qml` file, we call the `clear()` function when the `clear` tool is
     }
     ...
 
-In order to allow the user to delete each note individually, we add a tool in the `NoteToolbar` component to our `Note` component and we can use the `Tool` component that was implemented earlier for this:
+In order to allow the user to delete each note individually, we add a tool in the `NoteToolbar` component to our `Note` component. We can use the `Tool` component that was implemented earlier for this:
 
 .. code-block:: js
 
@@ -213,4 +213,4 @@ In order to allow the user to delete each note individually, we add a tool in th
 
 .. rubric:: What's Next?
 
-Next there will a detailed step on how store the note items in a database locally.
+Next, there will be a detailed step on how store the note items in a database locally.
diff --git a/desktop_devguide/chapter_04/step_2.rst b/desktop_devguide/chapter_04/step_2.rst
index 7346a68..6470164 100644
--- a/desktop_devguide/chapter_04/step_2.rst
+++ b/desktop_devguide/chapter_04/step_2.rst
@@ -8,54 +8,54 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Store and Load Data from a Database Using Javascript
-====================================================
+Store and Load Data from a Database
+===================================
 
-So far we have implemented the core functionality of     NoteApp*: creating and managing note items on the fly.
+So far we have implemented the core functionality of NoteApp*: creating and managing note items on the fly.
 
-In this step, we will go through a detailed implementation of how to store notes in a local database. QML offers a simple :qt:`Qt Quick Database API <qdeclarativeglobalobject.html>`, which uses the SQLite database for implementing our required feature.
+In this step, we will go through a detailed implementation of storing notes in a local database. QML offers a simple :qt5:`Qt Quick Local Storage API <qtquick/qmlmodule-qtquick-localstorage2-qtquick-localstorage-2.html>`, which uses the SQLite database for implementing our required feature.
 
-The preferred approach would be for the     NoteApp* to load notes from the database on application start-up and save them when the application is closed so no prompting is done for the user whatsoever.
+The preferred approach for the NoteApp* would be to load notes from the database on application start-up and save them when the application is closed. The user is not prompted at all.
 
 
-Defining the Database and Required Data Fields
-----------------------------------------------
+Defining the Database
+---------------------
 
-The database for     NoteApp* should be a fairly simple one. It has just one table, the *note* table, that will contain the information for our saved notes.
+The database for NoteApp* should be a simple one. It has just one table, the *note* table, that will contain the information for our saved notes.
 
 .. list-table::
     :widths: 20 30 50
     :header-rows: 1
 
-           - Field
-        - Type
-        - Description
+     * - Field
+       - Type
+       - Description
 
-           - `noteId`
-        - INTEGER (PRIMARY KEY AUTOINCREMENT)
-        - Unique identifier for the note item
+     * - `noteId`
+       - INTEGER (PRIMARY KEY AUTOINCREMENT)
+       - Unique identifier for the note item
 
-           - `x`
-        - INTEGER
-        - The `x` property of the note item holding the position on the horizontal axis
+     * - `x`
+       - INTEGER
+       - The `x` property of the note item holding the position on the horizontal axis
 
-           - `y`
-        - INTEGER
-        - The `y` property of the note item holding the position on the vertical axis
+     * - `y`
+       - INTEGER
+       - The `y` property of the note item holding the position on the vertical axis
 
-           - `noteText`
-        - TEXT
-        - For the note item text
+     * - `noteText`
+       - TEXT
+       - For the note item text
 
-           - `markerId`
-        - TEXT
-        - `markerId` represents the page to which this note item belongs
+     * - `markerId`
+       - TEXT
+       - `markerId` represents the page to which this note item belongs
 
 
 Looking at the Table definition, let's try to figure out from the information stated above what the `Note` component already has and if any new data should be introduced.
 
      The `x` and `y` are geometrical properties that each QML item has. Getting these values from the `Note` items should be straightforward. These values will be used to store the position of a note within its page.
-     `noteText` is the actual text of the note and we can retrieve it from the `Text` element in our `Note` component, however, a property alias could be defined for this and we can call it `noteText`. This will will be shown later on.
+     `noteText` is the actual text of the note and we can retrieve it from the `Text` element in our `Note` component, however, a property alias could be defined for this and we can call it `noteText`. This will be shown later on.
      `noteId` and `markerId` are identifiers that every note item should have. `noteId` will be a unique identifier required by the database while `markerId` will help us identify the page to which this note item belongs. So we would need two new properties in the `Note` component.
 
 
@@ -79,7 +79,7 @@ In the `Note` component, we define the new required properties:
 
     }
 
-Now considering that this `Page` component is responsible for creating `Note` items, it should also know which `markerId` it is associated with. When a new `Note` item will be created (not loaded from the database), the `Page` should set the `Note` item's `markerId` property.
+Considering that the `Page` component is responsible for creating `Note` items, it should also know which `markerId` it is associated with. When a new `Note` item is created (not loaded from the database), the `Page` should set the `Note` item's `markerId` property.
 
 We'll use a Javascript helper function for this:
 
@@ -110,9 +110,9 @@ We'll use a Javascript helper function for this:
 
     }
 
-Previously, in `main.qml`, we used the `newNoteObject()` function, but as explained above, that doesn't fit our purpose any longer so we need to replace it with the `newNote()` function (see above in the code snippet).
+Previously, in `main.qml`, we used the `newNoteObject()` function, but as explained above, that doesn't fit our purpose any longer so we need to replace it with the `newNote()` function.
 
-We have a `markerId` property for the `Page` component that is used to set the `markerId` of `Note` items when created, however, first we need to make sure that a page's `markerId` property is set properly and we know that `Page` items are created in the `PagePanel` component.
+We have a `markerId` property for the `Page` component that is used to set the `markerId` of `Note` items when created. We must ensure that a page's `markerId` property is set properly when the `Page` items are created in the `PagePanel` component.
 
 .. code-block:: js
 
@@ -134,54 +134,63 @@ We have a `markerId` property for the `Page` component that is used to set the `
     }
 
 
-To summarize what we have done so far, we have ensured that the relation for notes and pages is correct from a relational database perspective. A `Note` item has a unique ID that belongs to a page identified by a marker ID. In our QML code, we make sure that these values are set properly.
+We have so far ensured that the:
 
-Now let's work on how to load and perform the storing of notes.
+ * relation between notes and pages is correct from a relational database perspective,
 
-Stateless Javascript Library
+ * a `Note` item has a unique ID that belongs to a page identified by a marker ID,
+
+ * and these property values are set properly.
+
+Now let's work on how to load and store the notes.
+
+Stateless JavaScript Library
 ----------------------------
 
-To simplify the development effort, it would be a good idea to create a Javascript interface that interacts with the database and provides us with convenient functions to use in our declarative QML code.
+To simplify the development effort, it would be a good idea to create a JavaScript interface that interacts with the database and provides us with convenient functions to use in our QML code.
 
-In Qt Creator, we create a new Javscript file named `noteDB.js` and make sure that we check the     Stateless Library* option. The idea is to make the `noteDB.js` file act like a library and provide stateless helper functions. In this way there will be just one instance of this file loaded and used for each QML Component where the `noteDB.js` is imported and used. This will also ensure that there's just one global variable for storing the database instance `_db`.
+In Qt Creator, we create a new JavaScript file named, `noteDB.js`, and make sure that we check the     Stateless Library* option. The idea is to make the `noteDB.js` file act like a library and provide stateless helper functions. In this way, there will be just one instance of this file loaded and used for each QML component where the `noteDB.js` is imported and used. This also ensures that there's just one global variable for storing the database instance, `_db`.
 
-.. note:: Non Stateless Javascript files are useful when imported in a QML component, perform operations on that component and all the variables are valid within that context only. Each import, it creates a separate instance of the Javascript file
+.. note:: Non-stateless JavaScript files are useful when imported in a QML component, perform operations on that component, and all the variables are valid within that context only. Each import creates a separate instance of the JavaScript file.
 
 The `noteDB.js` should provide the following functionality:
 
-     Open/Create a local database instance
-     Create the necessary database tables
-     Read notes from the database
-     Delete all notes
+    * Open/Create a local database instance
+
+    * Create the necessary database tables
+
+    * Read notes from the database
+
+    * Delete all notes
+
+We will see in greater detail how the functions in `noteDB.js` are implemented when describing the implementation of loading and saving note items to the database. Now, let's consider the following functions implemented for us:
+
+    * `function openDB()` - Creates the database if one doesn't already exist and, if it does, it opens it
+
+    * `function createNoteTable()` - Creates the `note` table if one doesn't already exist. This function is only called in the `openDB()` function
+
+    * `function clearNoteTable()` - Removes all rows from the `note` table
 
-We will see in greater detail how the functions in `noteDB.js` are implemented when describing the implementation of loading and saving note items from the database, but for now let's consider the following functions implemented for us:
+    * `function readNotesFromPage(markerId)` - This helper function reads all the notes that are related to the `markerId` specified, and returns a dictionary of data.
 
-     `function openDB()`
-   Creates the database if one doesn't already exist and, if it does, it opens it
-     `function createNoteTable()`
-   Creates the `note` table if one doesn't already exist. This function is only called in the `openDB()` function
-     `function clearNoteTable()`
-   Removes all rows from the `note` table
-     `function readNotesFromPage(markerId)`
-   This helper function reads all the notes from the database that have their `markerId` column as     markerId* and returns a dictionary of data
-     `function saveNotes(noteItems, markerId)`
-   Used to save note items in the database. `noteItems` represents a list of note items and `markerId` is the common value for the `markerId` column.
+    * `function saveNotes(noteItems, markerId)` - Used to save note items in the database. The arguments, `noteItems` represents a list of note items, and the `markerId` representing the corresponding page to which the note items belong.
 
+.. note:: As all these JavaScript functions access the database using the Qt Quick Local Storage API, add the statement, `.import QtQuick.LocalStorage 2.0 as Sql`, at the beginning of `noteDB.js`.
 
-Loading and Storing Notes From DB
----------------------------------
+Loading and Storing Notes
+-------------------------
 
-Now that we have the `noteDB.js` implemented, we would like to use the given functions to perform the loading and storing of our notes.
+Now that we have the `noteDB.js` implemented, we would like to use the given functions to load and store notes.
 
-A good practice as to when and where to initialize or open the database connection is to do so in the     main* qml file. In this way, we can simply use the Javascript functions defined in the `noteDB.js` file without reinitializing the database.
+A good practice as to when and where to initialize or open the database connection is to do so in the     main* qml file. This way, we can use the JavaScript functions defined in the `noteDB.js` file without reinitializing the database.
 
-We import the `noteDB.js` in the `main.qml` file, but the question is when to call the `openDB()` function. QML offers helpful attached signals, :qt:`onCompleted() <qml-component.html#onCompleted-signal>` and :qt:`onDestruction() <qml-component.html#onDestruction-signal>`, which are emitted when the component is fully loaded and upon destruction respectively.
+We import the `noteDB.js` and `QtQuick.LocalStorage 2.0` in the `main.qml` file, but the question is when to call the `openDB()` function. QML offers helpful attached signals, :qt5:`onCompleted() <qtqml/qml-qtquick2-component.html#onCompleted-signal>` and :qt5:`onDestruction() <qtqml/qml-qtquick2-component.html#onDestruction-signal>`, which are emitted when the component is fully loaded and destroyed respectively.
 
 .. code-block:: js
 
     // main.qml
 
-    import QtQuick 1.1
+    import QtQuick 2.0
     import "noteDB.js" as NoteDB
 
     ...
@@ -192,7 +201,7 @@ We import the `noteDB.js` in the `main.qml` file, but the question is when to ca
     ...
 
 
-Here is the implementation of the `openDB` function. It calls the :qt:`openDatabaseSync() <qdeclarativeglobalobject.html#db-opendatabasesync-identifier-version-description-estimated-size-callback-db>` function for creating the database and afterwards calls the `createNoteTable()` function for creating the `note` table.
+Here is the implementation of the `openDB` function. It calls the :qt5:`openDatabaseSync() <qtquick/qmlmodule-qtquick-localstorage2-qtquick-localstorage-2.html#opendatabasesync>` function for creating the database and afterwards calls the `createNoteTable()` function for creating the `note` table.
 
 .. code-block:: js
 
@@ -222,7 +231,7 @@ Here is the implementation of the `openDB` function. It calls the :qt:`openDatab
     ...
 
 
-In the `main.qml` file, we initialize the database so it is pretty safe to start loading our `Note` items in the `Page` component as the `Page` component is the one responsible for managing notes. Above, we have mentioned the `readNotesFromPage(markerId)` function that returns a list of data arrays (a dictionary otherwise referred to the scripting world) and each array represents a row in the database with the data of a note.
+In the `main.qml` file, we initialize the database so it is pretty safe to start loading our `Note` items in the `Page` component. Above, we have mentioned the `readNotesFromPage(markerId)` function that returns a list of data arrays (referred as dictionary in the scripting world) and each array represents a row in the database with the data of a note.
 
 .. code-block:: js
 
@@ -247,7 +256,7 @@ In the `main.qml` file, we initialize the database so it is pretty safe to start
     }
 
 
-Tthe `Page` component will read the notes and create the respective QML     note* objects.
+Tthe `Page` component will read the notes and create the respective QML note* objects.
 
 .. code-block:: js
 
@@ -270,9 +279,9 @@ Tthe `Page` component will read the notes and create the respective QML     note
 We can see that the `newNoteObject()` function, defined previously in `Page.qml`, takes the array of data as arguments, which are in fact values for the `x`, `y`, `noteText`,
 `markerId` and `noteId` properties.
 
-.. note:: Notice that the `note` table of the database uses the same names as the `Note` component properties for the column names. This helps us pass the data of a table row as arguments when creating the note QML object.
+.. note:: Notice that the `note` table field names are same as the `Note` component properties. This helps us pass the data of a table row as arguments when creating the note QML object.
 
-Now that we have the loading of `Note` items from the database implemented, the next logical step is to implement the saving of notes into `DB`. In our code, we know that the `PagePanel` component is responsible for creating the `Page` items, meaning it should be able to access the notes per each page and use the `saveNotes()` Javascript function from `noteDB.js` should save them into `DB`.
+Now that we have implemented a function to load the `Note` items from the database, the next logical step is to implement a function to save notes into `DB`. In our code, we know that the `PagePanel` component is responsible for creating the `Page` items, so it should be able to access the notes on each page and call the `saveNotes()` JavaScript function from `noteDB.js` to save the notes into `DB`.
 
 .. code-block:: js
 
@@ -292,7 +301,7 @@ Now that we have the loading of `Note` items from the database implemented, the
         }
     }
 
-So at first we define a property alias that will expose the `Note` items, which in fact are children elements of the     Container Item* element created in the `Page` component:
+So at first we define a property alias that will expose the `Note` items, which are childrens of the     container Item* created in the `Page` component:
 
 .. code-block:: js
 
@@ -311,7 +320,7 @@ So at first we define a property alias that will expose the `Note` items, which
 
     }
 
-In the `PagePanel`, we implement the functionality for saving notes to     DB*:
+In the `PagePanel`, we implement the functionality for saving notes to DB*:
 
 .. code-block:: js
 
@@ -320,7 +329,7 @@ In the `PagePanel`, we implement the functionality for saving notes to     DB*:
     ...
     Component.onDestruction: saveNotesToDB()
 
-    // a javascript function that saves all notes from the pages
+    // a JavaScript function that saves all notes from the pages
     function saveNotesToDB() {
         // clearing the DB table before populating with new data
         NoteDB.clearNoteTable();
@@ -332,7 +341,7 @@ In the `PagePanel`, we implement the functionality for saving notes to     DB*:
     }
     ...
 
-In order to reduce the complexity of our code for the purpose of this guide, we simply clear all the data in     DB* just before saving our notes. This avoids the need to have code for updating existing *Note* items.
+In order to reduce the complexity of our code, we clear all the data in DB* before saving our notes. This avoids the need to have code for updating existing *Note* items.
 
 By the end of this chapter, the users are able to create and delete new notes as they like while the application saves and loads notes automatically for them.
 
diff --git a/desktop_devguide/chapter_05/index.rst b/desktop_devguide/chapter_05/index.rst
index 90a8694..1654a51 100644
--- a/desktop_devguide/chapter_05/index.rst
+++ b/desktop_devguide/chapter_05/index.rst
@@ -8,12 +8,12 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Adding Animations and Enhancing the Look & Feel
-===============================================
+Enhancing the Look and Feel
+===========================
 
-    NoteApp's* UI can be considered complete in terms of functionality and user interaction. There is, however, plenty of room for improvement by making the UI more appealing to the user. QML as a declarative language was implemented with animations and fluid transitions of UI elements in mind.
+The NoteApp's* UI can be considered complete in terms of functionality and user interaction. However, there is plenty of room for improvement by making the UI more appealing to the user. QML was designed as a declarative language, keeping in mind the animations and fluid transitions of UI elements.
 
-In this chapter, we will guide you step by step on how to add animations and make     NoteApp* feel more fluid. QML provides a set of QML elements that enable you to implement animations in a more convenient approach. This chapter will introduce new elements and how these elements will be used in our QML Components in order to make the UI more fluid.
+In this chapter, we will guide you step-by-step on how to add animations and make NoteApp* feel more fluid. QML provides a set of QML types that enable you to implement animations in a more convenient approach. This chapter introduces new types and guides how to use them in our QML Components to make the UI more fluid.
 
 .. note::
 
@@ -22,9 +22,11 @@ In this chapter, we will guide you step by step on how to add animations and mak
 
 In summary, the chapter will cover the following main topics:
 
-     Introducing concepts about animations and transitions in QML
-     New QML Elements will be covered, such as *Behavior*, *Transition* and various *Animation* elements
-     Enhancing *NoteApp* QML Components using various animations
+    * Introducing concepts about animations and transitions in QML
+
+    * New QML types will be covered, such as *Behavior*, *Transition* and various *Animation* elements
+
+    * Enhancing *NoteApp* QML Components using various animations
 
 This chapter has the following steps:
 
diff --git a/desktop_devguide/chapter_05/src/notezapp/Marker.qml b/desktop_devguide/chapter_05/src/notezapp/Marker.qml
index e1bb0ee..9c75124 100644
--- a/desktop_devguide/chapter_05/src/notezapp/Marker.qml
+++ b/desktop_devguide/chapter_05/src/notezapp/Marker.qml
@@ -37,9 +37,9 @@
 ****************************************************************************/
 // Marker.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
-// The Image element as top level is convenient
+// The Image type as top level is convenient
 // as the Marker component simply is a graphical
 // UI with a clicked() signal.
 Image {
@@ -90,7 +90,7 @@ Image {
         }
     ]
 
-    // creating a MouseArea element
+    // creating a MouseArea type
     // to intercept the mouse click
     MouseArea {
         id: mouseArea
diff --git a/desktop_devguide/chapter_05/src/notezapp/MarkerPanel.qml b/desktop_devguide/chapter_05/src/notezapp/MarkerPanel.qml
index 42f085c..1fcbab5 100644
--- a/desktop_devguide/chapter_05/src/notezapp/MarkerPanel.qml
+++ b/desktop_devguide/chapter_05/src/notezapp/MarkerPanel.qml
@@ -38,7 +38,7 @@
 
 // MarkerPanel.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Item {
     id: root
diff --git a/desktop_devguide/chapter_05/src/notezapp/Note.qml b/desktop_devguide/chapter_05/src/notezapp/Note.qml
index e2e944f..b544dd0 100644
--- a/desktop_devguide/chapter_05/src/notezapp/Note.qml
+++ b/desktop_devguide/chapter_05/src/notezapp/Note.qml
@@ -38,7 +38,7 @@
 
 // Note.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Item {
     id: root
diff --git a/desktop_devguide/chapter_05/src/notezapp/NoteToolbar.qml b/desktop_devguide/chapter_05/src/notezapp/NoteToolbar.qml
index 8d9e054..4d95f13 100644
--- a/desktop_devguide/chapter_05/src/notezapp/NoteToolbar.qml
+++ b/desktop_devguide/chapter_05/src/notezapp/NoteToolbar.qml
@@ -38,7 +38,7 @@
 
 // NoteToolbar.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Item {
     id: root
@@ -53,12 +53,12 @@ Item {
     }
 
     // declaring a property alias to the
-    // drag property of MouseArea element
+    // drag property of MouseArea type
     property alias drag: mousearea.drag
 
     // this default property enables us to
     // create QML Items that will be automatically
-    // laid out in the Row element and considered as toolItems
+    // laid out in the Row type and considered as toolItems
     default property alias toolItems: layout.children
 
     MouseArea {
@@ -71,7 +71,7 @@ Item {
         hoverEnabled: true
     }
 
-    // using a Row element for laying out tool
+    // using a Row type for laying out tool
     // items to be added when using the NoteToolbar
     Row {
         id: layout
@@ -85,12 +85,12 @@ Item {
         }
         spacing: 20
 
-        // the opacity depends if the mousearea elements
+        // the opacity depends if the mousearea types
         // has the cursor of the mouse.
         opacity: mousearea.containsMouse ? 1 : 0
 
-        // using the behavior element to specify the
-        // behavior of the layout element
+        // using the behavior type to specify the
+        // behavior of the layout type
         // when on the opacity changes.
         Behavior on opacity {
             // using NumberAnimation to animate
diff --git a/desktop_devguide/chapter_05/src/notezapp/Page.qml b/desktop_devguide/chapter_05/src/notezapp/Page.qml
index 665121c..9fcf3af 100644
--- a/desktop_devguide/chapter_05/src/notezapp/Page.qml
+++ b/desktop_devguide/chapter_05/src/notezapp/Page.qml
@@ -38,7 +38,7 @@
 
 // Page.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 import "noteDB.js" as NoteDB
 
 Item {
@@ -63,7 +63,7 @@ Item {
         Note { }
     }
 
-    // creating an Item element that will be
+    // creating an Item type that will be
     // used as a note container
     Item { id: container }
 
@@ -95,7 +95,7 @@ Item {
     }
 
     // a Javascript helper function for
-    // iterating through the children elements of the
+    // iterating through the children types of the
     // container item and calls destroy() for deleting them
     function clear() {
         for (var i=0; i<container.children.length; ++i) {
diff --git a/desktop_devguide/chapter_05/src/notezapp/PagePanel.qml b/desktop_devguide/chapter_05/src/notezapp/PagePanel.qml
index 38df25c..22badac 100644
--- a/desktop_devguide/chapter_05/src/notezapp/PagePanel.qml
+++ b/desktop_devguide/chapter_05/src/notezapp/PagePanel.qml
@@ -38,7 +38,7 @@
 
 // PagePane.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 import "noteDB.js" as NoteDB
 
 Item {
diff --git a/desktop_devguide/chapter_05/src/notezapp/Tool.qml b/desktop_devguide/chapter_05/src/notezapp/Tool.qml
index 4f562d8..ae164aa 100644
--- a/desktop_devguide/chapter_05/src/notezapp/Tool.qml
+++ b/desktop_devguide/chapter_05/src/notezapp/Tool.qml
@@ -38,9 +38,9 @@
 
 // Tool.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
-// use Image as the top level element
+// use Image as the top level type
 Image {
     id: root
     signal clicked()
diff --git a/desktop_devguide/chapter_05/src/notezapp/main.qml b/desktop_devguide/chapter_05/src/notezapp/main.qml
index a7e6e54..e556d19 100644
--- a/desktop_devguide/chapter_05/src/notezapp/main.qml
+++ b/desktop_devguide/chapter_05/src/notezapp/main.qml
@@ -38,7 +38,7 @@
 
 // main.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 import "noteDB.js" as NoteDB
 
 Rectangle {
@@ -94,7 +94,7 @@ Rectangle {
         border { color: "#600"; width: 4 }
     }
 
-    // using a Column element to layout the
+    // using a Column type to layout the
     // Tool items vertically
     Column {
         id: toolbar
diff --git a/desktop_devguide/chapter_05/src/notezapp/noteDB.js b/desktop_devguide/chapter_05/src/notezapp/noteDB.js
index 9f31b65..b2b91f8 100644
--- a/desktop_devguide/chapter_05/src/notezapp/noteDB.js
+++ b/desktop_devguide/chapter_05/src/notezapp/noteDB.js
@@ -40,14 +40,14 @@
 
 //making the nodeDB.js a stateless library
 .pragma library
-
+.import QtQuick.LocalStorage 2.0 as Sql
 // declaring a global variable for storing the database instance
 var _db
 
 //
 function openDB() {
     print("noteDB.createDB()")
-    _db = openDatabaseSync("StickyNotesDB","1.0","The stickynotes Database",1000000);
+    _db = Sql.LocalStorage.openDatabaseSync("StickyNotesDB","1.0","The stickynotes Database",1000000);
     createNoteTable();
 }
 
diff --git a/desktop_devguide/chapter_05/step_1.rst b/desktop_devguide/chapter_05/step_1.rst
index a947f51..7721911 100644
--- a/desktop_devguide/chapter_05/step_1.rst
+++ b/desktop_devguide/chapter_05/step_1.rst
@@ -8,25 +8,24 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Using the Behavior Element to Animate NoteToolbar
-=================================================
+Animating the NoteToolbar
+=========================
 
-Let's see how we can improve the `Note` Component and add a behavior to the element based on user's interaction. The `Note` Component has a toolbar with a     Delete* tool for deleting the note. Moreover, the note-toolbar is used to drag the note around by keeping the mouse pressed on it and moving the mouse.
+Let's see how we can improve the `Note` Component and add a behavior based on user's interaction. The `Note` Component has a toolbar with a Delete* tool for deleting the note. Moreover, the toolbar is used to drag the note around by keeping the mouse pressed on it.
 
-An improvement could be to make the `Delete` tool of the `Note Toolbar` visible only when needed. For instance, what we could show the `Delete` tool only when the toolbar is
-hovered and it would be nice to do this in a transitional approach, meaning using fading in and out effects.
+An improvement could be to make the `Delete` tool visible only when needed. For instance, making the `Delete` tool visible only when the toolbar is hovered, and it would be nice to do this using fade-in and fade-out effects.
 
-QML provides several approaches to implement this by using `Animation` and `Transition` elements as we will see later on. For this specific case, however, we use the :qt:`Behavior <qml-behavior.html>` QML Element and later on cover the reason behind this.
+QML provides several approaches to implement this by using `Animation` and `Transition` types. In this specific case, we will use the :qt5:`Behavior <qtquick/qml-qtquick2-behavior.html>` QML type, and later on cover the reason behind this.
 
 
-Behavior and NumberAnimation QML Elements
------------------------------------------
+Behavior and NumberAnimation Types
+----------------------------------
 
-In the `NoteToolbar` component, we use the :qt:`Row <qml-row.html>` element to layout the     Delete* tool so changing the `opacity` property of the :qt:`Row <qml-row.html>` element will also effect the opacity of the *Delete* tool.
+In the `NoteToolbar` component, we use the :qt5:`Row <qtquick/qml-qtquick2-row.html>` type to layout the     Delete* tool, so changing the `opacity` property of the :qt5:`Row <qtquick/qml-qtquick2-row.html>` type will also effect the opacity of the *Delete* tool.
 
 .. note:: The value of the `opacity` property is propagated from the parent to the child items.
 
-The :qt:`Behavior <qml-behavior.html>` element helps you define the behavior of your element based on the property changes of that element as shown in the following code in `NoteToolbar.qml`:
+The :qt5:`Behavior <qtquick/qml-qtquick2-behavior.html>` type helps you define the behavior of the item based on the property changes of that item as shown in the following code:
 
 .. code-block:: js
 
@@ -57,8 +56,8 @@ The :qt:`Behavior <qml-behavior.html>` element helps you define the behavior of
         }
         spacing: 20
 
-        // the opacity depends if the mousearea elements
-        // have the cursor of the mouse.
+        // the opacity depends if the mousearea
+        // has the cursor of the mouse.
         opacity: mousearea.containsMouse ? 1 : 0
 
         // using the behavior element to specify the
@@ -72,15 +71,15 @@ The :qt:`Behavior <qml-behavior.html>` element helps you define the behavior of
     }
     ...
 
-As we can see from the code shown above, we enable the     *hoverEnabled** property in the :qt:`MouseArea <qml-mousearea.html>` element, which allows `MouseArea` to accept mouse hover events. Afterwards, we toggle the `opacity` of the `Row` element to `0` if the `mousearea` element is not hovered and to `1` otherwise. The :qt:`containsMouse <qml-mousearea.html#containsMouse-prop>` property of `MouseArea` is used for this, which is set to true only when `mousearea` is hovered.
+As you can see in the code above, we enable the *hoverEnabled** property of :qt5:`MouseArea <qtquick/qml-qtquick2-mousearea.html>` type to accept mouse hover events. Afterwards, we toggle the `opacity` of the `Row` type to `0` if the `Mousearea` type is not hovered and to `1` otherwise. The :qt5:`containsMouse <qtquick/qml-qtquick2-mousearea.html#containsMouse-prop>` property of `MouseArea` is used to decide the opacity value for the Row type.
 
-So the :qt:`Behavior <qml-behavior.html>` element is created inside the `Row` element to define a behavior for it when the opacity` property is toggled and therefore changed so a :qt:`NumberAnimation <qml-numberanimation.html>` element is created to animate this change.
+So the :qt5:`Behavior <qtquick/qml-qtquick2-behavior.html>` type is created inside the `Row` type to define its behavior based on its `opacity` property. When the opacity value changes, the :qt5:`NumberAnimation <qtquick/qml-qtquick2-numberanimation.html>` is applied.
 
-The :qt:`NumberAnimation <qml-numberanimation.html>` element applies an animation based on numerical value changes so we use it for the `opacity` property of the `Row` for a duration of 350 milliseconds.
+The :qt5:`NumberAnimation <qtquick/qml-qtquick2-numberanimation.html>` type applies an animation based on numerical value changes, so we use it for the `opacity` property of the `Row` for a duration of 350 milliseconds.
 
-.. note:: The `NumberAnimation` element inherits from :qt:`PropertyAnimation <qml-propertyanimation.html>`, which have `Easing.Linear` as the default easing curve of the animation.
+.. note:: The `NumberAnimation` type is inherited from :qt5:`PropertyAnimation <qtquick/qml-qtquick2-propertyanimation.html>`, which has `Easing.Linear` as the default easing curve animation.
 
 
 .. rubric:: What's Next?
 
-In the next step, we will see how to implement an animation using     Transition* and other QML animation elements.
+In the next step, we will see how to implement an animation using Transition* and other QML animation types.
diff --git a/desktop_devguide/chapter_05/step_2.rst b/desktop_devguide/chapter_05/step_2.rst
index 7dba0cc..e5c0d08 100644
--- a/desktop_devguide/chapter_05/step_2.rst
+++ b/desktop_devguide/chapter_05/step_2.rst
@@ -8,34 +8,35 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Using States and Transitions to Animate Pages and Page Markers
-==============================================================
+Using States and Transitions
+============================
 
-Previously, we saw a rather convenient approach to defining simple animations upon the property changes of an element using the :qt:`Behavior <qml-behavior.html>` and :qt:`NumberAnimation <qml-numberanimation.html>` elements.
+In the previous step, we saw a convenient approach to defining simple animations based on the property changes, using the :qt5:`Behavior <qtquick/qml-qtquick2-behavior.html>` and :qt5:`NumberAnimation <qtquick/qml-qtquick2-numberanimation.html>` types.
 
-Certainly, there are cases in which animations depend on a set or property changes that could be represented by a :qt:`State
-<qml-state.html>`.
+Certainly, there are cases in which animations depend on a set or property changes that could be represented by a :qt5:`State <qtquick/qml-qtquick2-state.html>`.
 
-Let's see how we can further improve the UI of     NoteApp*.
+Let's see how we can further improve the UI of NoteApp*.
 
-The `Marker` items seem to be static when it comes to user interaction. What if we could add some animations based on different user interaction scenarios? Moreover, we would like to make the current active marker more visible to the user, hence the current page that the user is creating notes for.
+The `Marker` items seem to be static when it comes to user interaction. What if we could add some animations based on different user interaction scenarios? Moreover, we would like to make the current active marker and the current page more visible to the user.
 
-Animating the Marker Items using Transitions
---------------------------------------------
+Animating the Marker Items
+--------------------------
 
 If we are about to summarize the possible scenarios for enhancing user interaction with `Marker` items, the following use cases are depicted:
 
-     The current active `Marker` item should be more visible. A marker becomes active when the user clicks on it. The active marker is slightly bigger and, in fact, could slide from left to right (just like a drawer).
-     When the user hovers a marker with the mouse, the marker slides from left to right but not as much as an active marker would slide.
+    * The current active `Marker` item should be more visible. A marker becomes active when the user clicks on it. The active marker is slightly bigger, and it could slide from left to right (just like a drawer).
+
+    * When the user hovers a marker with the mouse, the marker slides from left to right but not as much as an active marker would slide.
 
 Considering the scenarios mentioned above, we need to work on the `Marker` and `MarkerPanel` components.
 
-While reading the description above about the desired behavior (the sliding effect from left to right), changing the `x` property of the `Marker` item immediately comes to mind because the `x` property represents the position of the item on the X-axis. Moreover, as the `Marker` item should be aware if it is the current active marker, a new property called `active` can be introduced.
+While reading the description above about the desired behavior (the sliding effect from left to right), the immediate thought I get is to change the `x` property of the `Marker` item as it represents the position of the item on the X-axis. Moreover, as the `Marker` item should be aware if it is the current active marker, a new property called `active` can be introduced.
 
 We can introduce two states for the `Marker` component that can represent the depicted behavior above:
 
-     `hovered` will update the `x` property of the marker when the user hovers it using the mouse
-     `selected` will update the `x` property of the marker when the marker becomes an active one, meaning clicked by the user
+    * `hovered` - will update the `x` property of the marker when the user hovers it using the mouse
+
+    * `selected` - will update the `x` property of the marker when the marker becomes an active one, that is, when it is clicked by the user.
 
 
 .. code-block:: js
@@ -86,19 +87,19 @@ We can introduce two states for the `Marker` component that can represent the de
 
 So we have two states declared that represent the respective property changes based on the user's behavior. Each state is bound to a condition that is expressed in the `when` property.
 
-.. note:: For the `containsMouse` property of the `mouseArea` element, the `hoverEnabled` property should be set to true
+.. note:: For the `containsMouse` property of the `MouseArea` type, the `hoverEnabled` property must be set to `true`.
 
-The :qt:`Transition <qml-transition.html>` QML Element is used to define the behavior of the item when moving from one state to another, meaning we can define various animations on the properties that change when a state becomes active.
+The :qt5:`Transition <qtquick/qml-qtquick2-transition.html>` type is used to define the behavior of the item when moving from one state to another. That is, we can define various animations on the properties that change when a state becomes active.
 
-.. note:: The default state of an item is referred to as a an empty string, ("")
+.. note:: The default state of an item is an empty string, ("")
 
-While in the `MarkerPanel` component, we make sure to set the `active` property of the `Marker` item to true only when it is clicked as described in previous steps. Please check `MarkerPanel.qml` for more details.
+While in the `MarkerPanel` component, we must set the `active` property of the `Marker` item to `true` when it is clicked. Refer to `MarkerPanel.qml` for the updated code.
 
 
 Adding Transitions to PagePanel
 -------------------------------
 
-In the `PagePanel` component, we are using states to manage navigation between pages. Adding transitions comes naturally to mind. Since we simply the `opacity` property in each state, we can add `Transition` for all states that run a `NumberAnimation` on the opacity values for creating the fade-in and fade-out effect.
+In the `PagePanel` component, we are using states to manage navigation between pages. Adding transitions comes naturally to mind. As we change the `opacity` property in each state, we can add `Transition` for all states that run a `NumberAnimation` on the opacity values for creating the fade-in and fade-out effect.
 
 .. code-block:: js
 
diff --git a/desktop_devguide/chapter_06/index.rst b/desktop_devguide/chapter_06/index.rst
index ac6b46e..386d7a1 100644
--- a/desktop_devguide/chapter_06/index.rst
+++ b/desktop_devguide/chapter_06/index.rst
@@ -8,13 +8,12 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Further Improvements of the Application
-=======================================
+Further Improvements
+====================
 
-At this stage, we can consider the     NoteApp* features complete and the UI also matches *NoteApp*'s requirements. Nevertheless, there is always room for further improvements, little features so they are called that make the application more polished and ready for deployment.
+At this stage, we can consider that the NoteApp* features are complete and the UI also matches *NoteApp*'s requirements. Nevertheless, there is always room for further improvements, which could be minor but they make the application more polished and ready for deployment.
 
-In this chapter, we will go through some minor improvements that are implemented for     NoteApp*, but also suggest new ideas and features to be added.
-Certainly, we would like to encourage everyone to take the     NoteApp* code base and develop it further and perhaps redesign the entire UI and introduce new features.
+In this chapter, we will go through the minor improvements that are implemented for NoteApp*, but also suggest new ideas and features to be added. Certainly, we would like to encourage everyone to take the     NoteApp* code base and develop it further and perhaps redesign the entire UI and introduce new features.
 
 .. note::
 
@@ -23,9 +22,11 @@ Certainly, we would like to encourage everyone to take the     NoteApp* code bas
 
 Here is a list of major points covered in this chapter:
 
-     More Javascript used to increase functionality
-     Working with the `z` ordering of QML Items
-     Using custom local fonts for the application
+    * More Javascript used to increase functionality
+
+    * Working with the `z` ordering of QML Items
+
+    * Using custom local fonts for the application
 
 
 This chapter has the following steps:
diff --git a/desktop_devguide/chapter_06/src/notezapp/Marker.qml b/desktop_devguide/chapter_06/src/notezapp/Marker.qml
index 719818b..681b2a1 100644
--- a/desktop_devguide/chapter_06/src/notezapp/Marker.qml
+++ b/desktop_devguide/chapter_06/src/notezapp/Marker.qml
@@ -38,9 +38,9 @@
 
 // Marker.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
-// The Image element as top level is convenient
+// The Image type as top level is convenient
 // as the Marker component simply is a graphical
 // UI with a clicked() signal.
 Image {
@@ -103,7 +103,7 @@ Image {
         }
     ]
 
-    // creating a MouseArea element
+    // creating a MouseArea type
     // to intercept the mouse click
     MouseArea {
         id: mouseArea
diff --git a/desktop_devguide/chapter_06/src/notezapp/MarkerPanel.qml b/desktop_devguide/chapter_06/src/notezapp/MarkerPanel.qml
index 2dc2001..81c7553 100644
--- a/desktop_devguide/chapter_06/src/notezapp/MarkerPanel.qml
+++ b/desktop_devguide/chapter_06/src/notezapp/MarkerPanel.qml
@@ -38,7 +38,7 @@
 
 // MarkerPanel.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Item {
     id: root
diff --git a/desktop_devguide/chapter_06/src/notezapp/Note.qml b/desktop_devguide/chapter_06/src/notezapp/Note.qml
index f3fc087..db4052d 100644
--- a/desktop_devguide/chapter_06/src/notezapp/Note.qml
+++ b/desktop_devguide/chapter_06/src/notezapp/Note.qml
@@ -38,7 +38,7 @@
 
 // Note.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Item {
     id: root
diff --git a/desktop_devguide/chapter_06/src/notezapp/NoteToolbar.qml b/desktop_devguide/chapter_06/src/notezapp/NoteToolbar.qml
index aa90fc6..cdd5169 100644
--- a/desktop_devguide/chapter_06/src/notezapp/NoteToolbar.qml
+++ b/desktop_devguide/chapter_06/src/notezapp/NoteToolbar.qml
@@ -38,7 +38,7 @@
 
 // NoteToolbar.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 Item {
     id: root
@@ -57,12 +57,12 @@ Item {
     }
 
     // declaring a property alias to the
-    // drag property of MouseArea element
+    // drag property of MouseArea type
     property alias drag: mousearea.drag
 
     // this default property enables us to
     // create QML Items that will be automatically
-    // laid out in the Row element and considered as toolItems
+    // laid out in the Row type and considered as toolItems
     default property alias toolItems: layout.children
 
     MouseArea {
@@ -78,7 +78,7 @@ Item {
         onPressed: root.pressed()
     }
 
-    // using a Row element for laying out tool
+    // using a Row type for laying out tool
     // items to be added when using the NoteToolbar
     Row {
         id: layout
@@ -93,12 +93,12 @@ Item {
 
         spacing: 20
 
-        // the opacity depends if the mousearea elements
+        // the opacity depends if the mousearea types
         // has the cursor of the mouse.
         opacity: mousearea.containsMouse ? 1 : 0
 
-        // using the behavior element to specify the
-        // behavior of the layout element
+        // using the behavior type to specify the
+        // behavior of the layout type
         // when on the opacity changes.
         Behavior on opacity {
             // using NumberAnimation to animate
diff --git a/desktop_devguide/chapter_06/src/notezapp/Page.qml b/desktop_devguide/chapter_06/src/notezapp/Page.qml
index d2f42df..2aaf921 100644
--- a/desktop_devguide/chapter_06/src/notezapp/Page.qml
+++ b/desktop_devguide/chapter_06/src/notezapp/Page.qml
@@ -38,7 +38,7 @@
 
 // Page.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 import "noteDB.js" as NoteDB
 
 Item {
@@ -63,7 +63,7 @@ Item {
         Note { }
     }
 
-    // creating an Item element that will be
+    // creating an Item type that will be
     // used as a note container we anchor the container
     // to fill the parent as it will be used
     // later in the code to control the dragging
@@ -103,7 +103,7 @@ Item {
     }
 
     // a Javascript helper function for
-    // iterating through the children elements of the
+    // iterating through the children types of the
     // container item and calls destroy() for deleting them
     function clear() {
         for (var i=0; i<container.children.length; ++i) {
diff --git a/desktop_devguide/chapter_06/src/notezapp/PagePanel.qml b/desktop_devguide/chapter_06/src/notezapp/PagePanel.qml
index 0ce8ff2..924f3f6 100644
--- a/desktop_devguide/chapter_06/src/notezapp/PagePanel.qml
+++ b/desktop_devguide/chapter_06/src/notezapp/PagePanel.qml
@@ -38,7 +38,7 @@
 
 // PagePanel.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 import "noteDB.js" as NoteDB
 
 Item {
diff --git a/desktop_devguide/chapter_06/src/notezapp/Tool.qml b/desktop_devguide/chapter_06/src/notezapp/Tool.qml
index a0085e7..2bb5678 100644
--- a/desktop_devguide/chapter_06/src/notezapp/Tool.qml
+++ b/desktop_devguide/chapter_06/src/notezapp/Tool.qml
@@ -38,9 +38,9 @@
 
 // Tool.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 
-// Use Image as the top level element
+// Use Image as the top level type
 Image {
     id: root
 
diff --git a/desktop_devguide/chapter_06/src/notezapp/main.qml b/desktop_devguide/chapter_06/src/notezapp/main.qml
index d7d204b..ae70d95 100644
--- a/desktop_devguide/chapter_06/src/notezapp/main.qml
+++ b/desktop_devguide/chapter_06/src/notezapp/main.qml
@@ -38,7 +38,7 @@
 
 // main.qml
 
-import QtQuick 1.1
+import QtQuick 2.0
 import "noteDB.js" as NoteDB
 
 Rectangle {
@@ -103,7 +103,7 @@ Rectangle {
         border { color: "#600"; width: 4 }
     }
 
-    // using a Column element to layout the
+    // using a Column type to layout the
     // Tool items vertically
     Column {
         id: toolbar
diff --git a/desktop_devguide/chapter_06/src/notezapp/noteDB.js b/desktop_devguide/chapter_06/src/notezapp/noteDB.js
index 9f31b65..b2b91f8 100644
--- a/desktop_devguide/chapter_06/src/notezapp/noteDB.js
+++ b/desktop_devguide/chapter_06/src/notezapp/noteDB.js
@@ -40,14 +40,14 @@
 
 //making the nodeDB.js a stateless library
 .pragma library
-
+.import QtQuick.LocalStorage 2.0 as Sql
 // declaring a global variable for storing the database instance
 var _db
 
 //
 function openDB() {
     print("noteDB.createDB()")
-    _db = openDatabaseSync("StickyNotesDB","1.0","The stickynotes Database",1000000);
+    _db = Sql.LocalStorage.openDatabaseSync("StickyNotesDB","1.0","The stickynotes Database",1000000);
     createNoteTable();
 }
 
diff --git a/desktop_devguide/chapter_06/step_1.rst b/desktop_devguide/chapter_06/step_1.rst
index 053aa0b..ce17453 100644
--- a/desktop_devguide/chapter_06/step_1.rst
+++ b/desktop_devguide/chapter_06/step_1.rst
@@ -8,21 +8,21 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Using Javascript to Enhance the Note Item Functionality
-=======================================================
+Enhancing the Note Item Functionality
+=====================================
 
 A nifty functionality for the `Note` items would be to have the note grow as more text is entered. Let's say for simplicity reasons that the note will grow vertically as more text is entered while it wraps the text to fit the width.
 
-The :qt:`Text <qml-text.html>` element has a :qt:`paintedHeight <qml-text.html#paintedHeight-prop>` property that gives us the actual height of the text painted on the screen. Based on this value, we can increase or decrease the height of the note itself.
+The :qt5:`Text <qtquick/qml-qtquick2-text.html>` type has a :qt5:`paintedHeight <qtquick/qml-qtquick2-text.html#paintedHeight-prop>` property that gives us the actual height of the text painted on the screen. Based on this value, we can increase or decrease the height of the note itself.
 
-First let's define a Javascript helper function that would calculate the proper value for the :qt:`height <qml-item.html#height-prop>` property of the `Item` element as the top-level element for the `Note` component.
+First, let's define a JavaScript helper function that calculates the value for the :qt5:`height <qtquick/qml-qtquick2-item.html#height-prop>` property of the `Item` type, which is the top-level type for the `Note` component.
 
 .. code-block:: js
 
     // Note.qml
 
     ...
-    // javascript helper function that calculates the height of
+    // JavaScript helper function that calculates the height of
     // the note as more text is entered or removed.
     function updateNoteHeight() {
         // a note should have a minimum height
@@ -36,7 +36,7 @@ First let's define a Javascript helper function that would calculate the proper
     }
     ...
 
-Since the `updateNoteHeight()` function updates the `height` property of the `root` element based on the :qt:`paintedHeight <qml-text.html#paintedHeight-prop>` property of `editArea`, we need to call this function upon a change on `paintedHeight`.
+As the `updateNoteHeight()` function updates the `height` property of the `root` based on the :qt5:`paintedHeight <qtquick/qml-qtquick2-text.html#paintedHeight-prop>` property of `editArea`, we need to call this function upon a change on `paintedHeight`.
 
 .. code-block:: js
 
@@ -56,7 +56,7 @@ Since the `updateNoteHeight()` function updates the `height` property of the `ro
 .. note:: Every property has a notifier signal that is emitted each time the property changes
 
 
-The `updateNoteHeight()` Javascript function changes the `height` property so we can define a behavior for this using the :qt:`Behavior <qml-behavior.html>` element.
+The `updateNoteHeight()` JavaScript function changes the `height` property so we can define a behavior for this using the :qt5:`Behavior <qtquick/qml-qtquick2-behavior.html>` type.
 
 .. code-block:: js
 
@@ -71,4 +71,4 @@ The `updateNoteHeight()` Javascript function changes the `height` property so we
 
 .. rubric:: What's Next?
 
-The next step will show how to use the `z` property of the `Item` element to properly order the notes.
+The next step will show how to use the `z` property of the `Item` type to properly order the notes.
diff --git a/desktop_devguide/chapter_06/step_2.rst b/desktop_devguide/chapter_06/step_2.rst
index 1c1d5a6..ad4aa00 100644
--- a/desktop_devguide/chapter_06/step_2.rst
+++ b/desktop_devguide/chapter_06/step_2.rst
@@ -8,13 +8,13 @@
     http://creativecommons.org/licenses/by-sa/2.5/legalcode .
     ---------------------------------------------------------------------------
 
-Ordering Notes Upon User Interaction
-====================================
+Ordering Notes
+==============
 
-Notes within a `Page` are not aware which note the user is currently working on. By default, all `Note` items created have the same default value for the :qt:`z <qml-item.html#z-prop>` property and in this case QML creates a default ordering stack of items based on which item was created first.
+Notes within a `Page` are not aware which note the user is currently working on. By default, all `Note` items created have the same default value for the :qt5:`z <qtquick/qml-qtquick2-item.html#z-prop>` property and in this case QML creates a default ordering stack of items based on which item was created first.
 
 The desired behavior would be to change the order of the notes upon a user's interaction.
-When the user clicks on the note toolbar or starts editing the note, then this note should come up and not be under other notes, hence the `z` value should be higher than the rest of the notes.
+When the user clicks on the note toolbar or starts editing the note, the current note should come up and not be under other notes. This is possible by changing the `z` value to be higher than the rest of the notes.
 
 .. code-block:: js
 
@@ -27,7 +27,7 @@ When the user clicks on the note toolbar or starts editing the note, then this n
         ...
     }
 
-The :qt:`activeFocus <qml-item.html#activeFocus-prop>` property becomes true when the `editArea` element has input focus. So, it would be safe to make the `z` property of the `root` element dependent on the `activeFocus` of the `editArea`. However, we need to make sure that the `editArea` element has input focus even when the toolbar is clicked by the user. Let's define a `pressed()` signal in the `NoteToolbar` component that is emitted upon a mouse press.
+The :qt5:`activeFocus <qtquick/qml-qtquick2-item.html#activeFocus-prop>` property becomes true when `editArea` has input focus. So, it would be safe to make the `z` property of the `root` dependent on the `activeFocus` of the `editArea`. However, we need to make sure that the `editArea` has input focus even when the toolbar is clicked by the user. Let's define a `pressed()` signal in the `NoteToolbar` component that is emitted on a mouse press.
 
 .. code-block:: js
 
@@ -46,7 +46,7 @@ The :qt:`activeFocus <qml-item.html#activeFocus-prop>` property becomes true whe
     }
     ...
 
-Hence, on the :qt:`onPressed <qml-mousearea.html#onPressed-signal>` signal handler in the `mousearea` element, we emit the `pressed()` signal of the `root` element of `NoteToolbar`.
+In the :qt5:`onPressed <qtquick/qml-qtquick2-mousearea.html#onPressed-signal>` signal handler in the `MouseArea` type, we emit the `pressed()` signal of the `root` of `NoteToolbar`.
 
 The `pressed()` signal of the `NoteToolbar` component is handled in the `Note` component.
 
@@ -64,7 +64,7 @@ The `pressed()` signal of the `NoteToolbar` component is handled in the `Note` c
         ...
     }
 
-In the code above, we set the :qt:`focus <qml-item.html#focus-prop>` property of the `editArea` element to `true` so that the `editArea` will receive the input focus, meaning that the `activeFocus` property becomes true, therefore the note item will update its `z` value.
+In the code above, we set the :qt5:`focus <qtquick/qml-qtquick2-item.html#focus-prop>` property of the `editArea` item to `true`, so that the `editArea` will receive the input focus. That is, the `activeFocus` property becomes true, which triggers its `z` property value change.
 
 
 .. rubric:: What's Next?
diff --git a/desktop_devguide/chapter_06/step_3.rst b/desktop_devguide/chapter_06/step_3.rst
index 4831689..c6611c7 100644
--- a/desktop_devguide/chapter_06/step_3.rst
+++ b/desktop_devguide/chapter_06/step_3.rst
@@ -13,8 +13,7 @@ Loading a Custom Font
 
 It is a very common approach in modern applications to use and deploy custom fonts and not depend on the system fonts. For `NoteApp`, we would like to do the same and we will use what QML offers for this.
 
-The :qt:`FontLoader <qml-fontloader.html>` QML element enables you to load fonts by name or URL path. As the loaded font could be widely used in the entire application, loading the font in the `main.qml` file and using it in the rest of the components would
-be the recommended approach.
+The :qt5:`FontLoader <qtquick/qml-qtquick2-fontloader.html>` QML type enables you to load fonts by name or URL path. As the loaded font could be widely used in the entire application, we recommend loading the font in the `main.qml` file and use it in the rest of the components.
 
 .. code-block:: js
 
@@ -37,7 +36,7 @@ be the recommended approach.
         ...
     }
 
-So we have created a `webfont` property for the `window` item. This property can be safely used in the rest of the components and we would like to use it in the `Note` for setting the font of the `editArea` to the newly loaded font.
+So we have created a `webfont` property for the `window` item. This property can be safely used in the rest of the components, so let us use it for the `editArea` in the `Note` component.
 
 .. code-block:: js
 
@@ -51,8 +50,8 @@ So we have created a `webfont` property for the `window` item. This property can
         ...
     }
 
-To set the font for `editArea`, we use the :qt:`font.family <qml-text.html#font.family-prop>` property. From the `window` root element, we use its `webfont` property to get the font name to be set.
+To set the font for `editArea`, we use the :qt5:`font.family <qtquick/qml-qtquick2-text.html#font.family-prop>` property. From the `window`, we use its `webfont` property to get the font name to be set.
 
 .. rubric:: What's Next?
 
-The next step will take you step by step through the details of making     NoteApp* ready for deployment.
+The next step will take you through the details of making NoteApp* ready for deployment.
diff --git a/desktop_devguide/chapter_07/index.rst b/desktop_devguide/chapter_07/index.rst
index dcde192..b3bb036 100644
--- a/desktop_devguide/chapter_07/index.rst
+++ b/desktop_devguide/chapter_07/index.rst
@@ -11,11 +11,11 @@
 Deploying the NoteApp Application
 =================================
 
-We have reached the point where we would to make the application available and deployable for a typical desktop environment. As described in the first chapters, we have used a Qt Quick UI project in Qt Creator to develop the     NoteApp* application. This means that `qmlviewer` is used to load the `main.qml` file, and therefore, have *NoteApp* running.
+We have reached the point where we would like to make the application available and deployable for a typical desktop environment. As described in the first chapters, we have used a Qt Quick UI project in Qt Creator to develop the NoteApp* application. This means that `qmlscene` is used to load the `main.qml` file, and therefore, have *NoteApp* running.
 
-At first, the simplest way of making     NoteApp* available is to create a package that bundles all the qml files, `qmlviewer` and a simple script that loads the `main.qml` file using `qmlviewer`. You need to refer to the documentation of each desktop platform on how to create small script. For instance, under a Linux platform, you could use a small `bash` shell script for this, while for Windows a simple batch file. This approach works well as being so straightforward, but it could be the case that you would not want to ship the source code because your application is using proprietary code. The application should be shipped in a binary format, in which all the qml files are bundled. This could help make the installation process and the user experience even more pleasant.
+At first, the simplest way of making NoteApp* available is to create a package that bundles all the qml files, `qmlscene` and a simple script that loads the `main.qml` file using `qmlscene`. You need to refer to the documentation of each desktop platform on how to create small script. For instance, under a Linux platform, you could use a small `bash` shell script for this, while for Windows a simple batch file. This approach works well as being so straightforward, but it could be the case that you would not want to ship the source code because your application is using proprietary code. The application should be shipped in a binary format, in which all the qml files are bundled. This could help make the installation process and the user experience even more pleasant.
 
-Hence, we need to create an executable file for     NoteApp* that should be fairly simple to install and use. In this chapter, you will you see how to create a Qt Quick application that bundles qml files and images in an executable binary file. Moreover, we will explore how to use the Qt Resource System with QML.
+Hence, we need to create an executable file for NoteApp* that should be fairly simple to install and use. In this chapter, you will you see how to create a Qt Quick application that bundles qml files and images in an executable binary file. Moreover, we will explore how to use the Qt Resource System with QML.
 
 .. note::
 
diff --git a/desktop_devguide/chapter_07/src/notezapp/noteapp.desktop b/desktop_devguide/chapter_07/src/notezapp/noteapp.desktop
deleted file mode 100644
index e06338c..0000000
--- a/desktop_devguide/chapter_07/src/notezapp/noteapp.desktop
+++ /dev/null
@@ -1,11 +0,0 @@
-[Desktop Entry]
-Encoding=UTF-8
-Version=1.0
-Type=Application
-Terminal=false
-Name=noteapp
-Exec=/opt/noteapp/bin/noteapp
-Icon=noteapp64
-X-Window-Icon=
-X-HildonDesk-ShowInToolbar=true
-X-Osso-Type=application/x-executable
diff --git a/desktop_devguide/chapter_07/src/notezapp/noteapp_harmattan.desktop b/desktop_devguide/chapter_07/src/notezapp/noteapp_harmattan.desktop
deleted file mode 100644
index bf9e5eb..0000000
--- a/desktop_devguide/chapter_07/src/notezapp/noteapp_harmattan.desktop
+++ /dev/null
@@ -1,11 +0,0 @@
-[Desktop Entry]
-Encoding=UTF-8
-Version=1.0
-Type=Application
-Terminal=false
-Name=noteapp
-Exec=/usr/bin/single-instance /opt/noteapp/bin/noteapp
-Icon=/usr/share/icons/hicolor/80x80/apps/noteapp80.png
-X-Window-Icon=
-X-HildonDesk-ShowInToolbar=true
-X-Osso-Type=application/x-executable
diff --git a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Marker.qml b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Marker.qml
index e94407c..157c482 100644
--- a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Marker.qml
+++ b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Marker.qml
@@ -36,10 +36,10 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 // Marker.qml
-// The Image element as top level is convenient as the Marker component
+// The Image type as top level is convenient as the Marker component
 // simply is a graphical UI with a clicked() signal.
 Image {
     id: root
@@ -89,7 +89,7 @@ Image {
         }
     ]
 
-    // creating a MouseArea element to intercept the mouse click
+    // creating a MouseArea type to intercept the mouse click
     MouseArea {
         id: mouseArea
         anchors.fill: parent
diff --git a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/MarkerPanel.qml b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/MarkerPanel.qml
index 8885083..a645f24 100644
--- a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/MarkerPanel.qml
+++ b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/MarkerPanel.qml
@@ -36,7 +36,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 // MarkerPanel.qml
 
diff --git a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Note.qml b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Note.qml
index 75235a5..3a8442f 100644
--- a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Note.qml
+++ b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Note.qml
@@ -36,7 +36,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 // Note.qml
 Item {
@@ -105,7 +105,7 @@ Item {
         onPaintedHeightChanged: updateNoteHeight()
     }
 
-    // defining a behavior when the height property changes for root element
+    // defining a behavior when the height property changes for root type
     Behavior on height { NumberAnimation {} }
 
     // javascript helper function that calculates the height of the note
diff --git a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/NoteToolbar.qml b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/NoteToolbar.qml
index b8bf590..082b2db 100644
--- a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/NoteToolbar.qml
+++ b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/NoteToolbar.qml
@@ -36,7 +36,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 // NoteToolbar.qml
 
@@ -55,11 +55,11 @@ Item {
         border.right: 10; border.bottom: 10
     }
 
-    //declaring a property alias to the drag property of MouseArea element
+    //declaring a property alias to the drag property of MouseArea type
     property alias drag: mousearea.drag
 
     //this default property enables us to create QML Items that will be automatically
-    //laid out in the Row element and considered as toolItems
+    //laid out in the Row type and considered as toolItems
     default property alias toolItems: layout.children
 
     MouseArea {
@@ -74,7 +74,7 @@ Item {
         onPressed: root.pressed()
     }
 
-    //using a Row element for laying out tool items to be added when using the NoteToolbar
+    //using a Row type for laying out tool items to be added when using the NoteToolbar
     Row {
         id: layout
         layoutDirection: Qt.RightToLeft
@@ -83,10 +83,10 @@ Item {
         }
         spacing: 20
 
-        //the opacity depends if the mousearea elements has the cursor of the mouse.
+        //the opacity depends if the mousearea types has the cursor of the mouse.
         opacity: mousearea.containsMouse ? 1 : 0
 
-        //using the behavior element to specify the behavior of the layout element
+        //using the behavior type to specify the behavior of the layout type
         //when on the opacity changes.
         Behavior on opacity {
             //Using NumberAnimation to animate the opacity value in a duration of 350 ms
diff --git a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Page.qml b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Page.qml
index 482244b..0b9c2ef 100644
--- a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Page.qml
+++ b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Page.qml
@@ -36,7 +36,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 import "noteDB.js" as NoteDB
 
@@ -64,7 +64,7 @@ Item {
         Note { }
     }
 
-    // creting an Item element that will be used as a note container
+    // creting an Item type that will be used as a note container
     // we anchor the container to fill the parent as it will be used
     // later in the code to control the dragging area for notes
     Item { id: container; anchors.fill: parent }
@@ -99,7 +99,7 @@ Item {
     }
 
     // a Javascript helper function for iterating through
-    // the children elements of the container item
+    // the children types of the container item
     // and calls destroy() for deleting them
     function clear() {
         for (var i=0; i<container.children.length; ++i) {
diff --git a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/PagePanel.qml b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/PagePanel.qml
index e495cb2..d8c4908 100644
--- a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/PagePanel.qml
+++ b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/PagePanel.qml
@@ -36,7 +36,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 import "noteDB.js" as NoteDB
 
 // PagePane.qml
diff --git a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Tool.qml b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Tool.qml
index c89a87e..e439418 100644
--- a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Tool.qml
+++ b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/Tool.qml
@@ -36,18 +36,18 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 
 // Tool.qml
 
-// Use Image as the top level element
+// Use Image as the top level type
 Image {
     id: root
 
     //defining the clicked signal
     signal clicked()
 
-    //using a MouseArea element to capture the mouse click of the user
+    //using a MouseArea type to capture the mouse click of the user
     MouseArea {
         anchors.fill: parent
         onClicked: root.clicked()
diff --git a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/main.qml b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/main.qml
index 35bc299..eb6e9b9 100644
--- a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/main.qml
+++ b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/main.qml
@@ -36,7 +36,7 @@
 **
 ****************************************************************************/
 
-import QtQuick 1.1
+import QtQuick 2.0
 import "noteDB.js" as NoteDB
 
 
@@ -95,7 +95,7 @@ Rectangle {
     }
 
     // the toolbar -
-    // using a Column element to layout the Tool items vertically
+    // using a Column type to layout the Tool items vertically
     Column {
         id: toolbar
         spacing: 16
diff --git a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/noteDB.js b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/noteDB.js
index 9f31b65..b2b91f8 100644
--- a/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/noteDB.js
+++ b/desktop_devguide/chapter_07/src/notezapp/qml/noteapp/noteDB.js
@@ -40,14 +40,14 @@
 
 //making the nodeDB.js a stateless library
 .pragma library
-
+.import QtQuick.LocalStorage 2.0 as Sql
 // declaring a global variable for storing the database instance
 var _db
 
 //
 function openDB() {
     print("noteDB.createDB()")
-    _db = openDatabaseSync("StickyNotesDB","1.0","The stickynotes Database",1000000);
+    _db = Sql.LocalStorage.openDatabaseSync("StickyNotesDB","1.0","The stickynotes Database",1000000);
     createNoteTable();
 }
 
diff --git a/desktop_devguide/chapter_07/step_1.rst b/desktop_devguide/chapter_07/step_1.rst
index ba8c557..f36af52 100644
--- a/desktop_devguide/chapter_07/step_1.rst
+++ b/desktop_devguide/chapter_07/step_1.rst
@@ -11,53 +11,50 @@
 Creating the NoteApp Qt Application
 ===================================
 
-The goal is to create a single executable     NoteApp* binary file that the user will just run to get *NoteApp* loaded.
+The goal is to create a single executable NoteApp* binary file that the user will run to get *NoteApp* loaded.
 
 Let's see how we can use Qt Creator for this.
 
-
 Creating a Qt Quick Application
 -------------------------------
 
-First we need to create a :creator:`Qt Quick Application <quick-projects.html#creating-qt-quick-applications>` using Qt Creator and make sure that we have selected     *Built-in elements only (for all platforms)** in the Qt Quick Application wizard. Let's name the application *noteapp*.
+First we need to create a :creator:`Qt Quick Application <quick-projects.html#creating-qt-quick-applications>` using Qt Creator and make sure that we have selected *Built-in elements only (for all platforms)** in the Qt Quick Application wizard. Let's name the application *noteapp*.
 
-So now we have a newly created project from the wizard and we notice that a     qmlapplicationviewer* project is generated for us. The generated *qmlapplicationviewer* project is a basic 'template' application that loads QML files.  This application, as being a very generic one for deploying Qt Quick applications across devices and targets, includes several platform specific code for each of those deployment targets. We will not go through these specific parts of the code because it doesn't fit the purpose of this guide.
+So now we have a newly created project from the wizard and we notice that a *qtquick2applicationviewer* project is generated for us. The generated *qtquick2applicationviewer* project is a basic 'template' application that loads QML files.  This application, as being a very generic one for deploying Qt Quick applications across devices and targets, includes several platform-specific code for each of those deployment targets. We will not go through these specific parts of the code because it doesn't fit the purpose of this guide.
 
-Nevertheless, there are certain peculiarities of the     qmlapplicationviewer* that somewhat limit us to achieve what we want. The application expects the developer to ship the QML files along with with the executable binary. Using the Qt Resource System becomes impossible, but you will see how to overcome this problem as we proceed.
+Nevertheless, there are certain peculiarities of the qtquick2applicationviewer* that somewhat limit us to achieve what we want. The application expects the developer to ship the QML files along with with the executable binary. Using the Qt Resource System becomes impossible, but you will see how to overcome this problem as we proceed.
 
-For the     noteapp* project, there is just one CPP source file, `main.cpp`. In the `main.cpp` file, you will see how the `viewer` object, the `QmlApplicationViewer` class, is used to load the `main.qml` file by calling the `QmlApplicationViewer::setMainQmlFile()` function.
+For the noteapp* project, there is one source file, `main.cpp`. In the `main.cpp` file, you will see how the `viewer` object, the `QtQuick2ApplicationViewer` class, is used to load the `main.qml` file by calling the `QtQuick2ApplicationViewer::setMainQmlFile()` function.
 
 
 .. code-block:: cpp
 
   // main.cpp
   ...
-  Q_DECL_EXPORT int main(int argc, char     argv[])
+  int main(int argc, char *argv[])
   {
-      QScopedPointer<QApplication> app(createApplication(argc, argv));
-      QScopedPointer<QmlApplicationViewer> viewer(
-                  QmlApplicationViewer::create());
+    QGuiApplication app(argc, argv);
 
-      viewer->setOrientation(QmlApplicationViewer::ScreenOrientationAuto);
-      viewer->setMainQmlFile("qml/noteapp/main.qml");
-      viewer->showExpanded();
+    QtQuick2ApplicationViewer viewer;
+    viewer.setMainQmlFile(QStringLiteral("qml/noteapp/main.qml"));
+    viewer.showExpanded();
 
-      return app->exec();
+    return app.exec();
   }
 
 
-Note, there is a basic `main.qml` file generated by the Qt Quick Application wizard which will be replaced by the `main.qml` file we have created for     NoteApp*.
+Note, there is a basic `main.qml` file generated by the Qt Quick Application wizard which will be replaced by the `main.qml` file we have created for NoteApp*.
 
-The folder structure of the generated     noteapp* project is very straightforward to understand.
+The folder structure of the generated noteapp* project is very straightforward to understand.
 
      noteapp - root folder of the *noteapp* project
 
-       qml - this folder contains all the QML files
-       qmlapplicationviwer - the generated application used for loading QML files
+      * qml - this folder contains all the QML files
+      * qtquick2applicationviewer - the generated application used for loading QML files
        noteapp.pro - the project file
-       main.cpp - the C++ file where a Qt Application is created that will produce a binary file for us
+      * main.cpp - the C++ file where a Qt Application is created
 
-We need to copy our QML files including the `fonts` and `images` directories in the `qml` directory of the newly created     noteapp* project. Additionally, we need to import these files into the project so that we will be able to work with them in Qt Creator.
+We need to copy our QML files including the `fonts` and `images` directories in the `qml` directory of the newly created noteapp* project. Qt Creator identifies changes to the project folder and adds the new files to the project view. If it doesn't, right-click on the project and choose *Add Existing Files* to add the new files.
 
 .. image:: img/importqmlfiles.png
     :scale: 80%
@@ -65,7 +62,7 @@ We need to copy our QML files including the `fonts` and `images` directories in
 
 .. note:: Make sure to add all existing files including images called from the `nodeDDB.js` file
 
-At this point, let's start to build and run the project and see if everything has gone well with the project creation. Before building the     noteapp* project, let's make sure we have the right settings in place for our project. Please refer to :creator:`Configure Projects <creator-configuring-projects.html>` in Qt Creator documentation.
+At this point, let's start to build and run the project and see if everything has gone well with the project creation. Before building the noteapp* project, let's make sure we have the right settings in place for our project. Refer to the :creator:`Configure Projects <creator-configuring-projects.html>` section in Qt Creator documentation.
 
 Once the application is successfully built, an executable binary file called `noteapp` should be produced in the root folder of the project. If you have Qt configured properly for your system, you'll be able run the file by clicking on it.
 
@@ -86,7 +83,7 @@ We have created an executable that loads the QML file for the application to run
 
 Seems that it is expected to actually ship the QML files along with the executable file, but this is not what we would like to achieve.
 
-Qt provides a quite intuitive :qt:`Resource System <resources.html>` that works seamlessly with QML. We need to create a resource file, `noteapp.qrc` for the     noteapp* root project so that we can add our QML and image files in it. Please refer to the :qt:`Creating a Resource File <creator-writing-program.html#creating-a-resource-file>` in Qt Creator documentation for detailed steps.
+Qt provides a quite intuitive :qt5:`Resource System <qtcore/resources.html>` that works seamlessly with QML. We need to create a resource file, `noteapp.qrc` for the noteapp* root project so that we can add our QML and image files to it. Refer to the :creator:`Creating a Resource File <creator-writing-program.html#creating-a-resource-file>` in Qt Creator documentation for detailed steps.
 
 .. image:: img/resourcefile.png
     :scale: 100%
@@ -105,51 +102,37 @@ First we comment out the first lines in the `noteapp.pro`:
 
   ....
 
-In addition to that, we can remove the following lines from the `noteapp.pro` file since they are Symbian platform related.
-
-.. code-block:: bash
-
-  ...
-  symbian:TARGET.UID3 = 0xE68D5D88
-  ...
-  # Allow network access on Symbian
-  symbian:TARGET.CAPABILITY += NetworkServices
-  ...
-
-
-In the `main.cpp` file, we see the `QmlApplicationViewer::setMainQmlFile()` function being called with the relative path to the `main.qml` file.
+In the `main.cpp` file, we see the `QtQuick2ApplicationViewer::setMainQmlFile()` function being called with the relative path to the `main.qml` file.
 
 .. code-block:: cpp
 
-  // qmlapplicationviewer.cpp
+  // qtquick2applicationviewer.cpp
   ...
-  void QmlApplicationViewer::setMainQmlFile(const QString &file)
+  void QtQuick2ApplicationViewer::setMainQmlFile(const QString &file)
   {
-      d->mainQmlFile = QmlApplicationViewerPrivate::adjustPath(file);
+      d->mainQmlFile = QtQuick2ApplicationViewerPrivate::adjustPath(file);
       setSource(QUrl::fromLocalFile(d->mainQmlFile));
   }
   ...
 
 
-The `QmlApplicationViewer` class inherits :qt:`QDeclarativeView <qdeclarativeView.html>`, which is a convenient class for loading and displaying QML files. The `QmlApplicationViewer::setMainQmlFile()` function is not optimized for using resources because it adjusts the path of the QML file before calling the :qt:`setSource() <qdeclarativeview.html#source-prop>` function.
+The `QtQuick2ApplicationViewer` class inherits :qt5:`QQuickView <qtquick/qquickview.html>`, which is a convenient class for loading and displaying QML files. The `QtQuick2ApplicationViewer::setMainQmlFile()` function is not optimized for using resources because it adjusts the path of the QML file before calling the :qt5:`setSource() <qtquick/qquickview.html#source-prop>` function.
 
-The simplest approach to overcome this would be to directly call :qt:`setSource() <qdeclarativeview.html#source-prop>` on the  `viewer` object in the `main.cpp` file, but this time we pass the `main.qml` as part of the resource file.
+The simplest approach to overcome this would be to directly call :qt5:`setSource() <qtquick/qquickview.html#source-prop>` on the  `viewer` object in the `main.cpp` file, but this time we pass the `main.qml` as part of the resource file.
 
 .. code-block:: cpp
 
   // main.cpp
   ...
-  Q_DECL_EXPORT int main(int argc, char     argv[])
+  int main(int argc, char *argv[])
   {
-      QScopedPointer<QApplication> app(createApplication(argc, argv));
-      QScopedPointer<QmlApplicationViewer> viewer(
-                  QmlApplicationViewer::create());
+    QGuiApplication app(argc, argv);
 
-      viewer->setOrientation(QmlApplicationViewer::ScreenOrientationAuto);
-      viewer->setSource(QUrl("qrc:/main.qml"));
-      viewer->showExpanded();
+    QtQuick2ApplicationViewer viewer;
+    viewer.setMainQmlFile(QStringLiteral("qml/noteapp/main.qml"));
+    viewer.showExpanded();
 
-      return app->exec();
+    return app.exec();
   }
 
 There is no other change to be done in the QML files where we use the image files and the font file since the path of the files is a relative one, which will point to the resource internal filesystem. So now we can build the project in Qt Creator that will produce us a binary executable file that bundles all the QML files, images and the font.
@@ -164,7 +147,7 @@ A graphical enhancement that is highly recommended is to set an icon for the app
 
 Inside the     noteapp* folder, you may have noticed a few *PNG* files and one *SVG* file by now. These image files will be used to set the icon for the application depending on the icon size since we can have 64x64 or 80x80 icons or a vectorized one.
 
-For more details concerning how these icon files are deployed on various platforms, you need to take a close look at the `qmlapplicationviewer.pri` file. You can find find detailed information on application icons in the :qt:`How to Set the Application Icon <appicon.html>` Qt reference documentation.
+For more details concerning how these icon files are deployed on various platforms, you need to take a close look at the `qtquick2applicationviewer.pri` file. You can find find detailed information on application icons in the :qt:`How to Set the Application Icon <appicon.html>` Qt reference documentation.
 
 We need to call the :qt:`setWindowIcon() <qwidget.html#windowIcon-prop>` function on the `viewer` in order to set the icon for the application window.
 
@@ -173,8 +156,8 @@ We need to call the :qt:`setWindowIcon() <qwidget.html#windowIcon-prop>` functio
   // main.cpp
   ...
   QScopedPointer<QApplication> app(createApplication(argc, argv));
-  QScopedPointer<QmlApplicationViewer> viewer(
-              QmlApplicationViewer::create());
+  QScopedPointer<QtQuick2ApplicationViewer> viewer(
+              QtQuick2ApplicationViewer::create());
 
   viewer->setWindowIcon(QIcon("noteapp80.png"));
   ...
@@ -187,15 +170,15 @@ We need a default window-title for our application and we will use the :qt:`setW
   ...
 
   QScopedPointer<QApplication> app(createApplication(argc, argv));
-  QScopedPointer<QmlApplicationViewer> viewer(
-              QmlApplicationViewer::create());
+  QScopedPointer<QtQuick2ApplicationViewer> viewer(
+              QtQuick2ApplicationViewer::create());
 
   viewer->setWindowIcon(QIcon("noteapp80.png"));
   viewer->setWindowTitle(QString("Keep Your Notes with NoteApp!"));
   ...
 
 
-The     NoteApp* is now ready to be shipped and deployed onto various desktop platforms.
+The NoteApp* is now ready to be shipped and deployed onto various desktop platforms.
 
 Deploying NoteApp
 -----------------
diff --git a/desktop_devguide/chapter_08/index.rst b/desktop_devguide/chapter_08/index.rst
index a2c8aab..d024059 100644
--- a/desktop_devguide/chapter_08/index.rst
+++ b/desktop_devguide/chapter_08/index.rst
@@ -11,18 +11,20 @@
 Lesson Learned and Further Reading
 ==================================
 
-This guide has shown you how to create an application using Qt Quick and how to make it ready for deployment onto a desktop environment.We have seen how to develop the     NoteApp* application step by step and we have learned various aspects of QML language and its potential for developing modern fluid UIs while keeping the code clean, simple and applying various programming techniques.
+This guide has shown you how to create an application using Qt Quick and how to make it ready for deployment onto a desktop environment. We have seen how to develop the NoteApp* application step-by-step and we have learned various aspects of the QML language and its potential for developing modern fluid UIs while keeping the code clean, simple by applying various programming techniques.
 
-We have learned some of the best practices of using various QML Elements and covered some interesting topics such as:
+We have learned some of the best practices of using various QML types and covered some interesting topics such as:
 
-     Animations and States
-     Using Javascript to enhance functionality
-     Dynamic QML object management
-     Local Database storage
-     Making the application ready to deploy.
+    * Animations and States
 
-By now, you should have the necessary knowledge and confidence to further enhance     NoteApp* with features and UI improvements and explore more features of QML and Qt Quick that we haven't had a chance to cover in this guide.
+    * Using JavaScript to enhance functionality
 
-Qt Quick is a fast growing technology being adopted by various software development industries and areas so it would be quite helpful to refer to the Qt Documentation page for new upcoming features.
+    * Dynamic QML object management
 
-For any comments, questions related to this guide, please feel free to contact us!
+    * Local database storage
+
+    * Making the application ready to deploy.
+
+By now, you should have the necessary knowledge and confidence to further enhance NoteApp* with features and UI improvements, and explore more features of QML and Qt Quick that we haven't had a chance to cover in this guide.
+
+Qt Quick is a fast growing technology that is being adopted by various software development industries and areas, so it would be helpful to refer to the Qt Documentation page for latest update about this technology.
diff --git a/desktop_devguide/conf.py b/desktop_devguide/conf.py
index 1176ef3..ca0587d 100644
--- a/desktop_devguide/conf.py
+++ b/desktop_devguide/conf.py
@@ -46,7 +46,7 @@ htmlhelp_basename = 'QtQuickApplicationGuide4Desktop'
 # (source start file, target name, title, author, documentclass [howto/manual]).
 latex_documents = [
   ('index', 'QtQuickApplicationGuide4Desktop.tex', u'Qt Quick Application Developer Guide for Desktop',
-   u'Nokia, http://qt.nokia.com/learning', 'manual'),
+   u'Digia, http://qt.digia.com/Product/Learning/', 'manual'),
 ]
 
 
diff --git a/desktop_devguide/index.rst b/desktop_devguide/index.rst
index 6531e6f..2b0e285 100644
--- a/desktop_devguide/index.rst
+++ b/desktop_devguide/index.rst
@@ -13,7 +13,7 @@ Qt Quick Application Developer Guide for Desktop
 
 Let's learn by example!
 
-The goal of this guide is to make you familiar with best programming practices using Qt Quick for building applications with QML. A prerequisite to this guide is to have a solid understanding of the QML language and also use the Qt Quick Application Development Primer as your first guide on how to use Qt Quick for application development. Throughout this guide, we’ll walk you through various aspects and best practices of application development with QML and how to deploy the application to a typical Desktop environment. References to other information sources are provided to make it easy for you to deepen your understanding of QML programming.
+The goal of this guide is to make you familiar with best programming practices using Qt Quick for building applications with QML. A prerequisite to this guide is to have a solid understanding of the QML language, so do read :qt5:about it<qtquick/qtquick-applicationdevelopers.html> to find out what it offers. Throughout this guide, we’ll walk you through various aspects and best practices of application development with QML and how to deploy the application to a typical Desktop environment. References to other information sources are provided to make it easy for you to deepen your understanding of QML programming.
 
 .. toctree::
    :maxdepth: 2
author	Venugopal Shivashankar <venugopal.shivashankar@digia.com>	2013-02-15 18:13:18 +0100
committer	Venugopal Shivashankar <venugopal.shivashankar@digia.com>	2013-02-27 13:42:12 +0100
commit	625972f263fce22f65ae258b1e11bee3b49a4770 (patch)
tree	34cf343cccfe10831e164a62b7d5cb9e98fff28d /desktop_devguide
parent	3df3246bb4a7a64d9207f2460df884d22603c623 (diff)