gabrewer.com

In my recent SaaS personal projects, I’ve been exploring the capabilities of Dapr, based off of the eShopOnDapr sample. Dapr, with its integrated APIs and best practices for building distributed applications, has significantly streamlined my development process. Learn more about Dapr.

I’ve also been incorporating architectural insights and best practices from YouTube channels like Milan Jovanovic, Nick Chapsas, and Codewrinkles. Their guidance has refinined my approach to these solutions especially around using MediatR, Vertical Slice architecture and performance. Check out their insights:

• Milan Jovanovic’s YouTube Channel
• Nick Chapsas’s YouTube Channel
• Codewrinkles’s YouTube Channel

The release of .NET 8 introduced the .NET Aspire 8.0 Preview 1 - an opinionated, cloud-ready stack ideal for building observable, production-ready, distributed applications compatible with Dapr. View .NET Aspire on GitHub.

Integrating .NET Aspire into my projects was pretty straightforward. However, I encountered a few challenges, especially with Dapr configuration management across projects. I ended up copying the dapr config files into each projects. Aslo .NET Aspire Preview 1 lacked support for deploying Dapr components to Azure.

With the advent of Preview 2, which impoves supports Dapr, I successfully updated my projects. However, I faced a challenge with the secret store configuration:

var secretStore = builder.AddDaprComponent("gab-secretstore", "secretstores", new
    DaprComponentOptions { LocalPath = "../dapr/components/" });

var apiService = builder.AddProject<Projects.gabMileage_Mileage_Api>("mileage-api")
    .WithDaprSidecar()
    .WithReference(secretStore);

This code snippet illustrates how Preview 2 allows specifying Dapr file locations, which was a game-changer in maintaining a centralized configuration. An initial oversight of omitting the trailing slash in the path led to a frustrating error “secret store is not configured”. In reviewing the logs of the Dapr sidecare revealed that the secretstore was not being loaded. Doing some debugging with the Aspire source provided the much-needed insight. Looking at the command line in the Aspire Dashboard showed that the resources path ommited the /component part of the path.

...
foreach (var componentReferenceAnnotation in componentReferenceAnnotations)
{
if (componentReferenceAnnotation.Component.Options?.LocalPath is not null)
{
var localPathDirectory = Path.GetDirectoryName(NormalizePath(componentReferenceAnnotation.Component.Options.LocalPath));

        if (localPathDirectory is not null)
        {
            aggregateResourcesPaths.Add(localPathDirectory);
        }
    }
    else if (onDemandResourcesPaths.TryGetValue(componentReferenceAnnotation.Component.Name, out var onDemandResourcesPath))
    {
        string onDemandResourcesPathDirectory = Path.GetDirectoryName(onDemandResourcesPath)!;

        if (onDemandResourcesPathDirectory is not null)
        {
            aggregateResourcesPaths.Add(onDemandResourcesPathDirectory);
        }
    }

}
...

I’m currently developing a simplified version of these projects to experiment with new ideas before integrating them into production projects. You’re welcome to check out the progress and contribute your insights on my personal GitHub repository.

My journey with Dapr and .NET Aspire continues to be a learning curve. I’m excited to see how these tools evolve and how they can further enhance SaaS project development.

Over the last couple of weeks I have been diving back into Angular development using Angular 6 and ngrx.  One of the things that quickly became apparent is that now the best practices of installing JavaScript tools is to install them locally instead of globally to prevent version collisions.

When I first started I installed the angular cli globally and encountered this type of error when running many of the sample apps that I downloaded.

Your global Angular CLI version (6.0.8) is greater than your local version (1.7.3). The local Angular CLI version is used.

This didn’t seem to cause me an issues but still the error bugged me and when I was reading the book Angular 6 for Enterprise-Ready Web Applications by Doguhan Uluca he really drives home that you should keep the number of globally installed packages to a minimum.

I was able to find out what commands I had installed globally using this command

npm list -g --depth=0

Which showed I only had the angular cli and npm install globally.

So I was able to uninstall the global angular cli and get rid to the ugly warnings.

Doguhan also points our that you should use npm-windows-upgrade instead of using npm i -g npm to upgrade npm on Windows or you are going to run into npm corruption issues.

