+Example: `[App](https://teams.microsoft.com/l/app/{appId})`, where `appId` is your application ID. For more information, see [app ID for different types of apps](deep-link-application.md#app-id-for-different-types-of-apps).

+Example: `https://teams.microsoft.com/l/app/{appId}`, where `appId` is your application ID. For more information, see [app ID for different types of apps](deep-link-application.md#app-id-for-different-types-of-apps).

+| appId | String | 64 | Yes | The ID of the Teams app that's to be opened. For more information, see [app ID for different types of apps](../concepts/build-and-test/deep-link-application.md#app-id-for-different-types-of-apps). |

+> Teams Toolkit support for API-based message extension is available only in Teams Toolkit pre-release version. Before you get started, ensure that you've installed a [Teams Toolkit pre-release version](../toolkit/install-Teams-Toolkit.md#install-a-pre-release-version).

+To build an API-based message extension using Teams Toolkit for Visual Studio Code, follow these steps:

+ > [!NOTE]

+ > The authentication flow for Microsoft Entra is only functional in remote environments. You can't test it in a local environment due to the lack of authentication support in Azure Function core tools. The repair API can be invoked anonymously in a local environment.

+ * **None**: Select if you don't want any authentication for the user to access the API.

+ * **API Key**: Select if you want to authenticate using an API key.

+ * **Microsoft Entra**: Select if you want to authenticate using app user's Teams identity.

+ :::image type="content" source="../assets/images/Copilot/api-based-me-ttk-auth-type.png" alt-text="Screenshot shows the authentication options for API-based message extension.":::

+ | File | Contents |

+ | | |

+ | `src/functions/repair.ts` | The main file of a function in Azure Functions. Defines an Azure Function that retrieves and filters repair records based on a query parameter from an HTTP GET request, and returns the results as a JSON response. |

+ | `src/repairsData.json` | The data source for the repair API. |

+ | `src/keyGen.ts` | Designed to generate an API key used for authorization. |

+ | `appPackage/apiSpecificationFile/repair.yml` | A file that describes the structure and behavior of the repair API. |

+ | `appPackage/responseTemplates/repair.json` | A template file for rendering API response. |

+ | `teamsapp.yml` | The main Teams Toolkit project file. The project file defines two primary things: Properties and configuration Stage definitions.|

+ |`teamsapp.local.yml` | Overrides teamsapp.yml with actions that enable local execution and debugging.|

+ |`aad.manifest.json` | Defines the configuration of Microsoft Entra app. This template only provisions a single tenant Microsoft Entra app.|

+ 1. Based on the options selected in **step a**, follow these steps:

+ * If you've selected **none** or **Microsoft Entra**, skip to the next step.

+ * If you've selected API key, follow these steps:

+ Generate and set up your API key as follows:

+ 1. In Visual Studio Code, go to **View** > **Terminal**.

+ 2. Run the following command to install dependency packages:

+ ```

+ npm install

+ ```

+ 3. Run the following command to generate your API key:

+ ```

+ npm run keygen

+ ```

+ The API key is generated as **Generated a new API Key: xxx...**. The generated API key is registered and recorded in the [API key registration tool](https://dev.teams.microsoft.com/api-key-registration) in Developer portal for Teams. For more information on API key registration, see [Register an API key](build-api-based-message-extension.md#register-an-api-key).

+ 4. Enter the generated API key into your `env/.env.*.user` file. Replace `<your-api-key>` with the actual key:

+ ```

+ SECRET_API_KEY=<your-api-key>

+ ```

+ </details>

+ 1. From the API list, select the required APIs and select **OK**.

+ > GET and POST APIs are supported for API-based message extensions.

+ 1. Under **LIFECYCLE**, select **Provision**.

+ 1. If your OpenAPI specification document has a security scheme `bearerAuth`, which uses the HTTP bearer scheme, enter the API key in the command window and select **Enter**.

+ :::image type="content" source="../assets/images/Copilot/api-based-me-ttk-api-key.png" alt-text="Screenshot shows the Enter API key command that appears in Teams Toolkit for Visual Studio Code.":::

+ > [!NOTE]

+ > The API key must be a string with 10 to 128 characters.

+ > [!NOTE]

+ > Teams toolkit source file includes a security check to ensure that an incoming request is authorized. It uses a function `isApiKeyValid(req)` to verify if the request contains a valid API key. If the API key isn't valid, the code returns an 401 HTTP status code, indicating an Unauthorized response.

+ |`Repair.cs` | The main file of a function in Azure Functions. Defines an Azure Function that retrieves and filters repair records based on a query parameter from an HTTP GET request, and returns the results as a JSON response.|

+ |`appPackage/apiSpecificationFile/repair.yml` | A file that describes the structure and behavior of the repair API.|

+ |`appPackage/responseTemplates/repair.data.json` | The data source for the repair API.|

+ | `teamsapp.yml` | The main Teams Toolkit project file. The project file defines two primary things: Properties and configuration Stage definitions.|

+ |`teamsapp.local.yml` | Overrides teamsapp.yml with actions that enable local execution and debugging.|

+ 1. Select an account to create the tunnel. The supported account types are Azure, Microsoft Account (MSA), and GitHub.

+ The tunnel you created is listed under **Dev Tunnels**.

+> [!NOTE]

+> In the app manifest v1.17 or later, the `full` property is mandatory and not required for app manifest v1.16.

+* [Grant tab device permission in Teams](../../sbs-tab-device-permissions.yml)

+* [Grant tab device permission in Teams](~/sbs-tab-device-permissions.yml)

+Webhooks help Teams to integrate with external apps. With Outgoing Webhooks, you can send text messages from a channel to a web service. After configuring the Outgoing Webhooks, users can @mention Outgoing Webhook and send a message to a web service. The service responds within 10 seconds to the message with a text or a card. For more information, see [create Outgoing Webhooks](~/webhooks-and-connectors/how-to/add-outgoing-webhook.md).

+Incoming Webhooks help in posting messages from apps to Teams. If Incoming Webhooks are enabled for a team in any channel, it exposes the HTTPS endpoint, that accepts correctly formatted JSON and inserts the messages to that channel. For example, you can create an Incoming Webhook in your DevOps channel, configure your build, and simultaneously deploy and monitor services to send alerts. For more information, see [create Incoming Webhooks](how-to/add-incoming-webhook.md#create-an-incoming-webhook).

+Connectors for Microsoft 365 Groups allow you to create a custom configuration page for your Incoming Webhook and package them as part of a Teams app. You send messages primarily using connector cards for Microsoft 365 Groups and can add a limited set of card actions to them. For example, a weather connector that allows users to select a location and any time of the day, to receive updates about tomorrow's weather. They're configured at channel level but are installed at team level. For more information, see [create connectors for Microsoft 365 Groups](~/webhooks-and-connectors/how-to/connectors-creating.md).

+Actionable messages allow users to take action without leaving their email client, increasing user engagement. With Microsoft 365 and Incoming Webhooks, you can send messages by posting a JSON payload to the webhook URL. For more information, see [create and send messages](~/webhooks-and-connectors/how-to/connectors-using.md).

+[App capabilities mapped to features](../concepts/design/map-use-cases.md#app-capabilities-mapped-to-features)