Show HN: I Built DevTools for Blazor (Like React DevTools but for .NET)
Show HN (score: 7)Description
The problem: Blazor is Microsoft's frontend framework that lets you write web UIs in C#. It's growing fast but lacks the debugging tools other frameworks have. When your component tree gets complex, you're stuck with Console.WriteLine debugging.
What I built: A browser extension + NuGet package that:
Shows the Razor component tree in your browser Maps DOM elements back to their source components Highlights components on hover Works with both Blazor Server and WASM
How it works: The NuGet package creates shadow copies of your .razor files and injects invisible markers during compilation. These markers survive the Razor→HTML pipeline. The browser extension reads these markers to reconstruct the component tree.
Current status: Beta - it works but has rough edges. Found some bugs when testing on larger production apps that I'm working through. All documented on GitHub.
Technical challenges solved:
Getting markers through the Razor compiler without breaking anything Working around CSS isolation that strips unknown attributes Making it work with both hosting models
It's completely open source:
https://github.com/joe-gregory/blazor-devtools
Demo site where you can try it:
https://blazordevelopertools.com
Would love feedback, especially from anyone building production Blazor apps. What debugging pain points do you have that developer tools could solve?
More from Show
No other tools from this source yet.