Photo by Markus Spiske on Unsplash

Edit all React Studio scripts in one place

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 script editor. This is really big feature for anyone who edits the value transformer scripts or edits the code templates. All scripts can be edited in one place and you can easily access premade generic snippets and create your own code snippets for the project.

This saves tons of time and clicks compared to old way when you had to move between scripts and sections just to check what is the Data slot name you want to access in the script.

Open Script editor from top menu bar or via edit script buttons.

Script Editor opens up also when you click Edit script button anywhere in the Studio.

Add Code Snippets with couple of mouse clicks.

Basic Code snippets are automatically for every Data slot and Data sheet

Create your own code snippets with this simple snippet markup language

Re-use your own code snippet

Your own code snippet added to code

Here is a quick walk-trough video about the Script editor

Filter Data linkage dropdown menus

Projects tend to get bloated with Data slots and props which leads to never-ending dropdown lists in Data linkage section. We’ve now added filter textbox which radically improves the UX.

Localization key

Every basic element has a localization key. In some cases you may want to have same localization key for multiple elements. Achieving this is now easier with the Localization key drop down menu. This is quite special feature so in most cases you don’t need to touch the Localization key setting.

Dynamic url for Web content element

Source URL for Web content element

You can now set the Web content element’s source url dynamically via props. This is really handy when you’re e.g. using details view and want to embed something from other web page. Note that Web content element might not work with all sites. It’s up to website admins if they allow embedding their own site. In most cases we always suggest simply using link to another web page rather than trying to embed it into your app.

Read full changelog here: https://docs.neonto.com/reactstudiochangelog/

Download React Studio from www.reactstudio.com