What Makes an App a Meeting App
A meeting app extends the Teams meeting experience itself rather than living only in a channel or personal tab — it can appear as an in-meeting side panel, a tab pinned to the meeting details before it starts, or content shared to the shared meeting stage that every participant sees simultaneously. The manifest declares this through the configurableTabs or meetingExtensionDefinition sections, with scopes including 'groupChat' and 'meeting', and Teams surfaces the app inside the meeting's '+' apps tray so any participant with permission can add it mid-call.
Cricket analogy: This is like the big screen at a stadium that every spectator watches simultaneously during a DRS review, rather than each fan checking a private replay on their own phone — the meeting stage is that shared, synchronized view for every participant.
Real-Time Events with the Live Share SDK
For apps that need every participant's meeting-stage view to stay in sync — a shared whiteboard, a collaborative poll, a synced video player — the Live Share SDK layers on top of Fluid Framework to provide real-time, low-latency shared state without the developer standing up their own WebSocket backend. A LiveState or LiveShareClient object exposes distributed data structures that automatically replicate changes to every connected client, and a MediaSynchronizer specifically keeps play/pause/seek actions on a shared video element synchronized across every participant's screen within a small tolerance.
Cricket analogy: This is like a stadium's electronic scoreboard system where updating the run count on one console instantly reflects on every display board around the ground — Live Share's replication does the same for shared app state across every participant's screen.
import { LiveShareClient } from "@microsoft/live-share";
import { LiveState } from "@microsoft/live-share";
import { app, meeting } from "@microsoft/teams-js";
await app.initialize();
const liveShare = new LiveShareClient();
await liveShare.join();
const { state: pollState } = await liveShare.getDDS(
"poll-state",
LiveState
);
pollState.on("stateChanged", (newState) => {
renderPollResults(newState);
});
// Any participant casting a vote updates state for everyone
function castVote(option) {
pollState.set({ ...pollState.state, [option]: (pollState.state[option] || 0) + 1 });
}Live Share automatically elects one connected client as the ephemeral Fluid container host for the meeting; if that participant leaves, another client transparently takes over, so app developers generally don't need to manage container lifecycle themselves.
Meeting Lifecycle Events and Context
A meeting app can subscribe to lifecycle signals through the Teams JS SDK's meeting namespace, such as meeting.getMeetingDetails() to read the meeting ID, organizer, and join time, or app.registerOnThemeChangeHandler to react when a participant switches between light, dark, and high-contrast themes mid-call. For server-side integrations, Graph's onlineMeeting resource and its attendanceReport subresource let a backend retrieve who joined, when, and for how long after the meeting ends — useful for compliance tracking or automatically following up with no-shows.
Cricket analogy: This is like a match referee's official report logging exactly which players took the field, when, and for how long — the attendanceReport does the same for meeting participants after the call ends.
Attendance reports and detailed meeting analytics via Graph require appropriate permissions (such as OnlineMeetingArtifact.Read.All) and are subject to tenant meeting-policy settings; some organizations disable attendance reporting entirely for privacy reasons, so don't assume the data will always be available.
- Meeting apps extend Teams meetings via in-meeting side panels, pre-meeting tabs, or a shared meeting stage.
- The manifest's meetingExtensionDefinition and 'meeting'/'groupChat' scopes declare an app as meeting-capable.
- The Live Share SDK, built on Fluid Framework, provides real-time synchronized state without a custom WebSocket backend.
- LiveState and other distributed data structures automatically replicate changes to every connected participant.
- MediaSynchronizer specifically keeps shared video playback (play/pause/seek) aligned across participants.
- The Teams JS SDK's meeting namespace exposes lifecycle data like meeting details and theme-change events client-side.
- Graph's onlineMeeting and attendanceReport resources let a backend retrieve who joined a meeting and for how long.
Practice what you learned
1. Which manifest section declares a Teams app as capable of running inside a meeting?
2. What underlying technology does the Live Share SDK build on to provide real-time synchronized state?
3. Which Live Share component specifically keeps shared video play/pause/seek actions aligned across participants?
4. Which Graph resource lets a backend retrieve who joined a meeting and for how long after it ends?
5. Why might attendanceReport data not be available for a given Teams meeting?
Was this page helpful?
You May Also Like
Microsoft Graph API for Teams
Learn how to read and write Teams data — teams, channels, messages, and members — through the unified Microsoft Graph REST API.
Single Sign-On (SSO) in Teams Apps
Understand how Teams apps silently authenticate users through Microsoft Entra ID using the getAuthToken and On-Behalf-Of flows.
Power Automate with Teams
See how low-code Power Automate flows trigger on Teams events and post adaptive cards, approvals, and notifications without custom code.
Related Reading
Related Study Notes in Microsoft Technologies
Browse all study notesWindows 10 / UWP Development Study Notes
.NET · 30 topics
Microsoft TechnologiesWindows Batch Scripting Study Notes
Batch · 30 topics
Microsoft TechnologiesMFC (Microsoft Foundation Classes) Study Notes
C++ · 30 topics
Microsoft TechnologiesSilverlight Study Notes
.NET · 30 topics
Microsoft TechnologiesXAML Study Notes
.NET · 30 topics
Microsoft TechnologiesWPF (Windows Presentation Foundation) Study Notes
.NET · 30 topics