MauiReactor

Component-based UI Library built on top of .NET MAUI

MauiReactor is .NET library written on top of .NET MAUI that allows you to write applications in pure C# using an MVU approach.

This is the classic Counter app in MauiReactor:

class CounterPageState
{
    public int Counter { get; set; }
}

class CounterPage : Component<CounterPageState>
{
    public override VisualNode Render()
        => ContentPage("Counter Sample",
            VStack(
                Label($"Counter: {State.Counter}"),

                Button("Click To Increment", () =>
                    SetState(s => s.Counter++))
            )
            .Spacing(10)
            .Center()
        );
    
}

Setting up MauiReactor from CLI

1. Install MauiReactor templates

dotnet new install Reactor.Maui.TemplatePack

2. Install MauiReactor hot reload console command (NOTE: this has changed from version 3 to version 4)

dotnet tool install -g Reactor.Maui.HotReloadConsole

If you already installed an old version of Reactor.Maui.HotReload, you can update it to the latest using this command (NOTE: this has changed from version 3 to version 4):

dotnet tool update -g Reactor.Maui.HotReloadConsole

3. Create a sample project

dotnet new maui-reactor-startup -o my-new-project

and move inside the new project folder

cd .\my-new-project\

4. Build & run the project (emulator or device must be running and configured)

dotnet build -t:Run -f net10.0-android

Under Mac, to target an iOS device/emulator, issue a command like this:

dotnet build -t:Run /p:_DeviceName=:v2:udid=<device_id> -f net10.0-ios

where the device id comes from this list:

xcrun simctl list

5. Hot-reload console (in a different shell)

dotnet-maui-reactor -f [net10.0-android|net10.0-ios|...]

6. Edits to code should be hot-reloaded by the application --> Enjoy!

Documentation

Documentation

Videos

Introductionary video from Solution1 conference

Interview with James Montemagno

Getting started video from Gerald Versluis

MauiReactor .NET MAUI UI July - 2024 Contribution - Task Manager App

Sample Applications

Main Samples Repository

Rive App

KeeMind App

Samples and test application

Star history

How to contribute

• Star the repository!
• File an issue (Issues)
• Fix bugs, add features, or improve the code with PRs
• Help with the documentation (Documentation Repo)