# Web services

Connect to external webservices to show data from other sources, or even create, update and delete data. Use your app as a way to get your data updated by app users who are not in the office or share data with your app users where ever they are via the same interface.\
Authentication can be based on API key, bearer token or basic auth.

You first setup a New web service collection which is used by the List, One, Create, Update and Delete webservices which belong to this Web service Collection.  Enter the Authentication method an connection parameters once and use it for all of the underlying webcalls.&#x20;

Define the separate web services you need and add blocks in your app to show the information in your app.

## **Create new collection**

1. Choose Web services in the left side navigation of your app
2. Click **+ New Collection** to add your first webservice
3. Enter the Resource URL , that's the base url which is used by the List, One, Create, Update and Delete webservices which belong to this Web service Collection

<figure><img src="https://2636455530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2wzy1sO41plYrfJfaAhN%2Fuploads%2F9JGjF9GP05b5Pjf1xyF8%2Fimage.png?alt=media&#x26;token=052af821-750f-48d5-bb5c-e2eb3ffd3747" alt=""><figcaption></figcaption></figure>

## Setup your web service

After defining the Web service collection, you can start configuring the web service

1. Select for example the **List** web service
2. Add specific parameters if needed
3. Click the **Setup now**<br>

   <figure><img src="https://2636455530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2wzy1sO41plYrfJfaAhN%2Fuploads%2FTqFcBkN28IYVLUHLt10I%2Fimage.png?alt=media&#x26;token=1085914c-db25-453d-9ef3-74e3e38e3d69" alt=""><figcaption></figcaption></figure>

   4\. The Tab **Fields** will be opened and if you have setup everything correctly, the fields within the web service will be shown

   <figure><img src="https://2636455530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2wzy1sO41plYrfJfaAhN%2Fuploads%2FnrGGcmF6NeEHfoottPWS%2Fimage.png?alt=media&#x26;token=fbbd0cbc-5696-449f-aa5c-596396073b60" alt=""><figcaption></figcaption></figure>

   5\. If you don't need all of the information within the app, you can **deselect** those fields by unchecking the checkbox and **Save** your changes.

## Show web service data in your app

After you have connected your web service to your app, you can add blocks to your app to make the data visible

1. Open the **Content** tab of your app
2. Click the red **+ block** button
3. Select the **Advanced tab**
4. Select the **List** to show a list of items in a screen. The detail page will be added automatically\ <img src="https://2636455530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2wzy1sO41plYrfJfaAhN%2Fuploads%2F1FVPSJJqDRLudnU8fH8p%2Fimage.png?alt=media&#x26;token=3e6aa7d3-0111-41ec-8a60-2b539f8c4c27" alt="" data-size="original">
5. Click **Add this block**&#x20;
6. Select the right data source, in this case the List  web service\ <img src="https://2636455530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2wzy1sO41plYrfJfaAhN%2Fuploads%2FOA872QLX6G4s89bKgcC0%2Fimage.png?alt=media&#x26;token=f4af1878-3af7-4623-a423-0b10a48c16c2" alt="" data-size="original">
7. In your app a green List block will be added with a detail page below it.&#x20;
8. On the List block you can Enable or disable information to show in the list using the switches. \ <img src="https://2636455530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2wzy1sO41plYrfJfaAhN%2Fuploads%2FBjuyJc8TIiTksNldHZXk%2Fimage.png?alt=media&#x26;token=5bd916ce-3dc8-419d-8809-a3c93f68fe76" alt="" data-size="original">
9. For advanced editing, select the **Elements** tab in the left top corner. [This article](https://docs.appmachine.com/style-your-screens/elements) explains to you how to use the element editor to fine tune the design .\ <img src="https://2636455530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2wzy1sO41plYrfJfaAhN%2Fuploads%2FLEniaXImfwvNsKUpa569%2Fimage.png?alt=media&#x26;token=e21fa80b-7cd5-4c80-8a75-c845bf6b399d" alt="" data-size="original">
10. You can finetune the Detail page in the same way.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.appmachine.com/developers/web-services.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
