Skip to main content

· 7 min read

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.

Azure Devops Project

Let's go ahead and add a new project.

Add new Azure Devops 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.

Create Node.js Devops Project

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.

Select the Framework

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.

Azure Kubernetes Service to Deploy

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.

Additional Settings AKS configuration

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.

K8s cluster, Container Registtry, CI/CD pipelines are created

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

Resources in page

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

Resource Group with All resources

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

Kubernetes cluster resources

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.

Azure Devops Project with CI/CD pipelines

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

Nodejs App on AKS

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.

Azure Kubernetes dashboard

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!

· 3 min read

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

User Navigation from web app to Teams

Opening chat seamlessly once user login

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.

Share to Teams icon

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!

· One min read

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.

· 9 min read

Overview

This is my 2nd post about a Chatbot solution to address the world wide problem "CoronaVirus" panademic. As it is now spreading across the world and its really vital to provide all citizens of the countries with up-to-date information. As we know it has come to a level that certain countries are in lockdown mode , more and more people are started to practice social distancing and work from home. As we have seen in the previous blog about the sentiment analysis of employees working form home, in this blog i will explain about how to build a chat bot to provides answers to most of the queries related to health information and latest learning. Chatbot is a platform which can be integrated with Web inteface or any collaboration tools such as MS Teams, Slack or Telegram and it can be operated 24*7 without any downtime.

Prerequisites:

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:

If you are new to building Chatbot, it is extremely easy and you can enable access to knowledge base via bot in few minutes.

Step 1: Create the Resource Group

As the first step, we need to create the resource group that contains all the resources needed. Navigate to Azure Portal and create the resource group named “rg-chatbot”

Create Resource Group

Step 2: Create a knowledge base

As the next step, navigate to QnA maker,sign-in with your Microsoft account and then click "Create a knowledge base" option

QnA maker

click "Create a QnA service" button in "Step 1" as shown below;

Create QnA service

You will be re-directed to Azure portal. Fill in the template form, and make sure to set pricing tier for "QnA Maker service" to F0, and for the supporting Azure Search service to F, if you want to host your Bot components for free. Then click "Create" button;

Create QnA service

As you could see in the portal Deployment of the relevant resources in your target resource group. If successful, you should get notification as resources deployed. As you will see the following resources under the particular resource group

Resources in QnA

Click on the App Service Plan you created

Note : By Default when you create, App Service Plan for the website is set to S1 pricing tier. You need to change it to the F1 tier if you don't want to have much cost incur on your subscription. You can do this by navigating to Scale Up(App Service Plan) and then select Dev/Test tab and select F1 and Apply.

Change the AppService plan

Step 3 : Connect your QnA service to your KB.

Navigate to the QnA maker again and click 'Refresh" button in "Step 2"

Click on Refresh and select the bot we created

Give a meaningful name to your Knowledge Base (KB)

Name your KB

Step 4 : Populate Knowledge base from different sources

You can specify different sources to feed your knowledge base. It can be populated uploaded from files (e.g., in PDF, MS Word, MS Excel, etc. formats) or typed manually or from Web sites (containing FAQ). For this example, we will be using the recommended standard Knowledge base with Covid-19 FAQs from the  Centers for Disease Control and Prevention and World Health Organisation Web sites.

Knowledge Base Sources

Also in the next step chit-chat" section you may choose "personality" for your bot, so that it can answer some additional small talk questions. This option will enrich the knowledge base with additional question/answer details, so you bot may respond to various greetings.

Populate KB

Now you can create your KB with a simple button click to setup your knowledge base and populate it with the data from the different configured sources.

Select the way it should answer small-talk questions

Once it successfuly created, you will see a window as follows,

Create the knowledge base

Step 5: Test bot's knowledge base

It's time to test bot'ts knowledge base , by clicking -> Test button, then type a question and enter,

Test Knowledge base

If you are happy with bot's responses, just go ahead and click "Save and train", then switch to "Publish " tab and publish the Knowledge base

Publish the Knowledge base

Step 6: Create Bot

Once it got successfully published, you can click on Create Bot as follows,

Create Bot

