One of the highlight among the announcements made at Microsoft Build 2020 was announcement of the new Azure service in the keynote: Azure App Static Web Apps. Azure Static Web Apps is a service that automatically builds and deploys full stack web apps to Azure from a GitHub repository. This service allow web developers to publish websites to a production environment by building apps from a GitHub repository for free. developers can use modular and extensible patterns to deploy apps in minutes while taking advantage of the built-in scaling and cost-savings offered by serverless technologies.

It provides the killer features for developers such as:

• Free web hosting for static content like HTML, CSS, JavaScript, and images.
• Integrated API support provided by Azure Functions as backend APIS
• First-party GitHub integration where repository changes trigger builds and deployments with Github Actions
• Globally distributed static content, putting content closer to your users.
• Free SSL certificates, which are automatically renewed.
• Custom domains* to provide branded customizations to your app.
• Seamless security model with a reverse-proxy when calling APIs, which requires no CORS configuration.
• Authentication provider integrations with Azure Active Directory, Facebook, Google, GitHub, and Twitter.
• Customizable authorization role definition and assignments.
• Back-end routing rules enabling full control over the content and routes you serve.
• Generated staging versions powered by pull requests enabling preview versions of your site before publishing.

How i deployed Meme-Generator App:​

I was building this meme generator app for an angular session today with Azure cognitive service to detect persons in the image and also to generate a meme by adding a text as the user wanted. As soon as Azure static web apps was announced I wanted to check it out with this application on how easy it is to deploy. Experience was seamless and easy to deploy and generate a url in few seconds.

Let me explain, how i achieved this in quick time.

Step 1. Sign-in to the Azure Portal, Search for “Static Web Apps”, and click the Create button

Visit https://portal.azure.com, sign-in, and use the search box at the top to locate the Static Web Apps service (note that it’s currently in “preview”). click the Create button to get started.

In this step you’ll fill out the Static Web Apps form and sign-in to your Github account to select your repository.

• Select your Azure subscription.
• Create a Resource Group
• Name your app , in my case its meme4fun
• Select a region (as of now its not available in all regions)
• Sign-in to Github and select your org, repo, and branch. 

Once you’re done filling out the form click the Next: Build > button.

Step 2: Define Angular App location, API, and Build Output​

The next step is to define the path where my app is located in the repository, and i did not have any azure function integrated and i will keep it as empty, and the directory where my build artifacts (your bundles) are located(i.e dist/meme-4-fun). After entering that information click the Review + create button.

Step 3:  Click the Create and Look for the Magic !​

Once you are good with everything you can go ahead and click the create button and you will see the application successfully gets deployed and end point generated to access it public.

Once the deployment is done, if you go the resource and click on overview you will see a configuration as follows,

It has the urls of the Github Actions and as well as Github source code and also the url of the application deployed. If you’d like to see the build in action on Github, click the Workflow file above.

You can access the meme generator application and create your own memes from https://lively-forest-0fd67f010.azurestaticapps.net/

Here are some great links you can visit to learn more. 

• Static Web Apps docs: 
  https://aka.ms/swadocs  
• Static Web Apps Learn modules (Angular, React, Svelte, or Vue JavaScript app and API): 
  https://aka.ms/swaframeworks  
• Static web app with the Gatsby static site generator: 
  https://aka.ms/staticsitegen  
• Blog post: 
  https://aka.ms/swapreview  

The above app is also available in the Microsoft's sample static web app Gallery.

If you're a web dev you need to check out this cool service for sure. Cheers!

Overview : 

Azure Service Bus is being used as one of the most reliable enterprise messaging services across different domains like health care, finance etc. Often, users do have uncertainties in handling the dead-letter messages. Before diving into the best practices, I would like to give you a quick introduction on dead-lettered messages.

Azure Service Bus Dead-letter Queue​

Azure Service Bus queues and topic subscriptions provide a secondary sub-queue, called a dead-letter queue. The purpose of the dead-letter queue is to hold messages that cannot be delivered to any receiver, or messages that could not be processed. So, any message that resides in the dead-letter queue is called a dead-lettered message.

Best practices in handling Azure Service Bus dead-letter message​

