how to do server side routing programmatically in react-router?

Question

I am using react-router-dom in my react project.

I am trying to programmatically navigate to a new parameter using: history.push("/newparam")

But the problem is navigating like this, isn't refreshing my page. Looks like its doing fake client
side routing. But I want to refresh my browser when I am navigating programmatically.

So how can I do something like a server-side routing using react-router-dom , where the page will refresh when the site will change url?

Answer 1

When you use react-router the complete routing is handled by the react on client side, So the server is responsible to only load the index of the frontend application, This is a normal behavior in Single page application. We do all the communication with the server using XHR calls. Using history.push("/newparam") or <Link route='/newparam' /> is always going to load the page from client side.

I dont exactly know what your usecase, But if you want the page to reload every time you navigate to a new page, use html <a> tag, This will initiate server side rendering. The JS equivalent of this would be window.location.href = '/your-redirect-url';

Let me know what exactly is your use-case so that I can help you further