💾Set up API requests

A tool's API is the way it can talk to another system, in our case, Bravo and your app. Check out these tutorials on how to set up API requests in Bravo to communicate with external tools.

Bravo can be connected to any API, as long as it is accessible on the Internet. This way, it's possible to create apps using any third party service of your choice to store and process the data.

What is an API?

Create API Collections

The API collections section is where where you set up groups of API requests. For example, If you want to display a list of items from your Google Sheets in your app, you first have to retrieve the data by setting up a GET request. Then, Bravo receives the data from the request and it's ready to be connected to an app design. In Bravo, there are two sections where you can create a collection of API requests:

Account Collections: Where the collections created can be used between different apps.
App Data Collections: Where the collections are exclusive to a specific app.

Account Data Collection

This data collection can be used between different apps.

How to create an Account Data Collection?

In the left side menu, click on the second icon from the top to access the Account Data Collections.
Simply click on "Create a new collection".

App Data Collection

These data collections are exclusive to a specific app.

How to create an App Data Collection?

Go into your app and select the "Data" tab.
Click on "Create a new collection".

API Collection Overview

In this guide, we will walk you through our API request page. We're dividing the screen in three sections:

Data Collection Settings
API Request Setup
API Request Response

1. Data Collection Settings

This section includes:

Collection Name: In this example, the collection name is "Create your first app".
Collection Settings: Click on the settings gear next to the Collection name to access the Settings. There are two main tabs:
- General:
  - Name: Put your preferred name for your data collection.
  - Description: By default, you'll find the Database URL in here.
- Authentication Settings: Configure the authentication type and add the token (if required) for the whole API collection.
  - Authentication types:
    None: No authentication required.
    Basic: Basic HTTP authentication.
    API Key: Utilises an API key for access.
    Bearer: Utilises a bearer token.
    Use settings from application (OAuth2): Leverages OAuth2 for authentication as configured in the application settings.
  - Token: Add the the API token, if required.

2. API Request Setup

In this section, you'll find the following:

Add Button: Click this button to create a new request. The list of requests will be shown under and it can be sorted by name or last modified. A search bar is also available.
Select a type of request: When creating a request, you can choose from the following types: GET, POST, PUT, PATCH, DELETE, and HEAD. Select the appropriate request type for your needs.

Request options available:

GET -> Intended to retrieve data from a server and do not modify the server's state.
POST -> Used to send data to the server for processing and may modify the server's state.
PUT -> Used to create a new resource or replace a resource.
PATCH -> Does partial update.
DELETE -> Deletes the specified resource
HEAD -> A type of HTTP request that is identical to HTTP GET, except that the server will not return a message-body as part of the HTTP response.

Request URL: Place the request URL coming from your backend.
Headers: Set the parameters of the HTTP request. This is used for authentication purposes, among others.

5. Query Parameters: Set of parameters attached at the end of the request URL.

6. Body: In this section, you'll define the content of your HTTP request. It's important to note that not all HTTP requests need a body. Typically, requests that send data to a server, such as POST or PATCH requests, do include a body. Data in the body can be in various formats, with JSON and plain text (raw) being among the most common. Like the request URL, the body can also contain request variables.

7. Pagination: Pagination is the app mechanism to “load more times”. This is recommended when your app needs to load content from a large database. Learn more about pagination.

8. Input Variables & Test Values: In case you’re using request variables in the URL or in the request body, you need to set temporary test values for those variables before sending the request. These values will be sent to the API endpoint in the request URL, and will only be used in the test requests you perform from Data Library. When using your Bravo app, you’ll need to bind the request variables with API data.

Send button: Click the "Send" button to run the API request and receive a response.

3. API Request Response

1. Received Data: This panel will display the data received from the API request, after clicking “Send”. You’ll be able to select the data you want to bind to the UI elements and the data you want to use in other API requests.

2. Output Variables: In this panel, you can specify a variable name for the data received from the API. This name will later appear when binding the UI elements with this data. It can also be used in other requests as a variable (in the URL or in the request body), in the case where those requests are linked to this one. For instance, a request for a detail page showing information for a particular item in a list.

3. Debug & Inspect Response: In this panel, you can see the content of the HTTP request and response, after clicking “Send” in the request URL panel to send a test request to the API. You might find this useful for debugging purposes. If the HTTP requests is successful, a 200- OK status code will be returned from the API, together with the data. If there was any issue with the HTTP request, an error code will be returned from the API.