BlazorMvc 2.1.1

dotnet add package BlazorMvc --version 2.1.1
NuGet\Install-Package BlazorMvc -Version 2.1.1
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="BlazorMvc" Version="2.1.1" />
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add BlazorMvc --version 2.1.1
#r "nuget: BlazorMvc, 2.1.1"
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
// Install BlazorMvc as a Cake Addin
#addin nuget:?package=BlazorMvc&version=2.1.1

// Install BlazorMvc as a Cake Tool
#tool nuget:?package=BlazorMvc&version=2.1.1

Blazor MVC

Add C# MVC capability to any Blazor application

Blazor MVC is a C# Project that enables the ability to use the MVC framework with Blazor applications. Developers that have experience with this framework in the past can have familiar structure and quickly move into Blazor.

Features

  • Compatibility with .NET 3, .NET 5, and .NET 6
  • Compatibility with both Blazor Server applications and Blazor WebAssembly
  • Example projects on how to implement Blazor MVC
  • Create Controllers and Models for each of your views by extending prebuild classes

Installation

This section can be used for either Blazor web server or WebAssembly applications. After this section navigate to your desired project type and see the different implementations.

Note: You can find working examples of one for each .NET version and for each type of Blazor project (Blazor Server or Blazor WebAssembly)

  • The first step to add BlazorMVC to your project is to download the BlazorMvc project from (https://github.com/jeffreypalermo/blazormvc).

  • Next, create a New Project or open an Existing Project using the Blazor framework

  • Navigate to the root folder of the desired solution within File Explorer and copy the project folder BlazorMvc from the downloaded project

Note: You can add a new project within the downloaded solution of BlazorMvc.

  • Next, open the project in Visual Studio

  • Right click on the solution, hover over Add, and select Existing Project....

    • Navigate to the folder of your current project and select the .csproj file of the BlazorMvc project that you copied over
  • Once BlazorMvc has been added to the solution, next add the project as a build dependencies within your desired project.

    • Right click on the blazor project, hover over Build Dependencies, and select Project Dependencies

      • Select BlazorMvc and click Ok
  • Then you need to edit the project file by double clicking your project in Visual Studios.

  • Within the newly opened .csproj copy and paste the below code within the <Project> tag.

 
    <ItemGroup> 
        <ProjectReference Include="..\BlazorMvc\BlazorMvc.csproj" /> 
    </ItemGroup>  

Above are the steps that are required to get started using BlazorMvc within your Blazor application. Below are the corresponding steps that are needed for both different types of applications to get them to run.

Note: To use BlazorMvc in components you need to make sure you using Palermo.BlazorMvc;

Blazor WebAssembly Application

For the Blazor WebAssembly application you need to edit a couple files in order to allow the BlazorMvc library to be properly implemented

  • Program.cs
using Microsoft.Extensions.Logging.Abstractions; 
using Palermo.BlazorMvc; 
  
var builder = WebAssemblyHostBuilder.CreateDefault(args); 
builder.Services.AddScoped<IUiBus>(provider => new MvcBus(NullLogger<MvcBus>.Instance)); 

// AppController is the class that we are creating next. You can use any naming convention. You will need to add the using statement to gain access to this class within this file 
builder.RootComponents.Add<AppController>("#app"); 
  • AppController.cs - Create a new class
using Microsoft.AspNetCore.Components.Rendering; 
using Palermo.BlazorMvc; 

// Change namespace to match yours 
namespace Sample.WebAssemblyNet6 
{ 
    // AppView is the default app view. If you created a new Blazor application this class will be names App. We renamed it to AppView 
    public class AppController : ControllerComponentBase<AppView> 
    { 
        protected override void BuildRenderTree(RenderTreeBuilder builder) 
        { 
            base.BuildRenderTree(builder); 
        } 
    } 
} 
  • AppView.razor- This is the App.razor file that was renamed
@inherits Palermo.BlazorMvc.ViewComponentBase 

<Router AppAssembly="@typeof(Program).Assembly"> 
    <Found Context="routeData"> 
        <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayoutController)"> 
        </RouteView> 
    </Found> 
    <NotFound> 
        <LayoutView Layout="@typeof(MainLayoutController)"> 
            <p>Sorry, there's nothing at this address.</p> 
        </LayoutView> 
    </NotFound> 
</Router> 

Blazor Server Aplication

  • Program.cs
using Microsoft.Extensions.Logging.Abstractions; 
using Palermo.BlazorMvc; 

var builder = WebApplication.CreateBuilder(args); 
builder.Services.AddScoped<IUiBus>(provider => new MvcBus(NullLogger<MvcBus>.Instance)); 

// Add services to the container. 
builder.Services.AddRazorPages(); 
builder.Services.AddServerSideBlazor(); 
builder.Services.AddScoped<AppController>(); 
builder.Services.AddScoped<WeatherForecastService>(); 
  • AppController.cs - Create a new class
using Microsoft.AspNetCore.Components.Rendering; 
using Palermo.BlazorMvc; 

// Change namespace to match yours 
namespace Sample.BlazorServerNet6 
{ 
    // AppView is the default app view. If you created a new Blazor application this class will be names App. We renamed it to AppView 
    public class AppController : ControllerComponentBase<AppView> 
    { 
        protected override void BuildRenderTree(RenderTreeBuilder builder) 
        { 
            base.BuildRenderTree(builder); 
        } 
    } 
} 
  • AppView.razor- This is the App.razor file that was renamed
@inherits Palermo.BlazorMvc.ViewComponentBase 

<Router AppAssembly="@typeof(Program).Assembly"> 
    <Found Context="routeData"> 
        <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayoutController)"> 
        </RouteView> 
    </Found> 
    <NotFound> 
        <LayoutView Layout="@typeof(MainLayoutController)"> 
            <p>Sorry, there's nothing at this address.</p> 
        </LayoutView> 
    </NotFound> 
</Router> 
  • _Host.cshtml
<component type="typeof(AppController)" render-mode="ServerPrerendered" /> 
Product Compatible and additional computed target framework versions.
.NET net5.0 was computed.  net5.0-windows was computed.  net6.0 was computed.  net6.0-android was computed.  net6.0-ios was computed.  net6.0-maccatalyst was computed.  net6.0-macos was computed.  net6.0-tvos was computed.  net6.0-windows was computed.  net7.0 was computed.  net7.0-android was computed.  net7.0-ios was computed.  net7.0-maccatalyst was computed.  net7.0-macos was computed.  net7.0-tvos was computed.  net7.0-windows was computed.  net8.0 was computed.  net8.0-android was computed.  net8.0-browser was computed.  net8.0-ios was computed.  net8.0-maccatalyst was computed.  net8.0-macos was computed.  net8.0-tvos was computed.  net8.0-windows was computed. 
.NET Core netcoreapp3.0 was computed.  netcoreapp3.1 was computed. 
.NET Standard netstandard2.1 is compatible. 
MonoAndroid monoandroid was computed. 
MonoMac monomac was computed. 
MonoTouch monotouch was computed. 
Tizen tizen60 was computed. 
Xamarin.iOS xamarinios was computed. 
Xamarin.Mac xamarinmac was computed. 
Xamarin.TVOS xamarintvos was computed. 
Xamarin.WatchOS xamarinwatchos was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last updated
2.1.1 4,947 12/7/2021
1.0.3 1,991 5/13/2021
1.0.2 332 5/13/2021
1.0.1 310 5/12/2021

BlazorMvc is a very straight-forward Model-View-Controller patter implemented for Blazor application. If you find that you need an additional extensibility point, consider taking the code files and placing them in a folder in your application. This may assist you in understanding the logic flow from a controller to a view.