OSDOCS#13454: Updates to the web console tutorial

modules/getting-started-cli-creating-new-project.adoc

@@ -12,10 +12,14 @@ Cluster administrators can allow developers to create their own projects. In mos
 
 This procedure creates a new project called `user-getting-started`. You will use this project throughout the rest of this tutorial.
 
+[IMPORTANT]
+====
+If you are using Developer Sandbox to complete this tutorial, skip this procedure. A project has already been created for you.
+====
+
 .Prerequisites
 
-* You have access to an {product-title} cluster.
-* You have installed the OpenShift CLI (`oc`).
+* You have logged in to the {oc-first}.
 
 .Procedure
 

modules/getting-started-cli-creating-secret.adoc

@@ -6,11 +6,11 @@
 [id="getting-started-cli-creating-secret_{context}"]
 = Providing access to the database by creating a secret
 
-The `nationalparks` application needs information, such as the database name, username, and passwords, on how to access the MongoDB database. However, because this information is sensitive, you should not store it directly in the pod.
+The `nationalparks` application needs information, such as the database name, username, and passwords, to access the MongoDB database. However, because this information is sensitive, you should not store it directly in the pod.
 
 You can use a _secret_ to store sensitive information, and share that secret with workloads.
 
-`Secret` objects provide a mechanism to hold sensitive information such as passwords, {product-title} client configuration files, private source repository credentials, and so on. Secrets decouple sensitive content from the pods. You can mount secrets into containers by using a volume plugin, or the system can use secrets to perform actions on behalf of a pod.
+`Secret` objects provide a mechanism to hold sensitive information such as passwords, {product-title} client configuration files, and private source repository credentials. Secrets decouple sensitive content from the pods. You can mount secrets into containers by using a volume plugin or by passing the secret in as an environment variable. The system can then use secrets to provide the pod with the sensitive information.
 
 The following procedure creates the `nationalparks-mongodb-parameters` secret and mounts it to the `nationalparks` workload.
 

modules/getting-started-cli-granting-permissions.adoc

@@ -26,3 +26,8 @@ As a requirement of the application, you must assign the `view` role to the `def
 ----
 $ oc adm policy add-role-to-user view -z default -n user-getting-started
 ----
++
+[IMPORTANT]
+====
+If you are using a different project, replace `user-getting-started` with the name of your project.
+====

modules/getting-started-cli-login.adoc

@@ -1,38 +0,0 @@
-// Module included in the following assemblies:
-//
-// * getting-started/openshift-cli.adoc
-
-:_mod-docs-content-type: PROCEDURE
-[id="getting-started-cli-login_{context}"]
-= Logging in to the CLI
-
-You can log in to the OpenShift CLI (`oc`) to access and manage your cluster.
-
-.Prerequisites
-
-* You must have access to an {product-title} cluster.
-* You must have installed the OpenShift CLI (`oc`).
-
-.Procedure
-
-* Log into {product-title} from the CLI using your username and password, with an OAuth token, or with a web browser:
-** With username and password:
-+
-[source,terminal]
-----
-$ oc login -u=<username> -p=<password> --server=<your-openshift-server> --insecure-skip-tls-verify
-----
-** With an OAuth token:
-+
-[source,terminal]
-----
-$ oc login <https://api.your-openshift-server.com> --token=<tokenID>
-----
-** With a web browser:
-+
-[source,terminal]
-----
-$ oc login <cluster_url> --web
-----
-
-You can now create a project or issue other commands for managing your cluster.

modules/getting-started-cli-view.adoc

@@ -34,7 +34,9 @@ NAME       HOST/PORT                                                  PATH   SER
 parksmap   parksmap-user-getting-started.apps.cluster.example.com            parksmap    8080-tcp   edge          None
 ----
 
-. From the above output, copy the value in the `HOST/PORT` column. Because the route is a secured route, you must add `https://` in front to get the application URL.
+. From the above output, copy the value in the `HOST/PORT` column.
+
+. Add `https://` in front of the copied value to get the application URL. This is necessary because the route is a secured route.
 +
 .Example application URL
 [source,text]
@@ -45,4 +47,6 @@ https://parksmap-user-getting-started.apps.cluster.example.com
 . Paste this application URL into your web browser. Your browser should display a map of the national parks across the world.
 +
 .National parks across the world
-image::getting-started-map-national-parks.png[A map of the national parks across the world is displayed with location tracking.]
+image::getting-started-map-national-parks.png[Map of the national parks across the world]
++
+If you allow the application to access your location, the map will center on your location.

modules/getting-started-web-console-connecting-a-database.adoc

@@ -1,32 +1,30 @@
 // Module included in the following assemblies:
 //
-// * getting-started/openshift-web-console.adoc
+// * tutorials/dev-app-web-console.adoc
 
 :_mod-docs-content-type: PROCEDURE
 [id="getting-started-web-console-connecting-database_{context}"]
-= Connecting to a database
+= Deploying the database application
 
-Deploy and connect a MongoDB database where the `national-parks-app` application stores location information.
-Once you mark the `national-parks-app` application as a backend for the map visualization tool, `parksmap` deployment uses the {product-title} discover mechanism to display the map automatically.
+The following procedure deploys `mongodb-nationalparks`, which is a MongoDB database that will hold the national park location information.
 
 .Prerequisites
 
-* You are logged in to the {product-title} web console.
-* You are in the *Developer* perspective.
-* You have a deployed image.
+* You have deployed the `parksmap` front-end application.
+* You have deployed the `nationalparks` back-end application.
 
 .Procedure
 
