Skip to main content

Microsoft Teams App and Bot Creation

A guide for Tines users to create apps using the Developer Portal app and the Azure Portal

Danielle Swanser avatar
Written by Danielle Swanser
Updated today

App Studio had been used to create Apps in Microsoft Teams, but this has been deprecated by Microsoft. Users are now required to build apps via other means. This guide will walk you through how to create an app and bot using the Developer Portal app and the Azure Portal. Some steps require elevated privileges. These have been flagged to the best of our knowledge with the least-privileged access role required to complete the setup.

Checklist of items you will create in this guide:

Microsoft Teams:

  1. Application ID/Client ID for your App

  2. Bot ID for your Bot

  3. Client Secret for your Bot

Tines

  1. OAuth 2.0 Credential

  2. MS Teams Channel ID Resource

  3. Microsoft Service URL Resource

The process for building an App and Bot can be divided into 6 parts.


Part 1 - Build your App

In Microsoft Teams, ensure you have the Developer Portal App installed.

1a. Install the App, if necessary.

On successful install, you will be presented with the option to open the application:

2. Open the Developer Portal App then navigate to Apps tab.

3. Create a new App by clicking on the + New app option. Give the app a name and click Add.

4. Fill out the following fields:

a. Short Description, Long Description, Developer Name, Website, Privacy Policy, Terms of Use, Application Client ID (should be the same as your App ID)

b. Examples:

  1. Short Description: App for Tines automation

  2. Long Description: App which allows the Tines automation solution to send and receive Teams messages and adaptive cards.

  3. Developer Name: Tines

  4. Website: https://tines.com

  5. Privacy Policy: https://tines.com/privacy

  6. Terms of Use: https://tines.com/terms

  7. Application (client) ID: c8xxxxx7-5xx9-4xxb-yxx1-gk7xxxxxxx67

c. Make a note of your App ID, then click on Save.

Optional Step: Branding

Upload your branding (logo, icons, etc), if desired. Note the mandatory requirements for pixel size and transparency.

Part 2 - Create a Bot to add to your App

💡 These steps require elevated privileges. To create a bot, you will need at least the Application Developer permission.

1. In the Developer Portal, navigate to Tools tab and select Bot Management.

2. Click + New Bot. Give the bot a name and click Add.

3. On successful creation of the bot you should see a message displayed with your bot name.

4. Navigate to Client secrets, then click Add a client secret for your bot.

5. A new client secret will be generated. Make a note of this, as it is the only time the secret displays. This will be needed to configure the OAuth2 credential in Tines. After you have noted it, click OK.

6. Navigate back to the Bots tab and make a note of your Bot ID. This will be needed to configure the OAuth2 credential in Tines.

7. Click into your Bot and navigate to Client Secrets and click on the Azure link which will take you to an Application Registration Page in your Azure Portal.

8. In the Azure Portal for App registrations, select your Bot with the corresponding Bot ID noted from Step 6. Click the Display name and it will take you to the app’s Overview.

9. In the Essentials section, click on the Add a Redirect URI link.

10. You will be brought to Platform configurations. Click Add a platform.

11. Click Web under Web applications.

12. In the Redirect URI field, paste your OAuth2 callback URI. You can find this in the

Callback URL section in a Tines OAuth 2.0 credential. You will be creating one for this bot later on. Click Configure. The remaining fields can be left blank.

13. You should now see the Web platform configuration for your Bot is redirecting to your Tines OAuth2 callback URI.

Part 3 - Associate your Bot and Publish your App

💡 Some of these steps require elevated privileges. Minimum recommended role: Teams Administrator

1. Return to Teams, access the Developer Portal App, and navigate to the Apps tab.

2. Select your App, click App Features, then click Bot.

3. Select your Bot based on your Bot ID that you have noted from Part 2, Step 6. You can choose from the drop-down menu or copy and paste the Bot ID. Add the following scopes to your bot and Save the settings:

  • Personal

  • Team

  • Group Chat

4. You will see a message displayed that your App has updated successfully. Click

Publish to publish your App.

5. Click the option for Publish to your org.

6. Click Publish your app. Within a few moments, you will see a Version number and a Submitted status.

7. Navigate directly or ask your Teams Admin to navigate to the Manage Apps section of the Teams admin center. Search for your App by its name in the

Search by name field.

8. Click the name of your App to reach its About page. You will see a warning icon for Pending Action near the Publish button.

9. Click Publish to publish the app to your org. You will see a confirmation message stating it may take a few hours for the app to appear.

Part 4 - Add your App to Teams

1. Navigate to the Built for your org section of Apps in Teams.

2. Click on your App and choose Add to a team from the dropdown next to Add or Open.

3. Type the name of the channel where the App should be added to and click Set up a Bot to confirm. The App is added to the Apps tab in the Manage Team section.

4. Navigate back to your channel to retrieve the Channel ID. Click the ellipsis ... , then Get Link to Channel.

5. Click Copy to retrieve the link, and paste it in a text editor of your choosing. The link should look something like this:

https://teams.microsoft.com/l/channel/12%3Ld1zc48f07ae123b560ff3e67ab1234f7%40thread.skype/Event%2520Demo%2520Channel?groupId=e0123454-22ab-57j3-8yz0-dcbabcad8eb1&tenantId=63a1b2c3-123a-4567-ef89-7a5bc101867k

We are interested in the value between /channel/ and /Event , so from this example, the channel ID would be 12%3Ld1zc48f07ae123b560ff3e67ab1234f7%40thread.skype.

Make note of your channel ID as it will be needed later on.

Part 5 - Putting the pieces together in your Tines Tenant

1. Create an OAuth 2.0 Credential in your Tines tenant with the following details:

  • Name: A name of your choosing, something like MSTeamsBot

  • Type: OAuth 2.0

  • Callback URL: Pre-populated

  • Client ID: Your Bot Application ID

  • Client Secret: Your Client Secret for the Bot

  • Scope: https://api.botframework.com/.default

  • Grant type: Client credentials

  • OAuth token URL: https://login.microsoftonline.com/botframework.com/oauth2/v2.0/token

2. Create the following resources in your Tines tenant:

Part 6 - Testing in a Tines Story

  1. Copy and Paste the following JSON for the Fetch Team Roster action to your story, replacing the following:

  • Resources

    • microsoft_service_url

    • ms_teams_channel_id

  • Credential

    • MSTeamsBot

{"agents":[{"disabled":false,"name":"Fetch Team Roster","options":"{\"url\":\"https://<<RESOURCE.microsoft_service_url>>/v3/conversations/<<RESOURCE.ms_teams_channel_id>>/members\",\"content_type\":\"json\",\"method\":\"get\",\"headers\":{\"Authorization\":\"Bearer <<CREDENTIAL.MSTeamsBot>>\"}}","position":{"x":345,"y":-150},"type":"httpRequest","timeSavedUnit":"minutes","timeSavedValue":0,"monitorAllEvents":false,"monitorFailures":false,"monitorNoEventsEmitted":null}],"links":[],"diagramNotes":[]}

2. Run the action to fetch all the members in the channel whose ID you provided. Congratulations, you’ve just set up your Bot successfully with Microsoft Teams and integrated with Tines!


Did this answer your question?