React Studio + Xano No Code backend builder Team up

Hi everyone, we’ve partnered with Xano which offers amazing No Code backend builder. You can create your database and business logic in Xanos easy to use admin and it generates you the API endpoints and documentation immediately.

I was able to create database and basic CRUD API without reading any of their tutorials so it I can say that it is really easy to use :slight_smile:

Anyway we’ve added integration to the React Studio which connects your Xano Database tables automatically to your React Studio project. Xano plugins also supports loading your custom API endpoints to Data sheets as long as the data returned is in standard JSON. This means that you can make complex queries and use functions and return the data to your React app made with React Studio.

Download the pre-release version of the Studio here: https://reactstudio.com/xano/

We’ve already made couple videos regarding the integration

We’ll create more videos soon for e.g. how to upload photos to Xano’s backend from the app created with React Studio.

2 Likes

Sounds perfect. best of luck!

It is seamless and easy to use. I already got a project setup with an instance running. Very nice work. Thanks for releasing it to us.

I will be interested in pulling data between screens with logic to render the future screen but need to dig into this.

You can create custom API endpoints and e.g. query data for certain user. The only thing you need to do is to use Data slots in endpoint url, here’s an example:

/restaurants/$slot(‘ds_SlotSelectedRestaurantID’)

This calls restaurants endpoint and adds restaurant Id to the call. The endpoint returns row(s) belonging to single restaurant.

Regarding the “pulling data between screens”; we’ll try to think about this. It has to be done so that loading Data interaction waits until the data is fetched. I’m hoping that we can figure out how to model this so that it can be done inside Studio without need to do any custom coding.

We’ve been also thinking that it would be nice to be able to load single column data from Data sheet to Data slot. Do you think this would be useful in your projects?

1 Like

I will put some time into the new back-end and see what I can get worked out.

Thanks for thinking about it! I’m sure there are lot’s of dependencies that would make this difficult to do. I think the single dataslot would be very useful for many different applications.

For example, we can’t add values to the Firebase user auth table (or I don’t know how) and so I have to maintain a separate table in the Cloud Firestore called “user_account” with these properties I want to save (like “isSubscribed”). The link between the two is the Google email which I use as the document ID in the Cloud Firestore user_account table.

If I could put “isSubscribed” into a dataslot, I can control the experience with switch gateways and states really easily. I’m sure there are many more use-cases. They come as you build. This is the one on my mind right now.

There is a second app I am building with React Studio in addition to DigitalIQ called OrderForce. I am sure I will find more with that one as it has much more account -> data interaction than digital iq.

Digital IQ is essentially all get calls other than the payment to subscribe to historical data.