Monday, October 27, 2025

Show HN: I Built DevTools for Blazor (Like React DevTools but for .NET) https://ift.tt/Z9XlmJG

Show HN: I Built DevTools for Blazor (Like React DevTools but for .NET) Hi HN! I've been working on developer tools for Blazor that let you inspect Razor components in the browser, similar to React DevTools or Vue DevTools. 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://ift.tt/wP7ItRB Demo site where you can try it: https://ift.tt/ziUwbTm Would love feedback, especially from anyone building production Blazor apps. What debugging pain points do you have that developer tools could solve? https://ift.tt/SKiI8Zv October 26, 2025 at 10:04PM

No comments:

Post a Comment

Show HN: The Legal Embedding Benchmark (MLEB) https://ift.tt/mPBv7YK

Show HN: The Legal Embedding Benchmark (MLEB) Hey HN, I'm excited to share the Massive Legal Embedding Benchmark (MLEB) — the first comp...