Good Monday, it's time to share new ReadingNotes. Here is a list of all the articles, podcasts, and blog posts, that catch my interest during the week.
If you think you may have interesting content, share it!
Programming
Blazor WASM Custom 404 Page on GH Pages (Justin Yoo) - This is a lovely double tutorial. Learn first how to write a 404 not found page in Blazor then learn how to use custom 404 when using GitHub as a hosting platform.
I changed my mind about writing new JavaScript frameworks (Salma Alam-Naylor) - JavaScript is its own universe with so many options and variations. Looking forward to seeing the WTF tool and learning more about how she builds it.
Introducing Spectre.Console (Steve Smith) - It's for sure a library that I will try. Console applications are a very useful tool so anything that can speed up the creation process is a must.
Developing .NET on AWS with Isaac Levin (.NET Rocks!) - Yes!! Of course, .NET is everywhere but now we hear about it! A captivating episode where Isaac makes a quick tour of all the possibilities for .Net developers on ASW.
137. Anti-Time Management with Richie Norton (Part 1)-id2920271-id538368995) (The Greg McKeown Podcast) - I was not sure what to expect from "Anti-Time Management" and I like what I heard. looking forward to listening to part two.
time to share my reading notes. Those are a curated list of all the articles, blog posts, podcast episodes, and books that catch my interest during the week and that I found interesting. It's a mix of the actuality and what I consumed.
You think you may have interesting content, share it!
Implicit Usings in .NET 6 (Scott Hanselman) - Ok yes, it's a cool feature to get started... BUT it's the first best practice you learn in VB (yes I remember Scott) do not use implicit... So fun, but that's it.
5 Reasons Why You Should use a DevTool (Michelle Pruit) - Yes, indeed and it is worth spending money on them to not be limited or blocked because you are using the free version or something.
Announcing ASP.NET Core in .NET 6 (Daniel Roth) - I've not been coding for a little while now, first thing on my to-do is to upgrade to.NET 6 my projects.
[Cake v2.0.0 RC 1 released](Pascal Berger) (https://cakebuild.net/blog/2021/11/cake-v2.0.0-rc0001-released) - A great new version, and important notification of retirement. I should do a tour of my flows/ pipeline to avoid bad surprises.
I made Squid Game with JavaScript (Shuvo) - I love it! Great post that shows us all the code used in this cool demo. There is also a short video to see the final game.
How to get Windows 11 (John Cable) - It's out now and honestly, it is great! If you didn't get the automatic upgrade maybe it's because you don't meet the requirement. Following the steps, it could be a simple checkbox to check-in your current version.
Introduction to GitHub Actions for .Net Developers (Dave Murray) - I'm not sure why but I always felt called by automation. Maybe because it's the ultimate proactivity of any task.GitHub Action is one of those extremely powerful tools that are worth your attention.
Static websites are lightning fast, and running them inside an Azure Blob Storage instead of a WebApp is incredibly economical (less than $1/ month). Does it mean you need to do everything manually? Absolutely not! In a previous post I explained how to automatically generated your static website using a Build Pipeline inside Azure DevOps. In this post, let's complete the CI-CD by creating a Release Pipeline to deploy it.
The Azure Resource Manager (ARM) Template
First thing first. If we want our release pipeline to deploy our website in Azure, we need first to be sure our Resources are available "up there." The best way to do this is by using an Azure Resource Manager (ARM template). I will use the same project started in the previous post, feel free to adapt to your structure or copy it from it.
Create a new file named deploy.json in the deployment folder. We need a simple storage account.
I used a parameter (StorageName) to define the name of the storage account. This way I could have multiple pipelines deploying in different storages.
Not to make the ARM template accessible to the release pipeline we also need to publish it. The easiest way to do it is to add another Copyfile task in our azure-pipeline. Add this task just before the PublishBuildArtifacts.
Once you commit and push these changes, it will trigger a build. When done, the ARM template will be available, and we will be able to start working on the release pipeline.
The Release Pipeline
Navigate to the DevOps project created in the previous post. This time, create a new Release Pipeline. When asked, select an empty template, we will pick manually the tasks we need.
First, we need to define the trigger and where are our artifacts. Click on the thing at the left of the screen. Select the build projects and let's use the latest version of the artifact to our deployment.
To get a continuous deployment, you need to enable it by clicking on the lightning bolt and selecting the enabled button.
Now let's select our tasks. Click on the "+" sign to add new tasks. We need three of these: Azure Resource Group Deployment, Azure CLI, and Azure File Copy.
Task 1 - Azure Resource Group Deployment
The first one will be an Azure Resource Group Deployment. The will be used to deploy our ARM template and be sure that the resources are available in Azure.
To configure the ARM deployment we need to select the Azure subscription and authorize the pipeline to have access. Then you will need to specify the name of the resource group you will be deploying into; it's location and finally points where is the linked ARM template.
Task 2 - Azure CLI
The second one is an Azure CLI. As I am writing this post, it's not possible to enable the static website property of a storage account. Therefore we will execute an Azure CLI command to change that configuration. Once you picked the Azure subscription, select inline script and enter this Azure CLI command:
az storage blob service-properties update --account-name wyamfrankdemo --static-website --index-document index.html
This will enable the static website property of the storage account named wyamfrankdemo, and set the default document to index.html.
Task 3 - Azure File Copy
The last task is an Azure File Copy to copy all our files from $(System.DefaultWorkingDirectory)/drop/drop/outpout to the $web container (in our Azure Blob storage). The container must be named $web, that's the name used by Azure for the static website.
Wrapping up
Once you are done configuring the Release Pipeline, it's time to save it and run it. After only a minute or two (this demo is pretty small) the blog should be available into Azure. To find your endpoint (aka URL) you can go into the portal.azure.com and look at the static website property of the blob storage that we just create.
I have that little website, a blog that doesn't consume much bandwidth, and I was looking to optimize it. Since Azure blob storage is such a low expensive resource, I thought it would be the perfect fit. I could use a static website generator to transform my markdown file into a nice looking blog and publish that in Azure! Using Azure DevOps pipeline I could at every "git push)" do that all automatically without having anything installed on my machine... meaning I could write a new blog post from anywhere and still be able to update my blog.
In this post, I will explain all the steps required to create a continuous integration and continuous deployment process to deploy a static website into Azure.
The Goal
The idea here is to have on a local machine a folder tracked by git. At every push, we want that change to trigger our CI-CD process. The Build Pipeline will generates the static website. The Release Pipeline will create our Azure resources and publish those artifacts.
The Static Website
In this post, I'm using Wyam.io as static website generator. However, it doesn't matter. There is a ton of excellent generator available: Jekyll, Hugo, Hexo, etc. I selected Wyam because it is written in .Net and If eventually, I want to dig dipper it would be easier for me.
For all those generated websites, it the same pattern. You have an input folder where you have all your posts and images and an output folder that contains the generated result. You don't need to track the content of your output folder, so it would be a good practice to modify the .gitignore file accordingly. As an example here how look mine.
The build pipeline will generate our website for us. There so, it needs to have the generator installed. A great tool to do this kind of tasks is Cake. What I like with that tool is that it is cross platform so I can use it without worrying on wish OS it will run.rd.
The Azure pipeline is defined in an azure-pipeline.yml file. Installing Cake should definitely be in our first steps. To know how to do that, navigate to the Get started page of the Cake's website, it's explained that we need to execute a build.ps1 or build.sh (depending on your build setup). That will install Cake and execute the file build.cake. Those files can be found on the GitHub repository as mentioned on the website.
On the Wyam website, in the deployment section of the documentation, you will find a sample for our required build.cake file. It looks like this:
On the first line, it will install the required NuGet package (you should definitely specify the version). Then it defines some tasks, and run the generation command. Create that file at the root of the website folder.
Now let's have a look at the azure-pipeline.yml file.
The first line is to specify the pipeline trigger. In our case, we will look at the master branch. Then I declare a variable to keep the .Net Core version. That way, it will be easier to maintain the script in the future.
The pool command is to specify what kind of server is created. Here I'm using a Windows one, yet I could have used Linux too (all components are cross-platform).
Then comes the list of steps. The first one install .Net Core. The second step is a powershell command to execute our build.ps1 file. At this stage, the static website should be generated in a subfolder output. The last two steps are to copy the content of the output folder into the ArtifactStagingDirectory and then publish it. This way the Release Pipeline can access the artifacts.
There is detailed information about all the commands for a YAML Azure Pipeline file in the documentation. Create your own or copy-paste this one in a new azure-pipeline.yml file under a subfolder named deployment. Once your file is created, commit and push them to GitHub or any repository.
Navigate to Azure DevOps (dev.azure.com). Open your project, or create a new one. Now from the left menu click on the Pipeline (the rocket icon), to create a new one. If you are using an external repository, like me, you will need to authorize Azure DevOps to your repo.
To configure the pipeline, since we already have created the azure-pipeline.yml file, select the Existing Azure Pipeline YAML file option and point it to our file in the deployment folder.
It will open our YAML file. If you wish you could update it. Run it, by clicking to Run blue button in the top-right corner. Your build pipeline is done. Now every time you will push changes into your repository that build will get triggered and generate the static website.
Migrating Azure Functions from v1 (.NET) to v2 (Jeremy Likness) - A great story and an migration walkthrough. It's most likely that by following these steps we can only be successful with our migration.
Applied AI in Software Development (Afsana Atar) - This post is an excellent overview of whats AI at ten thousand feet in the air. Perfect if you are not a data scientist and would like to learn more about that trend.
My Twitch Live Coding Setup (Suz Hinton) - A great post from Suz (aka Noopkat) a long time technical streamer, who his both very smart and generous. Definitely, a post to read.
Ghost Contact Form with Azure Functions (Tom Faltesek) - Being myself a user of both Ghost and Azure function I'm very excited about this new series of posts.
Building offline Blazor application (Gunnar Peipman) - A very interesting post about an experience done with Blazor. It's usually during those that I learn the most.
Introducing the Cake.Discord Addin (Gary Ewan Park) - A few weeks ago I used cake to deploy in Azure and I was very impressed by cake. Its great to see this project continues to evolve and get new addin is very cool.
Marking up the Web with ASP.NET Core and Markdown (Rick Strahl) - So many great ideas and cool projects in this article. If you use Markdown it's a must. If you are not using markdown, hmmm... what?!
Fast Focus (Damon Zahariades) - Great short book. Not like the other of his kind, this book goes right to the point and offers actionable item. It's very practical and accessible to everyone. At the end of the book, you know what to do to get started and improve your focus.