Refactor Azure deployment documentation to improve conditional logic for Blazor and API applications

docs/en/solution-templates/layered-web-application/deployment/azure-deployment/step1-create-azure-resources.md

@@ -15,7 +15,9 @@ To create a new Azure Web App Service, choose one of the following options:
 
 - [Create a new Azure Web App Service using the Terraform Template](terraform-web-app-service.md) (If you have experience with Terraform)
 
-{{ if UI == "BlazorServer" || UI == "MVC" || UI == "BlazorWebApp" && Tiered == "No" }}
+{{ if Tiered == "No" }}
+
+{{ if UI == "BlazorServer" || UI == "MVC" || UI == "BlazorWebApp"}}
 
 ### Create a new Azure Web App service using the Azure Portal
 
@@ -39,10 +41,7 @@ To create a new Azure Web App Service, choose one of the following options:
 
     ![Create Web App](../../../../images/azure-deploy-create-web-app-3.png)
 
-{{else}}
-
-{{ if UI == 'NG' }}
-
+{{else if UI == 'NG'}}
 ### Create a new Azure Static Web App for Angular using the Azure Portal
 
 1. Log in to the [Azure Portal](https://portal.azure.com/).
@@ -65,7 +64,29 @@ To create a new Azure Web App Service, choose one of the following options:
 
     ![Create Web App](../../../../images/azure-deploy-create-web-app-5.png)
 
-{{else}}
+### Create a new Azure Web App Service for API application
+
+1. You can create a new Azure Web App Service for an API application in the same resource group.
+
+2. Click the **Create** button on the top of the resource group page.
+
+3. Search for **Web App** and select **Web App** from the results.
+
+    ![Create a resource](../../../../images/azure-deploy-create-a-resource.png)
+
+4. Click the **Create** button.
+
+5. Fill in the required fields and click the **Review + create** button.
+
+6. Click the **Create** button.
+
+    ![Create Web App](../../../../images/azure-deploy-create-web-app-6.png)
+
+7. Wait for the deployment to complete.
+
+    ![Create Web App](../../../../images/azure-deploy-create-web-app-3.png)
+
+{{ else }}
 
 ### Create a new Azure Static Web App for Blazor using the Azure Portal
 
@@ -89,8 +110,80 @@ To create a new Azure Web App Service, choose one of the following options:
 
     ![Create Web App](../../../../images/azure-deploy-create-web-app-8.png)
 
+### Create a new Azure Web App Service for API application
+
+1. You can create a new Azure Web App Service for an API application in the same resource group.
+
+2. Click the **Create** button on the top of the resource group page.
+
+3. Search for **Web App** and select **Web App** from the results.
+
+    ![Create a resource](../../../../images/azure-deploy-create-a-resource.png)
+
+4. Click the **Create** button.
+
+5. Fill in the required fields and click the **Review + create** button.
+
+6. Click the **Create** button.
+
+    ![Create Web App](../../../../images/azure-deploy-create-web-app-6.png)
+
+7. Wait for the deployment to complete.
+
+    ![Create Web App](../../../../images/azure-deploy-create-web-app-3.png)
+
 {{end}}
 
+{{ else }}
+
+{{ if UI == "BlazorServer" || UI == "MVC" || UI == "BlazorWebApp"}}
+
+### Create a new Azure Web App service using the Azure Portal
+
+1. Log in to the [Azure Portal](https://portal.azure.com/).
+
+2. Click the **Create a resource** button.
+
+3. Search for **Web App** and select **Web App** from the results.
+
+    ![Create a resource](../../../../images/azure-deploy-create-a-resource.png)
+
+4. Click the **Create** button.
+
+5. Fill in the required fields and click the **Review + create** button.
+
+6. Click the **Create** button.
+
+    ![Create Web App](../../../../images/azure-deploy-create-web-app-2.png)
+
+7. Wait for the deployment to complete.
+
+    ![Create Web App](../../../../images/azure-deploy-create-web-app-3.png)
+
+{{ else if UI == 'NG'}}
+### Create a new Azure Static Web App for Angular using the Azure Portal
+
+1. Log in to the [Azure Portal](https://portal.azure.com/).
+
+2. Click the **Create a resource** button.
+
+3. Search for **Static Web App** and select **Static Web App** from the results.
+
+    ![Create a resource angular](../../../../images/azure-deploy-create-a-resource-angular.png)
+
+4. Click the **Create** button.
+
+5. Fill in the required fields and click the **Review + create** button.
+
+6. Click the **Create** button.
+
+    ![Create Web App](../../../../images/azure-deploy-create-web-app-4.png)
+
+7. Wait for the deployment to complete.
+
+    ![Create Web App](../../../../images/azure-deploy-create-web-app-5.png)
+
+{{ else }}
 ### Create a new Azure Web App Service for API application
 
 1. You can create a new Azure Web App Service for an API application in the same resource group.
@@ -113,7 +206,29 @@ To create a new Azure Web App Service, choose one of the following options:
 
     ![Create Web App](../../../../images/azure-deploy-create-web-app-3.png)
 
-{{ if Tiered == "Yes" && (UI == "MVC" || UI == "BlazorServer"  || UI == "BlazorWebApp") }}
+{{end}}
+
+### Create a new Azure Web App Service for API application
+
+1. You can create a new Azure Web App Service for an API application in the same resource group.
+
+2. Click the **Create** button on the top of the resource group page.
+
+3. Search for **Web App** and select **Web App** from the results.
+
+    ![Create a resource](../../../../images/azure-deploy-create-a-resource.png)
+
+4. Click the **Create** button.
+
+5. Fill in the required fields and click the **Review + create** button.
+
+6. Click the **Create** button.
+
+    ![Create Web App](../../../../images/azure-deploy-create-web-app-6.png)
+
+7. Wait for the deployment to complete.
+
+    ![Create Web App](../../../../images/azure-deploy-create-web-app-3.png)
 
 ### Create a new Azure Web App Service for AuthServer application
 
@@ -143,8 +258,6 @@ Same as above, but you only need to modify the name of the web app service to **
 
 {{ end }}
 
-{{ end }}
-
 ## What's next?
 
 - [Customizing the Azure Web App Service](step2-configuration-application.md)