Dan Schnau

Gradual Migration: Moving from MVC to Blazor Without Breaking Everything

Introduction: Why Migrate to Blazor?

Blazor brings the power of modern web development to .NET developers, enabling rich interactivity using just C#. But most existing enterprise applications still rely on ASP.NET MVC. Rewriting an entire application overnight isn’t realistic, so this post outlines how to move from MVC to Blazor gradually, without breaking everything in the process.

Step-by-Step Migration Strategy

1. Start with Shared Models and Services

Example: Refactor your business logic into a service:

public interface IProductService
{
    Product GetProductById(int id);
}

public class ProductService : IProductService
{
    public Product GetProductById(int id)
    {
        // Fetch from DB or cache
    }
}

Then inject and use it in both a controller and a Blazor component:

In MVC Controller:

public class ProductController : Controller
{
    private readonly IProductService _productService;

    public ProductController(IProductService productService)
    {
        _productService = productService;
    }

    public IActionResult Details(int id)
    {
        var product = _productService.GetProductById(id);
        return View(product);
    }
}

In Blazor Component:

@inject IProductService ProductService

@code {
    [Parameter] public int Id { get; set; }
    private Product product;

    protected override void OnInitialized()
    {
        product = ProductService.GetProductById(Id);
    }
}

2. Use Blazor Components in Razor Views (Where Appropriate)

Example: Embed a Blazor component into an MVC .cshtml view:

<component type="typeof(MyApp.Components.MyWidget)" render-mode="ServerPrerendered" />

Make sure the _Imports.razor and service registration for Blazor Server are correctly configured.

3. Isolate Blazor Areas for New Features

For any new feature, consider building it in Blazor from the start. You can keep MVC for legacy parts while introducing Blazor for greenfield work. Use consistent routing to make the experience seamless.

4. Gradually Replace High-Interaction Pages

Pages that involve lots of JavaScript, dynamic forms, or live updates are prime candidates for Blazor. These benefit most from Blazor’s signal-driven updates and component model.

5. Introduce a Hybrid Navigation Strategy

A quick note: this kind of hybrid approach—mixing Blazor and MVC—is different from "Blazor Hybrid," which refers to running Blazor components in both client-side and server-side contexts (often used in desktop scenarios with .NET MAUI). Here, we're talking about a web-focused strategy that blends traditional MVC routing with Blazor navigation.

Mix traditional MVC navigation (RedirectToAction, <a href>) with Blazor’s <NavLink> carefully. Keep navigation consistent with shared layout components and links that bridge both worlds.

6. Manage Authentication and Layouts Across Both Frameworks

Use shared layout files, partials, or component libraries where possible. For authentication, use the same middleware and claims-based identity so users don’t have to reauthenticate between sections.

7. Remove Unused Features

Migration is also a great opportunity to clean house. As you assess which parts of your MVC app to rebuild in Blazor, take note of outdated or unused features. If certain pages, reports, or admin tools haven’t been touched in months (or years), consider whether they need to be migrated at all. Trimming unused code keeps your new Blazor app leaner, easier to maintain, and more focused on what users actually need.

Final Thoughts: Tips, Pitfalls, and When to Go All-In

A full migration to Blazor is tempting—but not always necessary. Start small, prioritize user experience, and lean on shared services to minimize duplication. Avoid trying to copy MVC patterns directly into Blazor; embrace the component model instead. When your team is comfortable and the codebase is ready, a full move may make sense—but until then, hybrid works just fine.