DevTest & DevOps in the Cloud - Prague, 2017

November 14, 2017

During my talk in Prague on November 15th 2017 I show the following examples of Azure Management using the command line tools (CLI), Azure Resource Manager (ARM) and PowerShell (PS).

Azure CLI

Install Azure CLI. I used Bash for Ubuntu on Windows:

echo "deb [arch=amd64] https://packages.microsoft.com/repos/azure-cli/ wheezy main" | \
     sudo tee /etc/apt/sources.list.d/azure-cli.list
sudo apt-key adv --keyserver packages.microsoft.com --recv-keys 52E16F86FEE04B979B07E28DB02C46DF417A0893
sudo apt-get install apt-transport-https
sudo apt-get update && sudo apt-get install azure-cli

Try az to check that it works properly.

Login to Azure:

az login
az account set -s "Name"

Create Resource Group:

az group create -n CliDemo -l northeurope

Create App Service:

az appservice plan create -n CliAppServicePlan -g CliDemo --sku B1
az webapp create -n CliApp -g CliDemo -p CliAppServicePlan

Check the created WebApp:

az webapp list
az webapp list --out table
az webapp list --out table | grep Cli

Switch to interactive mode:

az interactive

Create a deployment slot:

az webapp deployment slot create -n CliApp -g CliDemo -s Staging

... doesn't work - requires the App Service Plan to be at least S1:

az appservice plan update -n CliAppService -g CliDemo --sku S1
az webapp deployment slot create -n CliApp -g CliDemo -s Staging

Set up deployment from GitHub:

az webapp deployment source config -n CliApp -g CliDemo -s Staging --repo-url https://github.com/msimecek/AzureCliWeb.git --branch master --git-token <GitHub personal access token>

Swap Staging to Production:

az webapp deployment slot swap -n CliApp -g CliDemo -s Staging

Scale up to 2 instances:

az appservice plan update -n CliAppService -g CliDemo --number-of-workers 2

PowerShell

Install Azure PowerShell (works on Linux and Mac too!).

Login:

Login-AzureRmAccount
Select-AzureRmSubscripton -Subscription "Name"

Resource group:

New-AzureRmResourceGroup -Name PsDemo -Location northeurope

Azure Resource Manager

In Visual Studio 2017 with Azure SDK:

File -> New -> Project... -> Cloud -> Azure Resource Group
Web app template

Remove Alert rules.

Add new parameter:

    "webAppName": {
      "type": "string",
      "minLength": 3
    },

Change webSiteName variable to:

"webSiteName": "[concat(parameters('webAppName'), uniqueString(resourceGroup().id))]"

Add resources to the website:

      "resources": [
        {
          "apiVersion": "2015-08-01",
          "type": "config",
          "name": "web",
          "dependsOn": [
            "[concat('Microsoft.Web/Sites/', variables('webSiteName'))]"
          ],
          "properties": {
            "appSettings": [
              {
                "name": "TEST_SETTING",
                "value": "Hello"
              }
            ]
          }
        }
      ]

Go to Azure Portal.

+ New -> Template Deployment -> Create
Edit Template -> Copy/Paste -> Save

Fill in parameter values and Purchase. Web App will be deployed.

ARM templates are differential, so to change the number of workers, you would simply deploy a template with different number in sku.capacity.

Tip: Go to https://resources.azure.com to browse your Resource Manager resources and see their JSON representation.


Visual Studio Mobile Cetner

Portal https://mobile.azure.com

New Windows (UWP) application

Show around the portal - sections, empty datasets.

Analytics

Copy Analytics code.

In Visual Studio 2017 create a new Universal Windows app.

Paste Analytics code at the end of constructor:

App.xaml.cs:

public App()
{
    this.InitializeComponent();
    this.Suspending += OnSuspending;

    MobileCenter.Start("<app id>", typeof(Analytics));
}

Run app, see on the portal that Analytics come in.

Custom Events

Add Button to MainPage.xaml.

Implement Click handler:

Analytics.TrackEvent("Clicked", new Dictionary<string, string>() { { "Count", clickCount++.ToString() } });

Add global field to the MainPage class:

private int clickCount = 1;

Push Notifications

Associate with Windows Store (Store -> Associate App with the Store).

Add NuGet package Microsoft.Azure.Mobile.Push.

App.xaml.cs:

protected override void OnLaunched(LaunchActivatedEventArgs e)
{
  ...
  MobileCenter.Start("<app id>", typeof(Push));
  Push.CheckLaunchedFromNotification(e);
}

MainPage.xaml.cs:

public MainPage()
{
    this.InitializeComponent();

    Push.PushNotificationReceived += (sender, ev) =>
    {
        Debug.WriteLine(ev.Title + ": " + ev.Message);

        if (ev.CustomData != null && ev.CustomData.ContainsKey("Color"))
        {
            var color = ev.CustomData["Color"];
            Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, () => {
                mainGrid.Background = GetColorFromHex(color);
            });
        }
    };
}

public static Windows.UI.Xaml.Media.SolidColorBrush GetColorFromHex(string hexaColor)
{
    return new Windows.UI.Xaml.Media.SolidColorBrush(
        Windows.UI.Color.FromArgb(
            255,
            Convert.ToByte(hexaColor.Substring(1, 2), 16),
            Convert.ToByte(hexaColor.Substring(3, 2), 16),
            Convert.ToByte(hexaColor.Substring(5, 2), 16)
        )
    );
}

App Registration Portal -> find new app -> copy Application Secret & Package SID.

Mobile Center portal -> new Windows app -> Push -> add Secret & SID to settings.

Build

Go to Build and link VSTS repo & queue new build

Set up a Distribution group called Beta testers

Add test account (MSA).

Distribute finished build.

Show that the test account is able to access it.


Command-line tools:

npm install -g mobile-center

API: https://docs.mobile.azure.com/api/

Found something inaccurate or plain wrong? Was this content helpful to you? Let me know!

šŸ“§ codez@deedx.cz