When I develop Aspire extensions, I frequently want to demonstrate how they’re used in practice. Playwright is fantastic for capturing application URLs and showing them in action—but it only reveals URLs, not the actual code behind them.
The real challenge? I don’t just want to show all the code. I want to highlight the relevant pieces that matter for the demonstration.
The Solution
I created an Aspire Resource that:
- Registers a lightweight file viewer resource that runs alongside your distributed application
- Serves a Monaco-powered web UI on a port you configure, with full syntax highlighting support
- Lets you specify individual files and highlight specific lines that demonstrate key functionality
- Renders each file at a clean URL (
/files/{filename}) for easy sharing and embedding
Instead of saying “look at line 47 of AppHost.cs,” I can now point to a live viewer showing exactly that line highlighted.
Why I Built This
When creating tutorials or documentation with Aspire, I often find myself:
- Switching between the running app and the code editor
- Explaining what a feature does without showing its implementation live
- Wanting a clean, shareable URL that demonstrates “here’s the code that does this”
aspireExtensions is open source on GitHub at https://github.com/ignatandrei/aspireExtensions
Next time implementation.