You will be re-directed to Azure portal where you can set the pricing tier of your Azure Bot Service to F0 (free one) , and you can pick SDK language as the one you are familiar with (either C# or Node) and the click "Create" button;

Create Web Bot

You can obtain the QnA authKey by clicking on it and from the deployment details,

Obtaining AuthKey

Once we filled everything, just hit Create button. Once it get deployed you will be able to see it from the notification.

Once Web App Bot is deployed , you may verify its functionality by selecting "Test in Web Chat" in the left navigation bar and then typing your messages in the Test window.

Test in Web Chat

If you get replies similar to what is shown on the screenshot above, congratulations - you have successfully completed setup and training of your bot !

Next step would be to make it accessible in your platform of choice.

Step 7 : Embed your bot into any web site of yours

Azure Web App Bot can communicate with external world via so called "channels". The channels are built for the relevant collaborating platforms, e.g. Skype,MS teams or Telegram. To find out more about supported channels, please consult Microsoft documentation here. By default, Web App Bot has "Web Chat" channel activated. It means that you can easily start using it on your Web site.

Navigate to Channels on the blade of created bot, then click "Get bot embedded codes" and finally click "Click here to open Web Chat configuration page" link.

Web Chat

Now click the "Show" link to reveal one of the secret keys. Use it to replace the <YOUR_SECRET_CODE> placeholder in the provided embedded code sample.

You can now paste this embedded code into the source code of your target website.

Now you can embed this into a Web sites can be built using various Web development frameworks: be it Angular,React,Vue,Angular or anything else.

Copy the code and embed in your site

Simply clone the repository, then replace the <PUT_YOUR_SECRET_CODE> placeholder on line 1059 with the secret code from your Web Chat configuration page (as described above).
You will then have a fully functional web page with an embedded QnA chatbot.

In this case, i already have built an Covid Tracker application with Angular and this how it looks when i embed the code what we got from the portal.

Covid tracker with BOT in place

Step 8: Enable Chatbot in Microsoft Teams

Say if you want to serve internal audience such as employees and if you are widely using Microsoft Teams in this crisis situation, you would nee to activate relvant channel in the bot's configuration.

Open Web App bot resource in the Azure portal again and select "Channels" option from the blade and click Microsoft Teams icon and press Save button

Select the channel you want to integrate with

Once it got successfully published, you can navigate to Channels blade again and see the Microsoft Teams channel in running state.

MS teams on running state

Now, switch to Microsoft Teams client, select "App Studio" from the left navigation bar if you dont have App studio, just install it from here

Click "Manifest Editor" tab and then click "Create a new app" button. 

Create a new App on teams

Fill all the details which are necessary and mandatory,

Add the details and make sure you get through all validation

Next in Capabilities -> Bots" choose your Azure bot from "Existing bot" tab's drop-down list and then define its scope in MS Teams, e.g. "Personal" and "Team" for your users to chat with the bot directly and within specific teams.

Setup the bot

Finish -> Test and distribute", use "Install" button (if you have MS Teams administrator access) or "Download" button (to send .ZIP package with the manifest details to your MS Teams administrator) to make your bot available in your MS Teams environment.

We're adone

If successful, then you should be able to chat now with your bot directly from within MS Teams.

BOT in Lit Mode

The above can be integrated into any social media platform listed in the channels and its quite easy

You can also consider using HealthCare Bot if you are focused to have the chatbot to handle related scenario only and he is a detailed article on how to build the same.

Things to add/Improve:

Modify your bot with lot more cool features with images and more content via the code (either c#/Node)

Keep the knowledge base upto date : As shown aove it is important to keep your bot's knowledge base up to date. You can just navigate to the QnA maker website and click on Save and Train button and publish as we shown above.

I am sure this would be useful to those who have built COVID trackers , you can just create and embed this chat bot within your web application, and for others to support employees who are working from home you can extend this bot on the respective collaboration tool. Let's fight against COVID with these cool technology and make this world a better place. Cheers!

· 7 min read

Overview:

Due to the recent COVID outbreak and as it continues to spread throughout the world, employees are being to asked to work from home. While most of the companies are already getting adapted to this new way of working, there are mixed opinions among employees from different parts of the world. IMO , Working from home is a good option for new parents, people with disabilities and others who aren’t well served by a traditional office setup. As this was appreciated by most of my colleagues and industry friends, i wanted to see how everyone is reacting to this new way of working across the world. In this post, i will explain how i built an application in 10 minutes to solve this particular question in mind using server less computing offered by Azure.

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.

Services used:

  • Azure Logic Apps
  • Azure Functions
  • Azure CosmosDB
  • Cognitive Service
  • PowerBI

Architecture:

Architecture

Architecture of the solution is very simple and it uses most of the Azure managed services that handle the infrastructure for you.Whenever a new tweet is posted Logic Apps receives and processes the tweet. Sentiment score of the tweet can be analyzed using the Cognitive service then Azure function is used here to detect the sentiment of the tweet and finally inserted as a row in the powerBI to visualize in the dashboard. You can also use SQL server/Cosmosdb to store the tweet data if you want to process it later.

How to build the application:

Step 1: Create the Resource Group

As the first step, we need to create the resource group that contains all the resources needed. Navigate to Azure Portal and create the resource group named "wfh-sentiment"

Step 2 : Create the Function App

As the next step lets create the Function App which we need to detect the sentiment of the tweet. You can create and deploy the function app using Visual Studio Code. Open Visual Studio Code(Make sure you have already installed the VSCode with the function core tools and extension). Select Ctrl + Shif + P to create a new Function Project and select the language as C# ( But you could consider using any of the language that you are familiar with)

Create new Function App

Select language as C#

Select the trigger as HttpTrigger

Give the name of the Function

Provide the name of the function

and the logic of the Function app is as follows,

using System;
using System.IO;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Azure.WebJobs;
using Microsoft.Azure.WebJobs.Extensions.Http;
using Microsoft.AspNetCore.Http;
using Microsoft.Extensions.Logging;
using System.Net.Http;
namespace WorkFromHome
{
public static class DecideSentinment
{
[FunctionName("DecideSentinment")]
public static async Task<HttpResponseMessage> Run(
[HttpTrigger(AuthorizationLevel.Anonymous, "get", "post", Route = null)] HttpRequestMessage req,
ILogger log)
{
log.LogInformation("C# HTTP trigger function processed a request.");
string Sentiment = "POSITIVE";
//Getting the score from the Cognitive Service and determining the sentiment
double score = await req.Content.ReadAsAsync<double>();
if(score < 0.3){
Sentiment = "NEGATIVE";
}
else if(score < 0.6){
Sentiment = "NEUTRAL";
}
return req.CreateResponse(System.Net.HttpStatusCode.OK,Sentiment);
}
}
}

And the source code can be found here. Then , you can deploy the function App to Azure with simple command using Ctrl+Shift+P and deploy to Function App.

Step 3: Create the Azure Cognitive Service to determine the sentiment of the tweet text

As we discussed above, lets create the cognitive service to determine the sentiment score of the tweet. Go to the same resource group and search for cognitive service and create a new service as follows,

Create Cognitive Service

Step 4: Create Cosmosdb to store the data

In my application, i have made this step optional as i don't need to save the tweet data for historical analysis. But you can definitely use cosmosdb to store the tweets to process later. As how you created the Cognitive service create a new cosmosdb account and a database to store the data as follows,

Cosmosdb to store tweets data

Step 5: Create PowerBI dataset to visualize the data

Navigate to PowerBI portal and create a new dataset to visualize the data we collected as follows,

Create new Streaming Data set in the work space

Select API in the new streaming data set option

Configure the fields as above.

Step 6: Create the Logic App and configure the Flow

This is the core part of the application as we are going to link together the above component as one flow. You can connect these flows using designer as well as using YAML code. I will be using Designer to create the flow.

As denoted above the first step we need to add the twitter connector which you can pick from the available list of connector named "when a new tweet is posted"

Connector when new tweet is posted

You need to configure the search text which you want to get the tweets , in this case i am going to use the Hashtag "#WFH" and set the interval as 30 seconds.

Look for new tweets on every 30 seconds

The second step is to pass the tweet to Azure cognitive service to analyse the sentiment of the tweet and get the score as output

Select detect sentiment as the next step

You need to provide the key and the URL which could be obtained from the cognitive service you created above.

Configure the detect sentiment of the tweet with the input as the tweet text

The third step is to pass the score obtained above to Azure function which we already deployed to determine the sentiment of the tweet, select the azure function from the connector list as follows,

Select Azure Function which will display the functions already deployed to azure

Configure score from the Cognitive service as an input to the Azure function

Next step is to stream the data set to powerBI so that it will be readily available for the visualization. Select the below connector as next step

Configure Add rows to a dataset to insert data to PowerBI

We are almost done with the configuration, as the last step you need to map the data fields from the above steps to insert into the dataset and the final configuration looks as below.

Mapping the dataset with the outputs from the previous steps

Step 7: Visualize it in PowerBI

Now we have configured all the steps required in the logic app, navigate to PowerBI and select the data set from which you want to create the report/dashboard. In this case we will select the data set which we have already created as follows,

Select the dataset

Rest is yours, you can create lot of usual charts/visualizations according to the way you need. I have created four basic metrics to see how world reacts to "work from home"

  • Indicate the total number of unique tweets
  • Distribution of sentiments using a pie chart
  • Table which displays all the data (user,location,sentiment,score and the tweet)
  • Worldmap which shows how distribution of sentiments look like

and this is how my application/dashboard look like.

Final Dashboard with RealTime Tweets

As you can see the tweets and the sentiments are being inserted to the data set and most of the sentiments are being Positive(Looks green !!!). You can replicate the same architecture for your scenarios ( Brands/ Public opinion etc).

As you see some complex scenarios/problems can be easily sorted out with the help of serverless computing and that is the power of Azure. Cheers!

For those who are interested you can view the Live dashboard.