We have some news that all you app builders are going to LOVE!

We’ve just launched a new integration with Xano, the no-code backend that lets you have a complete backend for your project within minutes.

Some highlights of this integration:

  • Create robust apps with login screens linked to a powerful backend that is ready to scale when you need it.
  • File upload plugin lets you easily and safely upload files from your React app to your Xano backend.
  • You’re in control. Easily spin up a…

Daily.co provides an awesome developer experience for adding their video conferencing API to your web app. They offer also “Prebuilt UI” which is usually ticks all the boxes needed for great video conferencing UI.

Daily Prebuilt-UI plugin for React Studio

We wrapped Daily’s Prebuilt UI snippet into React Studio plugin. You may download the plugin from React Studio’s plugin store. The plugin is dead simple to use, you simply add and align the plugin element on your React Studio project’s screen or component and link the “url” to your Room url prop. …

Example of Save data interaction with React Studio’s Xano plugin

Do you want to trigger functions on your server? Need to update data on your database? Here’s how you can do it in React Studio.

React Studio makes it easy to load data from API to app (Data sheets) easy but calling certain API endpoint with a button interaction has been a bit tricky to do. We’ve released an update to our Xano and Generic JSON plugin interactions plugin which clears the complexity of calling any API endpoints you might have.

Xano-React Studio plugin

Xano is an awesome NOCODE backend builder which makes API creation fun and easy. React Studio has a prebuild…

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.

Events view in ´Google analytics

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…

Project map Thumbnail view

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

Photo by Markus Spiske on Unsplash

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. …

React Studio

The premium app design tool for the most advanced JavaScript UI library — React JS www.neonto.com/reactstudio

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store