How To Pass Settings From A C# Application To A Hybrid React App

In this tutorial, you will learn how to pass settings from a C# application into a ReactJS application. In this example, we will pass data that is set within a C# application, as a prop into a ReactJS application. This will be achieved by passing a value into the ReactJS application via a custom attribute. To set the scene, I assume that your C# website is using MVC and that you have a controller. Within the controller, you get the data. Using a view model, you pass that data into your view. In this view, you have the HTML that initialises the ReactJS application. Data can be passed between the two application on the ReactJS applications root element, like this:

To read this attribute within your ReactJs application, the first thing that you will need to do is to get access to the HTML element. This can be done by querying the DOM using getElementById() like this:

Now you have access to the HTML element within yourReactJS application, you can access the parameter that has been passed in, like this:

You can now pass data between the two applications easily! Happy Coding!