How to Create an Azure Back-End for a Xamarin.Forms Application - Part Two

Introduction

 

Welcome to the second part of the article on "How to create an Azure Back-End for a Xamarin.Forms Application".

 

In the first part of the article, we've seen how to create:

• Resource Group
• Web App
• Azure SQL Database
• Azure Server 

You can read the first part here.

 

In this second part, we'll see how to,

• Deploy the SDK for .NET solutions to Azure.
• Connect a basic ToDo application built with Xamarin.Forms to the Azure Back-End and the Azure SQL Database.

For simplicity, we'll use the code shared in the related GitHub repository by Microsoft.

 

Prerequisites

• A Microsoft Azure Subscription (if you don't have one yet, see the Azure Portal for a free subscription).
• Microsoft Visual Studio 2019 (all versions).

Step 1 - Add the connection string to the Web App. 

 

First of all, we have to add the Azure SQL Database connection string to the Web App.

• Login into the Azure Portal with your credentials.
• Click on the name of the Web App (Type App Service)

•  Click on Configuration in the left-hand column.

•  Click on New connection string

• Compile the fields with the correct data and then click on save.

 

Step 2 - Deploy the SDK for .NET to Azure.

 

First, download the SDK for .NET, and the sample application from the related GitHub Repository.

• https://github.com/Azure/azure-mobile-apps-quickstarts

 Now, we'll work on Visual Studio:

•  Launch the IDE and select the folder we downloaded in the previous step.

• In Solution Explorer, expand the tree, as shown in the following picture.

• Open the ZUMOAPPNAME.sln solution and build it.
• Right-click on ZUMOAPPNAMEService and select Publish.

 

 

• Click on Start, then select App Service - Select Existing - Advanced.

 

• Insert the Connection String under MS_TableConnectionString, check Update database and save.

•  Now select the Web App created on Azure.

•  We'll see something like in the following picture.

•  Now, click on +Add in the Dependencies line, select Azure SQL Database and then click on next.

 

•  Compile the fields with the correct data and then click on finish.

•   We'll see something like the following.

•  Click on Publish to deploy the SDK for .NET to Azure.

 

Step 3 - Deploy the Xamarin.Forms Application.

 

Now we'll work on the Xamarin.Forms application.

• In Solution Explorer, expand the tree as shown in the following picture.

 

• Open the ZUMOAPPNAME.sln solution.
• Open the Contents.cs file.
• Replace the string after the @ with the WebApp URL we created on Azure.

 

 

•  Verify the build configuration for Android and iOS.

 

• Finally, launch the application (Ctrl + F5).
• Add a task to the Android or iOS application, then pull to refresh both the emulators and we'll see the added task in both the lists. 

 

 

SUCCESS!!! We've created an Azure back-end for our own Xamarin.Forms application.

 

Conclusion

 

In this article, we've seen how to:

• Deploy the SDK for .NET solutions on Azure.
• Connect a basic ToDo application built with Xamarin.Forms to the Azure Back-End and the Azure SQL Database.

How you have seen, we used the ready-to-use solutions from the GitHub Repository by Microsoft without modifying it, just for simplicity. 

 

Of course, this is the base for your own future projects where you want to create an Azure back-end for your Xamarin.Forms application, and

you can modify the code to do it (please, read the LICENSE.txt file).

 

Don't forget to delete the Resource Group from Azure when your test is completed to avoid unwanted costs (the procedure to do it is at the end of Part One of this article). 

 

Sources

• Microsoft Official Documentation,
  https://docs.microsoft.com/it-it/azure/app-service-mobile/app-service-mobile-xamarin-forms-get-started
  
  
• Related GitHub Repository
  https://github.com/Azure/azure-mobile-apps-quickstarts

Thank you for your time and your attention.