Most of the time we could notice that the message fails due to the following reasons;

1. Dependent service not available
2. Faulty message
3. Process code issue

Dependent service not available​

This could be one of the foremost and time after time reasons where the services that reply on message delivery may go down for a short period. For instance, the Redis or SQL connection issues may often happen.

Faulty Message​

According to the business scenarios, you may configure the custom properties to you Azure Service Bus messages and validate with respect to the values that should contain in the custom/user defined properties.

If in case the message doesn’t have a mandatory parameter or some value is incorrect, then the message will end up in the dead-letter queue after the maxDeliveryCount is attained.

The failed delivery can also be caused by a few other reasons such as network failures, a deleted queue, a full queue, authentication failure, or a failure to deliver on time.

Here we can drill down the reasons into two ways:

1. System level dead-lettering
2. Application level dead-lettering

Reasons for System level dead-lettering​

• Header Size Exceeded
• Error on processing subscription rule
• Exceeding time to live value
• Exceeding maxDeliveryCount
• When Session id property is set to true (the default is false)

Reasons for Application level dead-lettering​

• Messages that cannot be properly processed due to any sort of system issue
• Messages that hold malformed payloads
• Messages that fail authentication when some message-level security scheme is used

In this second scenario, the best practice is to manually verify the dead-lettered messages (using Service Bus Explorer or Serverless360) to correct message data or sometimes to purge messages and clear the queue.

Message process code issue​

This is a very rare case given a good number of resources in the community to fetch the flawless code. The developer should keep all the scenarios in the head and handle all the exceptions.

In the first and third scenario, the best practice is to use a flawless code that should run and reprocess the dead-lettered messages, you can find the sample code below;

internal class Program
    {
        private static string connectionString = ConfigurationSettings.AppSettings["GroupAssetConnection"];
        private static string topicName = ConfigurationSettings.AppSettings["GroupAssetTopic"];
        private static string subscriptionName = ConfigurationSettings.AppSettings["GroupAssetSubscription"];
        private static string databaseEndPoint = ConfigurationSettings.AppSettings["DatabaseEndPoint"];
        private static string databaseKey = ConfigurationSettings.AppSettings["DatabaseKey"];
        private static string deadLetterQueuePath = "/$DeadLetterQueue";

        private static void Main(string[] args)
        {

            try
            {
                ReadDLQMessages(groupAssetSyncService, log);
            }
            catch (Exception ex)
            {
                Console.WriteLine(ex.Message);
                throw;
            }
            finally
            {
                documentClient.Dispose();
            }
            Console.WriteLine("All message read successfully from Deadletter queue");
            Console.ReadLine();
        }

        public static void ReadDLQMessages(IGroupAssetSyncService groupSyncService, ILog log)
        {
            int counter = 1;
            SubscriptionClient subscriptionClient = SubscriptionClient.CreateFromConnectionString(connectionString, topicName, subscriptionName + deadLetterQueuePath);
            while (true)
            {
                BrokeredMessage bmessgage = subscriptionClient.Receive(TimeSpan.FromMilliseconds(500));
                if (bmessgage != null)
                {
                    string message = new StreamReader(bmessgage.GetBody<Stream>(), Encoding.UTF8).ReadToEnd();
                    syncService.UpdateDataAsync(message).GetAwaiter().GetResult();
                    Console.WriteLine($"{counter} message Received");
                    counter++;
                    bmessgage.Complete();
                }
                else
                {
                    break;
                }
            }

            subscriptionClient.Close();
        }
    }

Myths to chunk out​

Does the SequenceNumber of message added by Azure Service bus keeps on increasing on each failed attempt till it reaches maxDeliveryCount?

The sequence number can be trusted as a unique identifier since it is assigned by a central and neutral authority and not by clients. It also represents the true order of arrival and is more precise than a time stamp as an order criterion, because time stamps may not have a high enough resolution at extreme message rates and may be subject to (however minimal) clock skew in situations where the broker ownership transitions between nodes.

Setting maxDeliveryCount = 1, is that best practice to deal with poison messages so that consumer never attempt twice to process message once it failed?

It is not a best practice to set the maxDeliveryCount=1. Because if some network/connection issue occurs, the built-in retry will process and clear from the queue.

