开源软件名称（OpenSource Name）：

开源软件地址(OpenSource Url)：

开源编程语言(OpenSource Language)：

开源软件介绍(OpenSource Introduction)：

Mobile Apps of Tomorrow

In this workshop you will build a cloud-connected, AI powered mobile app that runs on iOS, Android and UWP using Xamarin and Xamarin.Forms.

The app you are creating is called Happy Xamarin Developers and is a social-media style image sharing app to share photos of happy Xamarin developers with the world. This app uses a number of Azure cloud services, including Authentication, Cognitive Services, Functions, Blob storage and CosmosDB.

Prerequisites

• Please make sure you have run through the setup prerequisites to configure your development environment before working through this workshop.

• You will also need an Azure account to configure the services required. These services will either be using free tiers, or be very cheap and only needed for the duration of the workshop. If you do not already have an Azure account, you can sign up for a free Azure account to get US$200 of credit on all services for 30 days, plus 12 months of free access for popular services, and unlimited access to 25 free services.

• This app will be authenticated using Facebook. You will need a Facebook account to both configure the authentication, and for all the users who will log in.

• This workshop was written using Visual Studio 2017 v15.7 and Visual Studio for Mac 7.5. If you are using a newer version then the menus, options and dialogs might be different. If you are using an older version, then please update your install if you have any problems.

• This workshop assumes you have at least a basic familiarity with C# and Visual Studio.

What you will learn

In this lab you will learn how to create a simple, multi-page Xamarin.Forms app that runs on iOS, Android and UWP.

You will learn how to use plug-ins to take advantage or hardware specific features such as the camera, how to use Cognitive Services, and how to wire up an app to a back-end built using Azure functions and Blob storage. On the back-end side, you will learn how to create an API using Azure functions, behind a mobile app service that provides authentication, and how to connect this API up to Cognitive Services, Blob storage and CosmosDB (a globally distributed database system running on Azure).

Disclaimer

In this workshop, your instructors will provide you guidance based on many years of experience doing mobile cross platform development with Xamarin. Of course within one single day, we cannot implement all the best practices in development, continuous integration, testing, QA, etc. This workshop is an introduction to cross-platform development with Xamarin and Azure which will get you started you into this fantastic world.

The examples are not production quality - for example you won't be handling exceptions anywhere in the code. You will also be writing functions inside the Azure portal and configuring services directly, whereas in a production app you would want to use CI/CD using services like VSTS and tools like the Azure Resource Manager.

We will also not be considering security in too much detail, beyond securing functions behind facebook authentication. For a production app, please refer to the Azure Security documentation and consider using tools like Azure Key Vault.

For more information on best practices and getting your app to a professional level, we recommend checking the Xamarin University courses.

Steps

The individual steps are linked below.

1. Create the solution
2. Set up an Azure Functions app
3. Create an Azure Service inside the mobile app
4. Create the Login page
5. Wire up the camera using a Xamarin plugin
6. Detect faces and emotion using the Azure FaceAPI
7. Configure storage using Blob storage and CosmosDB
8. Create an Azure Function to save the photos to blob storage
9. Create a blob storage trigger to analyze the photos and save the results to Cosmos DB
10. Create some Azure Functions to retrieve photos
11. Download photos to the mobile app
12. Show the photos on the mobile app
13. Improve the UI
14. Cleaning up

Cleaning up

During this workshop you will have created different Azure services, and some have an associated cost. The final step contains instructions to clean up these resources, so to save paying unnecessarily, remember to work through this step to delete the resource group you created regardless of how far through the workshop you manage to get.

Further reading

You can find links to relevant documentation below:

• Xamarin
• Azure Functions
• Blog Storage
• CosmosDB
• AppCenter
• Cognitive services

Contributors

This lab was built by Jim Bennett, Laurent Bugnion and Brandon Minnick.

Version History