Adding Blazor to a React site
Adding Blazor to a React site is very similar to Angular. This demo is based on the React and ASP.NET Core template in Visual Studio. The project is called ReactProject
.
First, we need a reference to our Blazor library, and I added the BlazorCustomElement
project as a reference.
We need a reference to the Microsoft.AspNetCore.Components.WebAssembly.Server NuGet
package; this is so we can serve the framework files.
To make our site serve the framework files, we need to add the following to Program.cs
:
app.UseBlazorFrameworkFiles();
Next, it’s time to add our component. In reactproject.client/src/ /App.tsx
, we add our custom tag:
<my-blazor-counter increment-amount="10"></my-blazor-counter>
In this case, we set the increment-amount
parameter to 10
, which will increase the counter by 10
every time we click it.
To make this all work, we need to load a couple of JavaScript. In reactproject.client...