Send and Receive data via external API integrations

Use any external & internal API

Work with API methods of your business systems or with third party services. Mobsted supports JSon RestAPI.

___________________________

CREATE API INTEGRATION

In this example we will use third party tools to get the weather info for any city and display this data in the app using apixu.com service.

  1. CREATE API CALL TEMPLATE

  2. CREATE API CALL BASED OPERATION

  3. DISPLAY DATA ON APP SCREEN

  4. CHECK RESULT

______________________________

CREATE API CALL TEMPLATE

  1. Go to the API providers section from Home Screen of the platform

  2. Click Add API Provider

  3. Fill in it's Name: Weather Provider 1 and Base URL: https://api.apixu.com

  4. Click Save API Provider and then click Create New API Provider Method

  5. Name the fields:

    • Api Provider Method Name: Weather method 1

    • Method: GET

    • Endpoint URL: /v1/current.json

    • Consumes and Produces Type: application/json

  6. Click Add parameters at the bottom of the pop up and fill in the fields:

    • Name: key

    • In: query

    • Type: string

    • Сheck the box Required

    • Click Save Parameter

  7. Add another parameter:

    • Name: q

    • In: query

    • Type: string

    • Description: City

    • Сheck the box Required

    • Click Save Parameter and then Save API Provider Method

    • Click Close.

______________________________________

CREATE API CALL BASED OPERATION

  1. Click Operations on the Home Screen of the platform

  2. Click Add Operation

  3. Open Weather Provider 1 drop down on the left, select Weather Method 1 that we created on the previous step

  4. Fill in the field: Operation Name: Weather Operation 1

  5. In the EXECUTION section fill in the parameters: for key use 80941dd14d6f46b7b2d122927192802

  6. q: fill in with #Backendname:city#

  7. Click Save operation.

_________________________________________

DISPLAY THE DATA ON THE APP SCREEN

  1. Navigate to Constructor

  2. Drag and Drop Text input element, fill in it's properties:

    • Backendname:city

    • Default Value: London

  3. Drag and Drop Button element, fill in it's properties:

    • Caption Button: Check #Backendname:city#

  4. Click Action tab, open Add new action drop down and select Execute Operation

  5. Open Add operation drop down, select Weather Operation 1 and click Save

  6. Drag and Drop Text element, where we print the result of the Weather Operation

  7. Fill in Text field: #Backendname:city# Weather: #Operation:weather Operation 1:Response:Result[0]:current.temp_c#

  8. Click Save Screen.

_______________

CHECK RESULT

Click the Preview button to launch the app from the current screen to check its working.

You can find the set up on screen - 12 External API Call Example in Demo App in your profile.

MENTIONED ARTICLES

Last updated