Microsoft Teams SDK reference
There are several libraries available to support various aspects of Teams app development. This article provides an overview of each, along with basic installation instructions.
| Library | Description | API reference |
|---|---|---|
| Live Share SDK | Live Share enables collaborative app experiences | Live Share Live Share canvas Live Share media |
| TeamsJS library | Teams JavaScript client library enables you to create hosted experiences in Teams, Outlook, and the Microsoft 365 app | TeamsJS |
| TeamsFx SDK | TeamsFx helps to reduce tasks by using Microsoft Teams single sign-on (SSO) and accessing cloud resources down to single line statements with little configuration | Teamsfx |
Microsoft Teams Live Share
The Live Share SDK is comprised of three sub-packages with features to help developers create more collaborative moments across Microsoft Teams. Live Share (sometimes called Live Share core) is for connecting to Fluid Framework through sidePanel and meetingStage for in meeting pop-up cards. Live Share media allows for media synchronization of video and audio during a Teams session. Live Share canvas adds annotation tools for whiteboard and PowerPoint presentations.
Finding the library
The Live Share SDK is a JavaScript package comprised of three sub-packages (Live Share, Live Share media, and Live Share canvas) which are published on npm and can be installed using npm or yarn.
To install the latest version of the Live Share packages to your application:
Live Share core
The Live Share SDK can be added to your meeting extension's sidePanel and meetingStage contexts with minimal effort to unlock new collaborative app scenarios throughout the lifecycle of a meeting. For more, see Live Share core capabilities.
Live Share media
The Live Share SDK enables robust media synchronization for any HTML <video> and <audio> element with just a few lines of code. By synchronizing media at the player state and transport controls layer, you can individually attribute views and license, while providing the highest possible quality available through your app. For more, see Live Share media capabilities.
npm install @microsoft/live-share@next --save
npm install @microsoft/live-share-media@next --save
Live Share canvas
Using Live Share canvas, your app can bring the power of PowerPoint Live inking tools with minimal effort. For more, see Live Share canvas overview.
npm install @microsoft/live-share@next --save
npm install @microsoft/live-share-canvas@next --save
Microsoft Teams JavaScript client library
With the latest Microsoft TeamsJS client library, your Teams app can run across Microsoft 365, including Outlook and the Microsoft 365 app. With TeamsJS you can deliver a cross-platform app to more users from a single codebase, and a more streamlined experience for your customers. The TeamsJS v.2.x.x SDK is a superset of TeamsJS 1.x versions; it supports existing Teams app functionality while adding the ability to host Teams apps in Outlook and Microsoft 365 app. Refer to the TeamsJS client library overview for guidance on building Microsoft 365-enabled apps.
Finding the library
The TeamsJS client is distributed as an npm package and can be installed using npm or yarn. It can also be referenced from its CDN endpoint.
CDN
TeamsJS can also be referenced from its CDN endpoints:
<!-- Microsoft Teams JavaScript API (via CDN) -->
<script
src="https://res.cdn.office.net/teams-js/2.30.0/js/MicrosoftTeams.min.js"
integrity="sha384-8I0Bv4bWDPSX5ZYhJcChnvrBNoieX3zASTxmZ9URwnjEVx70hsrN0ZUy/C46u8dw"
crossorigin="anonymous"
></script>
<!-- Microsoft Teams JavaScript API (via npm) -->
<script src="node_modules/@microsoft/teams-js@2.30.0/dist/MicrosoftTeams.min.js"></script>
<!-- Microsoft Teams JavaScript API (via local) -->
<script src="MicrosoftTeams.min.js"></script>
Microsoft TeamsFx SDK
The TeamsFx SDK greatly simplifies Microsoft Teams single sign-on (SSO) and cloud resource access in your app.
Finding the library
The TeamsFx client is distributed as an npm package for Typescript and JavaScript.