.Net MAUI is a cross-platform framework for creating native mobile and desktop app with c# and Xaml. In my previous article, we did warn welcome to Dotnet MAUI and shared information about the History of Xamarin.

MAUI as everybody already knows is a name for a new upgrade solution as a Multi-platform APP UI framework for building native cross-platform apps with .Net for android, iOS, macOS, and Windows. I am going to show how to create, build and debug the First MAUI application using Visual Studio 2022.

NET MAUI is the .NET Multi-platform App UI, a framework for

MAUI and other third-party framework teams started working on support for upgrading the app and old NuGet package to MAUI. MAUI will also provide you support for building the apps in different modern patterns and frameworks MVVM, MVU and RxUI.

.NET MAUI IDE


Microsoft provided 3 fantastic IDE Tools to create and develop apps with .NET MAUI and the happy news is MAUI is an open source.
  1. Visual Studio
  2. Visual Studio for Mac
  3. Visual Studio Code

Visual Studio 2022

On Windows or Mac machines you can use Visual Studio Code or Visual Studio/ VS for Mac for development. You will need the visual studio 2022 17.1.0 preview version. Microsoft released Visual studio 2022 version 17.0 in Nov month, but MUAI is still in preview so you can start to install visual studio 2022 17.1.0 preview version to create your first MUAI application.

Build your first .NET MAUI app

After installation success, Open the Visual Studio IDE

What .NET MAUI Means for Xamarin Developers

In this sample demo application, I am  going to show Android, iOS, and Windows app using MAUI, so Get started with “Create New Project”

What is .NET MAUI, and How Does it Differ from Xamarin?

On the new Project template, select project type as an” MAUI” and you will all the MAUI preview template, if you are not finding the MAUI template means, you have not installed the latest preview version so make sure you have installed the latest preview version 17.1 ++.

Microsoft Replaces Xamarin Toolkits with New .NET MAUI

In the Configure your new project window, name your project, choose your project location where you need to save, and click the Create button

The future of Xamarin: .NET MAUI

MAUI Solutions Structure

After clicking on Create, MAUI solutions default template loaded with all the related MAUI NuGet packages. There is a single project with different platform folders and resources.

Creating first .Net MAUI project

MainPage.XAML

The main page, whichever design, will support all other platforms as well, and also Main Page XAML build action modified in MAUI app.

Main Page.Xaml build action modified with MAUIXAML, make sure Xaml Build action is correct.

Right click on the XAML page >>Properties>>BuildAction of XAML Page to MauiXaml.

Creating new .NET 6 MAUI project

.NET Generic Host


The Worker Service templates, create a .NET Generic Host, HostBuilder. The Generic Host can be used with other types of .NET applications, such as Console apps.

Maui Program class enables apps to be initialized from a single location, and provides the ability to configure fonts, services, and third-party libraries.

iOS, Android, windows, and all the platform entry point calls a CreateMauiApp method of the static MauiProgram class that creates and returns a MauiApp, while lunch the application

.NET MAUI: How MAUI Will it impact on Xamarin Native applications?

Application Class

The App class derives from the Application class