-. From the *+Add* view in the *Developer* perspective, click *Container images* to open a dialog.
-. In the *Image Name* field, enter `quay.io/centos7/mongodb-36-centos7`.
-. In the *Runtime icon* field, search for `mongodb`.
-. Scroll down to the *General* section.
-. Ensure that you have the current values for the following:
-.. Application: `national-parks-app`
-.. Name: `mongodb-nationalparks`
-. Select *Deployment* as the *Resource*.
-. Unselect the checkbox next to *Create route to the application*.
-. In the *Advanced Options* section, click *Deployment* to add environment variables to add the following environment variables:
+. From the *Quick create* (image:fa-plus-circle.png[title="Quick create menu"]) menu in the upper right corner, click *Container images*.
+. Select *Image name from external registry* and enter `registry.redhat.io/rhmap47/mongodb`.
+. In the *Runtime icon* field, search for and select `mongodb`.
+. Scroll to the *General* section.
+. In the *Application name* field, enter `national-parks-app`.
+. In the *Name* field, enter `mongodb-nationalparks`.
+. Scroll to the *Deploy* section.
+. In the *Resource type* field, ensure that *Deployment* is selected.
+. Click *Show advanced Deployment option*.
+. Under *Environment variables (runtime only)*, add the following names and values:
 +
 .Environment variable names and values
 [cols="1,1"]
@@ -38,5 +36,16 @@ Once you mark the `national-parks-app` application as a backend for the map visu
 |`MONGODB_DATABASE`|`mongodb`
 |`MONGODB_ADMIN_PASSWORD`|`mongodb`
 |===
++
+[TIP]
+====
+Click *Add value* to add each additional environment variable.
+====
+
+. In the *Advanced options* section, clear *Create a route*.
++
+The database application does not need to be accessed externally, so a route is not required.
 
 . Click *Create*.
+
+You are redirected to the *Topology* page where you can see the `mongodb-nationalparks` deployment in the `national-parks-app` application.

modules/getting-started-web-console-creating-new-project.adoc

@@ -1,33 +1,29 @@
 // Module included in the following assemblies:
 //
-// * getting-started/openshift-web-console.adoc
+// * tutorials/dev-app-web-console.adoc
 
 :_mod-docs-content-type: PROCEDURE
 [id="getting-started-web-console-creating-new-project_{context}"]
-= Creating a new project
+= Creating a project
 
-A project enables a community of users to organize and manage their content in isolation. Projects are {product-title} extensions to Kubernetes namespaces. Projects have additional features that enable user self-provisioning.
+A _project_ enables a community of users to organize and manage their content in isolation. Projects are {product-title} extensions to Kubernetes namespaces. Projects have additional features that enable user self-provisioning. Each project has its own set of objects, policies, constraints, and service accounts.
 
-Users must receive access to projects from administrators. Cluster administrators can allow developers to create their own projects. In most cases, users automatically have access to their own projects.
+Cluster administrators can allow developers to create their own projects. In most cases, you automatically have access to your own projects. Administrators can grant access to other projects as needed.
 
-Each project has its own set of objects, policies, constraints, and service accounts.
+This procedure creates a new project called `user-getting-started`. You will use this project throughout the rest of this tutorial.
+
+[IMPORTANT]
+====
+If you are using Developer Sandbox to complete this tutorial, skip this procedure. A project has already been created for you.
+====
 
 .Prerequisites
 
-* You are logged in to the {product-title} web console.
-* You are in the *Developer* perspective.
-* You have the appropriate roles and permissions in a project to create applications and other workloads in {product-title}.
+* You have logged in to the {product-title} web console.
 
 .Procedure
 
-. In the *+Add* view, select *Project* -> *Create Project*.
+. Navigate to *Home* -> *Projects*.
+. Click *Create Project*.
 . In the *Name* field, enter `user-getting-started`.
-. Optional: In the *Display name* field, enter `Getting Started with OpenShift`.
-+
-[NOTE]
-====
-*Display name* and *Description* fields are optional.
-====
 . Click *Create*.
-
-You have created your first project on {product-title}.

modules/getting-started-web-console-creating-secret.adoc

@@ -1,43 +1,52 @@
 // Module included in the following assemblies:
 //
-// * getting-started/openshift-web-console.adoc
+// * tutorials/dev-app-web-console.adoc
 
 :_mod-docs-content-type: PROCEDURE
 [id="getting-started-web-console-creating-secret_{context}"]
-= Creating a secret
+= Providing access to the database by creating a secret
 
-The `Secret` object provides a mechanism to hold sensitive information such as passwords, {product-title} client configuration files, private source repository credentials, and so on.
-Secrets decouple sensitive content from the pods. You can mount secrets into containers using a volume plugin or the system can use secrets to perform actions on behalf of a pod.
-The following procedure adds the secret `nationalparks-mongodb-parameters` and mounts it to the `nationalparks` workload.
+The `nationalparks` application needs information, such as the database name, username, and passwords, to access the MongoDB database. However, because this information is sensitive, you should not store it directly in the pod.
+
+You can use a _secret_ to store sensitive information, and share that secret with workloads.
+
+`Secret` objects provide a mechanism to hold sensitive information such as passwords, {product-title} client configuration files, and private source repository credentials. Secrets decouple sensitive content from the pods. You can mount secrets into containers by using a volume plugin or by passing the secret in as an environment variable. The system can then use secrets to provide the pod with the sensitive information.
+
+The following procedure creates the `nationalparks-mongodb-parameters` secret and mounts it to the `nationalparks` workload.
 
 .Prerequisites
 
