CODEWITHSUNDEEP
asp.net-mvc-4reactjs
Codehelp
Codehelp

Reputation: 4747

How to use React with ASP.NET MVC

I wanted to tryout React and started following the tutorial here Took the Internet template, added the required script references in _Layout.cshtml and placed the following script in About.cshtml.

This code with the '@' char is giving trouble:

<script type="text/jsx">
  /**
   * @jsx React.DOM
   */
  // The above declaration must remain intact at the top of the script.
  // Your code here
</script>

MVC says:

The name 'jsx' does not exist in the current context

Please provide some pointers

Regards.

Upvotes: 7

Views: 10727

Answers (2)

Paul Knopf
Paul Knopf

Reputation: 9776

Take a look my project, a starter template for using React in .NET.

https://github.com/pauldotknopf/react-dot-net

This project solves many issues that are present in the other projects (NodeServices and ReactJS.NET), including truely isomorphic applications with matching server/client routing.

Upvotes: 0

Daniel Lo Nigro
Daniel Lo Nigro

Reputation: 3424

I've just released ReactJS.NET which lets you easily compile JSX to JavaScript. With ReactJS.NET, you can put your code into a .jsx file (say /Scripts/HelloWorld.jsx) and then reference it via a script tag:

<script src="@Url.Content("~/Scripts/HelloWorld.jsx")"></script>

Additionally, ASP.NET Bundling and Minification and Cassette are both supported.

Original answer (pre 4th April 2014):

You need to escape the @ by writing it twice:

<script type="text/jsx">
  /**
   * @@jsx React.DOM
   */
  // The above declaration must remain intact at the top of the script.
  // Your code here
</script>

I'm currently working on some stuff to make it easier to use React from ASP.NET, which should be coming out very soon. This includes server-side compilation of JSX (both on the fly and via ASP.NET minification and combination) and optional server-side rendering of React components. Stay tuned!

Upvotes: 10

Related Questions