Adding Vue Router and Shadcn-Vue to Fastify and Vite: Part 2

In Part 1, I walked through setting up Fastify, Vite, and TypeScript together, including all the gotchas I ran into along the way. Now that the backend and front-end tooling are working smoothly, it’s time to take things up a notch by adding page routing with Vue Router and enhancing the UI with Shadcn-Vue. Adding Vue Router The first step to building a more dynamic front-end is introducing client-side routing. This will let us navigate between different pages without needing full page reloads—a must-have for any modern web application....

November 12, 2024 · 4 min · 701 words · Me · 

Fastify, Vite, and TypeScript Setup Guide - Part 1

This is a recap of how I got Fastify, Vite, TypeScript, and Tailwind CSS working together. It was a bit like assembling a complicated jigsaw puzzle without the picture on the box, and I ran into a few unexpected gotchas along the way. Here, I’ve documented what worked, what didn’t, and how I solved the problems that came up. Hopefully, this helps me revisit the setup later or assists anyone else going down the same path....

October 26, 2024 · 5 min · 862 words · Me · 

My First Nuxt App

I’ve had this idea in mind for an AI-assisted tool that allows you to chat with your workout data, as well as generate new titles and descriptions. I’ve been obsessed with hosting on Cloudflare, had a pg project in Supabase, and have a looked at Vue longingly in the past, so I thought it was a good opportunity to combine all of these for a little project. I’ve included some screenshots for those without Strava accounts (required to pull in data), but if you do … give it a try: https://kalla....

October 22, 2024 · 3 min · 510 words · Me · 

Htmx Using Razor Components

I love the simplicity of Htmx and the dev experience of Razor Components, so today I’m going to show you how to use both of them together. We’re going to be using the standard .NET 8 webapp template, Razor Pages and layouts for the main pages, and Razor Components for the Htmx interactivity. This gives us the best of both simplicity worlds, using Razor pages for our overall app navigation and logic, and the templating an in-line code of Razor Components for our UX components....

August 30, 2024 · 4 min · 702 words · Me · 

Create a Custom Prometheus .NET Meter

In a previous post I showed you how to add Prometheus metrics to a Blazor app on Fly.io using the OpenTelemetry NuGet packages. Fly makes capturing and displaying metrics simple with their built in Grafana dashboards. But sometimes there are events and metrics from the application layer that you’d like to track, such as how many views a particular piece of content got. Here I’ve created InstrumentationService.cs which I can easily inject into any Blazor component in order to increment a counter:...

August 25, 2024 · 2 min · 357 words · Me · 

Running Blazor on Fly.io

I’ve been running a Blazor app on Heroku for a bit, but I decided to give Fly.io a try. Aside from the ease of deployment through their CLI, they boast some pretty cool, zero-configuration global deployment benefits: Over 3 million apps have launched on Fly.io, boosted by global Anycast load-balancing, zero-configuration private networking, hardware isolation, and instant WireGuard VPN connections. Push-button deployments that scale to thousands of instances. Since .NET Core 1....

August 24, 2024 · 4 min · 852 words · Me · 

On Troubleshooting

As a long time contributor to StackOverflow, the quality of posts are wide ranging. In the hay-day, a contributor could rack up tons of points by pointing low-effort posters in the right direction with a single line of code. Now I’m sure the majority of those questions could be (and are) answered by AI, which was trained on my answers. But I think troubleshooting is the hallmark of a great engineer....

August 23, 2024 · 2 min · 345 words · Me · 

Blazor Authentication Without Razor Pages

For a while now I’ve been using the standard ASP.NET authentication methods with customized Razor pages to match the style of my site. And while this works, it’s annoying to lose all the functionality of Blazor, especially when you pour hours of time into customizing the look-and-feel, only to need to recreate it in the Razor page. In short, the special sauce is a minimal API method hat accepts a POST form-encoded username and password, which I called internal_login:...

August 23, 2024 · 3 min · 499 words · Me · 

Blazor Magic Link

I wanted a quick Magic Link implementation for my Blazor app, so I cobbled together a solution. I took inspiration from a NuGet package (forgot which one), but it’s simple enough to do with a few methods. Generating the Magic Link When a user decides to log in with a magic link, you can call a method like this. I’m loading a lot of the email server config elsewhere in the service....

August 21, 2024 · 4 min · 726 words · Me · 

A Robot, Dad?

This story was written in 2006 when I was 24 years old. Today an traffic cone was left outside our home, and bringing it inside I realized I had never properly shared it. So now that history has come full circle, I’m reviving it here so it can live forever. Prologue The following story is commonly referred to as the day that single-handedly ruined my entire childhood. Of course, that’s just line that runs over and over in my head....

April 4, 2024 · 5 min · 1014 words · Me ·