-* You are logged in to the {product-title} web console.
-* You are in the *Developer* perspective.
-* You have a deployed image.
+* You have deployed the `nationalparks` back-end application.
+* You have deployed the `mongodb-nationalparks` database application.
 
 .Procedure
 
-. From the *Developer* perspective, navigate to *Secrets* on the left hand navigation and click *Secrets*.
+. Navigate to *Workloads* -> *Secrets*.
 . Click *Create* -> *Key/value secret*.
-.. In the *Secret name* field, enter `nationalparks-mongodb-parameters`.
-.. Enter the following values for *Key* and *Value*:
+. In the *Secret name* field, enter `nationalparks-mongodb-parameters`.
+. Enter the following values for *Key* and *Value*:
 +
 .Secret keys and values
 [cols="1,1"]
 |===
 |Key |Value
 
-|`MONGODB_USER`|`mongodb`
 |`DATABASE_SERVICE_NAME`|`mongodb-nationalparks`
+|`MONGODB_USER`|`mongodb`
 |`MONGODB_PASSWORD`|`mongodb`
 |`MONGODB_DATABASE`|`mongodb`
 |`MONGODB_ADMIN_PASSWORD`|`mongodb`
 |===
++
+[TIP]
+====
+Click *Add key/value* to add each additional key/value pair.
+====
 
-.. Click *Create*.
+. Click *Create*.
 . Click *Add Secret to workload*.
-.. From the drop down menu, select `nationalparks` as the workload to add.
-.. Click *Save*.
+. From the *Add this secret to workload* list, select `nationalparks`.
+
+. Click *Save*.
 
 This change in configuration triggers a new rollout of the `nationalparks` deployment with the environment variables properly injected.

modules/getting-started-web-console-deploying-first-image.adoc

@@ -1,32 +1,38 @@
 // Module included in the following assemblies:
 //
-// * getting-started/openshift-web-console.adoc
+// * tutorials/dev-app-web-console.adoc
 
 :_mod-docs-content-type: PROCEDURE
 [id="getting-started-web-console-deploying-first-image_{context}"]
-= Deploying your first image
+= Deploying the front-end application
 
-The simplest way to deploy an application in {product-title} is to run an existing container image. The following procedure deploys a front end component of an application called `national-parks-app`. The web application displays an interactive map. The map displays the location of major national parks across the world.
+The simplest way to deploy an application in {product-title} is to run a provided container image.
 
-.Prerequisites
-
-* You are logged in to the {product-title} web console.
-* You are in the *Developer* perspective.
-* You have the appropriate roles and permissions in a project to create applications and other workloads in {product-title}.
+The following procedure deploys `parksmap`, which is the front-end component of the `national-parks-app` application. The web application displays an interactive map of the locations of national parks across the world.
 
 .Procedure
 
-. From the *+Add* view in the *Developer* perspective, click *Container images* to open a dialog.
-. In the *Image Name* field, enter the following: `quay.io/openshiftroadshow/parksmap:latest`
-. Ensure that you have the current values for the following:
-.. Application: `national-parks-app`
-.. Name: `parksmap`
-. Select *Deployment* as the *Resource*.
-. Select *Create route to the application*.
-. In the *Advanced Options* section, click *Labels* and add labels to better identify this deployment later. Labels help identify and filter components in the web console and in the command line. Add the following labels:
+. From the *Quick create* (image:fa-plus-circle.png[title="Quick create menu"]) menu in the upper right corner, click *Container images*.
+. Select *Image name from external registry* and enter `quay.io/openshiftroadshow/parksmap:latest`.
+. Scroll to the *General* section.
+. In the *Application name* field, enter `national-parks-app`.
+. In the *Name* field, ensure that the value is `parksmap`.
+. Scroll to the *Deploy* section.
+. In the *Resource type* field, ensure that *Deployment* is selected.
+. In the *Advanced options* section, ensure that *Create a route* is selected.
++
+By default, services running on {product-title} are not accessible externally. You must select this option to create a route so that external clients can access your service.
+
+. Click the *Labels* hyperlink.
++
+The application code requires certain labels to be set.
+
+. Add the following labels to the text area and press Enter after each key/value pair:
+
 ** `app=national-parks-app`
 ** `component=parksmap`
 ** `role=frontend`
+
 . Click *Create*.
 
 You are redirected to the *Topology* page where you can see the `parksmap` deployment in the `national-parks-app` application.

modules/getting-started-web-console-deploying-python-app.adoc

@@ -1,48 +1,58 @@
 // Module included in the following assemblies:
 //
-// * getting-started/openshift-web-console.adoc
+// * tutorials/dev-app-web-console.adoc
 
 :_mod-docs-content-type: PROCEDURE
 [id="getting-started-web-console-deploying-python-app_{context}"]
-= Deploying a Python application
+= Deploying the back-end application
 
-The following procedure deploys a back-end service for the `parksmap` application. The Python application performs 2D geo-spatial queries against a MongoDB database to locate and return map coordinates of all national parks in the world.
-
-The deployed back-end service that is `nationalparks`.
+The following procedure deploys `nationalparks`, which is the back-end component for the `national-parks-app` application. The Python application performs 2D geo-spatial queries against a MongoDB database to locate and return map coordinates of all national parks in the world.
 
 .Prerequisites
 
