DEV Community

Incomplete Developer
Incomplete Developer

Posted on

I Let GitHub Copilot Build My Razor Pages UI (While Rewriting an Old .NET App)

I'm currently rewriting an old .NET Framework application using modern .NET and AI tools.

In this part of the project, I experimented with letting GitHub Copilot inside Microsoft Visual Studio generate the entire user interface.

The result was surprisingly good — with a few interesting lessons.


First Attempt: Blazor

My first thought was to use Blazor, since it’s one of the modern front-end options in ASP.NET Core.

But after trying several quick experiments, Copilot consistently struggled to generate working Blazor projects.

For now, Razor Pages turned out to be far easier for AI-assisted development.


Architecture Before UI

Before generating any UI, the application was already organized into separate projects:

  • Domain – business logic
  • Data Access – persistence
  • Services – application layer
  • Composition Root – dependency wiring

This keeps the UI layer thin, which is ideal when working with AI tools.

The UI project simply references the Services layer, while the rest of the logic lives outside the frontend.

This structure works well for small, medium, and even larger projects.


Prompting Copilot

To make things easier for Copilot:

  • I created a Razor Pages project shell manually
  • I wrote a high-level prompt describing the page
  • I focused on DTOs and data layout

Interestingly, I did not describe UI controls in detail.

I didn’t specify things like:

  • dropdowns
  • textboxes
  • specific HTML controls

Instead, I described what data should appear and how it should be ordered on the screen.

That was enough.


What Copilot Generated

Copilot produced:

  • Razor pages
  • Page models
  • ViewModels

The solution compiled immediately, and the generated PlayLottery page worked.

The form allowed users to:

  • choose how many tickets to generate
  • select number generation strategies
  • use historical lottery numbers as results

The results page showed:

  • overall results
  • net profit or loss

Iterating with AI

From there, the workflow became simple:

Prompt → run → refine.

For example, I asked Copilot to:

  • display the winning numbers
  • show the generated tickets
  • add borders so the results look like actual lottery tickets

Each change required only a small prompt.

This makes UI iteration surprisingly fast.


Key Takeaway

For this workflow, Razor Pages works extremely well with AI coding tools.

The key seems to be:

  • keep business logic outside the UI
  • provide clear DTOs
  • describe data layout instead of UI controls
  • iterate with prompts

Blazor may still catch up, but right now Razor Pages feels much easier for AI-assisted scaffolding.


Full Video Walkthrough

I recorded the entire process here:

👉 https://www.youtube.com/watch?v=sQdByQML_w8&list=PLphsQTGN5DbKsbob0eN5y4zQhZXUzpow2

The video shows:

  • the prompt used for Copilot
  • the generated Razor Pages
  • running the application
  • refining the UI with additional prompts

💡 If you're experimenting with AI-assisted development in .NET, I'd be curious to know:

Have you had better results with Razor Pages or Blazor when using Copilot?

Top comments (0)