NodeReact

Library to render React library components on the server-side with C# as well as on the client.


Keywords
react, reactjs, nodejs, asp-net, asp-net-core, aspnet, aspnetcore, csharp, dotnet, dotnet-core, dotnetcore, javascript, node, server-rendering, server-side-rendering, ssr
License
MIT
Install
Install-Package NodeReact -Version 2.0.0

Documentation

NodeReact.NET NuGet Version

Library to render React library components on the server-side with C# as well as on the client.

Features

  • Streaming, waiting for data, Suspnse and hydrateRoot... support via custom View Engine
  • High performance
  • Truly async

Migration from ReactJS.NET

ReactJS.NET api is almost completely compatible except

  • Not supported On-the-fly JSX to JavaScript compilation (only AddScriptWithoutTransform)
  • Not supported render functions (ReactJS.NET v4 feature)
  1. Make sure you use @await Html.PartialAsync and @await Html.RenderAsync on cshtml views, synchronous calls can deadlock application
  2. Replace
  • @Html.React to @await Html.ReactAsync
  • @Html.ReactWithInit to @await Html.ReactAsync
  • @Html.ReactRouter to @await Html.ReactRouterAsync
  1. Register NodeReact in service collection, example here

Ensure that any your server bundle define global variables for react like

global.React = require('react');
global.ReactDOM = require('react-dom');
global.ReactDOMServer = require('react-dom/server');

Make sure you have Node.JS installed

Configure Javascript.NodeJS for debug example

services.AddNodeReact(
    config =>
    {
        config.ConfigureNodeJSProcessOptions = opt => opt.NodeAndV8Options = "--inspect-brk";
        config.ConfigureOutOfProcessNodeJSServiceOptions = opt => opt.TimeoutMS = -1;
        config.AddScriptWithoutTransform("~/server.bundle.js");
        config.UseDebugReact = true;
    });