-* You are logged in to the {product-title} web console.
-* You are in the *Developer* perspective.
-* You have a deployed image.
+* You have deployed the `parksmap` front-end application.
 
 .Procedure
 
-. From the *+Add* view in the *Developer* perspective, click *Import from Git* to open a dialog.
-. Enter the following URL in the Git Repo URL field:
-[x-]`https://github.com/openshift-roadshow/nationalparks-py.git`
+. From the *Quick create* (image:fa-plus-circle.png[title="Quick create menu"]) menu in the upper right corner, click *Import from Git*.
+. In the *Git Repo URL* field, enter [x-]`https://github.com/openshift-roadshow/nationalparks-py.git`.
 +
-A builder image is automatically detected.
-+
-[NOTE]
-====
-If the detected builder image is Dockerfile, select *Edit Import Strategy*. Select *Builder Image* and then click *Python*.
-====
+A builder image is automatically detected, but the import strategy defaults to Dockerfile instead of Python.
+
+. Change the import strategy:
+
+.. Click *Edit Import Strategy*.
+.. Select *Builder Image*.
+.. Select *Python*.
+
 . Scroll to the *General* section.
-. Ensure that you have the current values for the following:
-.. Application: `national-parks-app`
-.. Name: `nationalparks`
-. Select *Deployment* as the *Resource*.
-. Select *Create route to the application*.
-. In the *Advanced Options* section, click *Labels* and add labels to better identify this deployment later. Labels help identify and filter components in the web console and in the command line. Add the following labels:
-.. `app=national-parks-app`
-.. `component=nationalparks`
-.. `role=backend`
-.. `type=parksmap-backend`
-. Click *Create*.
-. From the *Topology* view, select the `nationalparks` application.
+. In the *Application* field, ensure that the value is `national-parks-app`.
+. In the *Name* field, enter `nationalparks`.
+. Scroll to the *Deploy* section.
+. In the *Resource type* field, ensure that *Deployment* is selected.
+. In the *Advanced options* section, ensure that *Create a route* is selected.
 +
-[NOTE]
-====
-Click the *Resources* tab. In the *Builds* section, you can see your build running.
-====
+By default, services running on {product-title} are not accessible externally. You must select this option to create a route so that external clients can access your service.
+
+. Click the *Labels* hyperlink.
++
+The application code requires certain labels to be set.
+
+. Add the following labels to the text area and press Enter after each key/value pair:
+
+** `app=national-parks-app`
+** `component=nationalparks`
+** `role=backend`
+** `type=parksmap-backend`
+
+. Click *Create*.
+
+You are redirected to the *Topology* page where you can see the `nationalparks` deployment in the `national-parks-app` application.
+
+.Verification
+
+. Navigate to *Workloads* -> *Topology*.
+. Click the `nationalparks` deployment in the `national-parks-app` application.
+. Click the *Resources* tab.
++
+Wait for the build to complete successfully.

modules/getting-started-web-console-examining-pod.adoc

@@ -1,41 +1,34 @@
 // Module included in the following assemblies:
 //
-// * getting-started/openshift-web-console.adoc
+// * tutorials/dev-app-web-console.adoc
 
 :_mod-docs-content-type: PROCEDURE
 [id="getting-started-web-console-examining-pod_{context}"]
-= Examining the pod
+= Viewing pod details
 
-{product-title} leverages the Kubernetes concept of a pod, which is one or more containers deployed together on one host, and the smallest compute unit that can be defined, deployed, and managed.
+{product-title} uses the Kubernetes concept of a _pod_, which is one or more containers deployed together on one host, and the smallest compute unit that can be defined, deployed, and managed.
 Pods are the rough equivalent of a machine instance, physical or virtual, to a container.
 
-The *Overview* panel enables you to access many features of the `parksmap` deployment. The *Details* and *Resources* tabs enable you to scale application pods, check build status, services, and routes.
+The *Overview* panel enables you to access many features of the `parksmap` deployment. The *Details* and *Resources* tabs enable you to scale application pods and check the status of builds, services, and routes.
 
 .Prerequisites
 
-* You are logged in to the {product-title} web console.
-* You are in the *Developer* perspective.
-* You have a deployed image.
+* You have deployed the `parksmap` front-end application.
 
 .Procedure
 
-* Click `D parksmap` in the *Topology* view to open the *Overview* panel.
+. Navigate to *Workloads* -> *Topology*.
+. Click the `parksmap` deployment in the `national-parks-app` application.
 +
 .Parksmap deployment
-image::getting-started-examine-pod.png[]
+image::getting-started-examine-pod.png[Topology view of parksmap deployment]
 +
-The *Overview* panel includes tabs for *Details*, *Resources*, and *Observe*. The *Details* tab might be displayed by default.
+This opens an overview panel with the following tabs:
 
-+
-.Overview panel tab definitions
-[cols="2,3"]
-|===
-|Tab |Defintion
+** *Details*: View details about your deployment, edit certain settings, and scale your deployment.
 
