Explore tools and code samples

You've built your first tab app, interactive notification bot, and message extension. You can build a Teams app as per your app's requirements. Based on factors such as business needs, development environment, and domain knowledge, select the environment and tools to build your app.

A Teams app offers you the flexibility of choosing your build environment. It includes tools, framework, and languages to approach your app development. Build your Teams app in the environment that's best suited for your app. You can even select a combination. For example, you can use Teams Toolkit to build an app with JavaScript and host it on a SharePoint site.

This section takes you through the various options for building your Teams app.

Teams collaborative platform

As a collaborative platform for building apps, Teams offers the full range of apps and tools. Teams platform supports your app development at every stage from planning to distributing it.

You can use various tools and services to build your app. Following is an example development flow.

  1. Plan your project and figure out the requirement.
  2. Design your app. Use Teams UI Kit and Fluent UI React components for designing tabs UI.
  3. Build your app with JavaScript using Teams Toolkit.
  4. Extend functionality by adding more Teams capabilities, send activity feed notifications, and use Microsoft 365 data with Microsoft Graph.
  5. Test the app on a developer tenant with sample user data.
  6. Deploy the app to Azure.
  7. Manage and publish the app to Microsoft Teams Store with Developer Portal. Monetize your app with options, such as SaaS offers, in-app purchases, and more.

Tools and SDKs

You can build your Microsoft Teams app with the help of the following tools and SDKs.

Flow chart shows you the SDKs and tools you need to build your Teams app.

To start building your Teams app, you can select the tools and SDKs based on your app requirements.

  1. App capabilities: You can choose a single or a combination of capabilities based on your app requirements.
  2. SDKs you need: For example, if you're building AI capability for your bot app, you select Teams AI library.
  3. UI Components: Choose the UI components to design your app based on your app capability.
  4. Languages: Choose the language in which you want to build your app.
  5. Recommended Tools: Choose the tools based on the language that you've selected. You can also use the Teams Developer Portal to manage and publish your app. The Teams Toolkit and Yo Teams allows you to build your app with JavaScript and TypeScript or with C# in Visual Studio Code (VS Code) or Visual Studio.
App capabilities User interactions Recommended tools SDKs Languages
Tabs A full-screen embedded web experience. VS Code or Visual Studio with Teams Toolkit extension, or TeamsFx CLI if you prefer using CLI Teams JavaScript client library for UI functionalities, SharePoint Framework (SPFx), and Microsoft Graph SDK C#, TypeScript, and JavaScript (including React)
Bots A chat bot that converses with members. VS Code or Visual Studio with Teams Toolkit extension, or TeamsFx CLI if you prefer using CLI TeamsFx SDK, Bot Framework SDK, Teams AI library, and Microsoft Graph SDK C#, TypeScript, and JavaScript
Message extensions Shortcuts for inserting external content into a conversation or taking action on messages. VS Code or Visual Studio with Teams Toolkit extension, or TeamsFx CLI if you prefer using CLI TeamsFx SDK, Bot Framework SDK, Teams AI library, and Microsoft Graph SDK C#, TypeScript, and JavaScript

Note

  • Meeting and calls can deliver a user experience for enabling collaboration, partnership, informed communication, and shared feedback. For more information, see apps for Teams meetings and calls.
  • You can also use languages, such as Node.js, Java, Python, and Web technology like HTML and CSS to build your Teams app.

Example scenario: If you want to build a social media dashboard app that sends notifications using TypeScript, consider the following scenario:

Diagram shows you the scenario where you build Teams app with TypeScript.

Explore SDKs

You can also create and build your Teams app with various SDKs. Teams supports all the SDKs shown in the following image and you can choose SDKs based on your requirements:

Diagram shows you the list of tools and SDKs for you to build your Teams app.

Explore Tools

The following tools in the Teams platform help you during app development:

App development phase Teams platform tools
Design Teams UI kit and Fluent UI React components
Build Teams Toolkit, Tools and SDKs, and Microsoft Graph
Test, deploy, and publish Microsoft Entra ID and Developer Portal
Distribute Partner Center and Teams Store

Teams app tutorials and code samples

You can build your own Microsoft Teams app with different capabilities using the following tutorials and code samples.

Teams app tutorials

To start building your Teams app, use the following languages or frameworks and prepare your development environment.

  Tab Bot Message extension
Basic app Build your first tab app using JavaScript
Build your first app using C#
Build your first app with SPFx
Build your first bot app using JavaScript Build your first message extension app using JavaScript
Scenario-based app NA Build notification bot with JavaScript
Build command bot with JavaScript
Create Teams workflow bot
NA

Code samples

Code samples are designed to help you understand and build your own Teams app with different capabilities and scenarios. To learn more about the code samples, see Microsoft Teams samples.

See also

Plan your app

Understand and map your app use cases to Teams features.

Design your app

Design your app UI with Teams UI Kit.

Build your app

Looking for app development inspiration? Browse our list of real-world scenarios and industry solutions with high-fidelity concept mocks to understand the various ways a Teams app can help your users.

Extend your app across Microsoft 365

You can preview your Teams apps running in other high usage Microsoft 365 experiences with the latest Teams JavaScript client library.

Test your app

After integrating your app with Teams, you must test your app before publishing it.

Distribute your app

You can provide your Teams app to an individual, team, organization, or anyone who wants to use it.

Monetize your app

Teams Store offers app monetizing options, such as SaaS offers and In-app purchases. Choose the best monetizing option suitable for your Teams app.

Integrate with Teams

Blend the features that users love about an existing web app, service, or system with the collaborative features of Teams.

A little code goes a long way

You don't need to be an expert programmer to build a great Teams app. Try one of several the low-code solutions.