If you are reading messages in batch, a complete batch will re-process if an error occurred any of message.

Conclusion​

In this blog, we have seen a sneak peek of Azure dead-lettered queues and various reasons for dead-lettering of messages. Further, we discussed the best practices on handling the dead-lettered messages. Finally, we looked into the myths to chunk out while dealing with Azure Service Bus dead-lettered messages.

I hope you enjoyed reading this article. Happy Learning!

This article was contributed to my site by Nadeem Ahamed and you can read more of his articles from here.

Quarantine, self isolation , social distancing for the past one month, I’m living with these words. While most of us are investing this time to learn new technologies/tools. I challenged myself to skill up myself and have deep knowledge on certain services on Azure.

Kubernetes provides a uniform way of managing containers. Its aim is to remove the complexity of deciding where applications should be scheduled to run, how to locate them, how to ensure they are running, autoscale or deploy. Azure Kubernetes is a service on Azure that help Customer achieve their business goals, by providing a layer of automation on top of their infrastructure. Going towards the technical features, Azure Kubernetes has a lot to offer, but at the end of the day, is a great platform for saving money or growing faster.

Azure Kubernetes service offers great set for microservice architectures. If your application needs to start hundreds of containers quickly or will terminate them just as quickly and to have full control of those services, AKS is a great option. There are other scenarios such as Bigdata, IOT scenarios you would consider AKS as a preferred choice. In this post i will explain how to easily setup your application running on AKS cluster in 10 minutes with CI/CD pipelines.

PreRequisities:​

You will need to have an Azure Subscription. If you do not have an Azure subscription you can simply create one with free trial.

How to build & Deploy the application:​

If you are a beginner with Azure Kubernetes Service, Azure Devops is the best place that you need to look in order to understand how an Application is deployed on Azure Kubernetes. The Azure DevOps Project simplifies the setup of an entire continuous integration (CI) and continuous delivery (CD) pipeline to Azure with Azure DevOps. Cool thing is that, you can start with existing code or use one of the provided sample applications. It enables you to quickly deploy that application to various Azure services such as Virtual Machines, App Service, Azure Kubernetes Services (AKS), Azure SQL Database, and Azure Service Fabric.

Lets Deploy an Node.js App to Azure Kubernetes Service :

Navigate to Azure Portal and search for Azure Devops Project in the market place/search bar.

Let's go ahead and add a new project.

Azure Devops project enables developers to launch an app withany Azure App Service in just a few quick steps, providing everything needed to develop, deploy and monitor an app. Create a DevOps Project, and it provisions all the Azure resources and provides a Git code repository, Application Insights integration and a continuous delivery pipeline setup for deployment to Azure. The DevOps Project dashboard lets you monitor code commits, builds and deployments from a single view in the Azure portal. How cool is that ?

With the help of Azure DevOps Projects, you can build an Azure application, on an Azure service, in quick time. You also get automatic full CI/CD pipeline integration, built-in monitoring and deployment to the platform of your choice. Azure Devops Project supports almost all the latest languages out there in practice such as .Net,Java,Node.js,PHP,Python and Go.

Next step is to select the Language you want to have the application on, I will go ahead and choose Nodejs as my application language. But you could choose any language that you want to test.

Once you select the language, next step is to select the framework in which you want the application to be based on , For example, if you choose Python it could be based on Flask,Django etc. Similarly you have the flexibility to choose the framework once you decide the language. In this case i will go ahead and choose express.

Next step is the critical part of the process, This is the step that defines which service you would be using to deploy the app. You can Run your application on Windows or Linux. Simply deploy to Azure Web App, Virtual Machine, Service Fabric or choose Azure Kubernetes Service for your application. Each of those option provides deployment in an elegant and fast way. In this case, we will deploy the application to Azure Kubernetes service.

Once you are done with the above step, final step is passing the configuration details for the Kubernetes cluster on AKS as follows,

Most of the settings are self explanatory , you can change the size of underlying VMs based on your requirement. The default number of nodes for your cluster comes as 3 , if you need to make changes to your cluster and the container registry settings click on Additional Settings. Here you can configure the Kubernetes version, Node count, App Insights and resource group location. The HTTP application routing solution makes it easy to access applications that are deployed to your Azure Kubernetes Service (AKS) cluster. In this case we will disable it.