-|*Details* | Enables you to scale your application and view pod configuration such as labels, annotations, and the status of the application.
-1.4+|*Resources* |Displays the resources that are associated with the deployment.
-|Pods are the basic units of {product-title} applications. You can see how many pods are being used, what their status is, and you can view the logs.
-|*Services* that are created for your pod and assigned ports are listed under the *Services* heading.
-|*Routes* enable external access to the pods and a URL is used to access them.
-|*Observe*|View various *Events* and *Metrics* information as it relates to your pod.
-|===
+** *Resources*: View details for the pods, services, and routes associated with your deployment.
+
+** *Observe*: View metrics and events for your deployment.
+
+. To view the logs for a pod, select the *Resources* tab and click *View logs* next to the `parksmap` pod.

modules/getting-started-web-console-granting-permissions.adoc

@@ -1,30 +1,39 @@
 // Module included in the following assemblies:
 //
-// * getting-started/openshift-web-console.adoc
+// * tutorials/dev-app-web-console.adoc
 
 :_mod-docs-content-type: PROCEDURE
 [id="getting-started-web-console-granting-permissions_{context}"]
 = Granting view permissions
 
-{product-title} automatically creates a few special service accounts in every project. The default service account takes responsibility for running the pods. {product-title} uses and injects this service account into every pod that launches.
+{product-title} automatically creates several service accounts in every project. The `default` service account takes responsibility for running the pods. {product-title} uses and injects this service account into every pod that launches.
 
-The following procedure creates a `RoleBinding` object for the default `ServiceAccount` object. The service account communicates with the {product-title} API to learn about pods, services, and resources within the project.
+By default, the `default` service account has limited permissions to interact with the OpenShift API.
+
+As a requirement of the application, you must assign the `view` role to the `default` service account to allow it to communicate with the OpenShift API to learn about pods, services, and resources within the project.
 
 .Prerequisites
 
-* You are logged in to the {product-title} web console.
-* You have a deployed image.
-* You are in the *Administrator* perspective.
+* You have `cluster-admin` or project-level `admin` privileges.
 
 .Procedure
 
-. Navigate to *User Management* and then click *RoleBindings*.
+. Navigate to *User Management* -> *RoleBindings*.
 . Click *Create binding*.
-. Select `Namespace role binding (RoleBinding)`.
 . In the *Name* field, enter `sa-user-account`.
 . In the *Namespace* field, search for and select `user-getting-started`.
-. In the *Role name* field, search for `view` and select `view`.
-. In the *Subject* field, select `ServiceAccount`.
++
+[IMPORTANT]
+====
+If you are using a different project, select the name of your project.
+====
+. In the *Role name* field, search for and select `view`.
+. Under *Subject*, select `ServiceAccount`.
 . In the *Subject namespace* field, search for and select `user-getting-started`.
++
+[IMPORTANT]
+====
+If you are using a different project, select the name of your project.
+====
 . In the *Subject name* field, enter `default`.
 . Click *Create*.

modules/getting-started-web-console-load-data-output.adoc

@@ -1,39 +1,40 @@
 // Module included in the following assemblies:
 //
-// * getting-started/openshift-web-console.adoc
+// * tutorials/dev-app-web-console.adoc
 
 :_mod-docs-content-type: PROCEDURE
 [id="getting-started-web-console-load-data-output_{context}"]
+= Loading data into the database
 
-= Loading data and displaying the national parks map
-
-You deployed the `parksmap` and `nationalparks` applications and then deployed the `mongodb-nationalparks` database. However, no data has been loaded _into_ the database.
-Before loading the data, add the proper labels to the `mongodb-nationalparks` and `nationalparks` deployment.
+After you have deployed the `mongodb-nationalparks` database, you can load the national park location information into the database.
 
 .Prerequisites
 
-* You are logged in to the {product-title} web console.
-* You are in the *Developer* perspective.
-* You have a deployed image.
+* You have deployed the `nationalparks` back-end application.
+* You have deployed the `mongodb-nationalparks` database application.
 
 .Procedure
 
-. From the *Topology* view, navigate to `nationalparks` deployment and click *Resources* and retrieve your route information.
-. Copy and paste the URL into your web browser and add the following at the end of the URL:
+. Navigate to *Workloads* -> *Topology*.
+. Click the `nationalparks` deployment and select the *Resources* tab.
+. Copy the *Location* URL from your route.
+. Paste the URL into your web browser and add the following at the end of the URL:
 +
 [source,text]
 ----
 /ws/data/load
 ----
 +
+For example:
++
+[source,text]
+----
+https://nationalparks-user-getting-started.apps.cluster.example.com/ws/data/load
+----
++
 .Example output
 +
 [source,text]
 ----
 Items inserted in database: 2893
 ----
-. From the *Topology* view, navigate to `parksmap` deployment and click *Resources* and retrieve your route information.
-. Copy and paste the URL into your web browser to view your national parks across the world map.
-
-.National parks across the world
-image::getting-started-map-national-parks.png[]

modules/getting-started-web-console-login.adoc

@@ -1,26 +0,0 @@
-// Module included in the following assemblies:
-//
-// * getting-started/openshift-web-console.adoc
-
-:_mod-docs-content-type: PROCEDURE
-[id="getting-started-web-console-login_{context}"]
-= Logging in to the web console
-
-You can log in to the {product-title} web console to access and manage your cluster.
-
-.Prerequisites
-
-* You must have access to an {product-title} cluster.
-
-.Procedure
-
-* Log in to the {product-title} web console using your login credentials.
-
-You are redirected to the *Projects* page. For non-administrative users, the default view is the *Developer* perspective. For cluster administrators, the default view is the *Administrator* perspective. If you do not have `cluster-admin` privileges, you will not see the *Administrator* perspective in your web console.
-
-The web console provides two perspectives: the *Administrator* perspective and *Developer* perspective. The *Developer* perspective provides workflows specific to the developer use cases.
-
-.Perspective switcher
-image::web_console_perspectives.png[500,300]
-
-Use the perspective switcher to switch to the *Developer* perspective. The *Topology* view with options to create an application is displayed.

