We’ve added two new animation plugins to Plugin store. Install Plugins simply by opening the Plugin store on your React Studio and click on the Lottie + Particles.js.

These two plugins cover adding Lottie and Particles.js animations to your project and are dead simple to use; just place and align the plugin element onto screen and input the animation JSON to plugin settings.

We’ve published an update to React Studio’s Firebase plugin. This update adds new “Log event” interaction. Logging events is crucial for optimising your app usage.

Logged events are automatically sent to Firebase analytics and Google analytics. You simply need to update your Firebase plugin from React Studio’s Plugin manager and attach events to your app’s buttons.

Make sure you have the “measurementId” property added to your Firebase config. You’ll find it from your Firebase console or your Google analytics. Read more about config settings here https://firebase.google.com/docs/analytics/get-started

We’re excited to announce that we’ve added React Router to React Studio code generation. No more “lost pages” when user clicks browser back button and welcome url parameters! React Router code generation is available in React Studio Version 1.7.15 (383).

You’ll get the update automatically when you open the app. Install React Studio free from www.reactstudio.com. For older projects you need to regenerate the code to make your app fully react router compatible.

P.S. In case you’r using Firebase on your project you need to update the Firebase plugin to latest version (version 22 or higher) to make it work…

We’ve released a major update to React Studio (Version 1.7.15 build 383). Update comes up automatically when you open the app.

Whats new?

• React router
• New project map views and filtering (standard, thumbnails, list)
• Clear list item states
• Lots of bug fixes + minor improvements

Read the complete change log here: https://docs.neonto.com/reactstudiochangelog/

React Router

We’ve added support for React Router code our generation. This means that every screen will have unique url. Router supports parameters and multiple routes for single screen. There’s also support for 404 screen.

Read more detailed post about React router from here.

P.S. In case you’r using Firebase on your…

Firebase plugin is updated to support path to specific document. This means that you can point Data sheet path to single document without having to make query. You’ll get the update when you go to Plugins->Show Plugin manager->Update.

Check this short video to see the plugin in action.

Download React Studio free from www.reactstudio.com

Other interesting stories about React Studio

We’ve released an update (Version 1.7.10 (373) to React Studio. You’ll get the update automatically by opening the React Studio app. If you don’t have the app you can download it from www.reactstudio.com App is currently Mac only (sorry Windows and Linux users)

This update is all about improving UX for custom scripts, data linkages and localization keys. Thanks heaps for everyone suggesting improvements and features on our forum.

Whats new!

• Completely revamped Script editor
• Localization key drop-down menu
• Filtering for Data runtime linkage popup
• Web content element Source URL linkage
• Add background to screens by default

Script editor

This update introduces totally revamped…

React Studio projects have built in localisation feature which is really powerful even though many users don’t even know that it exists.

Let’s get down to business.

Every React Studio project has a “Localization” data sheet by default. This data sheet holds all translations for basic elements used in the designs. Element text is mapped with localization_key to correct strings (translations) in “language” columns. By default only the ‘en’ column is created but you can create as many language columns needed. …

We’ve released 1.7.9 version of React Studio. You’ll get the update automatically by opening your React Studio app on your Mac.

Whats new!

• “Hot reload” for generated code, this makes code exports many times faster after the first code export. Just click “Open in Web Browser” and see the difference yourself.
• Improvements to Drawer menu; direction: left, right and support for multiple states.
• CSS update which blocks click-throughs for components. This is handy e.g. when you need to create custom modal component which blocks all other buttons on screen.
• Added two new props for rectangle vectors ; Fill color and…