azure

Zero to Azure Hero with ASP.NET Core, Blazor, Azure DevOps, Cognitive Services, SonarCloud and App Services - Part 9

In this final post in our Zero to Azure Hero series I will cover some tips and tricks such as adding status badges to your GitHub ReadMe page and creating an Azure DevOps dashboard to monitor your Pipelines.

To add an Azure Build Pipeline status badge to our GitHub page, from the Azure DevOps portal, navigate to the Build page, select the pipeline you wish to generate the badge for, select the ellipsis beside the Edit and Queue buttons and finally select 'Status Badge'

DevOpsBadge

Copy the Sample Markdown to your clipboard.

Open your Sentiment Analysis library in VS Code and create a ReadMe.md file and paste in your markdown.

Readme

Commit and push your changes from the CLI and refresh your project on GitHub and you should now see your Azure Pipelines status badge listed.

NewBadge

We can also add a badge for our SonarCloud analysis. From the SonarCloud overview page for your project, select 'Get Project Badges' from the bottom right, then copy the badge you would like to use.

SonarBadge

Paste the copied markup into your ReadMe.md file and convert to valid markdown, save and push the changes to GitHub.

![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=twitter-sentiment-juihdfewuirye87t34ui587&metric=alert_status)

Once the changes are pushed, refresh your GitHub page to see the second badge.

TwoBadges

In this case you can see my Quality Gate has failed due to lack of code coverage.

The final thing I want to cover is setting up Azure DevOps dashboards to monitor your CI/CD pipelines.

From the Azure DevOps portal select Overview from the Main Menu then Dashboards. From here you can create a new dashboard, or use the existing 'Overview' board. Im going to do the latter and use the existing board.

NewDashboard-1

Once selected you will be prompted to add your first widget

Dash1

On the right drag on the Build Usage and Build History widgets.

Dash2

To configure the Build History Widget click the cog and from the settings on the right select one of your pipelines

Dash3

Add another Build History widget and select your second pipeline

Dash4

Once complete click Done Editing at the top

Dash5

Thats our first dashboard up and running. There are loads of extensions available out of the box and if you don't find something you need you can search the extensions gallery here

And thats a Wrap!

All code covered in this Blog Post can be found on my GitHub repository here.

https://github.com/stevenknox/TwitterSentiment

Thanks for taking the time to read this, I hope you have enjoyed it and have learned a thing or two along the way. If you have any queries please get in contact via my twitter @stevenknox101 or the disqus comments box below. Looking forward to hearing from you!

Part 1 - Introduction

Part 2 -Create our Library and hook up Twitter API support

Part 3 - Setup our first Azure DevOps CI/CD Pipeline

Part 4 - Update pipeline to package and push to private NuGet Feed on Azure Artifacts

Part 5 - Add Code Quality Analysis to our pipeline using SonarCloud

Part 6 - Add Sentiment Analysis using Text Analytics API from Azure Cognitive Services

Part 7 - Build our ASP.NET Core Blazor App

Part 8 - Deploy our ASP.NET Core Blazor App to Azure App Services

Part 9 - Wrapping up, Badges, Dashboards and more