modules/getting-started-web-console-scaling-app.adoc

@@ -1,35 +1,31 @@
 // Module included in the following assemblies:
 //
-// * getting-started/openshift-web-console.adoc
+// * tutorials/dev-app-web-console.adoc
 
 :_mod-docs-content-type: PROCEDURE
 [id="getting-started-web-console-scaling-app_{context}"]
-= Scaling the application
+= Scaling up the application
 
-In Kubernetes, a `Deployment` object defines how an application deploys. In most cases, users use `Pod`, `Service`, `ReplicaSets`, and `Deployment` resources together. In most cases, {product-title} creates the resources for you.
+In Kubernetes, a `Deployment` object defines how an application deploys. In most cases when you deploy an application, {product-title} creates the `Pod`, `Service`, `ReplicaSet`, and `Deployment` resources for you.
 
-When you deploy the `national-parks-app` image, a deployment resource is created.  In this example, only one `Pod` is deployed.
+When you deploy the `parksmap` image, a deployment resource is created. In this example, only one pod is deployed. You might want to scale up your application to keep up with user demand or to ensure that your application is always running even if one pod is down.
 
-The following procedure scales the `national-parks-image` to use two instances.
+The following procedure scales the `parksmap` deployment to use two instances.
 
 .Prerequisites
 
-* You are logged in to the {product-title} web console.
-* You are in the *Developer* perspective.
-* You have a deployed image.
+* You have deployed the `parksmap` front-end application.
 
 .Procedure
 
-. In the *Topology* view, click the `national-parks-app` application.
-. Click the *Details* tab.
+. Navigate to *Workloads* -> *Topology* and click the `parksmap` deployment.
+. Select the *Details* tab.
 . Use the up arrow to scale the pod to two instances.
 +
 .Scaling application
-image::getting-started-scaling-pod.png[500,300]
-+
-[NOTE]
-====
-Application scaling can happen quickly because {product-title} is launching a new instance of an existing image.
-====
+image::getting-started-scaling-pod.png[Scaling pod to two instances]
 
-. Use the down arrow to scale the pod down to one instance.
+[TIP]
+====
+You can use the down arrow to scale your deployment back down to one pod instance.
+====

modules/getting-started-web-console-view.adoc

@@ -0,0 +1,33 @@
+// Module included in the following assemblies:
+//
+// * tutorials/dev-app-web-console.adoc
+
+:_mod-docs-content-type: PROCEDURE
+[id="getting-started-web-console-view_{context}"]
+= Viewing the application in a web browser
+
+After you have deployed the necessary applications and loaded data into the database, you are now ready view the national parks application through a browser.
+
+You can access the application by opening the URL for the front-end application.
+
+.Prerequisites
+
+* You have deployed the `parksmap` front-end application.
+* You have deployed the `nationalparks` back-end application.
+* You have deployed the `mongodb-nationalparks` database application.
+* You have loaded the data into the `mongodb-nationalparks` database.
+
+.Procedure
+
+. Navigate to *Workloads* -> *Topology*.
+. Click the *Open URL* link from the `parksmap` deployment.
++
+.National parks across the world
+image::getting-started-parksmap-url.png[Opening the URL for the parksmap deployment]
+
+. Verify that your web browser displays a map of the national parks across the world.
++
+.National parks across the world
+image::getting-started-map-national-parks.png[Map of the national parks across the world]
++
+If you allow the application to access your location, the map will center on your location.

tutorials/dev-app-cli.adoc

@@ -6,7 +6,7 @@ include::_attributes/common-attributes.adoc[]
 
 toc::[]
 
-This tutorial walks you through deploying services to stand up an application called `national-parks-app` on {product-title} that displays a map of national parks across the world. You will use the {oc-first} to complete this tutorial.
+This tutorial guides you through deploying services to stand up an application called `national-parks-app` on {product-title} that displays a map of national parks across the world. You will use the {oc-first} to complete this tutorial.
 
 To complete this tutorial, you will perform the following steps:
 
@@ -40,11 +40,15 @@ Before you start this tutorial, ensure that you have the the following required
 * You have installed the xref:../cli_reference/openshift_cli/getting-started-cli.adoc#installing-openshift-cli[{oc-first}].
 * You have access to a test {product-title} cluster.
 +
-If your organization has a cluster you can test on, contact your cluster administrator for access.
-+
 If your organization does not have a cluster to test on, you can request access to the link:https://developers.redhat.com/developer-sandbox[Developer Sandbox] to get a trial of {product-title}.
 
-* You have xref:../cli_reference/openshift_cli/getting-started-cli.adoc#cli-logging-in_cli-developer-commands[logged into your cluster by using the {oc-first}].
+* You have the appropriate permissions, such as the `cluster-admin` xref:../authentication/using-rbac.adoc#viewing-cluster-roles_using-rbac[cluster role], to create a project and applications within it.
++
+If you do not have the required permissions, contact your cluster administrator. You need the `self-provisioner` role to create a project and the `admin` role on the project to modify resources in that project.
++
+If you are using Developer Sandbox, a project is created for you with the required permissions.
+
+* You have xref:../cli_reference/openshift_cli/getting-started-cli.adoc#cli-logging-in_cli-developer-commands[logged in to your cluster by using the {oc-first}].
 
 // Creating a new project
 include::modules/getting-started-cli-creating-new-project.adoc[leveloffset=+1]