Container registry is needed as your images needs to be pushed to them. Once you're good with all settings, click ok and done!. You will see a notification box as below.

Once everything is created you will be redirected to a Dashboard page as below.

The four stages involved are:

1. Azure Kubernetes Cluser: Created and configured your Azure Kubernetes Cluster and application endpoint.
2. Azure Container Registry : Created and application image is pushed to the container registry.
3. Repository: Created a distributed Git repository and checked in sample code.
4. CI/CD Pipeline: Seamlessly connected with the Azure Devops collaboration solution allows you to plan, test, release and monitor your solutions.
5. Application Insights:  Created and configured your Application Insights telemetry which enables active monitoring and learning to proactively detect issues and continuously analyze and test hypotheses without code.

You can see all the resources created on Azure under the resource group

When you click on the Kuberentes cluster, you can see the Kubernetes related resources such as dashboard logs etc.

And if you navigate to the blade you can see the settings such as Enabling Dev spaces , Kubernetes version, Application Insights etc.

On the Azure Devops side, you will be able to see new Azure Devops project created with Dashboard, Backlog items, CI/CD pipelines etc.

And when you click on the application endpoint, you would see that the application running successfully on Azure Kubernetes service.

In order to verify the services and pods, you could follow the steps provided in the Azure Kubernetes dashboard configuration and when you open up the dashboard, you can see the status of each services.

I have spent more than 4 days in the past to configure Kubernetes to deploy my application. But Azure Devops project Simplify and speed up the DevOps process with Azure DevOps services. If you want to explore more kind of scenarios on different services on Azure its worth to explore Azure Devops Labs. I hope it makes it easier to get started with any of the deployment with Azure services. Cheers!

I was working with a partner recently in developing Apps and integrated them as a part of Teams. At times there are questions from customers whether they would be able to utilize the features of teams within their application. The simple answer for the will be NO as Teams Platform Architecture is enabling developers to bring adoption to teams by building more applications from different industry verticals which can be embedded inside teams

However there are two ways you can make the user to navigate to Microsoft Teams from the web application or even from Outlook.

Make a clickable link for Teams chat :

Here is a handy tip on how to make a one-click link that will open up Teams chat to you or the person who is already logged in. Say if you are using a web application which is on Angular, simply you can add a click event to navigate to teams with the code,

 takeUserToTeams() {
    window.location.href='http://teams.microsoft.com/l/chat/0/[email protected]';
  }

When the user click on the button it will open a web page where the user will sign-in with their Microsoft account. If the Teams app is installed on the client's computer, the web page will offer to open the chat in the Teams client, otherwise they can use the Teams web browser experience

This is a very simple tip but most of the customers are asking for a way to do the same.

Create a Share to Microsoft Teams​

Third-party websites can also use the launcher script to embed Share to Teams buttons on their webpages which will launch the Share to Teams experience in a popup window when clicked. This will allow you to share a link directly to any person or Microsoft Teams channel without switching context.

Step 1: Add  launcher.js script on your webpage.

https://teams.microsoft.com/share/launcher.js

Step 2 : add an HTML element on your webpage with the teams-share-button class attribute and the link to share in the data-href attribute.

<div
  class="teams-share-button"
  data-href="https://<link-to-be-shared>">
</div>

This will add the Microsoft Teams icon to your website.

That's it whenever user click the button content will be posted on the user directly from your apps to teams.

Hope these 2 tips helps someone out there to integrate teams with your application easily to navigate the users to teams!

The online MVP Community Quiz is an online quize program by Isidora Katanic, who is the organizer of the famous community events such as Experts Live Europe and Experts Live Switzerland.

Before joining with Microsoft, I have been a Microsoft MVP continuously for 2 years that gave me the opportunity to meet so many experts across the world and get to know them and the communities. The quiz mainly covered the questions among the interesting facts about famous MVPs and the community events.

🏆 Among the winners!

It's great to be listed among the winners as there were participants from 23 countries around the world.