I’ve been working through my childhood in therapy lately and asking myself what drives me to fix things: problems, computers, code, people, etc. And with enough work I’ve pinpointed it to a single interaction that I’ll recount here. I don’t recall how old I was, exactly, but we’ll place the time period around Windows 95. It was a typical evening in the Gennari house. I would say probably sometime after dinner and before bed. And I recall the phone ringing and my mom handing the phone off to my dad. To date myself, these were the times when phones were attached to walls. If you were lucky, the cord to the handset was long enough you could walk around the corner. I was sitting at the dinner table, probably finishing homework when my motioned to me. ...

I work with a UX designer who has a strong reaction every time she sees pure black (#000000) in a design. “It’s too harsh!” she’ll say, insisting that dark grays create more sophisticated digital experiences. Her passion got me thinking - could people actually tell the difference? That question turned into isit000000.com, a playful challenge that tests whether you can spot true black among various dark shades. Spoiler: it’s much harder than you’d think! ...

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. Vue Router is the standard tool for this job when working with Vue. ...

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. ...

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.app ...

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. ...

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: ...

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.0 first release in 2016, Microsoft has made a Docker image available for the .NET runtime, making composing Docker containers and running .NET application a breeze. This has made hosting on services that support Docker (like Heroku and Fly) a breeze. To get started, you need Dockerfile in your project folder. Simply change the AppName.dll to match your executable name. I’m also running .NET 9.0 preview builds, so adjust accordingly. ...

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. Over time, you learn to hone troubleshooting skills and you can often tell a lot about an engineering by the tooling they surround themselves with. ...

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: ...