1. Start with a data source

Use your Figma design as the frontend and power it by displaying and interacting with content from external data sources as the backend. Data sources can be a database that you create, with Airtable or Google Sheet, or an existing source, like New York Times or Strava.

2. Get the API

A tool's API is the way it can talk to another system, in our case, Bravo and your app. The most common standard is REST API, using GET, PUT, POST, PATCH, DELETE API requests, which translates to create, read, update, and delete data (CRUD) operations. This is what you can set up in Bravo in order to talk to these external tools. Find the API documentation from these tools on how to set up the request you need.

Learn more about API

3. Connect API operations to your app UI

The Data Library in Bravo is where you create collections (or folders) of API requests for your app project. After you've set up the requests, go to your app project to bind these requests to your app UI. Then voilà! Test drive your functional native app with the Bravo Vision previewer app before uploading your final app to the app stores.

API Connector in Bravo Studio

Watch how you use Bravo to connect to APIs and bind the data to your app UI.

Display

To display, or "read", data is commonly done with the GET request. It retrieves data from the source. Then, you can select which data records to bind to which UI element. (Ex: display a list of contacts)

Create

To create data is commonly done with the POST request. It creates a new data record in the specified destination in the data source. (Ex: a new contact in a contact list)