I Made a Fully-Functional Blazor App That Does Nothing

In my current project, we're still in the modeling phase, but we figured it was time to put together a UI mockup. Sure, I could’ve used Figma, PlantUML, MS Paint, or even raw HTML/CSS. But I chose Blazor.

Why? Well, I’m comfortable with it, for starters... but more importantly, Blazor’s routing, Bootstrap 5 integration, and ease of dropping in JavaScript made it a perfect fit. And unlike most visual mockup tools, this approach means much of the actual code will be reusable when we build out the real app. That’s a huge win.

What resulted after a few days is... a bit of an anomaly: a fully functional Blazor app that does nothing. What do I mean?

The structure is all there. There are form submits, item deletes, navigation flows... but instead of real logic, most buttons just fire a toast notification. Sort buttons don’t sort. Deleting an item doesn’t actually remove it. It's all placeholder behavior.

WHAT'S HE DOIN?

The truth is, I don’t know the full shape of the data we’ll be working with yet. But I do know the user stories and workflows. So I built a functional façade — a complete skeleton with visual feedback and modular components, all designed as if it were a real application.

For instance, take this orders page:

Take the orders page, for example. It uses a FullOrdersTable component that renders multiple OrderTableRows. Right now, the data is hardcoded. But the component is ready to accept an IList<Order>, and each row is designed to map cleanly to an object model. When the time comes, the real data can just slide into place. Boom, a fully dynamic Orders page, just like that.

And that is why I chose Blazor for this current iteration of the UI.

In The End

By building the UI in Blazor up front, I was able to validate user flows, test layout decisions, and set the stage for real functionality, without throwing away work. It’s more than a prototype, and less than a working app: it’s a bridge. One that looks good, works responsively, and will be easy to wire up when we’re ready to make it real.