@@ -111,6 +115,7 @@ include::modules/getting-started-cli-creating-secret.adoc[leveloffset=+2]
 
 [role="_additional-resources"]
 .Additional resources
+* xref:../nodes/pods/nodes-pods-secrets.adoc#nodes-pods-secrets-about_nodes-pods-secrets[Understanding secrets]
 * xref:../cli_reference/openshift_cli/developer-cli-commands.adoc#oc-create-secret-generic[oc create secret generic]
 * xref:../cli_reference/openshift_cli/developer-cli-commands.adoc#oc-set-env[oc set env]
 * xref:../cli_reference/openshift_cli/developer-cli-commands.adoc#oc-rollout-status[oc rollout status]

tutorials/dev-app-web-console.adoc

@@ -6,41 +6,71 @@ include::_attributes/common-attributes.adoc[]
 
 toc::[]
 
-// TODO: Will update this tutorial in a future PR
+This tutorial guides you through deploying services to stand up an application called `national-parks-app` on {product-title} that displays a map of national parks across the world. You will use the {product-title} web console to complete this tutorial.
 
-[id="openshift-web-console-before-you-begin"]
-== Before you begin
+To complete this tutorial, you will perform the following steps:
 
-* Review xref:../web_console/web-console.adoc#web-console-overview[Accessing the web console].
-* You must be able to access a running instance of {product-title}. If you do not have access, contact your cluster administrator.
+. xref:../tutorials/dev-app-web-console.adoc#getting-started-web-console-creating-new-project_dev-app-web-console[Create a project for the application].
++
+This step allows your application to be isolated from other cluster user's workloads.
 
-include::modules/getting-started-web-console-login.adoc[leveloffset=+1]
+. xref:../tutorials/dev-app-web-console.adoc#getting-started-web-console-granting-permissions_dev-app-web-console[Grant view permissions].
++
+This step grants `view` permissions to interact with the OpenShift API to help discover services and other resources running within the project.
 
+. xref:../tutorials/dev-app-web-console.adoc#getting-started-web-console-deploying-first-image_dev-app-web-console[Deploy the front-end application].
++
+This step deploys the `parksmap` front-end application, exposes it externally, and scales it up to two instances.
+
+. xref:../tutorials/dev-app-web-console.adoc#getting-started-web-console-deploying-python-app_dev-app-web-console[Deploy the back-end application].
++
+This step deploys the `nationalparks` back-end application and exposes it externally.
+
+. xref:../tutorials/dev-app-web-console.adoc#getting-started-web-console-connecting-database_dev-app-web-console[Deploy the database application].
++
+This step deploys the `mongodb-nationalparks` MongoDB database, loads data into the database, and sets up the necessary credentials to access the database.
+
+After you complete these steps, you can xref:../tutorials/dev-app-web-console.adoc#getting-started-web-console-view_dev-app-web-console[view the national parks application in a web browser].
+
+[id="prerequisites_{context}"]
+== Prerequisites
+
+Before you start this tutorial, ensure that you have the the following required prerequisites:
+
+* You have access to a test {product-title} cluster.
++
+If your organization does not have a cluster to test on, you can request access to the link:https://developers.redhat.com/developer-sandbox[Developer Sandbox] to get a trial of {product-title}.
+
+* You have the appropriate permissions, such as the `cluster-admin` xref:../authentication/using-rbac.adoc#viewing-cluster-roles_using-rbac[cluster role], to create a project and applications within it.
++
+If you do not have the required permissions, contact your cluster administrator. You need the `self-provisioner` role to create a project and the `admin` role on the project to modify resources in that project.
++
+If you are using Developer Sandbox, a project is created for you with the required permissions.
+
+* You have xref:../web_console/web-console.adoc#web-console-overview[logged in to the {product-title} web console].
+
+// Creating a new project
 include::modules/getting-started-web-console-creating-new-project.adoc[leveloffset=+1]
 
 [role="_additional-resources"]
 .Additional resources
-* xref:../authentication/using-rbac.adoc#default-roles_using-rbac[Default cluster roles]
-* xref:../applications/projects/working-with-projects.adoc#viewing-a-project-using-the-web-console_projects[Viewing a project using the web console]
-* xref:../applications/projects/working-with-projects.adoc#odc-providing-project-permissions-using-developer-perspective_projects[Providing access permissions to your project using the Developer perspective]
-* xref:../applications/projects/working-with-projects.adoc#deleting-a-project-using-the-web-console_projects[Deleting a project using the web console]
+* xref:../applications/projects/working-with-projects.adoc#viewing-a-project-using-the-web-console_projects[Viewing a project by using the web console]
 
+// Granting view permissions
 include::modules/getting-started-web-console-granting-permissions.adoc[leveloffset=+1]
 
 [role="_additional-resources"]
 .Additional resources
-* xref:../authentication/understanding-authentication.adoc#rbac-users_understanding-authentication[Understanding authentication]
 * xref:../authentication/using-rbac.adoc#authorization-overview_using-rbac[RBAC overview]
 
+// Deploying the front-end application
 include::modules/getting-started-web-console-deploying-first-image.adoc[leveloffset=+1]
 
 [role="_additional-resources"]
 .Additional resources
