I have been using React Studio for about 2 months now and it is amazing. It saves me so much time than manually coding and converting designs as well.
One thing that I haven’t done with React Studio is to implement browser history. I know there are modules like react-history (https://www.npmjs.com/package/react-history-router) that can wrap components…but is there an inherent feature in React Studio to enable browser history. A lot of users are more familiar with hitting their browser back button than pressing the back button in the app.
Any help with this would be appreciated.
Hi, thanks for the kudos.
Unfortunately we haven’t done anything experiments regarding React Studio and React routing or browser history.
Hi Antti. I’m sorry for the sincerity but you guys really should care about this issue. This will make RS more powerful. This is not only a simple technical issue, far beyond, we are also talking about delivering the best user experience. Otherwise, app build with React Studio will give users an unfamiliar, inconsistent, and fragile experience. When a user presses the browser’s back button they expect to navigate just like any other app or web app.
Best wishes, Marcos
Hi Antti. Thank you for the quick response. I exported my project to React Code and it seems like you have comments in the code that state and routes can be added in through plugins. Do you have any suggestions that work with the React Studio framework? Easily applied rather than gut and switch?
So recommendations I am looking for would be like redux for state management and react-history for routes. I am thinking of trying to make a plugin to manage at least of these scenarios.
Just a heads up on this matter! We’re working on this and will publish beta build for Studio with React Router for you guys to test out.
Awesome! You guys rock. Thank you RS team!
Sounds Great! Let me know how else I can help with the beta test.
Here’s a link to the beta build that implements React Router:
If you are using Firebase in your project you need to update the Firebase plugin too:
Please note that this is a quite big change and it might break something. We recommend you to backup your project file before starting to use the beta build!
when you will release a new official build?
We’d like to give a little time for React Router before we release it officially. We’d appreciate if you could try the beta build with your projects and let us know if something breaks. Just remember to backup your files!
Have you had time to test your projects with the demo build?
Yes, at the moment i have no problems…
Me too. So far, so good Great job React Studio Team. You can use it, and it will work effortlessly and seamlessly.
Important: It makes sense. Avoid naming screens with spaces, otherwise, it won’t properly.
Hi. Apparently changing component’s own state is not working in this beta version.
Has anyone seen the same bug?
At least on my demo projects Change state works. Could you zip and send (here or via email) an light example demo project where it doesn’t work?
I’ve checked it again, and it was tested on a screen, not a component. Maybe this is what’s happening, I guess.
is it possible to choose if this feature can be enabled or no?
We’ll probably force enable it because I don’t see many reasons when one would not want the router and leaving the option available would probably make the code generation much more complex. The free version is something which should work for most use cases and if someone wants some special use cases then we build custom versions.
we are closing to finish all the necessary things to implement react-router in React Studio but we are not quite ready to release it officially yet so here’s a new beta build:
Notable changes in the build:
- Authentication settings for screens. You can define which Login Gate needs to be unlocked in order to access the screen.
- Routing settings for screens. You can specify which url paths can be used to access the screen.
- Also path parameters can defined under Routing settings. You can define in which data slots parameters are stored.
- 404 page setting in now available in App Settings block inspector.