https://github.com/felixrieseberg/npm-windows-upgrade

Windows 10 Home password expiration.

Today I had a couple of Windows 10 Home machines had their passwords expire.

To turn off the Windows 10 password expiration

net accounts /maxpwage:0

From http://www.thewindowsclub.com/customizing-the-password-policy-in-windows-7

Upgrading npm on Windows

I was installing jspm on a new machine and after I installed node 4.3.1 it was running npm I was trying to upgrade npm.  I tried a bunch of different commands I found on stack overflow but this command from the npm site (I feel like Colonel Sanders looking for the Nashville Hot Chicken Recipe) did the trick on both Windows and the Mac.

npm install npm@latest –g

From*:* https://docs.npmjs.com/getting-started/installing-node

http-server

In my recent javascript library/framework exploration I found myself needing a quick way to server html without having to have gulp or more permanent web server.  I found http-server fits the bill nicely.

npm install –g http-server

http-server –o –c-1

-o opens browser window after starting the server

-c-1 disables caching

From: https://github.com/indexzero/http-server

When VisualStudio code was announced I went out and installed it right away on my Mac and Windows machines.  One my home development machine I was unable to see the icons.  I was thinking that it was due to my 4K display and an High DPI issue but it turns out not to be the case.

In reading the Reacting to feedback, common issues, and our first update post on the Visual Studio Code bug it was due to the svg file extension being associated to something other than image/svg+xml in my case due to Inkscape it was set to application/svg.

Changing the Content Type to image/svg+xml made the icons visible.

There is a FAQ with several fixes and workarounds for Visual Studio Code at https://code.visualstudio.com/Docs/FAQ

The third (second successful) Kickstarter campaign that I pledged to the Chocolatey Kickstarter campaign was successfully funded.  I always like reading what tools other developers are using so to celebrate, I thought I would publish the packages I currently have installed.

I may have an issue with being obsessed with editors.

Editors

Close behind my obsession with editors is my love to learn new programming languages.

Languages

Databases

Programming Utilities

Utilities

Media Utilities

In the last year I have become enamored with Hypermedia APIs and the Collection+JSON API in particular that I first came across in Mike Amundsen’s book Building Hypermedia APIs with HTML5 and Node.  It seems to be a perfect fit for many of the APIs that I have been working on.  Glenn Block created the CollectionJson.Net library to make it easy to create Collection+JSON based ASP.NET Web APIs.

However when I browse to a WebAPI endpoint that returns a Collection+JSON result in Internet Explorer or Firefox I get a prompt to download the file.

Chrome displays the raw JSON result in a more friendly manner.

Although Fiddler or the browser debug tools make it fairly easy to see the results as JSON sometimes it is convenient to see the results rendered directly in the browser.

I found an old post from Rick Strahl’s blog regarding how to display application/json.  He suggests using JSONView for Firefox and adding a registry entry for Internet Explorer.  I was able to easily tweak the Internet Explorer registry keys to handle vnd.collection+json.  Unfortunately JSONView for Firefox will not work for the application/vnd.collection+json media type. https://github.com/bhollis/jsonview/issues/7

For internet Explorer it is just a matter of changing the Content type entered in the registry from application/json to application/vnd.collection+json

Create a new application/vnd.collection+json key in:

• HKEY_CLASSES_ROOT\MIME\Database\ContentType**application/vnd.collection+json**
• Add a string value of CLSID with a value of {25336920-03F9-11cf-8FD0-00AA00686F13} (the CLSID for the “Browse in place” action)
• Add a DWORD value of Encoding with a hex value of 0x00080000

[HKEY_CLASSES_ROOT\MIME\Database\Content Type\application/vnd.collection+json]
“CLSID”=”{25336920-03F9-11cf-8FD0-00AA00686F13}”
“Encoding”=hex:08,00,00,00

Now Collection_JSON results will display directly in Internet Explorer.

For Firefox it was just a matter of specifying the application to open the media type as Firefox.

This adds the application/vnd.collection+json media type to the Applications list in the Firefox Options dialog.

And now Collection+JSON results will display directly in the Firefox window.

This technique will work for other types of +json media types as well such as Mason (application/vnd.mason+json) and HAL (application/vnd.hal+json).