-* xref:../applications/creating_applications/odc-creating-applications-using-developer-perspective.adoc[Creating applications using the Developer perspective]
-* xref:../applications/projects/working-with-projects.adoc#viewing-a-project-using-the-web-console_projects[Viewing a project using the web console]
 * xref:../applications/odc-viewing-application-composition-using-topology-view.adoc#odc-viewing-application-topology_viewing-application-composition-using-topology-view[Viewing the topology of your application]
-* xref:../applications/projects/working-with-projects.adoc#deleting-a-project-using-the-web-console_projects[Deleting a project using the web console]
 
+// Viewing pod details
 include::modules/getting-started-web-console-examining-pod.adoc[leveloffset=+2]
 
 [role="_additional-resources"]
@@ -49,43 +79,33 @@ include::modules/getting-started-web-console-examining-pod.adoc[leveloffset=+2]
 * xref:../applications/odc-viewing-application-composition-using-topology-view.adoc#odc-scaling-application-pods-and-checking-builds-and-routes_viewing-application-composition-using-topology-view[Scaling application pods and checking builds and routes]
 * xref:../applications/odc-viewing-application-composition-using-topology-view.adoc#odc-labels-and-annotations-used-for-topology-view_viewing-application-composition-using-topology-view[Labels and annotations used for the Topology view]
 
+// Scaling up the deployment
 include::modules/getting-started-web-console-scaling-app.adoc[leveloffset=+2]
 
 [role="_additional-resources"]
 .Additional resources
-* xref:../scalability_and_performance/recommended-performance-scale-practices/recommended-control-plane-practices.adoc#recommended-scale-practices_cluster-scaling[Recommended practices for scaling the cluster]
-* xref:../nodes/pods/nodes-pods-autoscaling.adoc#nodes-pods-autoscaling-about_nodes-pods-autoscaling[Understanding horizontal pod autoscalers]
-* xref:../nodes/pods/nodes-pods-vertical-autoscaler.adoc#nodes-pods-vertical-autoscaler-about_nodes-pods-vertical-autoscaler[About the Vertical Pod Autoscaler Operator]
+* xref:../scalability_and_performance/recommended-performance-scale-practices/recommended-control-plane-practices.adoc#recommended-scale-practices_recommended-control-plane-practices[Recommended practices for scaling the cluster]
 
+// Deploying the back-end application
 include::modules/getting-started-web-console-deploying-python-app.adoc[leveloffset=+1]
 
 [role="_additional-resources"]
 .Additional resources
 * xref:../applications/odc-viewing-application-composition-using-topology-view.adoc#odc-adding-services-to-your-application_viewing-application-composition-using-topology-view[Adding services to your application]
 * xref:../applications/creating_applications/odc-creating-applications-using-developer-perspective.adoc#odc-importing-codebase-from-git-to-create-application_odc-creating-applications-using-developer-perspective[Importing a codebase from Git to create an application]
-* xref:../applications/odc-viewing-application-composition-using-topology-view.adoc#odc-viewing-application-topology_viewing-application-composition-using-topology-view[Viewing the topology of your application]
-* xref:../applications/projects/working-with-projects.adoc#odc-providing-project-permissions-using-developer-perspective_projects[Providing access permissions to your project using the Developer perspective]
-* xref:../applications/projects/working-with-projects.adoc#deleting-a-project-using-the-web-console_projects[Deleting a project using the web console]
 
+// Deploying the database application
 include::modules/getting-started-web-console-connecting-a-database.adoc[leveloffset=+1]
 
-[role="_additional-resources"]
-.Additional resources
-* xref:../applications/odc-viewing-application-composition-using-topology-view.adoc#odc-adding-services-to-your-application_viewing-application-composition-using-topology-view[Adding services to your application]
-* xref:../applications/projects/working-with-projects.adoc#viewing-a-project-using-the-web-console_projects[Viewing a project using the web console]
-* xref:../applications/odc-viewing-application-composition-using-topology-view.adoc#odc-viewing-application-topology_viewing-application-composition-using-topology-view[Viewing the topology of your application]
-* xref:../applications/projects/working-with-projects.adoc#odc-providing-project-permissions-using-developer-perspective_projects[Providing access permissions to your project using the Developer perspective]
-* xref:../applications/projects/working-with-projects.adoc#deleting-a-project-using-the-web-console_projects[Deleting a project using the web console]
-
+// Providing access to the database by creating a secret
 include::modules/getting-started-web-console-creating-secret.adoc[leveloffset=+2]
 
 [role="_additional-resources"]
 .Additional resources
 * xref:../nodes/pods/nodes-pods-secrets.adoc#nodes-pods-secrets-about_nodes-pods-secrets[Understanding secrets]
 
+// Loading data into the database
 include::modules/getting-started-web-console-load-data-output.adoc[leveloffset=+2]
 
-[role="_additional-resources"]
-.Additional resources
-* xref:../applications/projects/working-with-projects.adoc#odc-providing-project-permissions-using-developer-perspective_projects[Providing access permissions to your project using the Developer perspective]
-* xref:../applications/odc-viewing-application-composition-using-topology-view.adoc#odc-labels-and-annotations-used-for-topology-view_viewing-application-composition-using-topology-view[Labels and annotations used for the Topology view]
+// Viewing the application in a web browser
+include::modules/getting-started-web-console-view.adoc[leveloffset=+1]