Skip to content

Commit 6ecb4e4

Browse files
authored
Merge pull request #192110 from rachana-satao/RAS-branch-1
Update after review
2 parents 435fbcd + 7384084 commit 6ecb4e4

File tree

1 file changed

+25
-24
lines changed

1 file changed

+25
-24
lines changed

articles/app-service/quickstart-nodejs.md

Lines changed: 25 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,10 @@ title: 'Quickstart: Create a Node.js web app'
33
description: Deploy your first Node.js Hello World to Azure App Service in minutes.
44
ms.assetid: 582bb3c2-164b-42f5-b081-95bfcb7a502a
55
ms.topic: quickstart
6-
ms.date: 03/10/2022
6+
ms.custom: mvc, devcenter, seodec18, devdivchpfy22
7+
#zone_pivot_groups: app-service-platform-windows-linux
8+
ms.date: 03/22/2022
79
ms.devlang: javascript
8-
ms.custom: mvc, devcenter, seodec18, mode-api
910
#zone_pivot_groups: app-service-ide-oss
1011
zone_pivot_groups: app-service-vscode-cli-portal
1112
---
@@ -45,12 +46,12 @@ This quickstart configures an App Service app in the **Free** tier and incurs no
4546
::: zone-end
4647
## Create your Node.js application
4748

48-
In this step, you create a starter Node.js application and make sure it runs on your computer.
49+
In this step, you create a basic Node.js application and ensure it runs on your computer.
4950

