Now that Microsoft.UI.Reactor and the project templates are on NuGet.org, getting started is a LOT simpler than it used to be.
If you want the absolute shortest path to a running app, it's really just this (assuming you already installed the .NET SDK):
dotnet new install Microsoft.UI.Reactor.ProjectTemplates
dotnet new reactorapp
dotnet run -a x64
That's it!
So let's take a quick look at what those three commands actually do, and more importantly what kind of app Reactor generates for you.
Creating the app
The first command installs the template:
dotnet new install Microsoft.UI.Reactor.ProjectTemplates
You only need to do this the first time.
Next:
dotnet new reactorapp
If you run that in an empty folder, the template uses the folder name as the project name and drops the generated files right there.
And finally:
dotnet run -a x64
That builds and launches the app with the x64 architecture, which is generally the right thing to do for a WinUI desktop app (if you are on ARM64 you can use arm64 instead).
If you prefer creating the app in a named folder instead, you can also do:
dotnet new reactorapp -n MyFirstReactorApp
cd MyFirstReactorApp
dotnet run -a x64
Project Contents
One of the nice things about the template is that it stays very small. You're not dropped into a huge starter app with a lot of moving parts. The interesting bits are basically just:
- App.cs
- <ProjectName>.csproj
And honestly, that's a pretty good first impression for Reactor, because the whole point is that your UI is just C# code.
Let's start with App.cs
The generated app looks like this:
using System;
using Microsoft.UI.Reactor;
using Microsoft.UI.Reactor.Core;
using Microsoft.UI.Reactor.Layout;
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using static Microsoft.UI.Reactor.Factories;
ReactorApp.Run<App>("MyFirstReactorApp", width: 900, height: 600);
class App : Component
{
public override Element Render()
{
var (name, setName) = UseState("World");
var titleBar = TitleBar("MyFirstReactorApp").Flex(shrink: 0);
var body = Border(
FlexColumn(
Heading($"Hello, {name}!"),
TextBox(name, setName, placeholderText: "Your name")
.AutomationName("NameInput")
) with { RowGap = 16 }
).Padding(24).Flex(grow: 1, basis: 0);
return FlexColumn(titleBar, body)
.Backdrop(BackdropKind.Mica);
}
}
This is pretty simple, but at the same time there's actually a lot going on here, so let's break down the basics.
The very first interesting line is this one:
ReactorApp.Run<App>("MyFirstReactorApp", width: 900, height: 600);
This is the app bootstrap. Reactor opens the window, hosts the app, and renders your root component. If you're used to XAML app startup plumbing, this is refreshingly simple.
Then we get to the App component itself:
class App : Component
{
public override Element Render()
The Render methods are the key to Reactor. You don't create a window and start mutating controls. Instead you render an element tree that describes what the UI should look like right now, and it returns a light-weight description of the UI - not the UI objects themselves.
The next line is probably the most important one in the whole sample, and if you're coming from XAML probably the most unfamiliar one:
var (name, setName) = UseState("World");
UseState is one of many "hooks" you'll find in Reactor. You have some state. You render UI from that state. Events update the state. Reactor re-renders and patches the native WinUI controls in place.
The sample keeps this super simple: the initial value is `"World"`, so the heading renders as:
Heading($"Hello, {name}!")
which means the app starts out showing `Hello, World!` using a Textblock with the Heading style. The "Heading" is merely a simple short-cut for creating a TextBlock with the style preset, to keep your code simple and concise. There are a bunch of these short-hand statements like HStack and VStack for Horizontal and Vertical StackPanels.
Then the text box wires straight into that same state:
TextBox(name, setName, placeholderText: "Your name")
This is a nice little detail because it immediately shows the controlled-input model. As you type into the text box, `setName` gets called, the component renders again, and the heading updates live.
So type `Reactor`, and the heading becomes `Hello, Reactor!`.
That's a tiny app, sure, but it's also the whole Reactor loop in one screen.
The rest of the file is mostly layout and presentation.
var titleBar = TitleBar("MyFirstReactorApp").Flex(shrink: 0);
gives you a title bar, while:
FlexColumn(...)
Border(...).Padding(24)
build up the body using ordinary C# composition instead of XAML markup.
And finally:
.Backdrop(BackdropKind.Mica);
adds a Mica backdrop so the sample already feels like a proper Windows app.
That last part is worth calling out: Reactor isn't drawing some fake custom UI surface. It's building real WinUI UI under the covers.
The project file is small too
The generated project file is also pretty lean:
<Project Sdk="Microsoft.NET.Sdk">
<PropertyGroup>
<OutputType>WinExe</OutputType>
<TargetFramework>net10.0-windows10.0.22621.0</TargetFramework>
<Platforms>ARM64;X86;X64</Platforms>
<UseWinUI>true</UseWinUI>
<WindowsPackageType>None</WindowsPackageType>
<WindowsAppSDKSelfContained>true</WindowsAppSDKSelfContained>
<Nullable>enable</Nullable>
</PropertyGroup>
<ItemGroup>
<PackageReference Include="Microsoft.WindowsAppSDK" Version="..." />
<PackageReference Include="Microsoft.UI.Reactor" Version="..." />
</ItemGroup>
</Project>
Again, nothing wild here, and that's a good thing.
UseWinUI makes this a WinUI project, WindowsPackageType is set to None so you start with an unpackaged desktop app, and Microsoft.UI.Reactor just comes in as a normal NuGet package.
That's really the big story here: Reactor now feels like a regular part of the .NET ecosystem. Install a template, create a project, run it. Edit it in Visual Studio, VS Code, or just Notepad for a bit of personal torture. Or have your favorite agent iterate on it. Because everything is code, you're more likely to get compile time errors instead of XAML runtime errors which really helps with both your and an agent's inner dev-loop.
What you get when it runs
When the app starts up, you get a small native desktop window with a title bar, a greeting, and a text box asking for your name.
Type in the box, and the heading updates immediately.
That might not s- ound like much, but it's actually a very good first sample because it teaches the right thing right away: the UI is a function of state.
No XAML. No view models. No binding setup. Just state in, UI out.
A lot of starter templates try too hard to impress you. They throw in navigation, settings pages, MVVM layers, mock data, half a dozen folders, and a bunch of code you're supposed to delete later.
This one doesn't.
It gives you one component, one piece of state, one layout, and one interaction. Just enough to understand the model, and not so much that you have to reverse engineer the template before you can start building your own app.
And that's probably exactly what a first Reactor app should be.
Where to next?
If you want learn more start with the Build 2026 presentation which covers a lot of the basics:
- Building WinUI Apps with C# First Patterns and AI Assisted Workflows
Next check out the official Reactor Documentation, but I'd like to call out a few key pages to study:
Next go study the samples. Here are a few I found interesting:
- Reactor Gallery - Lots of great samples in one big demo app. Run this app and study each sample.
- Validation Showcase - Great example of how to do even intricate input validation with very little code.
- Reactor IDE - A Visual-Studio style app demonstrating docking/draggable windows.
- Particle Storm - High-performance particle rendering using Win2D.