Task-Based Consumer Mobile App

Solution Idea

If you'd like to see us expand this article with more information (implementation details, pricing guidance, code examples, etc), let us know with GitHub Feedback!

This consumer mobile app architecture uses Azure App Service Mobile Apps to simplify authentication with multiple social identity providers, store data and sync it for offline access, and send push notifications.

The app is built with Visual Studio (PC or Mac) and Xamarin, sharing C# code across Android, iOS, and Windows without compromising user experience. Visual Studio App Center is used to automate builds and tests and distribute to beta testers and app stores, while also providing usage monitoring and analytics in conjunction with App Insights.

The links to the right provide documentation on deploying and managing the Azure products listed in the solution architecture above.

Visual Studio Team Services

Visual Studio

Visual Studio Tools for Xamarin

Application Insights

Visual Studio App Center

App Service Mobile Apps

Architecture

Architecture diagram Download an SVG of this architecture.

Data Flow

  1. Create the mobile app using Visual Studio and Xamarin.
  2. Create and configure a new Mobile Apps back end on the Azure portal, or through Visual Studio, and configure the solution in Visual Studio to communicate with the back end.
  3. Implement authentication through social identity providers.
  4. Create a model-driven data structure through the App Service APIs and SDK.
  5. Implement offline sync to make the mobile app functional without a network connection.
  6. If you created the back end in Visual Studio, you can publish the app service directly from Visual Studio (PC or Mac).
  7. Store the solution source code with your source control provider of choice.
  8. Build and test the app through Visual Studio App Center and publish it.
  9. Use Application Insights to monitor the App Service.

Components

  • Build the web front end, mobile apps, and back end services with C# in Visual Studio 2017 or Visual Studio for Mac.
  • Xamarin: Create mobile apps for iOS and Android using C# and Azure SDKs.
  • Visual Studio App Center: App Center enables a continuous integration and deployment workflow by pulling code from BitBucket, GitHub, and Visual Studio Team Services.
  • App Service: The client app uses one of the mobile client SDKs to connect to an Azure Mobile App backend. The client SDKs have built-in support for offline sync and authentication, making it much easier to build a full-featured app.
  • Application Insights: Detect issues, diagnose crashes, and track usage in your web app with Application Insights. Make informed decisions throughout the development lifecycle.
  • Azure SQL Database: Structured data is stored in SQL Database, a cloud relational database service, which supports transactions and efficient querying.
  • Offline sync: Use the offline data sync feature of the Azure Mobile App client SDKs to create responsive and robust apps that remain useful even when there are network issues.
  • Identity Provider: Use App Service authentication/authorization to integrate with a social or enterprise identity provider.

Next steps