My First React Application With ASP.NET MVC

But where is the .sln file

Hello Developer, Nice Blog.. Need clarification from your side. When I create a TypeScript JSX file its creating file with an extension of "filename.tsx". Why did I get this extension and How can I get ".jsx" file. Thank you

Hello all..Things we need to install here is.. JavascriptEngineSwitcher.V8, JavaScriptEngineSwitcher.V8.Native.linux-x64, JavaScriptEngineSwitcher.V8.Native.win-x86 from nuget package manager . Then, In App_Start folder there is a file named ReactConfig.cs .. in that file.. import the namespace(using javascriptEngineSwitcher.V8) and inside public static void Configure() .. add these two lines..( JavaScriptEngineSwitcher.Core.JsEngineSwitcher.Current.DefaultEngineName = V8JsEngine.EngineName; JavaScriptEngineSwitcher.Core.JsEngineSwitcher.Current.EngineFactories.AddV8(); ) and thats all

Please suggest how to install packages like axios, router etc

Nice article! thank you for sharing

When I run my project, it shows this error: No JS engines were registered. Visit https://reactjs.net/docs for more information. it shows this line in red: Ligne 40: @Scripts.Render("~/bundles/main") could someone help me please?

Is it possible to make this project in MVC 2 with VS 2010 ?

It would be great if you also post working example with .NET 4.7.2 version.

You work in your sample source code with a normal Web Application with MVC. But you show screenshots, that you used the Empty Web Application MVC template! The article is very bad and stole my time!

Visit this site for updated example on the same context : https://reactjs.net/

I am not able view the images given in the jsx file. Can you please help me with this.

One unsolicited advise to the author is "Please make this project in ASP.Net Core 2.1 also"... a tidbit of info to other readers is I needed to add using JavaScriptEngineSwitcher.Core; using JavaScriptEngineSwitcher.V8; in the ReactConfig.cs file in the App_Start folder. Of course I had to add these packages using NuGet Package Manager. Errors encountered during development were 1)no js engines were registered2) @Scripts does not exist 3) packages element is not declared 4) JSX element div has no corresponding closing tag

Dude, if you are writing something, please write it correct. do it 100%. your article is not matching with your sample. you installed bunch of other packages in your sample to run and you have more code in your sample. i wish there was a thump down button here, i could give you that you waste our time.

I had to add this to the Global.asax.cs file: using System.Web.Optimization; BundleConfig.RegisterBundles(BundleTable.Bundles);

In the _Layout.cshtml, it states to add in: @Scripts.Render("~/bundles/main"). Do this in the body section at the bottom. Also following it, you need: @RenderSection("scripts", required: false)

I get a "The name 'Scripts' does not exist in the current context" error from adding @Scripts.Render("~/bundles/main") to the _Layout.cshtml page. It has the red squiggly line. I had to add to the Views folder’s web.config <namespaces> section. <add namespace="System.Web.Optimization"/>

I got "Cannot find name 'react' in the FirstReactApp.tsx. It has the red squiggly lines. Also when I created the FirstReactApp I choose Web/Scripts/TypeScript JSX file as indicated above and it created a .tsx file. (This even shows in the screen shot above). I since created it again but using Web/Markup/JSX file and it created the file with the .jsx extension and I no longer get this error.

I tried this out ang I've got this error "react is not defined", any suggestions please

Hi Kirti, I too had the same problem with bundling that didn't find the main (so in essence didn't load the .jsx file). However I managed to get around by bypassing bundling and rendering the script directly on index.cshtml by coding: @Scripts.Render("~/Scripts/FirstReactApp.jsx")Hope it helps others!

I got this warning as Loading failed for the <script> with source “http://localhost:56221/bundles/main”. so not getting display Hello World. Can anyone please help me out?

Great article sir...... thank you for sharing

You created the baby steps for the React learners. You did the great effort to create such a nice content. Keep it up.

Routing is possible in react like angular?

Good article. please post more part wise to show data and form where data will be fetching from db etc. looking for a full blown application like Todo or quiz etc where multiple forms will be there. thanks

Great article sir......... :)

Nice article sir to learn about React Application with MVC ... :)

Nice article sir :-)

Good , easy to follow the steps