DEV Community

loading...
Cover image for Deploying an App with the Azure CLI
Microsoft Azure

Deploying an App with the Azure CLI

editingemily profile image Emily Freeman Updated on ・3 min read

Welcome to Azure April! Every day during the month of April, we'll be releasing an article on, well, Azure. The topics range but will cover:

  • Deploying to Azure
  • Blob Storage
  • Logic Apps
  • Machine Learning
  • Azure DevOps
  • ARM templates
  • Azure Functions
  • VS Code
  • Cosmos DB
  • IoT

And so much more. I'm glad you're here! I want to give a special shout out to Michael Crump for creating all the tips and tricks we've selected to highlight in Azure April.

For the first day, I've decided to kick us off with something relatively simple but important. And common! Deploying an app to Azure using only the CLI. This is one of the first things I learned when I started diving into Azure and I think builds the foundation of your Azure knowledge.

Thanks for joining us! You can always find me on Twitter.

For more information on the Azure CLI, start here.


While I love working with the Azure Portal or even Visual Studio, it is sometimes nice to do everything from the command line. In this tutorial, we'll be using a Linux VM and BASH to do everything.

Don't have Azure? Grab a free subscription.

Step 1

Ensure you have the following stack installed.

mbcrump@crumplinux:~$ git --version
git version 2.7.4
mbcrump@crumplinux:~$ nodejs --version
v4.2.6
mbcrump@crumplinux:~$ npm --version
3.5.2
mbcrump@crumplinux:~$ gulp --version
[20:05:28] CLI version 1.4.0
[20:05:28] Local version 3.9.1
mbcrump@crumplinux:~$ mongod --version
db version v2.6.10
2017-09-20T20:11:43.087+0000 git version: nogitversion
2017-09-20T20:11:43.095+0000 OpenSSL version: OpenSSL 1.0.2g  1 Mar 2016

Step 2

Create a folder such as webapp and then $ cd webapp.

Step 3

Run the following command in the webapp folder.

git clone https://github.com/crpietschmann/jsQuizEngine.git.

This is a JavaScript based quiz engine by Chris Pietschmann.

Step 4

Change your working directory to jsQuizEngine/src and now we’ll need to create a deployment user that can deploy web app through git.

az webapp deployment user set --user-name {your-username} --password {your-password}
Name    PublishingUserName
------  --------------------
web     mbcrump

Step 5

We’ll need a resource group. I’m going to put mine in the West US.

az group create --name StaticResourceGroup --location "West US"
Location    Name
----------  -------------------
westus      StaticResourceGroup

Step 6

We’ll also need an Azure App Service Plan. I’ll use the free one for this example.

az appservice plan create --name StaticAppServicePlan --resource-group StaticResourceGroup --sku FREE
AppServicePlanName    GeoRegion    Kind    Location      MaximumNumberOfWorkers  Name                  ProvisioningState    ResourceGroup        Status    Subscription
--------------------  -----------  ------  ----------  ------------------------  --------------------  -------------------  -------------------  --------  ------------------------------------
StaticAppServicePlan  West US      app     West US                            1  StaticAppServicePlan  Succeeded            StaticResourceGroup  Ready     d1ecc7ac-c1d8-40dc-97d6-2507597e7404

Step 7

We’ll create an Azure Web App and deploy it using local git.

Remember! Your URL will be unique and different than the ones you see in the example snippets.

az webapp create --name MyQuizApplication --resource-group StaticResourceGroup --plan StaticAppServicePlan --deployment-local-git

You should see something like this in the output:

Local git is configured with url of 'https://mbcrump@myquizapplication.scm.azurewebsites.net/MyQuizApplication.git' 

Copy and paste this to your editor of choice.

Step 8

We'll need to add azure as a remote repository so that we can easily push updates from our local git repository. Be sure to update the command below to your specific credentials and unique URL.

git remote add azure https://mbcrump@myquizapplication.scm.azurewebsites.net/MyQuizApplication.git

Step 9

Push the changes.

git push azure master

Step 10

Nice! We can now browse to our new site.

Once you get a hang of using the CLI, then these steps become natural.

Want to dig further into the Azure CLI? Start here.


We'll be posting articles every day in April, so stay tuned or jump ahead and check out more tips and tricks now.

Discussion (0)

pic
Editor guide