Deepdive links to React routes fail when deployed inside web-src of appbuilder project

[sarav_prakash]

I am running a simple react app from AppBuilder. The project builds and deploys successfully. I have routes within my react app. 

Now hitting the routes link from my local, the deepdive urls work. For example `https://localhost:9080/faq` this deepdive link works at local. But when deploy onto AppBuilder, same deepdive link does not work like this https://**-contenthub-stage.adobeio-static.net/faq 

It works, when I navigate to homepage and then click on Link route 

Both are same urls. When hitting deepdive link it fails. But launching app from homepage and then navigating into routes are working. 

Conclusion is, Appbuilder can only serve index.html root page. When uri changes, it could not resolve route at serverside and throws 404. Workaround expecting is, the appbuilder must ignore paths and always serve the app. Once app launches, react knows to serve correct page based of route. But appbuilder is preventing to serve the app.

Anyone have tried serving react application using AppBuilder and faced similar issue?

[sarav_prakash · Accepted solution]

Worked with Adobe ticket and figured Appbuilder does not support serverside rendering required by BrowserRouter. I fixed this by changing to HashRouter. I wrote a detailed article on error thrown and how I fixed it 

https://medium.com/@bsaravanaprakash/dont-deploy-react-apps-that-uses-browserrouter-onto-adobe-appbu...

[tmj]

That is amazing, Sarav! Thank you so much!!