Merge pull request #208911 from w-azure/winona-hub-manage-tools

Updated screenshot markdown

Author: Stacyrch140

articles/iot-hub/iot-hub-create-through-portal.md

@@ -114,4 +114,4 @@ To delete an IoT hub, find the IoT hub you want to delete, then choose **Delete*
 Follow these links to learn more about managing Azure IoT Hub:
 
 * [Message routing with IoT Hub](tutorial-routing.md)
-* [Monitor your IoT hub](monitor-iot-hub.md)
+* [Monitor your IoT hub](monitor-iot-hub.md)

articles/iot-hub/iot-hub-create-use-iot-toolkit.md

@@ -13,95 +13,90 @@ ms.author: junhan
 
 [!INCLUDE [iot-hub-resource-manager-selector](../../includes/iot-hub-resource-manager-selector.md)]
 
-This article shows you how to use the [Azure IoT Tools for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=vsciot-vscode.azure-iot-tools) to create an Azure IoT hub. 
+This article shows you how to use the [Azure IoT Tools for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=vsciot-vscode.azure-iot-tools) to create an Azure IoT hub. You can create one without an existing IoT project or create one from an existing IoT project.
 
 [!INCLUDE [updated-for-az](../../includes/updated-for-az.md)]
 
-To complete this article, you need the following:
-
-- An Azure subscription. If you don't have an Azure subscription, create a [free account](https://azure.microsoft.com/free/?WT.mc_id=A261C142F) before you begin.
+## Prerequisites
 
 - [Visual Studio Code](https://code.visualstudio.com/)
 
 - [Azure IoT Tools](https://marketplace.visualstudio.com/items?itemName=vsciot-vscode.azure-iot-tools) installed for Visual Studio Code.
 
+## Create an IoT hub without an IoT Project
 
-## Create an IoT hub and device in an IoT Project
-
-The following steps show how you can create an IoT Hub and register a device to the hub within an IoT Project in Visual Studio Code.
-
-Instead of provisioning an Azure IoT Hub and device from the Azure portal. You can do it in the VS Code without leaving the development environment. The steps in this section show how to do this.
-
-1. In the new opened project window, click `F1` to open the command palette, type and select **Azure IoT Device Workbench: Provision Azure Services...**. Follow the step-by-step guide to finish provisioning your Azure IoT Hub and creating the IoT Hub device.
+The following steps show how to create an IoT Hub without an IoT Project in Visual Studio Code (VS Code).
 
-    ![Provision command](media/iot-hub-create-use-iot-toolkit/provision.png)
+1. In VS Code, open the **Explorer** view.
 
-    > [!NOTE]
-    > If you have not signed in Azure. Follow the pop-up notification for signing in.
+2. At the bottom of the Explorer, expand the **Azure IoT Hub** section. 
 
-1. Select the subscription you want to use.
+   :::image type="content" source="./media/iot-hub-create-use-iot-toolkit/azure-iot-hub-devices.png" alt-text="A screenshot that shows the location of the Azure IoT Hub section in VS Code." lightbox="./media/iot-hub-create-use-iot-toolkit/azure-iot-hub-devices.png":::
 
-    ![Select sub](media/iot-hub-create-use-iot-toolkit/select-subscription.png)
+3. Select **Create IoT Hub** from the list in the **Azure IoT Hub** section. 
 
-1. Then select and existing resource group or create a new [resource group](../azure-resource-manager/management/overview.md#terminology).
+   :::image type="content" source="./media/iot-hub-create-use-iot-toolkit/create-iot-hub.png" alt-text="A screenshot that shows the location of the Create IoT Hub list item in VS Code." lightbox="./media/iot-hub-create-use-iot-toolkit/create-iot-hub.png":::
 
-    ![Select resource group](media/iot-hub-create-use-iot-toolkit/select-resource-group.png)
+5. A pop-up will show in the bottom-right corner to let you sign in to Azure for the first time, if you are not signed in already.
 
-1. In the resource group you specified, follow the prompts to select an existing IoT Hub or create a new Azure IoT Hub.
+6. From the command palette at the top of VS Code, select your Azure subscription. 
 
-    ![Select IoT Hub steps](media/iot-hub-create-use-iot-toolkit/iot-hub-provision.png)
+7. Select your resource group.
 
-    ![Select IoT Hub](media/iot-hub-create-use-iot-toolkit/select-iot-hub.png)
+8. Select a location.
 
-    ![Selected IoT Hub](media/iot-hub-create-use-iot-toolkit/iot-hub-selected.png)
+9. Select a pricing tier.
 
-1. In the output window, you will see the Azure IoT Hub provisioned.
+10. Enter a globally unique name for your IoT hub, then press **Enter**.
 
-    ![IoT Hub Provisioned](media/iot-hub-create-use-iot-toolkit/iot-hub-provisioned.png)
+11. Wait a few minutes until the IoT Hub is created. You'll see a confirmation in the output console.
 
-1. Select or create a new IoT Hub Device in the Azure IoT Hub you provisioned.
+## Create an IoT hub and device in an existing IoT project
 
-    ![Select IoT Device steps](media/iot-hub-create-use-iot-toolkit/iot-device-provision.png)
+The following steps show how to create an IoT Hub and register a device to the hub within an existing IoT project in Visual Studio (VS) Code.
 
-    ![Select IoT Device Provisioned](media/iot-hub-create-use-iot-toolkit/select-iot-device.png)
+This method allows you to provision in VS Code without leaving your development environment.
 
-1. Now you have Azure IoT Hub provisioned and device created in it. Also the device connection string will be saved in VS Code.
+1. In the new opened project window, click `F1` to open the command palette, type and select **Azure IoT Device Workbench: Provision Azure Services...**. Follow the step-by-step guide to finish provisioning your Azure IoT Hub and creating the IoT Hub device.
 
-    ![Provision done](media/iot-hub-create-use-iot-toolkit/provision-done.png)
+   :::image type="content" source="media/iot-hub-create-use-iot-toolkit/provision.png" alt-text="A screenshot that shows how to open the command palette in VS Code." lightbox="media/iot-hub-create-use-iot-toolkit/provision.png":::
 
+    > [!NOTE]
+    > If you have not signed in Azure. Follow the pop-up notification for signing in.
 
+1. Select the subscription you want to use.
 
-## Create an IoT hub without an IoT Project
+   :::image type="content" source="media/iot-hub-create-use-iot-toolkit/select-subscription.png" alt-text="A screenshot that shows how to choose your Azure subscription in VS Code." lightbox="media/iot-hub-create-use-iot-toolkit/select-subscription.png":::
 
-The following steps show how you can create an IoT Hub without an IoT Project in Visual Studio Code.
+1. Then select and existing resource group or create a new [resource group](../azure-resource-manager/management/overview.md#terminology).
 
-1. In Visual Studio Code, open the **Explorer** view.
+   :::image type="content" source="media/iot-hub-create-use-iot-toolkit/select-resource-group.png" alt-text="A screenshot that shows how to choose a resource group or create a new one in VS Code." lightbox="media/iot-hub-create-use-iot-toolkit/select-resource-group.png":::
 
-2. At the bottom of the Explorer, expand the **Azure IoT Hub** section. 
+1. In the resource group you specified, follow the prompts to select an existing IoT Hub or create a new Azure IoT Hub.
 
-   ![Expand Azure IoT Hub Devices](./media/iot-hub-create-use-iot-toolkit/azure-iot-hub-devices.png)
+   :::image type="content" source="media/iot-hub-create-use-iot-toolkit/iot-hub-provision.png" alt-text="A screenshot that shows the first prompt in choosing an existing IoT Hub in VS Code." lightbox="media/iot-hub-create-use-iot-toolkit/iot-hub-provision.png":::
 
-3. Click on the **...** in the **Azure IoT Hub** section header. If you don't see the ellipsis, hover over the header. 
+   :::image type="content" source="media/iot-hub-create-use-iot-toolkit/select-iot-hub.png" alt-text="A screenshot that shows the second prompt in choosing an existing IoT Hub in VS Code." lightbox="media/iot-hub-create-use-iot-toolkit/select-iot-hub.png":::
 
-4. Choose **Create IoT Hub**.
+   :::image type="content" source="media/iot-hub-create-use-iot-toolkit/iot-hub-selected.png" alt-text="A screenshot that shows the third prompt in choosing an existing IoT Hub in VS Code." lightbox="media/iot-hub-create-use-iot-toolkit/iot-hub-selected.png":::
 
-5. A pop-up will show in the bottom-right corner to let you sign in to Azure for the first time.
+1. In the output window, you'll see the Azure IoT Hub provisioned.
 
-6. Select Azure subscription. 
+   :::image type="content" source="media/iot-hub-create-use-iot-toolkit/iot-hub-provisioned.png" alt-text="A screenshot that shows the output window in VS Code." lightbox="media/iot-hub-create-use-iot-toolkit/iot-hub-provisioned.png":::
 
-7. Select resource group.
+1. Select or create a new IoT Hub Device in the Azure IoT Hub you provisioned.
 
-8. Select location.
+   :::image type="content" source="media/iot-hub-create-use-iot-toolkit/iot-device-provision.png" alt-text="A screenshot that shows the fourth prompt in choosing an existing IoT Hub in VS Code." lightbox="media/iot-hub-create-use-iot-toolkit/iot-device-provision.png":::
 
-9. Select pricing tier.
+   :::image type="content" source="media/iot-hub-create-use-iot-toolkit/select-iot-device.png" alt-text="A screenshot that shows an example of an existing IoT Hub in VS Code." lightbox="media/iot-hub-create-use-iot-toolkit/select-iot-device.png":::
 
-10. Enter a globally unique name for your IoT Hub.
+1. Now you have Azure IoT Hub provisioned and device created in it. Also the device connection string will be saved in VS Code.
 
-11. Wait a few minutes until the IoT Hub is created.
+   :::image type="content" source="media/iot-hub-create-use-iot-toolkit/provision-done.png" alt-text="A screenshot that shows IoT Hub details in the output window in VS Code." lightbox="media/iot-hub-create-use-iot-toolkit/provision-done.png":::
 
 ## Next steps
 
-Now you have deployed an IoT hub using the Azure IoT Tools for Visual Studio Code. To explore further, check out the following articles:
+Now that you've deployed an IoT hub using the Azure IoT Tools for Visual Studio Code, explore these articles:
 
 * [Use the Azure IoT Tools for Visual Studio Code to send and receive messages between your device and an IoT Hub](iot-hub-vscode-iot-toolkit-cloud-device-messaging.md).