How to use react with asp.net MVC to create a modular site/portal

Question

I read all about react, webpack, react router and very other things in all of their documentation and found all menus, links and routes are defined in src and compiled (bundled and minified) by webpack BEFORE publishing.

But I need a mechanism so:

1. Links and routes generated based on available modules and user requested (for example, a normal user MUST NOT see links for the manager. a solution in react router samples (hiding manager links) is so basic and not for production.

2. Do this dynamically when user requests for resource

Is there any way to do bundle or add dynamic parts (such as routing configs) to precompiled JavaScripts in runtime?

I'm using asp.net framework MVC

Answer 1

If you want to control what level of users can see what, here is what you'll want to do:

if(Request.IsAuthenticated){
    if (isAdmin){
        @Html.ActionLink("Link for Managers", "Manager", "SomeFolder")
        }
        @Html.ActionLink("Home", "Index", "Somefolder2")
        @Html.ActionLink("About", "Index", "Somefolder3")
        @Html.ActionLink("Reports", "Index", "Somefolder4")

   }

This would allow all users see the "Home", "About", and "Reports" links, and only let admins see the "Link for Managers." This would be in your layout using razor syntax, and it's very easy to implement additional logic for user views. I hope this helps put you on the right path!

Answer 2

In fact, react was made for a different architecture, Backend makes REST APIs and react could be a different project and even could have Server Side Rendering separately. react call APIs for manipulating the application, So, Backend can be written in any language.

Also, I'd some experience in your situation but a little different, Unfortunately, it is not up now and I can not show my case. We make our page with react and bundle it by using webpack And finally put the JavaScript and CSS bundle file in the page.

The Razor cshtml file was a little global so the react router could load the page that the user wanted, but that implementation was not very good.

Some time ago I see a ReactJS.NET website that claims a very lovely and clean integration between react and asp.net. It was so weird to me. As regards, It can help you.

Hope my answer helps you.