DEV Community

Cover image for How to deploy a Node.js app to Azure
Joe Steinbring
Joe Steinbring

Posted on

How to deploy a Node.js app to Azure

So far, we haven't talked much about Azure or Node.js on either of my blogs. The only Azure-specific post that I could find was the MS is EOLing Azure Functions which use .NET Core 3.1 on December 3 from July. I figured that we would address that, today. In today's tutorial, we are going to be covering how to deploy a node app to Azure using the command-line.

Prerequisites: Node, NPM, and Azure CLI

Before we go any further, you should make sure that you have node and NPM installed and that you have the Azure CLI installed. You can see if you have node installed by running node --version from the terminal.

node --version

Step 1: Create a Node.js app to deploy

For this example, we'll use the Express Generator. You can create your new app by running npx express-generator node-example --view ejs.

npx express-generator node-example --view ejs

Next, if you cd node-example && npm install, you will navigate into the project folder and install the dependencies.

cd node-example && npm install

At this point, you can run the server by just running npm start.

npm start

If you want to get the debugging info also, you can alternately run DEBUG=node-example:* npm start.

DEBUG=node-example:* npm start

With the server running, you can see the output at http://localhost:3000/.

http://localhost:3000/

Step 2: Change the server port

As you can see above, the server is using port 3000 but if you open bin/www and look for process.env.PORT, you can change what port the startup script uses.

process.env.PORT

If we are going to deploy this to Azure, we should probably change that to 80.

Step 3: Deploy to Azure

From within the project folder, you can deploy the project by running az webapp up --sku F1 --name <unique-project-name>. The <unique-project-name> bit must be a value that is unique across all of azure and contain only characters that are a-z, 0-9, and -. The F1 SKU is on their free-pricing tier.

az webapp up --sku F1 --name JWS-Node-Example

At this point, your node app is live. You can see the demo app at http://jws-node-example.azurewebsites.net.

https://jws-node-example.azurewebsites.net/

Step 4: Redeploying to Azure

The next, natural question is how to redeploy the app after you make changes to it. If we look at routes/index.js, the variable title is set to the value "Express" on line 6.

routes/index.js

If we change that value to "Flavortown", it should change the output on the site. To save your changes to Azure, you can use the terminal command az webapp up.

az webapp up

You will notice that the command that we used had no arguments. If you look into .azure/config within the project folder, the details are defined there. If you need to change something, you can do it there.

.azure/config

Now, our demo site says "Welcome to Flavortown".

https://jws-node-example.azurewebsites.net/

Have any questions, comments, or concerns? See something that I am doing wrong here? Please feel free to drop a comment, below. I am by no means an expert in Node or Azure but hopefully we can help each other.

[ Cover photo by Arget on Unsplash ]

Top comments (0)