Merge pull request #112978 from v-dihans/website-monitoring

ShawnJackson · web-flow · commit a7f2278503f1 · 2020-05-05T10:07:37.000-05:00
edit pass: website-monitoring
diff --git a/articles/azure-monitor/app/website-monitoring.md b/articles/azure-monitor/app/website-monitoring.md
@@ -1,6 +1,6 @@
 ---
 title: 'Quickstart: Monitor websites with Azure Monitor Application Insights'
-description: Provides quickstart instructions setup client/browser-side website monitoring with Azure Monitor Application Insights
+description: In this quickstart, learn how to set up client/browser-side website monitoring with Azure Monitor Application Insights.
 ms.topic: quickstart
 ms.date: 07/15/2019
 
@@ -20,28 +20,26 @@ With Azure Monitor Application Insights, you can easily monitor your website for
 
 ## Enable Application Insights
 
-Application Insights can gather telemetry data from any internet-connected application, running on-premises or in the cloud. Use the following steps to start viewing this data.
+Application Insights can gather telemetry data from any internet-connected application that's running on-premises or in the cloud. Use the following steps to view this data:
 
 1. Sign in to the [Azure portal](https://portal.azure.com/).
-2. Select **Create a resource** > **Management tools** > **Application Insights**.
+1. Select **Create a resource** > **Management tools** > **Application Insights**.
 
    > [!NOTE]
-   >If this is your first time creating an Application Insights resource you can learn more by visiting the [Create an Application Insights Resource](https://docs.microsoft.com/azure/azure-monitor/app/create-new-resource) article.
-
-   A configuration box appears; use the following table to fill out the input fields.
+   >If this is your first time creating an Application Insights resource, see [Create an Application Insights resource](https://docs.microsoft.com/azure/azure-monitor/app/create-new-resource).
+1. When the configuration box appears, use the following table to complete the input fields:
 
     | Settings        | Value           | Description  |
    | ------------- |:-------------|:-----|
-   | **Name**      | Globally Unique Value | Name that identifies the app you're monitoring |
-   | **Resource Group**     | myResourceGroup      | Name for the new resource group to host Application Insights data. You can create a new resource group or use an existing one. |
-   | **Location** | East US | Choose a location near you, or near where your app is hosted |
-
-3. Click **Create**.
+   | **Name**      | Globally Unique Value | The name that identifies the app you're monitoring. |
+   | **Resource Group**     | myResourceGroup      | The name for the new resource group to host Application Insights data. You can create a new resource group or use an existing one. |
+   | **Location** | East US | Choose a location near you, or near where your app is hosted. |
+1. Select **Create**.
 
 ## Create an HTML file
 
-1. On your local computer, create a file called ``hello_world.html``. For this example the file will be placed on the root of the C: drive at ``C:\hello_world.html``.
-2. Copy the script below into ``hello_world.html``:
+1. On your local computer, create a file called ``hello_world.html``. For this example, create the file on the root of drive C so that it looks like ``C:\hello_world.html``.
+1. Copy and paste the following script into ``hello_world.html``:
 
     ```html
     <!DOCTYPE html>
@@ -51,18 +49,18 @@ Application Insights can gather telemetry data from any internet-connected appli
     </head>
     <body>
     <h1>Azure Monitor Application Insights Hello World!</h1>
-    <p>You can use the Application Insights JavaScript SDK to perform client/browser-side monitoring of your website. To learn about more advanced JavaScript SDK configurations visit the <a href="https://github.com/Microsoft/ApplicationInsights-JS/blob/master/API-reference.md" title="API Reference">API reference</a>.</p>
+    <p>You can use the Application Insights JavaScript SDK to perform client/browser-side monitoring of your website. To learn about more advanced JavaScript SDK configurations, visit the <a href="https://github.com/Microsoft/ApplicationInsights-JS/blob/master/API-reference.md" title="API Reference">API reference</a>.</p>
     </body>
     </html>
     ```
 
 ## Configure Application Insights SDK
 
-1. Select **Overview** > **Essentials** > Copy your application's **Instrumentation Key**.
+1. Select **Overview** > **Essentials**, and then copy your application's **Instrumentation Key**.
 
    ![New Application Insights resource form](media/website-monitoring/instrumentation-key-001.png)
 
-2. Add the following script to your ``hello_world.html`` before the closing ``</head>`` tag:
+1. Add the following script to your ``hello_world.html`` file before the closing ``</head>`` tag:
 
    ```javascript
    <script type="text/javascript">
@@ -74,15 +72,17 @@ Application Insights can gather telemetry data from any internet-connected appli
    </script>
    ```
 
-3. Edit ``hello_world.html`` and add your instrumentation key.
+1. Edit ``hello_world.html`` and add your instrumentation key.
+
+1. Open ``hello_world.html`` in a local browser session. This action creates a single page view. You can refresh your browser to generate multiple test-page views.
 
-4. Open ``hello_world.html`` in a local browser session. This action creates a single pageview. You can refresh your browser to generate multiple test page views.
+## Monitor your website in the Azure portal
 
-## Start monitoring in the Azure portal
+1. Reopen the Application Insights **Overview** page in the Azure portal to view details of your currently running application. The **Overview** page is where you retrieved your instrumentation key.
 
-1. You can now reopen the Application Insights **Overview** page in the Azure portal to view details about your currently running application. The **Overview** page is where you retrieved your instrumentation key. The four default charts on the overview page are scoped to server-side application data. Since we're instrumenting the client/browser-side interactions with the JavaScript SDK, this particular view doesn't apply unless we also have a server-side SDK installed.
+   The four default charts on the overview page are scoped to server-side application data. Because we're instrumenting the client/browser-side interactions with the JavaScript SDK, this particular view doesn't apply unless we also have a server-side SDK installed.
 
-2. Click on ![Application Map icon](media/website-monitoring/006.png) **Analytics**.  This action opens **Analytics**, which provides a rich query language for analyzing all data collected by Application Insights. To view data related to the client-side browser requests run the  following query:
+1. Select **Analytics** ![Application Map icon](media/website-monitoring/006.png).  This action opens **Analytics**, which provides a rich query language for analyzing all data collected by Application Insights. To view data related to the client-side browser requests, run the following query:
 
     ```kusto
     // average pageView duration by name
@@ -101,29 +101,29 @@ Application Insights can gather telemetry data from any internet-connected appli
 
    ![Analytics graph of user requests over a period of time](./media/website-monitoring/analytics-query.png)
 
-3. Go back to the **Overview** page. Click on **Browser** from under the **Investigate** header, then select **Performance**  Here you find metrics related to the performance of your website. There's also a corresponding view for analyzing failures and exceptions in your website. You can click **Samples** to drill into individual transaction details. From here, you can access the [end-to-end transaction details](../../azure-monitor/app/transaction-diagnostics.md) experience.
+1. Go back to the **Overview** page. Under the **Investigate** header, select **Browser**, and then select **Performance**.  Metrics related to the performance of your website appear. There's a corresponding view for analyzing failures and exceptions in your website. You can select **Samples** to access the [end-to-end transaction details](../../azure-monitor/app/transaction-diagnostics.md).
 
    ![Server metrics graph](./media/website-monitoring/browser-performance.png)
 
-4. To begin exploring the [user behavior analytics tools](../../azure-monitor/app/usage-overview.md), from the main Application Insights menu select [**Users**](../../azure-monitor/app/usage-segmentation.md) under the **Usage** header. Since we're testing from a single machine, we'll only see data for one user. For a live website, the distribution of users might look as follows:
+1. On the main Application Insights menu, under the **Usage** header, select [**Users**](../../azure-monitor/app/usage-segmentation.md) to begin exploring the [user behavior analytics tools](../../azure-monitor/app/usage-overview.md). Because we're testing from a single machine, we'll only see data for one user. For a live website, the distribution of users might look like this:
 
      ![User graph](./media/website-monitoring/usage-users.png)
 
-5. If we had instrumented a more complex website with multiple pages, another useful tool is [**User Flows**](../../azure-monitor/app/usage-flows.md). With **User Flows** you can track the pathway visitors takes through the various parts of your website.
+1. For a more complex website with multiple pages, you can use the [**User Flows**](../../azure-monitor/app/usage-flows.md) tool to track the pathway that visitors take through the various parts of your website.
 
    ![User Flows visualization](./media/website-monitoring/user-flows.png)
 
-To learn more advanced configurations for monitoring websites, check out the [JavaScript SDK API reference](https://github.com/Microsoft/ApplicationInsights-JS/blob/master/API-reference.md).
+To learn more advanced configurations for monitoring websites, see the [JavaScript SDK API reference](https://github.com/Microsoft/ApplicationInsights-JS/blob/master/API-reference.md).
 
 ## Clean up resources
 
-If you plan to continue on to work with additional quickstarts or with the tutorials, don't clean up the resources created in this quickstart. Otherwise, if you don't plan to continue, use the following steps to delete all resources created by this quickstart in the Azure portal.
+If you plan to continue working with additional quickstarts or tutorials, don't clean up the resources created in this quickstart. Otherwise, use the following steps to delete all resources created by this quickstart in the Azure portal.
 
 > [!NOTE]
-> If you used an existing resource group the instructions below will not work and you will need to just delete the individual Application Insights resource. Keep in mind anytime you delete a resource group all underyling resources that are members of that group will be deleted.
+> If you used an existing resource group, the following instructions won't work. Instead, you can just delete the individual Application Insights resource. Keep in mind that when you delete a resource group, all underyling resources that are members of that group are deleted too.
 
-1. In the left menu in the Azure portal, click **Resource groups**, and then click **myResourceGroup** or the name of your temporary resource group.
-2. On your resource group page, click **Delete**, type **myResourceGroup** in the text box, and then click **Delete**.
+1. On the left menu on the Azure portal, select **Resource groups**, and then select **myResourceGroup** or the name of your temporary resource group.
+1. On your resource group page, select **Delete**, enter **myResourceGroup** in the text box, and then select **Delete**.
 
 ## Next steps
 
