Start an API Request

Datasource

The easiest way to perform an API Request is to use the Datasource feature.

1. Create a Datasource using an already created API Request
2. Bind the request parameter values and the responses.
3. Enable the Auto start when Screen First Loads or add an Start a Datasource request Event Action.

Example with steps

1. Add a List View.
2. Open Datasource.
3. Press + Create Datasource.
4. Select External API tab.
5. Select the Weather API and then the Get Cities API Request.
6. Bind API Request Parameters. (There is only one in this example)
   1. Press the + on the country parameter.
   2. Bind parameter with a the Cy Static Value. You can use any other supported option.
   3. Press SAVE
7. Bind the Response parameters. (There is only one in this example)
   1. Select the Cities Fetched Response.
   2. Press the + on the cities response parameter.
   3. Select the Design Element option, if not already selected.
   4. Select the List View from step 1.
   5. Add a new Cell, called City Cell.
   6. Select the newly created City Cell.
   7. Select if you want to edit the Cell. If you are reusing a previously edited cell, you don’t need to edit it again.
8. Press SAVE to close the Datasource editor.
9. Select if you want to Auto Start the Datasource when Screen First Loads.

Code Block

You can perform an API Request using the Execute API Code Block.

1. Create an API Request.
2. Open a Code Blocks editor. You can either create or edit an existing Function.
3. Add the Execute API Request Code Block.
   1. Select the API Request.
   2. Set self block as the delegate parameter.
   3. Set the parameter inputs, if any.
4. Close Code Blocks editor.
5. Implement API Response protocols.
   1. Go to Protocols Tab.
   2. Press the API-Name Of Your API
   3. Add and edit the required Functions.
      Note: After you save your Function, Protocols Tab will display the Protocols that you need to implement to handle the API Responses. Every API Response will call the respective Function.
6. Add the Execute a Function Event Action to an Event, for example, the Button On Click Event.

Example with steps

1. Add a List View.
2. Create a new Screen property, called cities.
   1. Go to the Data Inspector. (5th tab on the Inspectors section)
   2. Press the + to add a new Screen property.
   3. Select the already created City Model.
   4. Select the List(array) option, as the API Response that we will use returns multiple cities.
   5. (Optional) Edit the name of the new screen property.
   6. Press SAVE
3. Bind the cities Screen property to the List View. By binding a Screen property to a Design Element, every time the value of the Screen property is updated, the Design Element_(List View)_ will reload with the new Data.
4. Select the Cell that will be used. Note: Cell needs to have one Cell property with the City Data Type.
5. Go to the Code section.
6. Add a new Function, called call get cities API.
7. Implement the Execute API Code Block.
   1. Drag the Code Block from the Blocks->API.
   2. Select the API Request from the dropdown.
   3. Set self block as the delegate parameter.
   4. Set the country parameter with a Static Text Code Block and type CY.
   5. Close Function
8. Implement Response protocols.
   1. Select the Protocols Tab.
   2. Select the API-Get Cities.
   3. Press Add on the Cities Fetched suggested Function.
   4. Edit the Cities Fetched function.
   5. Pass the value of the fetched cities to the cities property from step 2. Note: API Response functions automatically create Function arguments with all API Response parameters’ values.
      1. Drag the Setter Block for the cities properties.
      2. Connect it to the cities Function Argument.
   6. Close the Function.
9. Implement a way to execute the function. For example, add the Execute a Function Event Action to an Button On Click Event.