Permalink
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
61 lines (43 sloc) 1.98 KB
id layout title
aspnet
docs
Getting Started (ASP.NET 4.x)

Just want to see the code? Check out the sample project.

This guide covers enabling server-side rendering and Babel compilation. If you want a step-by-step guide on configuring a brand new site, see the ReactJS.NET tutorial for ASP.NET.

ReactJS.NET requires Visual Studio 2015 and MVC 4 or 5.

Install the React.Web.Mvc4 package through NuGet. You will also need to install a JS engine to use (either V8 or ChakraCore are recommended). See the JSEngineSwitcher docs for more information.

To use V8, add the following packages:

JavaScriptEngineSwitcher.V8
JavaScriptEngineSwitcher.V8.Native.win-x64

ReactConfig.cs will be automatically generated for you. Update it to register a JS engine and your JSX files:

using JavaScriptEngineSwitcher.Core;
using JavaScriptEngineSwitcher.V8;

[assembly: WebActivatorEx.PreApplicationStartMethod(typeof(React.Sample.Mvc4.ReactConfig), "Configure")]

namespace React.Sample.Mvc4
{
	public static class ReactConfig
	{
		public static void Configure()
		{
			ReactSiteConfiguration.Configuration
				.AddScript("~/Content/Sample.jsx");

			JsEngineSwitcher.Current.DefaultEngineName = V8JsEngine.EngineName;
			JsEngineSwitcher.Current.EngineFactories.AddV8();
		}
	}
}

Reference JSX files directly in script tags:

<script src="~/Content/Sample.jsx"></script>

You're done! You can now call Html.React from within Razor files:

@Html.React("Sample", new { initialComments = Model.Comments, page = Model.Page })

You can also use webpack or System.Web.Optimization to bundle your scripts together.

Check out the sample project for a working demo.