Using REST API in Native Screens

Step 1: Select a Native Screen Element

1. Go to Screens in the Twinr Builder

2. Open any screen (e.g., Home, Shop)

3. Select a supported element such as:

   • Product List

   • List

   • Banner etc.

---

Step 2: Choose Data Source

1. In the element’s Content panel, locate Data Source

2. Select API (instead of Static)

3. Choose the required API from the API Call dropdown

Step 3: Configure API Response Mapping

.

1. Click Configure API Response

2. The configuration dialog opens with:

   • Response Preview (live API data)

   • Response Mapping options

3. Map API response fields to UI properties, such as:

   • Image URL

   • Title

   • Description

   • Background color (optional)

4. Provide a Default Image URL to handle missing images

5. Click Save

Once mapping is completed, the element is automatically populated with API data.

---

Step 4: Preview and Publish

• The mapped data appears instantly in the Preview

• The same data is rendered on mobile devices

• Any future API updates reflect automatically without manual changes