Workload Repair failed: `dotnet workload repair - MAUI



Resources

The resources are a good improvement in MAUI. The AppIcon, image and font folder will be available under the MAUI project and it is just a single SVG, Looks like Maui will just automatically take care of generating all the different icon sizes for different devices.


How do I determine where the error is when I check MAUI compatibility with maui-check?How do I determine where the error is when I check MAUI compatibility with maui-check?

Run IOS App

Building MAUI iOS applications requires access to Apple's build tools, which only run on a Mac. Because of this, Visual Studio 2022 must connect to a network-accessible Mac to build iOS applications.

You must install the Xcode 13.1++ version on the Mac machine before connecting Visual Studio 2022 to the Windows machine.

Windows Configuration 

  1. Connect same wifi network
  2. Download and install Visual Studio 2022 with MAUI

Mac Configuration

  1. Connect same wifi network
  2. Install Xcode 13.1 ++
  3. On Network preference > switch on Remote login
Pair to Mac machine from windows

Pair to Mac for Xamarin.iOS Development

Program.cs

Program class file is the main entry file on IOS app and executes the main method of the application, here you can define your custom app delegate file and other configuration files

Appdelegate.cs

Each platform will call MauiProgram static class for initialize. On iOS will call as below

You can select iOS simulator and device and click Run icon for executing the application



The out as like below



Run Android App

The android application, MainApplication.cs will execute first, it will call the MauiProgram static class initially as like below
 
You can select android simulator or device as below, press F5 to run the application
 


The output like below



Run Windows App


The Windows application executes  App.xaml.cs file first, it will call the MauiProgram static class initially as like below

Select the device and run the Application



MAUI Windows device

Demo Video

I have shared a recorded demo video with two versions, English and Tamil. It will help you to understand more about creating, building, and debuging the First MAUI application.

English Demo Video



Tamil Demo Video 



Hope this article is very useful for you, If you have any questions/ feedback/ issues, please write in the comment box

An Azure key vault is a cloud service for securely storing and accessing secrets. A secret is anything that you want to tightly control access to such as API Key and Subscription, Password, Secure content, Connection string, and certification.

The developer no need to write secure content in UI Application, take as an example previously, we storing our database connecting string to in the UI application as a plain text or creating custom encryption algorithm for encrypting and decrypt the connection, now Microsoft provided a fantastic feature for store and retrieve the secure content in Azure key vault and azure will take care for your safety about content.

I am sharing a quick experience that you may also experience same in your working environment, on Prod environment database is more secure and live, but always developer can able to find the prod database connection string from config file and using same connection string developer can able to login database, edit the value, if developer update any value wrongly, that is become a bigger issue and also admin trying to change the password every frequent also application should have to do redeployment. Here, to avoid this issue, the application owners can use the azure Key vault to a prod database.

Azure portal: Create a key vault

A good practice is to create a separate vault for each deployment environment of each of your applications, such as development, test, and production. 

In this article, we will learn more about how to create an Azure key vault using the Azure portal. Once you have created a key vault, you can enable the “Azure monitor Log” to monitor the key vault.

Create Azure Key Vault

Step 1: Navigate to Azure Portal and create / login to the portal

Step 2: create a new azure key vault as shown below

Step 3: Navigate create new Resource > Search “Key Vault”, you will get the following screen and click on create.

Quickstart - Create an Azure Key Vault with the Azure portal

After clicking on the Create new button, you will get the following screen which you can provide info about your key vault
  1. Select Subscription and Resource group.
  2. Provide key vault name, Vault name must only contain alphanumeric characters and dashes and cannot start with a number.
  3. Select the region, which is nearest to your deployment zone.
  4. Pricing tier: Key Vault is designed to store configuration secrets for server apps. It's not intended for storing data belonging to your app's users, This will reflect the cost model. Azure Key Vault service is offered in two service tiers: standard and premium, pricing will refer below table by the West Us region and Indian currency. The best-recommended way, please go and check-inway, please go and check on Microsoft official website for exact current pricing based on your region

Key Vault pricing

You have to fill in the details as shown screen shot below

Manage Key Vault in Azure Stack Hub using the portal - Azure

After clicking on the Review + create a button, the Azure portal will validate the information and will give the confirmation with the review screen

Azure Key Vault Tutorial | Secure secrets, keys and certificates easily

Click on the Creation option and wait for a few min for deployment

Azure Key Vault Reviews 2021: Details, Pricing, & Features | G2

Click to go to Resource and be able to find 3 types of Azure Key Vault (KV) stores: 
  1. secrets
  2.  keys 
  3. certificates (certs).

Azure portal: Create a key vault

Secrets 

 Provides secure storage of secrets, such as DB connection strings, account keys, or passwords for PFX (private key files). The secret is a name-value pair of strings. Secret names must be 1-127 characters long, contain only alphanumeric characters and dashes, and must be unique within a vault. A secret value can be any UTF-8 string up to 25 KB in size.
  1. Upload options have two different types 1. Manual 2. Certificate.
  2. Name: Provide a valid secret name. Secret names can only contain alphanumeric characters and dashes.
  3. Value: Provide the single line value, the Azure Portal currently only supports single-line secret values, use Azure PowerShell to set multi-line values.

Azure portal: Create a key vault

(Cryptographic) Keys 

keys represented as JWK (JSON Web Key). Supports multiple key types and algorithms, and enables the use of Hardware Security Modules (HSM) for high-value keys.

There are 3 options to create the key
  1. Generate - Key type is RSA and EC, Select RSA and EC size and provide activate expiration date
  2. Import – Select your key to upload, Key type is RSA and provide activate expiration date
  3. Restore Backup -Select existing key to upload

Azure portal: Create a key vault=

Certificates 

Certificates are a managed X.509 certificate, which is built on top of keys and secrets and adds an automated renewal feature/auto-rollover. When a Key Vault certificate is created, an addressable key and secret are also created with the same name. The Key Vault key allows key operations and the Key Vault secret allows retrieval of the certificate value as a secret. A Key Vault certificate also contains public x509 certificate metadata.

Azure portal: Create a key vault

If you try to browse on secrets, key, and certificate key identifiers from the azure portal, you will get an unauthorized response because Keyvault is not public internet and is controlled through Active Directory.

Azure portal: Create a key vault

What next?

In this article, You created a new different azure key vault using the Azure portal. Will share in the next article about Key Vault integrate with xamarin mobile applications.
Azure App service logging are the output of runtime trace statement in the different app code. logging feature will help you might only want to see a logged message when a particular level of error has occurred, While developing a Web App or an API, this can be very useful in order to debug it.

Azure provides built-in diagnostics to assist with debugging an App service App. In this article, you will learn what are the different types of diagnostics logging and steps to enable in Azure Portal. I have shared in my previous article details information to create a web app using the Azure portal and use the same application for demo.
Enable diagnostics logging for apps in Azure App Service

Types of Azure App service Logging

Azure provides the below-logging feature in the new Azure portal and all the logging features will support the Windows platform and some of the logging will support Linux as well. Logs can be stored and located for accessing information in the portal.
  1. Application Logging (Filesystem and Blob)
  2. Web Server logging (Filesystem and Storage)
  3. Detailed Error Message
  4. Failed request tracing

Step to Enable Application logging

Application logs message generated by the application. There are two options available in application logging as Filesystem and Blob. Contains one or more text files. The format of the log messages depends on the logging provider and access logging in the following directory - /Logfile/Application/

Filesystem

The Filesystem option is for temporary debugging purposes and turns itself off in 12 hours.

Blob

The Blob option is for long-term logging and needs a blob storage container to write logs to.

Error Level

Application error detail fall into the following error level
  1. Error – Included category by Error and Critical
  2. Warning - Included category by Warning, Error, and Critical
  3. Information - Included category by Info, Warning, Error, and Critical
  4. Verbose - Trace, Debug, Info, Warning, Error, Critical (all categories)
You can follow the below steps to enable application logging for Windows apps in the Azure portal.

Step 1: Navigate to the Azure portal and select your Web app and select App Service logs.
Enable diagnostics logging for apps in Azure App Service

Step 2: Select on either Application logging Filesystem or Blob or both, in this demo I have enabled Application logging as a File system.
Step 3: You can also set the Error level as Error, warning, information, verbose.
Step 4: Select Save Options.

Step to Enable Web Server logging

Web Server Logging also having two different types of storage and File Systems, Raw HTTP request data in the W3C extended log file format. Each log message includes data such as the HTTP method, resource URI, client IP, client port, user agent, response code, and store log file in the /LogFiles/http/RawLogs/. You can follow the below steps to enable webserver logging

Step 1: Navigate to the Azure portal and select your Web app and select App Service logs.

Enable diagnostics logging for apps in Azure App Service

Step 2: Select on either Web server logging Filesystem or Blob, in this demo I have enabled server logging as a File system.
Step 3: Provide Quota and Retention Period (Days), set the number of days the logs should be retained.
Step 4: Once all the details filled and click on save options

Detailed Error Message

Detail Error Message selects as ON, they will generate an error message as a File system and Copies of the .htm error pages that would have been sent to the client browser. For security reasons, detailed error pages shouldn't be sent to clients in production, but App Service can save the error page each time an application error occurs that has HTTP code 400 or greater and file will store in the directory is http://logfiles/DetailedErrors/

Enable diagnostics logging for apps in Azure App Service

Failed request tracing

The Failed request tracing including a trace of the IIS components used to process the request and the time taken in each component. It's useful if you want to improve site performance or isolate a specific HTTP error. The file format is XML files and an XSL file. You can view the formatted XML files in the browser and a file store directory is /LogFiles/W3SVC#########/

Enable diagnostics logging for apps in Azure App Service

Download Log File

All the different logging has Specify logs stored in the App Service file system, the easiest way is to download the ZIP file in the browser at

Windows apps: https://<app-name>.scm.azurewebsites.net/api/dump

Linux/container apps: https://<app-name>.scm.azurewebsites.net/api/logs/docker/zip


Summary

In this article, you have learned detail about the Azure logging feature and how to enable different logging uses the Azure portal, Will share in the next article about implementing logging and send log messages to the application logs. If you have any questions/feedback/ issues, please write them in the comment box.
The Azure App Service is an HTTP-based service for hosting web applications, REST APIs, and mobile back ends. We can create and deploy using different languages like .Net, .Net Core, Java, Ruby, Node.js. PHP, or Python. In the previous article shared steps to create web apps using visual studio, in this article will show the steps create a web app by using Azure Portal.

Create an App Service by using Azure Portal

Set up an App Service

  1. Navigate to Microsoft Azure Portal.
  2. Select the All resource links at the top of the left-hand navigation.
  3. Select Web > App Service to display the App service creation wizardCreate an App Service by using Azure Portal

Create Web App Wizard

Web Apps lets you quickly build, deploy, and scale enterprise-grade web, mobile, and API apps running on any platform and fill out the following fields in each of the sections on the wizard.

Project Details

  • Subscription: Select Azure subscription, which you have
  • Resource Group: Create a new resource group to make it easier to clean up the resources later.

Instance Details

  • Name: The name you choose must be unique among all Azure web apps. This name will be part of the app's URL like msdevbuildapp.azurewebsites.net.
  • Publish: Let us Select Code for in this article demo.
  • Runtime Stack: Select .NET Core 3.1 LTS. 
  • Operating System: Keep Windows selected here, it's the default when you selected .NET Core 3.1 LTS above.
  • Region: Keep the default selection for now.

App Service Plan

  • Windows Service Plan: Leave the default selection. By default, the wizard will create a new plan in the same region as the web app.
  • SKU and size: Select F1. To select the F1 tier, select Change size to open the Spec Picker wizard. On the Dev / Test tab, select F1 from the list, then select Apply.
reate an App Service by using Azure Portal

Select Review and Create to navigate to the review page, then select Create to create the app.

Create an App Service by using Azure Portal

Deployment success message

Wait for 2 to 3 minutes, the portal will display the deployment page, where you can view the status of your deployment.

Create an App Service by using Azure Portal

Deployment Overview

Once the app service is ready, you can select the Go to resource button and the Azure portal will display the web app overview page like below.

Create an App Service by using Azure Portal

To preview your new web app's default content, select its URL at the top right, navigate to your web app service (https://msdevbuild.azurewebsites.net). The placeholder page that loads indicate that your web app is up and running and ready to receive deployment of your app's code.

App Service Editor

Microsoft provided App Service Editor tool is a web-based editor for App Service. On the Development Tools section of the left-hand navigation of your app and click on App Service Editor (Preview).

Create an App Service by using Azure Portal

The Editor is similar to the visual studio online editor with different section solutions preview, code Editor, and Design preview page.

Create an App Service by using Azure Portal

Summary

Navigate or refresh your web app service URL and you will get updated content in the browser. In this article, you have learned about creating Web app using the Azure portal and learned about Azure Online Editor.

Create an App Service by using Azure Portal

If you have any questions/feedback/ issues, please write them in the comment box.
Azure has role-based access control (RBAC) to restrict access to resources and management features, but it can’t be used to quickly prevent the users from accidentally deleting a resource.

One of my friends called and asked How to avoid unknown or accidental deletion of Azure resources by other users, In this article, will share the steps, Azure resource lock implementation, Which Prevents Accidental Deletion of Resources.

Microsoft Azure: Avoid unknown or accidental deletion of Azure resources

Type Azure Lock

Microsoft provided two types of azure resource lock

CannotDelete 

 Lock prevents users from deleting a storage account, but permits reading and modifying its configuration.

Type Azure Resource Lock

ReadOnly 

Lock prevents users from deleting a storage account or modifying its configuration but permits reading the configuration.


Type Azure Resource Lock

User role Administrator and owner can modify the above two azure lock features.

Configure Azure Lock

We will see the following steps for how to configure azure lock using the Azure portal.

Step 1: Navigate to your storage account, or if you have not created it before, I have shared steps in my previous article about how to create an Azure storage account.

Microsoft Azure: Avoid unknown or accidental deletion of Azure resources

Step 2: On Storage account quick setting menu and Select on Lock, the lock list showing empty means, they are is no lock available on existing so click on Add for new lock configuration

Microsoft Azure: Avoid unknown or accidental deletion of Azure resources

Create new Lock

As mentioned above, Resource lock has two types, so select the Lock type as per your need and provide the lock name and description for understanding.

Microsoft Azure: Avoid unknown or accidental deletion of Azure resources

After clicking on Ok, You will get the following list screen with Lock Name, type, and Edit. Edit Options for Edit the name and type, delete option for deleting the lock associated with a storage account.

Microsoft Azure: Avoid unknown or accidental deletion of Azure resources

Resource Lock testing

You can navigate to Storage account and click on Delete

Microsoft Azure: Avoid unknown or accidental deletion of Azure resources

After clicking on the delete option, Immediately Azure intelligent will show the notification saying you can’t delete because of the Resource lock

Microsoft Azure: Avoid unknown or accidental deletion of Azure resources

Summary

You have learned now and How to Avoid Accidental Deletion of Azure Resource on the Azure Portal and available lock options. If you have questions, Keep continuing to post your comment below.

Featured Post

Xamarin MAUI: First iOS, Android and Windows Mobile App using Visual studio 2022

.Net MAUI is a cross-platform framework for creating native mobile and desktop app with c# and Xaml. In my previous article, we did warn we...

Popular Posts

Welcome to MSDEVBUILD.COM