5051
> [!TIP]
5152
> If you have already completed the [Node.js tutorial](https://code.visualstudio.com/docs/nodejs/nodejs-tutorial), you can skip ahead to [Deploy to Azure](#deploy-to-azure).
5253
53-
1. Create a simple Node.js application using the [Express Generator](https://expressjs.com/starter/generator.html), which is installed by default with Node.js and NPM.
54+
1. Create a Node.js application using the [Express Generator](https://expressjs.com/starter/generator.html), which is installed by default with Node.js and NPM.
5455

5556
```bash
5657
npx express-generator myExpressApp --view ejs
@@ -89,7 +90,7 @@ Before you continue, ensure that you have all the prerequisites installed and co
8990
9091
#### Sign in to Azure
9192
92-
1. In the terminal, make sure you're in the *myExpressApp* directory, then start Visual Studio Code with the following command:
93+
1. In the terminal, ensure you're in the *myExpressApp* directory, then start Visual Studio Code with the following command:
9394

9495
```bash
9596
code .
@@ -112,14 +113,14 @@ Before you continue, ensure that you have all the prerequisites installed and co
112113

113114
:::image type="content" source="media/quickstart-nodejs/deploy.png" alt-text="Screenshot of the Azure App service in Visual Studio Code showing the blue arrow icon selected.":::
114115

115-
1. Choose the *myExpressApp* folder.
116+
1. Select the *myExpressApp* folder.
116117

117118
# [Deploy to Linux](#tab/linux)
118119

119-
3. Choose **Create new Web App**. A Linux container is used by default.
120+
3. Select **Create new Web App**. A Linux container is used by default.
120121
1. Type a globally unique name for your web app and press **Enter**. The name must be unique across all of Azure and use only alphanumeric characters ('A-Z', 'a-z', and '0-9') and hyphens ('-').
121122
1. In Select a runtime stack, select the Node.js version you want. An **LTS** version is recommended.
122-
1. In Select a pricing tier, select **Free (F1)** and wait for the the resources to be provisioned in Azure.
123+
1. In Select a pricing tier, select **Free (F1)** and wait for the resources to be provisioned in Azure.
123124
1. In the popup **Always deploy the workspace "myExpressApp" to \<app-name>"**, select **Yes**. This way, as long as you're in the same workspace, Visual Studio Code deploys to the same App Service app each time.
124125
125126
While Visual Studio Code provisions the Azure resources and deploys the code, it shows [progress notifications](https://code.visualstudio.com/api/references/extension-guidelines#notifications).
@@ -128,7 +129,7 @@ Before you continue, ensure that you have all the prerequisites installed and co
128129
129130
# [Deploy to Windows](#tab/windows)
130131
131-
3. Choose **Create new Web App... Advanced**.
132+
3. Select **Create new Web App... Advanced**.
132133
1. Type a globally unique name for your web app and press **Enter**. The name must be unique across all of Azure and use only alphanumeric characters ('A-Z', 'a-z', and '0-9') and hyphens ('-').
133134
1. Select **Create a new resource group**, then enter a name for the resource group, such as *AppServiceQS-rg*.
134135
1. Select the Node.js version you want. An **LTS** version is recommended.
@@ -164,7 +165,7 @@ Before you continue, ensure that you have all the prerequisites installed and co
164165
165166
:::zone target="docs" pivot="development-environment-cli"
166167
167-
In the terminal, make sure you're in the *myExpressApp* directory, and deploy the code in your local folder (*myExpressApp*) using the [az webapp up](/cli/azure/webapp#az-webapp-up) command:
168+
In the terminal, ensure you're in the *myExpressApp* directory, and deploy the code in your local folder (*myExpressApp*) using the [az webapp up](/cli/azure/webapp#az-webapp-up) command:
168169

169170
# [Deploy to Linux](#tab/linux)
170171

@@ -180,12 +181,12 @@ az webapp up --sku F1 --name <app-name> --os-type Windows
180181

181182
-----
182183

183-
- If the `az` command isn't recognized, be sure you have the Azure CLI installed as described in [Set up your initial environment](#set-up-your-initial-environment).
184+
- If the `az` command isn't recognized, ensure you have the Azure CLI installed as described in [Set up your initial environment](#set-up-your-initial-environment).
184185
- Replace `<app_name>` with a name that's unique across all of Azure (*valid characters are `a-z`, `0-9`, and `-`*). A good pattern is to use a combination of your company name and an app identifier.
185186
- The `--sku F1` argument creates the web app on the Free pricing tier, which incurs a no cost.
186187
- You can optionally include the argument `--location <location-name>` where `<location_name>` is an available Azure region. You can retrieve a list of allowable regions for your Azure account by running the [`az account list-locations`](/cli/azure/appservice#az_appservice_list_locations) command.
187188
- The command creates a Linux app for Node.js by default. To create a Windows app instead, use the `--os-type` argument.
188-
- If you see the error, "Could not auto-detect the runtime stack of your app," make sure you're running the command in the *myExpressApp* directory (See [Troubleshooting auto-detect issues with az webapp up](https://github.com/Azure/app-service-linux-docs/blob/master/AzWebAppUP/runtime_detection.md)).
189+
- If you see the error, "Could not auto-detect the runtime stack of your app," ensure you're running the command in the *myExpressApp* directory (See [Troubleshooting auto-detect issues with az webapp up](https://github.com/Azure/app-service-linux-docs/blob/master/AzWebAppUP/runtime_detection.md)).
189190
190191
The command may take a few minutes to complete. While running, it provides messages about creating the resource group, the App Service plan, and the app resource, configuring logging, and doing ZIP deployment. It then gives the message, "You can launch the app at http://&lt;app-name&gt;.azurewebsites.net", which is the app's URL on Azure.
191192

@@ -231,15 +232,15 @@ Sign in to the Azure portal at https://portal.azure.com.
231232
:::image type="content" source="./media/quickstart-nodejs/portal-search.png?text=Azure portal search details" alt-text="Screenshot of portal search":::
232233
233234
1. In the **App Services** page, select **Create**.
234-
1. In the **Basics** tab, under **Project details**, make sure the correct subscription is selected and then choose to **Create new** resource group. Type *myResourceGroup* for the name.
235+
1. In the **Basics** tab, under **Project details**, ensure the correct subscription is selected and then select to **Create new** resource group. Type *myResourceGroup* for the name.
235236
236237
:::image type="content" source="./media/quickstart-nodejs/project-details.png" alt-text="Screenshot of the Project details section showing where you select the Azure subscription and the resource group for the web app":::
237238
238-
1. Under **Instance details**, type a globally unique name for your web app and select **Code**. Choose *Node 14 LTS* **Runtime stack**, an **Operating System**, and a **Region** you want to serve your app from.
239+
1. Under **Instance details**, type a globally unique name for your web app and select **Code**. Select *Node 14 LTS* **Runtime stack**, an **Operating System**, and a **Region** you want to serve your app from.
239240
240241
:::image type="content" source="./media/quickstart-nodejs/instance-details.png" alt-text="Screenshot of the Instance details section where you provide a name for the virtual machine and select its region, image and size":::
241242
242-
1. Under **App Service Plan**, choose to **Create new** App Service Plan. Type *myAppServicePlan* for the name. To change to the Free tier, click **Change size**, select **Dev/Test** tab, select **F1**, and select the **Apply** button at the bottom of the page.
243+
1. Under **App Service Plan**, select **Create new** App Service Plan. Type *myAppServicePlan* for the name. To change to the Free tier, select **Change size**, select **Dev/Test** tab, select **F1**, and select the **Apply** button at the bottom of the page.
243244
244245
:::image type="content" source="./media/quickstart-nodejs/app-service-plan-details.png" alt-text="Screenshot of the Administrator account section where you provide the administrator username and password":::
245246
@@ -255,9 +256,9 @@ Sign in to the Azure portal at https://portal.azure.com.
255256
256257
### Get FTP credentials
257258
258-
Azure App Service supports [**two types of credentials**](deploy-configure-credentials.md) for FTP/S deployment. These credentials are not the same as your Azure subscription credentials. In this section, you get the *application-scope credentials* to use with FileZilla.
259+
Azure App Service supports [**two types of credentials**](deploy-configure-credentials.md) for FTP/S deployment. These credentials aren't the same as your Azure subscription credentials. In this section, you get the *application-scope credentials* to use with FileZilla.
259260

260-
1. From the App Service app page, click **Deployment Center** in the left-hand menu and select **FTPS credentials** tab.
261+
1. From the App Service app page, select **Deployment Center** in the left-hand menu and select **FTPS credentials** tab.
261262

262263
:::image type="content" source="./media/quickstart-nodejs/ftps-deployment-credentials.png" alt-text="FTPS deployment credentials":::
263264

@@ -267,7 +268,7 @@ Azure App Service supports [**two types of credentials**](deploy-configure-crede
267268

268269
:::image type="content" source="./media/quickstart-nodejs/filezilla-ftps-connection.png" alt-text="FTPS connection details":::
269270

270-
1. Click **Connect** in FileZilla.
271+
1. Select **Connect** in FileZilla.
271272

272273
### Deploy files with FTP
273274

@@ -330,11 +331,11 @@ You can deploy changes to this app by making edits in Visual Studio Code, saving
330331
331332
You can stream log output (calls to `console.log()`) from the Azure app directly in the Visual Studio Code output window.
332333
333-
1. In the **App Service** explorer, right-click the app node and choose **Start Streaming Logs**.
334+
1. In the **App Service** explorer, right-click the app node and select **Start Streaming Logs**.
334335
335336
![Start Streaming Logs](./media/quickstart-nodejs/view-logs.png)
336337
337-
1. If asked to restart the app, click **Yes**. Once the app is restarted, the Visual Studio Code output window opens with a connection to the log stream.
338+
1. If asked to restart the app, select **Yes**. Once the app is restarted, the Visual Studio Code output window opens with a connection to the log stream.
338339
339340
1. After a few seconds, the output window shows a message indicating that you're connected to the log-streaming service. You can generate more output activity by refreshing the page in the browser.
340341

@@ -373,7 +374,7 @@ To stop log streaming at any time, press **Ctrl**+**C** in the terminal.
373374
374375
You can access the console logs generated from inside the app and the container in which it runs. You can stream log output (calls to `console.log()`) from the Node.js app directly in the Azure portal.
375376
376-
1. In the same **App Service** page for your app, use the left menu to scroll to the *Monitoring* section and click **Log stream**.
377+
1. In the same **App Service** page for your app, use the left menu to scroll to the *Monitoring* section and select **Log stream**.
377378
378379
:::image type="content" source="./media/quickstart-nodejs/log-stream.png" alt-text="Screenshot of Log stream in Azure App service.":::
379380
@@ -390,7 +391,7 @@ You can access the console logs generated from inside the app and the container
390391
2021-10-26T21:04:08.614403210Z: [INFO]
391392
2021-10-26T21:04:08.614407110Z: [INFO] export NODE_PATH=/usr/local/lib/node_modules:$NODE_PATH
392393
2021-10-26T21:04:08.614411210Z: [INFO] if [ -z "$PORT" ]; then
393-
2021-10-26T21:04:08.614415310Z: [INFO] export PORT=8080
394+
2021-10-26T21:04:08.614415310Z: [INFO] export PORT=8080
394395
2021-10-26T21:04:08.614419610Z: [INFO] fi
395396
2021-10-26T21:04:08.614423411Z: [INFO]
396397
2021-10-26T21:04:08.614427211Z: [INFO] node /opt/startup/default-static-site.js
@@ -439,7 +440,7 @@ The `--no-wait` argument allows the command to return before the operation is co
439440
440441
When no longer needed, you can delete the resource group, App service, and all related resources.
441442
442-
1. From your App Service *overview* page, click the *resource group* you created in the [Create Azure resources](#create-azure-resources) step.
443+
1. From your App Service *overview* page, select the *resource group* you created in the [Create Azure resources](#create-azure-resources) step.
443444
444445
:::image type="content" source="./media/quickstart-nodejs/resource-group.png" alt-text="Resource group in App Service overview page":::
445446
@@ -468,4 +469,4 @@ Check out the other Azure extensions.
468469
* [Azure Resource Manager Tools](https://marketplace.visualstudio.com/items?itemName=msazurermtools.azurerm-vscode-tools)
469470
470471
Or get them all by installing the
471-
[Node Pack for Azure](https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-node-azure-pack) extension pack.
472+
[Node Pack for Azure](https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-node-azure-pack) extension pack.

0 commit comments

Comments
 (0)