DEV Community

Bablu Lawrence
Bablu Lawrence

Posted on

A Starter template for React & ASP.NET Core App in Azure

So you are thinking of building an app using React, ASP.NET Core and deploy to Azure.

That should be simple isn't it?

No, not likely if you are building something to put in production; because in that situation you (or InfoSec) will have several of following ideas, perfectly reasonable in themselves :

  • Lets use newest React and .NET Core features.
  • Database? Obviously Azure SQL Db.
  • Azure Search and Azure Redis Cache will make my app really fast.
  • Users really want SSO, so we should use OpenId Connect, OAuth 2.0, Azure AD, MFA ...
  • Definitely no keys, secrets and passwords in config files.
  • CI/CD is a given.
  • We will fully automate cloud provisioning.
  • MVP in 12 weeks, Yey 😃!

However, together this is a lot of work. For example:

How app will access Azure Search and Redis Cache? The best practice is to use Azure Managed Service Identity(MSI). However MSI is not supported for these services yet. That leads to Azure Key Vault; you can store the keys in Key Vault and retrieve them using MSI from the app. But can Key Vault be used for storing Azure SQL DB passwords as well? You can, but SQL DB does support MSI so it is better to use that.

How about provisioning? You can use ARM templates, Azure PowerShell or Azure CLI. However if you goal is to achieve 100% automation and CI/CD then you probably need all 3.

and there are more like this...

Lot of this complexity is accidental in nature and has nothing to do with the success or failure of your app i.e. the solution to the problem you are trying to solve. Does that mean you can push it towards later in the development? Not advisable, you probably will under estimate the effort and risks and end up in trouble.

So what is the solution?

Ironically, good news lies in the nature of the problem. As mentioned above, lot of this complexity has nothing to do with with your problem you are trying to solve. That means if you have a set of patterns that solve them you can carry them to your next app, provided you structure your code and deployment appropriately.

Having been there recently, I built a template encapsulating the solutions for my future self. You might find it useful. Here it is:

GitHub logo bablulawrence / starter-react-dotnetcore

React ASP.NET Core MVC application template for Microsoft Azure

A Starter template for React & ASP.NET Core App in Azure

Building a React & ASP.NET Core app and deploying to Azure is rather straight forward. However building one ready ready for production can become quite complicated because you might want to:

  • Use additional services like Azure Storage, Azure Search, Azure Redis cache and therefore need a scalable way to add the service APIs to your application code.
  • Implement best practices for accessing these services from your app, such as Azure Managed Service Identity(MSI) and Azure Key Vault.
  • Implement Authentication using Azure AD, Single Sign On(SSO), OpenId Connect, OAuth 2.0, MFA etc.
  • Fully automate provisioning of Azure resources.
  • Implement CI/CD.

This is a template app, created with the intent of solving some of these problems, helpful for quick starting React & ASP.NET development in Azure. The core domain is kept as plain CRUD, so that it can be refactored to…

Top comments (0)