Timesheet Blazor Server

Timesheet · how it was refactored

Branch by abstraction

How one MVC app became a shared core with three front ends, without breaking it along the way.

The steps

  1. The original project was MVC Classic, with the domain layer in the same project as the MVC UI. Unit tests for the domain layer were in a separate test project.
  2. Introduce the abstraction. The domain layer moved into its own project behind a clear interface. The unit tests showed it still behaved the same.
  3. Point the existing UI at it. The MVC Classic UI was changed to depend on the new domain project.
  4. Reuse it for more UIs:
    • a hybrid UI (MVC/Razor Pages hosting Blazor components);
    • a Blazor Server UI.

Projects before and after

Solution Explorer before: Timesheet (domain layer and UI) and Timesheet.Tests. After: Timesheet.Blazor.Server (UI), Timesheet.Core (domain layer), Timesheet.Mvc.Classic (UI), Timesheet.Mvc.RazorComponents (UI) and Timesheet.Tests

Three front ends, one core

The same application layer (models, repository, services, validation) in Timesheet.Core, used by three different UIs:

How it's built

An unhandled error has occurred. Reload 🗙