Welcome to the Xamarin Azure Challenge!
The goal is to create a serverless Azure Function and connect it to a Xamarin mobile app.
The challenge begins 23 September 2019, and ends at 2359 PT on 23 October 2019.
-
Ten (10) Grand Prizes:
- Each winner will receive Microsoft Surface Headphones
-
One Thousand (1,000) Prizes:
- Each winner will receive a 3-month Xbox Game Pass
Learn more about the challenge: https://github.com/xamarin/XamarinAzureChallenge/blob/master/TermsAndConditions.md
- Create and publish a serverless Azure Function
- Add the Azure Function url to the Xamarin.Forms application
- Submit your entry from the Xamarin.Forms application to your Azure Function
- Create Azure Suscription
- If you do not currently have an Azure subscription, sign up for a free Azure account that includes a $200 Azure Credit
- Install Visual Studio + Xamarin Tools
We have two options to retrieve the code for the Xamarin Azure Challenge:
To clone this repository, run this command in your favorite terminal:
git clone https://github.com/xamarin/XamarinAzureChallenge.git
To download the source clode, click this link: https://github.com/xamarin/XamarinAzureChallenge/archive/master.zip
Note: On a PC, save the source code in a folder close to your root directory, e.g.
C:\Code\
. If the folder path is too many characters long, you may get errors while publishing the code to the Azure Functions.
After cloning the repository, we have 3 options to create our Azure Function:
-
In Visual Studio on PC, open
XamarinAzureChallenge.sln
-
In Visual Studio, in the top toolbar, select File > Account Settings...
- In the Account Settings window, select Add an account...
Note: If your Azure account is already visible, you may skip this step
- In the Sign in to your account pop-up, log in to your Azure account
Note: If your Azure account was already visible, you may skip this step
- In the Account Settings window, select Close
-
In Visual Studio, in the Solution Explorer, right-click on Backend > XamarinAzureChallenge.Functions
-
In the right-click menu, select in Publish
- In the Pick a publish target window, select the following:
- Azure Functions Consumption Plan
- Create New
- In the Pick a publish target window, select Publish
- In the Create New window, enter the following information:
- Name: XamarinAzureChallenge-[Your Name]
- Note: Replace
[Your Name]
with your name to ensure the Azure Function name is unique - In this example, I'm using
XamarinAzureChallenge-Brandon
- Note: Replace
- Subscription: [Select your Azure Subscription]
- Resource Group
- New
- New resource group name: XamarinAzureChallenge
- OK
- New
- Location: [Select the Azure Data Center Closest To You]
- Azure Storage
- New
- Account Name: xamarinazure[Your Name]
- Note: Replace
[Your Name]
with your name to ensure the Azure Storage name is unique - In this example, I'm using "xamarinazurebrandon"
- Note: Replace
- Location: [Select the Azure Data Center Closest To You]
- Account type: Standard - Locally Redundant Storage
- OK
- Account Name: xamarinazure[Your Name]
- New
- In the Create New window, click Create
- Standby while Visual Studio creates our Azure Function resources
- In the Publish window, to push our code to the newly created Azure Function, select Publish
- In the Visual Studio Toolbar, select View > Output
- In the Output window, ensure it says
Publish: 1 succeeded
-
In Visual Studio for Mac, open
XamarinAzureChallenge.sln
-
In the Apple Menu Bar, select Visual Studio > Account...
- In the Account window, click Add...
Note: If your Azure account is already visible, you may skip this step
- In the Sign in to your account pop-up, sign into your Azure account
Note: If your Azure account was already visible, you may skip this step
- After logging into your Azure Account, in the Account window, select the red close button, X
-
In Visual Studio for Mac, in the Solution Explorer, right-click on Backend > XamarinAzureChallenge.Functions
-
In the right-click menu, select Publish > Publish to Azure...
-
In the Publish to Azure App Service window, select your Azure Account
-
In the Publish to Azure App Service window, select New
- In the Create New App Service on Azure window, enter the following information:
- App Service Name: XamarinAzureChallenge-[Your Name]
- Note: Replace
[Your Name]
with your name to ensure the App Service Name is unique - In this example, I'm using
XamarinAzureChallenge-Brandon
- Note: Replace
- Subscription: [Select your Azure Subscription]
- Resource Group
- Click the + symbol
- XamarinAzureChallenge
- Service Plan:
- Custom
- Plan Name: XamarinAzureChallenge
- Region: [Select the Azure Data Center Closest to you]
- Pricing: Consumption
- In the Create New App Service on Azure window, select Next
- In the Configure Storage Account window, enter the following information:
- Storage Account:
- Custom
- Account Name: xamarinazure[Your Name]
- Note: Replace
[Your Name]
with your name to ensure the Storage Account Name is unique - In this example, I'm using "xamarinazurebrandon"
- Note: Replace
- Account Type: Standard - Locally Redundant Storage
- In the Configure Storage Account window, select Create
- In the Create Azure App Service pop up, select OK
- In Visual Studio, in the menu bar, select View > Pads > Azure
- In Visual Studio, in the Azure pad, ensure the code is Deploying...
- Stand by while Visual Studio for Mac publishes our code to our Azure Function
As a prerequisite, you must install Azure Core Tools version 2.x and Azure CLI.
Alternatively, if you do not wish to install these tools locally, you can use these CLI tools pre-installed in a browser via the Azure Cloud Shell.
- Open the terminal
- In the terminal, enter the following command to login into Azure CLI:
az login
Note: Stand by until the Azure CLI opens your browser to the Azure Login page
-
In the automatically-opened browser window, on the Azure Login page, log into your Azure Account
-
In the terminal, enter the following command to create a new Azure Resource Group:
az group create --name XamarinAzureChallenge --location westeurope
Note: If you have more than one subscription you will need to especify the subscription in which the resource group will be created using
--subscription [your Azure Subscription ID]
- In the terminal, enter the following command to create a new Azure Storage Account:
az storage account create --name xamarinazure[Your Name] --location westeurope --resource-group XamarinAzureChallenge --sku Standard_LRS
Note: Replace
[Your Name]
with your name to ensure the storage name is uniqueNote: If you have more than one subscription you will need to especify the subscription in which the resource group will be created using
--subscription [your Azure Subscription ID]
- In the terminal, enter the following command to create a function app:
az functionapp create --resource-group XamarinAzureChallenge --consumption-plan-location westeurope --name XamarinAzureChallenge-[Your Name] --storage-account xamarinazure[Your Name] --runtime dotnet
Note: Replace
[Your Name]
with your name to ensure the functionapp name is uniqueNote: For
--storage-account
, use the storage account created in the previous stepNote: If you have more than one subscription you will need to especify the subscription in which the resource group will be created using
--subscription [your Azure Subscription ID]
Note: The Azure Function name must be unique, which is why we append our name
- In the terminal, enter the following command to navigate to the project folder
XamarinAzureChallenge.Functions
project folder.
- Windows
cd [Your Path to XamarinAzureChallengeSource Code]\src\XamarinAzureChallenge\XamarinAzureChallenge.Functions
- macOS
cd [Your Path to XamarinAzureChallengeSource Code]/src/XamarinAzureChallenge/XamarinAzureChallenge.Functions
- In the terminal, enter the following command to publish our code to our Azure Function:
func azure functionapp publish XamarinAzureChallenge-[Your Name]
Note: Replace
[Your Name]
with your name, using the same account name created earlier
Before our Azure Function can submit our entry for the XamarinAzureChallenge, we'll need to configure a few items.
Azure Functions allow us to store Environment Variables in the cloud that our Functions app can retrieve at runtime. In this step, we'll add the submission url as an Environment Variable.
-
In your browser, navigate to the Azure Portal
-
In the Azure Portal, on the left-hand menu, select the cube-shaped Resource Groups icon
-
In the Resource Groups window, in the filter box, enter
XamarinAzureChallenge
-
In the Resource Groups window, select the XamarinAzureChallenge Resource Group
- In the XamarinAzureChallenge Resource Group, select the function app XamarinAzureChallenge-[Your Name]
- In the XamarinAzureChallenge Function, in the Configured features frame, select Configuration
- In the Application Settings window, select + New application setting
- In the Add/Edit application setting window, enter the following data:
- Name: END_POINT
- Value: https://xamarinazurechallenge-backend.azurewebsites.net/api/SubmitChallengeResult
- In the Add/Edit application setting window, select OK
- In the Add/Edit application setting window, select the Save
- Stand by while the settings are saved
- In the Add/Edit application setting window, select the close button, X
To ensure a valid submisison, the Function App will verify the Azure Subscription ID using Managed Identity & Access Control. Let's enable both.
- In the XamarinAzureChallenge window, select Platform features
- In the Platform features window, select Identity
-
In the Identity window, in the System assigned tab, set the Status to On
-
In the Identity window, select Save
- In the confirmation popup, select Yes
- Stand by while System Assigned Identity is enabled
- In the Identity window, click the close button, X
- In the Platform features tab, select Access control (IAM)
- In the Access Control window, select +Add > Add role assignment
- In the right-hand fly-out menu Add role assignment, make the following selections:
- Role: Owner
- Assign Access to: Azure AD user, group or service principal
- Select: xamarinazurechallenge
- In the right-hand fly-out menu Add role assignment, select XamarinAzureChallenge-[Your Name]
- In the right-hand fly-out menu Add role assignment, select Save
After publishing our Azure Function, we are ready to configure our Xamarin app with our Azure Function's URL.
-
In your browser, navigate to the Azure Portal
-
In the Azure Portal, on the left-hand menu, select the cube-shaped Resource Groups icon
-
In the Resource Groups window, in the filter box, enter
XamarinAzureChallenge
-
In the Resource Groups window, select the XamarinAzureChallenge Resource Group
- In the XamarinAzureChallenge Resource Group, select the function app XamarinAzureChallenge-[Your Name]
- In the Function Apps window, select XamarinAzureChallenge > Functions > SubmitChallengeFunction
- In the SubmitChallengeFunction window, select Get function url
- In the Get function url window, select Copy
-
In Visual Studio, open
XamarinAzureChallenge.sln
-
In Visual Studio, in the Solution Explorer, open Mobile > XamarinAzureChallenge > ViewModels > UserDataViewModel.cs
-
In the UserDataViewModel editor, comment out the
#error
compiler directive by prepending//
:
//#error Missing Azure Function Endpoint Url. Replace "Enter Your Function API Url Here" with your Azure Function Endopint Url
- In the UserDataViewModel editor, paste your Azure Function Url to
private const string endpoint
:
private const string endpoint = "[Enter your Azure Function URL]";
Note: Replace
[Enter your Azure Function URL]
with the URL retrieved in the previous step
-
In Visual Studio, in the Solution Explorer, right-click on
XamarinAzureChallenge.Android
Note: To run the iOS app, right-click on
XamarinAzureChallenge.iOS
-
In the right-click menu, select Set As Startup Project
- In Visual Studio, at the top, select the arrow icon to build/deploy the app
- Ensure the app launches on your mobile device
-
Follow the instructions on the mobile app to complete the Xamarin Azure Challenge
-
Upon completing the challenge, ensure the success screen is displayed
You've successfully completed the Xamarin Azure Challenge. Keep an eye out for an email shortly!
If you found an issue with this challenge, please open an issue in this GitHub repo
If you are interested in learning more about this topic, you can refer to the following resources: