Microsoft 365 Community Microsoft Teams Open Meetings

28 Sep 2023

📺 In this 11 minute developer focused demo, Markus walks us through through a personal Teams tab to uplkoad a file with a pickler or via drag'n'drop and get it back converted to PDF, HTML or JPG file format depending on source type and selection. Comprehensive demo, covering of architectural details and code walkthrough. Markus covers the Graph API endpoint, SSO, and storing options.

This demo is taken from the Microsoft 365 & Power Platform Development Community call August 17th, 2023. Join the next call! Download recurrent invite from https://aka.ms/community/calls

✨ Presenter
Markus Möller (Avanade) | https://twitter.com/Moeller2_0

💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home

Sharing is caring! You are awesome! 🧡

1 participant
11 minutes

uploading

downloaded

pdfs

import

drag

projectory

file

jpeg

sharepoint

microsoft

13 Sep 2023

📺 In this 13 minute developer focused demo, Ejaz shows us how to utilize Teams Toolkit v5.0 to implement a bookmark bot into Microsoft Teams. It adds new bookmark items to a SharePoint list and uses Microsoft Graph to do that. Bot supports SSO and uses Adaptive Cards to collect user input and confirm the creation of the item. He shares the minimal path to awesome and provides a comprehensive code walkthrough.

This demo is taken from the Microsoft 365 & Power Platform community call 3rd of August 2023. Join the next call! Download recurrent invite from https://aka.ms/community/calls

✨ Presenter
Ejaz Hussain (Content+Cloud) | @ejazhussain_

📖 Learn more
• Bookmark Bot sample: https://adoption.microsoft.com/en-us/sample-solution-gallery/sample/pnp-sp-dev-teams-sample-bot-graph-bookmark/

💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home

Sharing is caring! You are awesome! 🧡

1 participant
13 minutes

toolkit

bookmark

apps

project

themes

bots

sharepoint

user

backend

microsoft

22 Aug 2023

📺 In this 14 minute developer focused demo, Robert showcases the Hack Together: Microsoft Teams Global Hack Grand Winner 2023 Teams for solution creation (Robert Schouten (Rapid Circle), Shrusti Shah (Rapid Circle) & Maarten Visser (Rapid Circle)): A Live Patient Review Teams meeting app using Live Share SDK and Fluid Framework. he provides a comprehensive demo of the solution and code walkthrough.

This demo is taken from the Microsoft 365 & Power Platform weekly call – 22nd of August, 2023 Join the next call! Download recurrent invite from https://aka.ms/community/calls

✨ Presenter
Robert Schouten (Rapid Circle)

📖 Learn more
• Demo solution - https://adoption.microsoft.com/en-us/sample-solution-gallery/sample/pnp-sp-dev-teams-sample-tab-live-patient-review-liveshare/

💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home

Sharing is caring! You are awesome! 🧡

2 participants
16 minutes

hackathon

global

ai

consultation

demos

thinking

collaborate

team

challenges

microsoft

22 Aug 2023

📺 In this 15 minute developer focused demo, John shows us how to use Teams Toolkit in order to create apps for Microsoft Teams as a .NET developer. He first walks us how to get Teams Toolkit for Visual Studio, use a project template to create a new app like a Notofication Bot, a Command Bot or a Workflow Bot. In the scaffolded project, he provides a comprehensive code walkthrough and then demoes how the app works in Microsoft Teams as well.

This demo is taken from the Microsoft 365 & Power Platform weekly call – 22nd of August, 2023. Join the next call! Download recurrent invite from https://aka.ms/community/calls

✨ Presenter
John Miller (Microsoft) | @jmillerdev

💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home

Sharing is caring! You are awesome! 🧡

1 participant
15 minutes

toolkit

teamstack

workflow

netdevelopers

setup

implementing

sdk

debugging

ui

chat

10 Aug 2023

📺 As a Viva Connections Admin, you can pin multiple Forms in the dashboard, but don’t. In this 9-minute developer-focused demo, Marcus Castro suggests a way to reduce Viva Dashboard clutter. Cleanly open/respond to multiple forms using Stage View accessed from this single custom ACE card or access multiple Power Apps from this custom ACE. Address process and authentication challenges. The benefits will become clear in demo. How does it work - review supporting list structure, ACE card configuration and deep-link generation.

This community call demo is taken from the Viva Connections & SharePoint Framework Bi-weekly sync call recorded on June 15, 2023.

✨ Demo Presenter
• Marcus Castro (Microsoft)

📖 Supporting materials
• Documentation - Link to a Form | https://learn.microsoft.com/viva/connections/use-the-link-card#link-to-a-form
• Documentation - Link to PowerApps | https://learn.microsoft.com/viva/connections/use-the-link-card#link-to-powerapps
• Sample - Basic Card - Multiple Forms | https://github.com/pnp/sp-dev-fx-aces/tree/main/samples/BasicCard-Multiple-Forms-Apps
• Documentation - Overview of Viva Connections | https://learn.microsoft.com/viva/connections/viva-connections-overview
• Documentation - Create deep links | https://learn.microsoft.com/microsoftteams/platform/concepts/build-and-test/deep-links
• Samples – SPFx ACE Samples | https://github.com/pnp/sp-dev-fx-aces/tree/main/samples
• Documentation – Designing Viva Connections Quick Views | https://learn.microsoft.com/sharepoint/dev/spfx/viva/design/designing-quick-view
• Documentation – Viva Connections Adaptive Card Extension Quick View samples | https://learn.microsoft.com/sharepoint/dev/spfx/viva/design/quick-view-samples
• Repo – TeamsDeeplinkHelper (Deep-link Generator App) | https://github.com/ericsche/TeamsDeeplinkHelper

💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home

Sharing is caring! You are awesome! 🧡

1 participant
9 minutes

powerapps

sharepoint

dashboard

apps

microsoft

users

card

connections

forms

sso

18 Jul 2023

In this 17-minute Maker/Developer focused demo, Paolo Pialorsi shows an end-to-end Microsoft Teams personal app with web parts and widgets created with SharePoint Framework. Solution uses SPFx (v1.17). The Dashboard can be rendered in SharePoint Online, Teams, Microsoft 365 Portal, and Outlook.com. Secured Azure functions in back-end. Solution is deployed in tenant’s app catalog. Thoughts on architecture. Step through code and manifest to understand how solution was built. The addition of an ACE extension will be subject of a subsequent demo.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on June 6, 2023.

Demo Presenter
• Paolo Pialorsi (PiaSys) | @PaoloPia

Supporting materials
• Documentation – PnP/PnPjs home | https://pnp.github.io/pnpjs/
• Sample - Contoso Retail Dashboard | https://adoption.microsoft.com/sample-solution-gallery/sample/pnp-spfx-reference-scenarios-samples-react-retail-dashboard/
• Article - How to use SPFx powered Microsoft Teams apps in Outlook and Office | https://pnp.github.io/blog/post/spfx-08-spfx-powered-teams-solutions-outlook-office/

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

1 participant
17 minutes

contoso

demo

dashboard

configure

presentation

package

collaboration

sharepoint

model

matters

13 Jul 2023

📺 In this 17 minute developer-focused demo Hugo Bernier walks us through the "My Dashboard" sample of Joao Mendes. Sample looks professional and complete which makes adoption of web parts easier. Utilizing Microsoft Graph Toolkit V3 RC, this SPFx app allows quick access to user agenda, To Do Tasks, Files and News and Relevant People related to user. Hugo also provides an overview on Microsoft Graph toolkit.

This demo is taken from the Viva Connections & SharePoint Framework community call - 13th of July 2023. Join the next call! Download recurrent invite from https://aka.ms/community/calls

✨ Presenter
Hugo Bernier (Microsoft) | @bernierh & Joao Mendes | @joaomendez

📖 Learn more
• Sample shown in video: https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-my-dashboard
• Getting started with SharePoint Framework: https://learn.microsoft.com/en-us/sharepoint/dev/spfx/set-up-your-developer-tenant
• Building for Microsoft teams: https://learn.microsoft.com/en-us/sharepoint/dev/spfx/build-for-teams-overview
• Use Microsoft Graph in your solution: https://learn.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/using-microsoft-graph-apis
• Publish SharePoint Framework applications to the Marketplace: https://learn.microsoft.com/en-us/sharepoint/dev/spfx/publish-to-marketplace-overview
• Microsoft 365 Patterns and Practices - Guidance, tooling, samples and open-source controls for your Microsoft 365 development: https://pnp.github.io/
• Fluent UI version 9 - Converged Fluent UI components: https://github.com/microsoft/fluentui/tree/master/packages/react-components

💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home

Sharing is caring! You are awesome! 🧡

1 participant
17 minutes

webpart

dashboard

browser

user

manage

profile

usability

pmpjs

joao

sharepoint

6 Jul 2023

In this 16-minute developer-focused demo Martin Heusser points to the elephant in the room - phone number management in Teams Admin Center is lacking. Here is the in-house alternative you may want to consider. Uses SharePoint Online, Microsoft List (names and numbers), Azure Automation, PowerShell, CLI for Microsoft 365, and Power Automate. 1-click deployment - the Environment.json script’s Runbook delivers the magic in 5-10 minutes. Customization options using Power Automate. Demo adding/removing users and phone numbers.

This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on May 25, 2023.

Demo Presenter
• Martin Heusser (Houlihan Lokey) | @mozzeph

Community Call Conversation
• aka.ms/May25-Demo2

Supporting materials
• Article - Teams Phone Number Management on a Budget (Part 1) | https://medium.com/@mozzeph/teams-phone-number-management-on-a-budget-e25d53f65caf
• Article - Teams Phone Number Management List Part 2 | https://medium.com/@mozzeph/teams-phone-number-management-list-part-2-b5385e348a3a
• Repo - Teams Phone Automation | https://github.com/mozziemozz/TeamsPhoneAutomation

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

1 participant
16 minutes

microsoft

sharepoint

management

skype

phone

36500

routing

locally

users

powershell

4 Jul 2023

In this 6-minute Maker/Developer focused demo, Sheena Makker’s presentation opens with a quick overview of the Microsoft 365 Mobile app. Now you are able to run Teams Personal Tab apps on the Microsoft 365 mobile app, on Android and on iOS (Testflight). Specifically, Teams Tab apps built using Microsoft Teams JS v2 and Teams App manifest v1.13. Microsoft 365 app is available to WW enterprise audience on Android and on iOS (Testflight).

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on May 23, 2023.

Demo Presenter
• Sheena Makker (Microsoft)

Supporting materials
• Documentation - Build tabs for Teams | https://learn.microsoft.com/microsoftteams/platform/tabs/what-are-tabs
• Article - Join our Beta program (Microsoft Teams apps now available in public preview in the Microsoft 365 iOS app) | https://devblogs.microsoft.com/microsoft365dev/microsoft-teams-apps-now-available-in-public-preview-in-the-microsoft-365-ios-app/#join-our-beta-program
• Sample - Extend Teams app to other M365 host apps like Outlook, Office.com | https://github.com/microsoft/app-camp/tree/main/experimental/ExtendTeamsforM365
• Documentation - App manifest schema for Teams | https://learn.microsoft.com/microsoftteams/platform/resources/schema/manifest-schema
• Feedback - Teams App now available in Microsoft 365 app (office.com) | https://forms.office.com/pages/responsepage.aspx?id=v4j5cvGGr0GRqy180BHbR8Ui9WZwaVlCj6Azal95z3FUNVJMODAwREhKWldXOEFOM0EyMU5OTDlRVi4u&wdLOR=c9A56A813-35E3-49AB-9BB6-9E99C2904C31

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
6 minutes

app

apps

microsoft365

android

microsoft

mobile

office

themes

launching

365

27 Jun 2023

📺 In this 17-minute developer focused demo, Bob German delivers an expanded experience grounded in the same premise as before - reuse existing app investments, but now build a simple Teams app with Teams Toolkit and use the app to call existing web services in (your enterprise, public web services, and Microsoft Graph). The strategy focuses on messaging extensions – all types covered in this camp. The presenter shows high level architecture and then shows what you can build with 6 new labs.

This community call demo is taken from the weekly Microsoft 365 Platform Community call recorded on June 27, 2023. Join the next one by downloading invite from https://aka.ms/community/calls.

✨ Presenter
• Bob German (Microsoft) | @Bob1German

📖 Learn more
• Workshop - Build Microsoft Teams apps leveraging existing software investments | aka.ms/app-camp-new
• Repo – App Camp | https://github.com/microsoft/app-camp

💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home

Sharing is caring! You are awesome! 🧡

2 participants
17 minutes

apps

software

app

microsoft

application

leveraging

toolkit

users

project

services

27 Jun 2023

📺 In this 12-minute Maker/Developer focused demo, Paolo Pialorsi delivers the 3rd installment on this end-to-end retail solution scenario that you can build in Microsoft 365. In this particular demo, the focus is on the back-end .NET API relied upon by both the Teams personal app and a Viva Connections card. See in call in Postman and code in SPFx app for how to consume the API in a secure way by providing a token – easily configured.

This community call demo is taken from the weekly Microsoft 365 Platform Community call recorded on June 27, 2023.

✨ Demo Presenter
• Paolo Pialorsi (PiaSys.com) | @PaoloPia

📖 Supporting materials
• Sample - Contoso Retail Dashboard | https://adoption.microsoft.com/sample-solution-gallery/sample/pnp-spfx-reference-scenarios-samples-react-retail-dashboard/
• Documentation - Build your first SharePoint Adaptive Card Extension | https://learn.microsoft.com/sharepoint/dev/spfx/viva/get-started/build-first-sharepoint-adaptive-card-extension
• Demo - Extend SPFx apps across Microsoft 365 - Contoso Retail scenario (2023-06-06) – Paolo Pialorsi (PiaSys) | @PaoloPia
• Demo (June 13) - Exposing Microsoft Teams apps in Microsoft Viva with SPFx cards – Paolo Pialorsi (PiaSys) | @PaoloPia

💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home

Sharing is caring! You are awesome! 🧡

2 participants
13 minutes

sharepoint

backend

demo

presentation

microsoft

api

leveraging

connection

viva

configuring

13 Jun 2023

In this 16-minute developer focused demo, Paolo Pialorsi reviews capabilities of cards and rendering devices. QuickView and CardView cards (ACEs) can be created with no-code (configurable), low-code (designable) or pro code (customizable). Step through ACE creation using yeoman generator, creating a CardView card with specific elements (images, text, buttons). Scaffold and explore the code. Discuss getting data from external sources, data binding, deep linking, and usage of secured Azure Functions in back-end. Add a button and register views.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on June 13, 2023.

Demo Presenter
• Paolo Pialorsi (PiaSys) | @PaoloPia

Supporting materials
• Sample - Contoso Retail Dashboard | https://adoption.microsoft.com/sample-solution-gallery/sample/pnp-spfx-reference-scenarios-samples-react-retail-dashboard/
• Documentation - Build your first SharePoint Adaptive Card Extension | https://learn.microsoft.com/sharepoint/dev/spfx/viva/get-started/build-first-sharepoint-adaptive-card-extension
• Demo - Extend SPFx apps across Microsoft 365 - Contoso Retail scenario (2023-06-06) – Paolo Pialorsi (PiaSys) | @PaoloPia

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
17 minutes

dashboard

application

interface

demo

presentation

advanced

microsoft

sharepoint

configuring

viva

12 Jun 2023

In this 12-minute developer focused demo, Supriti Bhan shows how with Live Share, users co-watch, co-create, and co-edit what’s on screen during meetings. Meeting participants can annotate, manipulate, activate, edit the same object shown on all participants screens in real time. Learn about 3 SDK packages (groups of capabilities) – Live Share core, Live Share media, and Live Share canvas. Short demo shows complete interactivity now available across mobile and desktop devices.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on May 16, 2023.

Demo Presenter
• Supriti Bhan (Microsoft)

Supporting materials
• Documentation - Live Share SDK | https://learn.microsoft.com/microsoftteams/platform/apps-in-teams-meetings/teams-live-share-overview

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

3 participants
13 minutes

share

collaborate

presentation

users

chat

apps

discussed

demo

session

live

23 May 2023

In this 13-minute developer-focused demo, Markus Möller focuses on Option B - use a single app to generate, publish and review template-based documents from any Microsoft 365 product - Teams, Outlook, Microsoft 365, SharePoint, with ONE Teams solution. Last week, Option A generated a document using SPFx. This week, Option B uses yoteams (native app) not only for generation, but also enables publish & review (using search-based messaging extensions). The Option’s evaluation criteria considers hosting, authentication, and privacy.

This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on April 13, 2023.

Demo Presenter
• Markus Möller (Avanade) | @Moeller2_0

Community Call Conversation
• aka.ms/Apr13-Demo1

Supporting materials
• Article - SharePoint document review in Outlook or Teams | https://mmsharepoint.wordpress.com/2023/02/07/sharepoint-document-review-in-outlook-or-teams/
• Article - A SharePoint document generator as Microsoft 365 app I (yoteams) | https://mmsharepoint.wordpress.com/2022/12/28/a-sharepoint-document-generator-as-microsoft-365-app-i-yoteams/
• Sample - Offer Creation (yoteams) - Microsoft Teams App | https://github.com/pnp/teams-dev-samples/tree/main/samples/tab-office-offer-creation
• Documentation - Extend Teams apps across Microsoft 365 | https://learn.microsoft.com/microsoftteams/platform/m365-apps/overview
• Demo (Option A) – A SharePoint document generator as Microsoft 365 app with SPFx – Markus Möller (Avanade) | @Moeller2_0

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
13 minutes

application

apps

office

toolkit

microsoft

sharepoint

demos

preview

foreign

presenting

16 May 2023

In this 14-minute developer focused demo, Srinivas Varukala and Rick Shire kick showcase an open-source App provided by Microsoft Teams that simplifies the management of separate Teams call queues and individuals with a connected and capable supervisor UI. Manage call queues, upload schedules (CSV), view schedules, manually update schedules. Queue coordination delivered by Power Apps to Power Automate via custom connector to Azure function, which runs Power Shell using a service account with credentials stored in Key Vault.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on May 16, 2023.

Demo Presenters
• Srinivas Varukala (Microsoft) | @svarukala
• Rick Shire (Microsoft)

Supporting materials
• App - Microsoft Teams Call Queue Scheduler | aka.ms/CallQueueScheduler

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

3 participants
14 minutes

scheduler

calls

supervisors

queue

client

delegating

cues

app

timely

microsoft

9 May 2023

Solutions created for Teams are also available automatically in Outlook and Microsoft 365 app. In this 18-minute Developer focused demo, Vesa Juvonen relates how SPFx uses Teams SDK v2.9.1 by default and a custom or auto generated manifest to deliver this extensibility. See simple steps to onboard a SharePoint web part into Microsoft Teams. The Teams SDK is natively available in context and Teams Toolkit supports SharePoint Framework. Also, improved debugging for SPFx provided by Teams Toolkit v5.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on May 9, 2023.

Demo Presenter
• Vesa Juvonen (Microsoft) | @vesajuvonen

Supporting materials
• Documentation - Overview of the SharePoint Framework | https://learn.microsoft.com/sharepoint/dev/spfx/sharepoint-framework-overview
• Documentation – Teams Toolkit Overview | https://learn.microsoft.com/microsoftteams/platform/toolkit/teams-toolkit-fundamentals
• Marketplace – Microsoft Teams Toolkit for Visual Studio Code | https://marketplace.visualstudio.com/items?itemName=TeamsDevApp.ms-teams-vscode-extension

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

1 participant
19 minutes

sharepoint

toolkit

microsoft

accessible

v1

applications

host

deployments

sdks

developers

9 May 2023

Create powerful web flow solutions using workflow templates in Teams. In this 10-minute developer focused demo, Eric Scherlinger and Avadhesh Dubey update viewers on recently added 21 new templates to automate event notifications, initiate file synchronization, connect to third party apps, and more. 2 examples shown – Create a new Trello card from message and add button to notify a user in Teams. 2-3 steps to implement template. Full flow created behind the scenes for you to inspect, learn, modify.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on May 9, 2023.

Demo Presenters
• Eric Scherlinger (Microsoft)
• Avadhesh Dubey (Microsoft)

Supporting materials
• Documentation - Create flows in Microsoft Teams | https://learn.microsoft.com/power-automate/teams/teams-app-create
• Documentation - Use flows in teams created from templates | https://learn.microsoft.com/power-automate/teams/introduction-teams-templates
• Template - Create a new Trello card from a message | https://powerautomate.microsoft.com/templates/details/0e9e8e425a6c4f599af2f602ccb9916f/create-a-new-trello-card-from-a-message/
• Template - Notfity a user in Teams | https://powerautomate.microsoft.com/templates/details/52f77e0cde234231903129fce1327763/notfity-a-user-in-teams/
• Demo - Power Platform Solutions in Microsoft Teams – Example scenario deep dive – Marcus Castro (Microsoft) (May 2nd)
• Demo – Why build Power Platform Solutions in Microsoft Teams? – Stuart McCarthy (Microsoft) & Marcus Castro (Microsoft) (April 25th)

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
10 minutes

workflow

workflows

automations

automation

powerapps

automating

collaborate

tool

bot

leverage

4 May 2023

In this 19-minute developer-focused demo, Siddharth Vaghasia and Kunj Sangani show a modified out-of-box form customizer that will get you up and running in no time. The presenter essentially walks viewers through his form customizer article, UI and code while delivering tips for fine tuning and debugging along with a historical reference. One time saver is the ability to toggle between form customizer, list and Item on form. Works only if running SPFx v1.15 or greater.

This PnP Community demo is taken from the Viva Connections & SharePoint Framework Bi-weekly sync call recorded on May 4, 2023.

Demo Presenters
• Siddharth Vaghasia (BinaryRoots) | @siddh_me
• Kunj Sangani | @sanganikunj

Supporting materials
• Sample - Teams Tab Conversation View | https://adoption.microsoft.com/sample-solution-gallery/sample/pnp-sp-dev-spfx-web-parts-react-teams-conversationview/
• Documentation - Build Microsoft Teams tab using SharePoint Framework – Tutorial | https://learn.microsoft.com/sharepoint/dev/spfx/web-parts/get-started/using-web-part-as-ms-teams-tab
• Documentation - Build your first app with SPFx | https://learn.microsoft.com/microsoftteams/platform/sbs-gs-spfx

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
19 minutes

collaborating

project

sharing

conversation

sharepoint

client

context

teamstep

webpart

spfx

2 May 2023

In this 13-minute developer focused demo, Bob German presents a simple Tab app solution that uses Live Share SDK, Teams Toolkit and Fluid UI. When in a meeting, any participant can (in side panel) add/delete themselves to the who’s next to speak queue, that immediately renders (Fluid) on all other participants screens. Low/no permissions requirement to use. Step through code – manifest, React app, the fluidLiveShare component, and the connection to the LiveShare SDK/host.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on April 4, 2023.

Demo Presenter
• Bob German (Microsoft) | @Bob1German

Supporting materials
• Sample Repo - How to use this Who's Next In-meeting app | aka.ms/who-is-next
• Article – Build a "Who's Next" Teams meeting app with Fluid Framework and the Live Share SDK | aka.ms/who-is-next-article
• Video - Build a "Who's Next" Teams Meeting app | aka.ms/who-is-next-video
• Documentation - Live Share SDK | https://learn.microsoft.com/microsoftteams/platform/apps-in-teams-meetings/teams-live-share-overview?tabs=javascript

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
13 minutes

project

provisioning

developer

toolkit

demo

apps

user

sdk

host

scrum

2 May 2023

In this 12-minute developer focused demo, Marcus Castro moves beyond integration of Power Apps into Teams tabs or personal apps, to implementations that utilize more Teams capabilities (action buttons, chat, adaptive cards) to deliver richer contextual conversations to your users. Sample incident reporting application in this demo showcases integration options - context aware apps, Power Apps deep linking, sharing (Power Automate Flow), all on desktop/mobile surfaces. Samples available soon.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on May 2, 2023.

Demo Presenter
• Marcus Castro (Microsoft)

Supporting materials
• Demo – Why build Power Platform Solutions in Microsoft Teams? – Stuart McCarthy (Microsoft) & Marcus Castro (Microsoft)
• Documentation - Create apps in Microsoft Teams by using Power Apps | https://learn.microsoft.com/power-apps/teams/create-apps-overview
• Documentation - Create low-code custom apps for Teams | https://learn.microsoft.com/microsoftteams/platform/samples/teams-low-code-solutions

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
13 minutes

app

apps

application

user

chat

demo

mobile

capabilities

help

microsoft

26 Apr 2023

In this 11-minute Developer focused demo, Garry Trinder delivers the final installment of this series. You’ve built an awesome app on your local machine, now it’s time to move it to a remote environment to validate and share with others. The move is streamlined with 3 Toolkit features - provision to cloud, deploy to cloud, and publishing to your organization. In this example a simple tab app makes its way to the Teams admin portal and can be added to Teams.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on March 28, 2023.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrinder

Supporting materials
• Training - Build and deploy apps for Microsoft Teams using Teams Toolkit for Visual Studio Code | aka.ms/learn/teamstoolkit
• Documentation – Teams Toolkit Overview | https://learn.microsoft.com/microsoftteams/platform/toolkit/teams-toolkit-fundamentals?pivots=visual-studio-code
• Documentation – Teams JavaScript client library | https://learn.microsoft.com/microsoftteams/platform/tabs/how-to/using-teams-client-library
• Documentation - people module | https://learn.microsoft.com/javascript/api/@microsoft/teams-js/people
• Documentation - chat module | https://learn.microsoft.com/javascript/api/@microsoft/teams-js/chat

Previous demos in this series
• Demo 4 - Add chat capability to Microsoft Teams app using Teams JavaScript client library – Garry Trinder (Microsoft) | @garrytrinder (3/21)
• Demo 3 - Teams Toolkit Learn Path - Build a Microsoft Teams tab app using Teams Toolkit for Visual Studio Code – Garry Trinder (Microsoft) | @garrytrinder (3/7)
• Demo 2 – Teams Toolkit Learn Path - Build a bot using Teams Toolkit for Visual Studio Code - Garry Trinder (Microsoft) | @garrytrinder - (2/28)
• Demo 1 – Teams Toolkit Learn Path – Get started building apps for Microsoft Teams using Teams Toolkit for Visual Studio Code - Garry Trinder (Microsoft) | @garrytrinder – (2/21)

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

1 participant
11 minutes

toolkits

deploying

toolkit

apps

teams

chats

prerequisites

microsoft

bot

projects

25 Apr 2023

In this 16-minute developer focused demo, Garry Trinder covers several new features in Teams Toolkit v5.0 that make it much easier to migrate what you have to Teams. To create/deploy Teams app today is a lot of work. The task is simplified. Key v5.0 features reviewed – project files, pre-defined actions, and Visual Studio Dev Tunnels. Inspect differences in code walk through as migrate existing Teams Conversation Bot SSO quick-start sample into a Teams Toolkit project.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on April 25, 2023.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrind

Supporting materials
• Documentation - Available actions in Teams Toolkit | aka.ms/teamsfx-actions
• Sample - Teams Conversation Bot SSO quick-start | https://adoption.microsoft.com/sample-solution-gallery/sample/officedev-microsoft-teams-samples-bot-conversation-sso-quickstart-js/
• General Samples – Teams Samples | aka.ms/community/samples
• Repo - Migrated Project using - Teams Toolkit v5.0 Pre-release | https://github.com/garrytrinder/msteams-bot-sso
• Demo – Introduction to Microsoft Teams Toolkit v5 - New features and capabilities – John Miller (Microsoft) | @jmillerdev
• Documentation - Teams Toolkit Visual Studio Code v5.0 Prerelease Guide | aka.ms/teamsfx-v5.0-guide

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

1 participant
17 minutes

bots

workflow

setups

provisioning

project

apps

implementing

teamsfx

toolkit

microsoft

25 Apr 2023

Microsoft Teams is built for hybrid collaboration and delivers contextual information, automations and actions. Power Platform delivers bespoke functionality, connection to data and workflows. Microsoft is focused on bringing elements of Teams and Power Platform Suite together. In this 15-minute developer focused demo, delivered by Stuart McCarthy and Marcus Castro hear about app integration in Fabrikam Airport work shift management example and how to identify Power platform apps ripe for Teamifying. Preview 3 app integration features, deep dive next week.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on April 25, 2023.

Demo Presenters
• Stuart McCarthy (Microsoft)
• Marcus Castro (Microsoft)

Supporting materials
• Documentation - Create apps in Microsoft Teams by using Power Apps | https://learn.microsoft.com/power-apps/teams/create-apps-overview
• Documentation - Create low-code custom apps for Teams | https://learn.microsoft.com/microsoftteams/platform/samples/teams-low-code-solutions

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
15 minutes

collaborating

teamifying

discussions

users

contextually

talking

thinking

chats

power

manager

20 Apr 2023

In this 9-minute developer-focused demo, Harminder Singh shares a SPFx web part that uses the Graph API to display the health status for all Microsoft 365 services as seen only by Admins in Admin Center, presently. The web part delivers a similar appearance and drill down functionality as in Admin center. Web part broken into multiple sub-components with separate styling for code manageability/reuse. Many of the components are stateless.

This PnP Community demo is taken from the Viva Connections & SharePoint Framework Bi-weekly sync call recorded on April 20, 2023.

Demo Presenter
• Harminder Singh (Nagarro) | @Harminder_Sethi

Supporting materials
• Sample - Service Health for Microsoft 365 | https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-m365-services-health

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
10 minutes

microsoft

manage

admin

api

advisory

helper

ui

services

365

nagaro

18 Apr 2023

In this 21-minute developer focused demo, John Miller reviews Teams apps, manifests, hosting and cross platform visibility. New v5 automation features for composable automation, templates, CLI/IDE extensions. Install the teamsfx CLI tool from npm, create a project (notification bot), walk through default project structure in scaffold, app package, environment variables, hosting files, teams app update, F5 debug, instructions in yml files, new tunneling task, automated creation of needed platform resources.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on April 18, 2023.

Demo Presenter
• John Miller (Microsoft) | @jmillerdev

Supporting materials
• Toolkit - Microsoft Teams Toolkit | https://github.com/officedev/teamsfx
• Feedback – mail to: ttkfeedback@microsoft.com
• Schedule a chat - https://aka.ms/ttk-chat

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
21 minutes

apps

app

teamzap

teamsfx

tooling

provisioner

developers

api

launching

hosted

10 Apr 2023

In this 17-minute developer focused demo, Dan Wahlin focuses viewers on the front-end and on web components. Start by installing front-end app packages - azure/communication-common and azure/communication-react. Define an ACS user identity, and token and Teams meeting link. Create an ACS credential, callAadapterArgs. and the ACS callAdapter that’s passed to the CallComposite component – the wrapper around various functionality that enables audio/video calling to happen. This is part 3 in a 6-part series.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on February 21 2023.

Demo Presenter
• Dan Wahlin (Microsoft) | @DanWahlin

Supporting materials
• Repo - Microsoft Cloud Integrations (code samples, videos, documentation) | https://github.com/microsoft/microsoftcloud
• Tutorial - Audio/Video Calling from a Custom App into a Teams Meeting | aka.ms/mscloud-acs-teams-tutorial
• Tools – Azure Communication Services UI Library | aka.ms/acs-ui-library
• Documentation - What is Azure Communication Services? | https://learn.microsoft.com/azure/communication-services/overview

ACS Series Demos
• Demo 2 – Create an Azure Communication Services Resource – Dan Wahlin (Microsoft) | @DanWahlin (2/14)
• Demo 1 – Getting Started with Azure Communication Services, Microsoft Graph, and Microsoft Teams – Dan Wahlin (Microsoft) | @DanWahlin (2/7)
• Demo 0 – Introduction to Azure Communication Services – Tomas Chladek (Microsoft) | @tomaschladek2 (1/31)

2 participants
17 minutes

demoing

chat

introduced

microsoft

come

collaboration

services

aicha

user

cloud

6 Apr 2023

In this 16-minute developer-focused demo, Markus Möller shows how with this Microsoft 365 SPFx app, you can generate template-based Offer documents with custom meta data from within Teams, Outlook, Office, and SharePoint. The “Offer Creation” app shows up in the Add Apps menu within M365 products because it was installed as a personal app in Microsoft Teams. Templates created from M365 apps are stored in the same “Offerings” document library. Review key code elements and configuration.

This PnP Community demo is taken from the Viva Connections & SharePoint Framework Bi-weekly sync call recorded on April 6, 2023.

Demo Presenter
• Markus Möller (Avanade) | @Moeller2_0

Supporting materials
• Article – A SharePoint document generator as Microsoft 365 app II (SPFx) | https://mmsharepoint.wordpress.com/2022/12/28/a-sharepoint-document-generator-as-microsoft-365-app-ii-spfx/
• Article – A user configured Teams personal app with SPFx web part | https://mmsharepoint.wordpress.com/2023/01/02/a-user-configured-teams-personal-app-with-spfx-web-part/
• Sample - Offer Creation | https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-office-offer-creation
• Documentation - Extend Outlook and Office with the SharePoint Framework | https://learn.microsoft.com/sharepoint/dev/spfx/office/overview
• Demo - Extend Microsoft Teams apps across Microsoft 365 (Outlook and Office) - Markus Möller (Avanade) | @Moeller2_0

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

1 participant
16 minutes

sharepoint

toolkit

microsoft

office

document

application

generate

foreign

provisioning

host

5 Apr 2023

In this 9-minute developer focused demo, Dewain Robinson shows that by tapping the power of Chat GPT for creating responses in real time, one need not author content in the bot. Control the GPT experience by limiting the content accessed (corporate approved), by the Power Virtual Agent (PVT), the dialog manager. Generated responses include short answer and links to supporting content. Capability included in the Public Preview delivers a new paradigm for how topics will be created and managed for conversational agents.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on March 14, 2023.

Demo Presenter
• Dewain Robinson (Microsoft) | @Dewain76

Supporting materials
• Documentation - AI-based boosted conversations overview (preview) | https://learn.microsoft.com/power-virtual-agents/nlu-gpt-overview
• Website - Empower everyone to easily create conversational bots. | aka.ms/trypva
• Video training - Boost Conversations using GPT with Power Virtual Agents | https://www.youtube.com/watch?v=b29v49l2Am8
• Article - Now in Public Preview: Power Virtual Agents’ new advanced authoring canvas | https://powervirtualagents.microsoft.com/blog/now-in-public-preview-power-virtual-agents-new-advanced-authoring-canvas/

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
10 minutes

bots

agents

authoring

enabling

communicate

users

powerful

ai

powerfx

virtual

4 Apr 2023

In this 27-minute developer focused demo, Garry Trinder opens with an overview of Teams apps (bots, tabs, message extensions and meeting extensions), Teams Toolkit and Toolkit prerequisites (Visual Studio Code, Microsoft 365 tenant and Node.js). Then in VS Code, install and setup Teams Toolkit in the tenant, get a sample tabs app (sourced from Toolkit’s samples gallery) up and running. This is the part 1 in a 5-part series.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on February 21, 2023.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrind

Supporting materials
• Learn Path - Build and deploy apps for Microsoft Teams using Teams Toolkit for Visual Studio Code | aka.ms/learn/teamstoolkit

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

1 participant
27 minutes

toolkits

app

workflow

demos

microsoft

introduce

bots

setup

team

trinder

31 Mar 2023

In this 11-minute developer focused demo, Ayça Baş kicks articulates how does an external customer get a token that enables them to join my Teams meeting through ACS? Learn about the integrations between ACS, Teams and Azure functions. Use an Azure function (ACSTokenFunction) called from client’s React app, to make a dynamic ACS identity and token. Walk through the code and see the result in action. This is the 5th demo in this series.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on March 7, 2023.

Demo Presenter
• Ayça Baş (Microsoft) | @aycabs

Supporting materials
• Tutorial - Audio/Video Calling from a Custom App into a Teams Meeting | aka.ms/mscloud-acs-teams-tutorial
• Integrations - Microsoft Cloud Integration Scenarios | aka.ms/microsoft-cloud
• Repo - Microsoft Cloud Integrations (code samples, videos, documentation) | https://github.com/microsoft/MicrosoftCloud
• Library - Azure Communication Services – UI Library | aka.ms/acs-ui-library
• Documentation - Azure Functions documentation | aka.ms/msazure-functions
• Tool – Graph Explorer | aka.ms/ge

• Previously delivered demos in this series
• Demo 4 – Dynamically Create a Microsoft Teams Meeting using Microsoft Graph - Ayça Baş (Microsoft) | @aycabs - (2/28)
• Demo 3 – Integrate Azure Communication Services Calling into a React App - Dan Wahlin (Microsoft) | @DanWahlin – (2/21)
• Demo 2 – Create an Azure Communication Services Resource – Dan Wahlin (Microsoft) | @DanWahlin (2/14)
• Demo 1 – Getting Started with Azure Communication Services, Microsoft Graph, and Microsoft Teams – Dan Wahlin (Microsoft) | @DanWahlin (2/7)
• Demo 0 – Introduction to Azure Communication Services – Tomas Chladek (Microsoft) | @tomaschladek2 (1/31)

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
11 minutes

communication

collaboration

chat

interface

azure

microsoft

session

introduce

services

demos

30 Mar 2023

In this 13-minute developer-focused demo, Lee Ford briefly reviews OpenAI - DALL-E, then proceeds to implement an AI scenario using a Teams Message Extension and an Azure Bot. Request an AI generated image based on a simple text description, receive back an image rendered in an Adaptive Card leveraging the Bot Framework to execute the transaction and accessing an Open AI API. A thorough educational code walk-through. Sample available.

This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on March 30, 2023.

Demo Presenter
• Lee Ford (Symity) | @lee_ford

Community Call Conversation
• aka.ms/Mar30-Demo1

Supporting materials
• Sample - Teams DALL·E 2 Messaging Extension | aka.ms/msgext-dalle
• Article - How to use AI image prompts to generate art using DALL‑E | https://create.microsoft.com/learn/articles/how-to-image-prompts-dall-e-ai

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
13 minutes

ai

dali

bot

chat

demo

app

accessible

talking

helper

implement

28 Mar 2023

In this 13-minute Maker/Developer focused demo, David Rousset runs through how to develop and remotely debug (and make live updates) apps on Android or iPhone from a Windows PC using Vorlon.js. Requires adding only a script to Teams web app running on these surfaces. The script monitors calls to console log that’s connected to PC via WiFi. See functionality in demo today. What can we build for you tomorrow? Envision a VS Code extension for Teams Toolkit.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on February 28, 2023.

Demo Presenter
• David Rousset (Microsoft) | @davrous

Supporting materials
• Tool - INTRODUCING VORLON.JS | https://vorlonjs.io/

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
13 minutes

apps

android

app

debugging

application

toolkit

developer

microsoft

remote

gs

28 Mar 2023

In this 15-minute developer focused demo, Luca Bandinelli and Alex Terentiev deliver a directional update on SPFx and extensibility platform for Microsoft 365. SPFx v1.17 capabilities reviewed include: Use TeamsJS SDK v2.9.1, OS variable now in serve.json configuration, web part TopActions, Sync to Teams, Action handler for ACE, focus parameters in ACE quick view, and Adaptive Cards v1.5 schema support. Beyond v1.17 capabilities also described.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on March 28, 2023.

Demo Presenters
• Luca Bandinelli (Microsoft)
• Alex Terentiev (Microsoft) | @alexaterentiev

Supporting materials
• Article – Announcing SharePoint Framework 1.17 release candidate - Vesa Juvonen (Microsoft) | @vesajuvonen

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
15 minutes

sharepoint

connections

framework

access

virtual

microsoft

host

viva

applications

teamstab

21 Mar 2023

In this 15-minute Developer focused demo, Garry Trinder orients you to see how the JS library can be used to add native Teams functionality into your applications. Install the library, note how APIs are grouped by capabilities that access functionality within Teams, initialize library, explore usage of capabilities – specifically context and chat. In demo, step through adding Teams chat to an app with a few lines of JS code. Fourth installment in a 5-part series.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on March 21, 2023.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrinder

Supporting materials
• Training - Build and deploy apps for Microsoft Teams using Teams Toolkit for Visual Studio Code | aka.ms/learn/teamstoolkit
• Documentation – Teams Toolkit Overview | https://learn.microsoft.com/microsoftteams/platform/toolkit/teams-toolkit-fundamentals?pivots=visual-studio-code
• Documentation – Teams JavaScript client library | https://learn.microsoft.com/microsoftteams/platform/tabs/how-to/using-teams-client-library
• Documentation - people module | https://learn.microsoft.com/javascript/api/@microsoft/teams-js/people
• Documentation - chat module | https://learn.microsoft.com/javascript/api/@microsoft/teams-js/chat

Previous demos in this series
• Demo 3 - Teams Toolkit Learn Path - Build a Microsoft Teams tab app using Teams Toolkit for Visual Studio Code – Garry Trinder (Microsoft) | @garrytrinder (3/7)
• Demo 2 – Teams Toolkit Learn Path - Build a bot using Teams Toolkit for Visual Studio Code - Garry Trinder (Microsoft) | @garrytrinder - (2/28)
• Demo 1 – Teams Toolkit Learn Path – Get started building apps for Microsoft Teams using Teams Toolkit for Visual Studio Code - Garry Trinder (Microsoft) | @garrytrinder – (2/21)

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

1 participant
15 minutes

chat

helpers

toolkit

trinder

bot

users

session

apps

teams

deploying

20 Mar 2023

In this 17-minute developer-focused demo, Ramin Ahmadi’s solution calls the Microsoft Search API to search resources. Build tabs using ready-made UI building blocks for native UI on Desktop/Web/Mobile. Use Bot for back-end and Adaptive Cards for front-end. Reviews prerequisites like bot development/registration and SSO configuration if login is required. Also covers technology limitations. Step through configurations for app manifest, SSO, App Registration, task modules, use of adaptive card Designer, and more. Tabs with Adaptive Cards are only supported as personal apps.

This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on February 16, 2023.

Demo Presenter
• Ramin Ahmadi (Content+Cloud) | @raminahmadi1986

Community Call Conversation
• https://aka.ms/Feb16-Demo1

Supporting materials
• Samples – teams-dev-samples | https://github.com/pnp/teams-dev-samples/tree/main/samples
• Documentation - Build tabs with Adaptive Cards | https://learn.microsoft.com/microsoftteams/platform/tabs/how-to/build-adaptive-card-tabs
• Documentation – Configure SSO for your bot | https://learn.microsoft.com/microsoftteams/platform/sbs-bots-with-sso?tutorial-step=3
• Documentation – Overview of the Microsoft Search API in Microsoft Graph | https://learn.microsoft.com/graph/search-concept-overview
• Tool – Adaptive Cards Designer | https://www.adaptivecards.io/designer/

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
17 minutes

tabs

tab

apps

adaptive

microsoft

software

browser

cards

toolkit

user

14 Mar 2023

In this 24-minute developer focused demo, Dan Wahlin explains while there many app deployment options to Azure, in this demo Dan deploys an ACS app using Azure Static Web Apps. Step through the process - set up a GitHub Repo using the GitHub command line tool. Insert your ACS React app in Repo. Go to Azure Portal and create a Static Web App, point to your app in Repo. Pass in environment variables and click to deploy app and APIs. Part 6 – final in series.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on March 14, 2023.

Demo Presenter
• Dan Wahlin (Microsoft) | @DanWahlin

Supporting materials
• GitHub CLI – Take GitHub to the command line | https://cli.github.com/
• Repo - Microsoft Cloud Integration Scenarios | | aka.ms/microsoft-cloud
• Tutorial - Audio/Video Calling from a Custom App into a Teams Meeting | aka.ms/mscloud-acs-teams-tutorial
• Repo - Microsoft Cloud Integrations (code samples, videos, documentation) | https://github.com/microsoft/microsoftcloud
• Tools – Azure Communication Services UI Library | aka.ms/acs-ui-library
• Tool – Graph Explorer | aka.ms/ge
• Training - Azure Static Web Apps | aka.ms/swa-training
• Documentation - What is Azure Communication Services? | https://learn.microsoft.com/azure/communication-services/overview

Previous demos in this series:
• Demo 5 - Dynamically Create an Azure Communication Services Identity and Token - Ayça Baş (Microsoft) | @aycabs - (3/7)
• Demo 4 – Dynamically Create a Microsoft Teams Meeting using Microsoft Graph - Ayça Baş (Microsoft) | @aycabs - (2/28)
• Demo 3 – Integrate Azure Communication Services Calling into a React App - Dan Wahlin (Microsoft) | @DanWahlin – (2/21)
• Demo 2 – Create an Azure Communication Services Resource – Dan Wahlin (Microsoft) | @DanWahlin (2/14)
• Demo 1 – Getting Started with Azure Communication Services, Microsoft Graph, and Microsoft Teams – Dan Wahlin (Microsoft) | @DanWahlin (2/7)
• Demo 0 – Introduction to Azure Communication Services – Tomas Chladek (Microsoft) | @tomaschladek2 (1/31)

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
24 minutes

deploying

recorded

server

workflows

chat

azure

apps

cloud

demo

microsoft

7 Mar 2023

In this 21-minute developer focused demo, Garry Trinder steps through creating a new Teams app that contains a tab. The Teams Toolkit enables you to build a half dozen different tab experiences with React based project templates. Covered in this session – tabs and Toolkit overviews, themes, router, app manifest, Toolkit installation, configuration, app and tab template selection. Walk through the scaffolded project code. This is the 3rd demo in this series.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on March 7, 2023.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrind

Supporting materials
• Training - Build and deploy apps for Microsoft Teams using Teams Toolkit for Visual Studio Code | aka.ms/learn/teamstoolkit
• Documentation – Teams Toolkit Overview | https://learn.microsoft.com/microsoftteams/platform/toolkit/teams-toolkit-fundamentals?pivots=visual-studio-code
• Documentation – Create a new Teams project | https://learn.microsoft.com/microsoftteams/platform/toolkit/create-new-project?pivots=visual-studio-code
• Documentation – Build tabs for Teams | https://learn.microsoft.com/microsoftteams/platform/tabs/what-are-tabs
• Documentation – Add single sign-on to Teams app | https://learn.microsoft.com/microsoftteams/platform/toolkit/add-single-sign-on?pivots=visual-studio-code

Previously delivered demos in this series
• Demo 2 – Teams Toolkit Learn Path - Build a bot using Teams Toolkit for Visual Studio Code - Garry Trinder (Microsoft) | @garrytrinder - (2/28)
• Demo 1 – Teams Toolkit Learn Path – Get started building apps for Microsoft Teams using Teams Toolkit for Visual Studio Code - Garry Trinder (Microsoft) | @garrytrinder – (2/21)

2 participants
21 minutes

chats

toolkit

session

bot

apps

talking

tabbing

project

teams

trinder

28 Feb 2023

In this 17-minute developer focused demo, Garry Trinder invites you to step through prerequisites to create a bot for Teams and understand functions of a proactive messaging (reminder) bot in your workflow. Bot architectural components include web server, Azure Bot Service, Azure AD app registration, HTTP tunnel, and Microsoft Teams app package. In Visual Studio Code, create a Notification bot using an HTTP trigger running on Azure Functions using JavaScript. On local machine, tour provisioned capabilities. Module 2 in a 5-part series.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on February 28, 2023.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrind

Supporting materials
• Learn - Build a bot by using Teams Toolkit for Visual Studio Code | https://learn.microsoft.com/training/modules/teams-toolkit-vsc-create-bot/
• Learn - Build and deploy apps for Microsoft Teams using Teams Toolkit for Visual Studio Code | aka.ms/learn/teamstoolkit
• Visual Studio Marketplace – Teams Toolkit | https://marketplace.visualstudio.com/items?itemName=TeamsDevApp.ms-teams-vscode-extension

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

1 participant
17 minutes

bots

bot

toolkit

workflow

chats

demo

apps

debugging

build

teamsfx

28 Feb 2023

In this 14-minute developer focused demo, Ayça Baş shows how to leverage Microsoft Graph and Azure functions to automate the creation of a Teams meeting link rather than going to the calendar, creating an invite, copying/pasting link for ACS, etc. Ideal for customers using ACS in a custom app while customer service agent is using Teams – both parties use same URL to join meeting. Step through Microsoft Graph client (with authentication) setup and meeting creation code. Module 4 in this series.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on February 28, 2023.

Demo Presenter
• Ayça Baş (Microsoft) | @aycabs

Supporting materials
• Tutorial - Audio/Video Calling from a Custom App into a Teams Meeting | aka.ms/mscloud-acs-teams-tutorial
• Integrations - Microsoft Cloud Integration Scenarios | aka.ms/microsoft-cloud
• Repo - Microsoft Cloud Integrations (code samples, videos, documentation) | https://github.com/microsoft/MicrosoftCloud
• Library - Azure Communication Services – UI Library | aka.ms/acs-ui-library
• Documentation - Azure Functions documentation | aka.ms/msazure-functions
• Tool – Graph Explorer | aka.ms/ge

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

2 participants
14 minutes

chat

session

demo

presentations

meet

communication

automated

setup

recordings

microsoft

28 Feb 2023

In this 17-minute developer focused demo, Garry Trinder builds a personal app (DALL-E 2 Image Generator) with a workflow bot that returns images based on text entries. The Teams Toolkit orchestrates creation of welcome message, activity and message handlers, dialog menus, Adaptive Cards, conversation states, querying OpenAI service for images, task modules, publishing to organization’s App Catalog and Azure integration - authentication, provisioning Azure storage, etc. Demo functionality, code walkthrough, plenty of tips and tricks. Sample available.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on February 7, 2023.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrind

Supporting materials
• Website – OpenAI | https://openai.com/
• Tools - Microsoft Teams Toolkit | aka.ms/ttk
• Repo - DALL-E 2 Image Generator Bot for Microsoft Teams | https://github.com/garrytrinder/msteams-dalle-2-image-generator-bot
• Contributor – Garry Trinder | https://github.com/garrytrinder

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

1 participant
17 minutes

bots

bot

ai

demo

toolkit

app

workflow

package

chat

project

15 Feb 2023

In this 15-minute developer-focused demo, Lee Ford steps viewers through the process - user sends message from Teams client to the Azure Bot ID defined in Teams app manifest, Azure Bot sends message to Bot code that is running in an Azure Function (doesn’t have to be an Azure Function), Bot sends the text from message sent from Teams to OpenAI API and answer/response is sent back to Teams (in Adaptive Cards).

This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on January 19, 2023.

Demo Presenter
• Lee Ford (Symity) | @lee_ford

Community Call Conversation
• aka.ms/Jan19-Demo1

Supporting materials
• Sample - Teams OpenAI Conversation Bot | aka.ms/bot-openai
• Org – Open AI | https://openai.com/about/
• Documentation – GPT-3 model | https://beta.openai.com/docs/models/gpt-3

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

👋 Join to our weekly Microsoft 365 & Power Platform Community calls to learn more. These are PUBLIC calls for you to get access on the latest details from Microsoft and to see awesome demos from community on these technologies - Download recurrent invites from https://aka.ms/community/calls

1 participant
15 minutes

conversational

bots

bot

dialogue

chat

openai

ai

hosted

topic

foreign

7 Feb 2023

In this 20-minute developer focused demo, David Rousset shares a new SDK in preview for building collaborative meeting extensions. Secure real-time collaboration for Teams. Low-friction dev - web-based SDK, fast integration time, robust distributed data structures, free fully managed service, regional scaling, local browser testing. Demo, how to get started, sample and resources. Uses Fluid Framework and the LivePresence data structure (component). Package simulated environment as a Teams app that’s seen by all meeting participants.

This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on January 17, 2023.

Demo Presenter
• David Rousset (Microsoft) | @davrous

Supporting materials
• Sample - Metaverse Collaborative Virtual Visit - Live Share sample | https://github.com/davrous/metaverseliveshare
• Documentation – Live Share SDK | aka.ms/TeamsLiveShare
• Documentation – Live Share media capabilities | aka.ms/TeamsLiveShareMedia
• SDK – Live Share SDK | https://github.com/microsoft/live-share-sdk
• Samples – live-share-sdk/samples | aka.ms/LiveShareSamples
• FAQ – Live Share SDK FAQ | aka.ms/LiveShareFAQ
• Preview – Public developer preview for Teams | aka.ms/AAgxxj5
• 2022 Build Session – Make your meetings more interactive! Learn how to build engaging synchronous experiences your users will love | aka.ms/teamsliveshare/build22deepdive
• 2022 Build Session – Build collaborative apps with Microsoft Teams and Microsoft 365 services | aka.ms/teamsliveshare/build22collabapps
• Game Engine – babalon.js | https://www.babylonjs.com/

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

👋 Join to our weekly Microsoft 365 & Power Platform Community calls to learn more. These are PUBLIC calls for you to get access on the latest details from Microsoft and to see awesome demos from community on these technologies - Download recurrent invites from https://aka.ms/community/calls

2 participants
20 minutes

sdk

sdks

toolkit

collaborative

share

communicate

package

developer

preview

teams

27 Dec 2022

In this 11-minute developer focused demo, John Miller shares updates delivered in the last 3 months in the Teams Toolkit that further simplify Teams app development. Highlights include - new sample app project, simpler APIs for bot and message extension SSO, New project template for Workflow bot, fine-tuned control of Teams Toolkit debussing steps, Add SSO after the fact feature, and more. Also covers what’s next. Toolkit is available in Visual Studio 2022 and VS Code. We always appreciate your feedback!
This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on November 29, 2022.

Demo Presenter
• John Miller (Microsoft) | @jmillerdev

Supporting materials
• Tools - Microsoft Teams Toolkit | https://github.com/OfficeDev/TeamsFx
• Samples - Microsoft Teams Framework (TeamsFx) Sample Gallery | aka.ms/teamsfx-samples

Topic related demos
• Demo - Add Azure AD single sign-on to your Microsoft Teams bots using Teams Toolkit for Visual Studio Code – Garry Trinder (Microsoft) | @garrytrinder – 29:43
• Demo - Build your first Workflow bot for Microsoft Teams with Teams Toolkit for Visual Studio Code – Garry Trinder (Microsoft) | @garrytrinder – 39:44
• Demo - Build your first Command bot in C# for Microsoft Teams with Teams Toolkit for Visual Studio – Ayça Baş (Microsoft) | @aycabs https://youtu.be/AQgo2MmMzr4
• Demo - Build your first Command bot for Microsoft Teams with Teams Toolkit for Visual Studio Code – Garry Trinder (Microsoft) | @garrytrinder https://youtu.be/3skgtkJ1McQ
• Demo - Build your first Notification bot for Microsoft Teams with Teams Toolkit for Visual Studio Code – Garry Trinder (Microsoft) | @garrytrinder https://youtu.be/bwyd46tVzQo
• Demo - Build a productivity dashboard by using Teams Toolkit for Visual Studio – Ayça Baş (Microsoft) | @aycabs https://youtu.be/AZMH1tq7wEw
• Demo - Getting started with Teams Toolkit for Visual Studio – Garry Trinder (Microsoft) | @garrytrinder https://youtu.be/7oa0hW5pXt8

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
11 minutes

toolkits

toolkit

tooling

workflow

deploying

debugging

bot

teamsfx

sdk

updates

22 Dec 2022

In this 15-minute developer-focused demo, Markus Möller steps through how you use the same Mail Storage app – a static Teams personal app, in Teams, Outlook and Office.com to store emails with attachments in (Teams, Outlook, OneDrive) based on host environment (detected) in which the personal app is running. Microsoft Graph open extensions detects and links to mails already saved. Requires TeamsJS SDK 2.0 (SSO), yoTeams v4.0 (instance) and Teams manifest 1.13 or greater. Sample available now.

This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on December 22, 2022.

Demo Presenter
• Markus Möller (Avanade) | @Moeller2_0

Supporting materials
• Article - Extend Teams apps to M365 with SSO the right way | https://mmsharepoint.wordpress.com/2022/08/31/extend-teams-apps-to-m365-with-sso-the-right-way/
• Sample - Tab Office Mail Storage - Microsoft Teams App | https://github.com/pnp/teams-dev-samples/tree/main/samples/tab-office-sso-mail-save
• Documentation - Extend Teams apps across Microsoft 365 | https://learn.microsoft.com/microsoftteams/platform/m365-apps/overview
• Article - M365 Across App scenarios - Teams apps and SPFx | https://pnp.github.io/blog/post/microsoft-365-app-scenarios/

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
15 minutes

sharepoint

microsoft

office

evernote

apps

outlook

save

demo

introduce

teams

6 Dec 2022

In this 15-minute developer focused tour, Vesa Juvonen highlights synergies between Viva Toolkit & SharePoint Framework (SPFx) – community created pro-code developer tooling that simplifies development, validation, and publishing of custom Microsoft Viva experiences. Toolkit features include connection between Visual Studio Code and tenant, environment validation, installation of technical dependencies, solution update with CLI for Microsoft 365, start from scenario or sample, CodeTour, and it works on any SPFx project! Create a Viva Connections project from scratch, from a scenario or from an ACE sample. Alignment to Teams Toolkit. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on December 6, 2022.

Demo Presenter
• Vesa Juvonen (Microsoft) | @vesajuvonen

Supporting materials
• Marketplace - Viva Connections Toolkit (Preview) | aka.ms/viva/code
• Repo - Viva Connections Toolkit for Visual Studio Code | https://github.com/pnp/vscode-viva
• Feedback – vscode-viva/issues | https://github.com/pnp/vscode-viva/issues

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

1 participant
15 minutes

sharepoint

microsoft

setups

toolkit

application

viva

extensibility

version

benefits

docs

22 Nov 2022

In this 15-minute developer focused demo, Ayça Baş shows using a Notification bot to get information, i.e., weather information, from an API delivered to you via Adaptive Card. When you create a project, you will see step-by-step guidance displayed in the template. Follow it! Use ngrok for tunneling, create dependencies, F5 to run project, trigger your bot, update bot to point to desired API, replace default data in Adaptive Card with your information. Walk through code and appreciate what the Toolkit does for you. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on November 22, 2022.

Demo Presenter
• Ayça Baş (Microsoft) | @aycabs

Supporting materials
• Documentation - Teams Toolkit Overview | https://learn.microsoft.com/microsoftteams/platform/toolkit/teams-toolkit-fundamentals?pivots=visual-studio-code
• Documentation - Install Teams Toolkit | https://learn.microsoft.com/microsoftteams/platform/toolkit/install-teams-toolkit?tabs=vscode&pivots=visual-studio-code
• Documentation - Create a new Teams project | https://learn.microsoft.com/microsoftteams/platform/toolkit/create-new-project?pivots=visual-studio
• FAQ - FAQ for Teams Toolkit | https://learn.microsoft.com/microsoftteams/platform/toolkit/faq
• Tool – ngrok | https://ngrok.com
• Microsoft 365 text tenant - Join the Microsoft 365 Developer Program today! | https://developer.microsoft.com/microsoft-365/dev-program
• Tool – Adaptive Cards Designer | https://adaptivecards.io/designer/
• Article – Build a stock update notification bot using C# and Teams Toolkit for Visual Studio - Garry Trinder (Microsoft) | @garrytrinder - https://devblogs.microsoft.com/microsoft365dev/build-a-stock-update-notification-bot-for-microsoft-teams-using-c-and-teams-toolkit-for-visual-studio/

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
15 minutes

bots

toolkits

apps

teamsocket

dashboard

setup

tasks

notificationcontroller

apis

microsoft

15 Nov 2022

In this 25-minute developer focused demo, Garry Trinder steps through using the Teams Toolkit to add SSO assets to your bot projects. You have a bot, now add single sign-on (SSO) to call APIs like Microsoft Graph. Setup auth flow, implement command, update configuration, and then see how a user is authenticated by the bot calling the Microsoft Graph API. TeamsFX simplifies working with authentication, and with SSO enabled commands. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on November 15, 2022.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrinder

Supporting materials
• Documentation - Teams Toolkit Overview | https://learn.microsoft.com/microsoftteams/platform/toolkit/teams-toolkit-fundamentals?pivots=visual-studio-code
• Documentation - Build command bot with JavaScript | https://learn.microsoft.com/microsoftteams/platform/sbs-gs-commandbot?tabs=vscode
• Demo - Build your first Command bot for Microsoft Teams with Teams Toolkit for Visual Studio Code | https://www.youtube.com/watch?v=3skgtkJ1McQ
• Documentation – TeamsFx SDK | https://learn.microsoft.com/microsoftteams/platform/toolkit/teamsfx-sdk
• Repo - Microsoft Teams Toolkit | https://github.com/OfficeDev/TeamsFx
• Documentation – Add single sign-on to Teams app | https://learn.microsoft.com/microsoftteams/platform/toolkit/add-single-sign-on?tabs=typescript%2F%3Ffrom%3Dteamstoolkit&pivots=visual-studio-code
• Documentation – Microsoft Graph SDK overview | https://learn.microsoft.com/graph/sdks/sdks-overview
• Repo - Microsoft Graph JavaScript Client Library | https://github.com/microsoftgraph/msgraph-sdk-javascript

Previously delivered demos from Garry
• Build your first Workflow bot for Microsoft Teams with Teams Toolkit for Visual Studio Code | https://youtu.be/S4M9IUj7mOo?t=2384
• Build your first Command bot for Microsoft Teams with Teams Toolkit for Visual Studio Code | https://youtu.be/3skgtkJ1McQ
• Build your first Notification bot for Microsoft Teams with Teams Toolkit for Visual Studio Code | https://youtu.be/bwyd46tVzQo

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
25 minutes

bots

bot

chat

workflow

demos

toolkit

interface

debugging

microsoft

teamsfx

8 Nov 2022

In this 19-minute developer focused demo, Garry Trinder transforms viewers from zero to orders hero in minutes. What is a workflow tool and Teams Toolkit for Visual Studio Code? Use these tools to create a project, run the new bot for first time, a very comprehensive look through the files/code, live coding to create a restaurant order form (Adaptive Cards), capture data, and conclude with summary and resources. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on November 8, 2022.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrinder

Supporting materials
• Teams Toolkit (Marketplace) - Microsoft Teams Toolkit for Visual Studio Code | https://marketplace.visualstudio.com/items?itemName=TeamsDevApp.ms-teams-vscode-extension
• Samples – Adaptive Cards - Samples and Templates (Restaurant order sample) | https://adaptivecards.io/samples/RestaurantOrder.html

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
20 minutes

bots

bot

workflow

toolkit

app

machine

chat

interface

project

microsoft

26 Oct 2022

In this 16-minute developer/designer focused demo, Garry Trinder asserts Notification bots are great for sending pro-active messages into Microsoft Teams. Interested? Let’s create this bot now! Install Teams Toolkit for Visual Studio Code and scaffold a project to create a Notification bot with HTTP and Timer Trigger (Azure Functions) and use TypeScript (or JavaScript). Inspect what the toolkit has provisioned, trigger the bot for the first time and wrap up with summary and resources. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on October 4, 2022.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrinder

Supporting materials
• Documentation - Teams Toolkit Overview | https://learn.microsoft.com/microsoftteams/platform/toolkit/teams-toolkit-fundamentals?pivots=visual-studio-code
• Documentation - Create a new Teams project | https://learn.microsoft.com/microsoftteams/platform/toolkit/create-new-project?pivots=visual-studio-code
• Documentation - TeamsFx SDK | https://learn.microsoft.com/microsoftteams/platform/toolkit/teamsfx-sdk
• Repo - Microsoft Teams Toolkit | https://github.com/OfficeDev/TeamsFx

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
16 minutes

bots

bot

notifications

app

toolkit

chat

kit

helpers

bar

microsoft

24 Oct 2022

In this 11-minute developer focused demo, learn how to migrate a non-Azure AD Web App to Microsoft Teams and deliver a Single Sign On (SSO) experience with your hosts Bob German and Aditya Challapally. This sample shows the linking of a user’s AAD id with their GitHub or SaaS app identity in an IdentityMap stored in a database. At login, the Authorization is based on associated (linked) identities found in Map. Also see how associations are added to map. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on October 4, 2022.

Demo Presenters
• Bob German (Microsoft) | @Bob1German
• Aditya Challapally (Microsoft)

Supporting materials
• Training - Microsoft Teams App Camp On Demand | aka.ms/AppCamp
• Article - Account linking with Microsoft Teams single sign-on | aka.ms/account-linking-article
• Sample - External OAuth identity linking in Teams Apps. | aka.ms/account-linking-sample
• Event - Teams App Camp LIVE EVENT, October 20, 2022, 8-9am Pacific | aka.ms/TeamsAppCamp

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
11 minutes

teamsapp

authentication

admins

azure

id

users

microsoft

associated

supporting

enterprise

18 Oct 2022

In this 20-minute developer/designer focused demo, Ayça Baş starts at the beginning installing Visual Studio 2022 and Teams Toolkit, launching Visual Studio and creating a new command bot project. Follow the Quick Start configuration instructions installed with Toolkit and then add bot to your Teams chat. Type “helloWorld” to trigger initial response from your bot! Deep dive into the provisioned code and see places for potential modification. Use command bot with QnA Maker to deliver large Q&A solution quickly. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on October 18, 2022.

Demo Presenter
• Ayça Baş (Microsoft) | @aycabs

Supporting materials
• Documentation – Teams Toolkit Overview | https://learn.microsoft.com/microsoftteams/platform/toolkit/teams-toolkit-fundamentals?pivots=visual-studio
• Documentation – Install Teams Toolkit | https://learn.microsoft.com/microsoftteams/platform/toolkit/install-teams-toolkit?tabs=vscode&pivots=visual-studio
• Documentation – Create a new Teams project | https://learn.microsoft.com/microsoftteams/platform/toolkit/create-new-project?pivots=visual-studio
• Documentation - FAQ for Teams Toolkit | https://learn.microsoft.com/microsoftteams/platform/toolkit/faq
• Tool - Join the Microsoft 365 Developer Program today! | aka.ms/m365/devprogram

Related demos
• Demo - Build your first Command bot for Microsoft Teams with Teams Toolkit for Visual Studio Code – Garry Trinder (Microsoft) | @garrytrinder | https://youtu.be/9VcJNSOAOjU?t=1479

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
20 minutes

bots

bot

chat

toolkit

microsoft

debugging

users

apps

team

launched

11 Oct 2022

In this 26-minute developer/designer focused demo, Garry Trinder shows how command bots automate repetitive tasks through a conversational interface. Teams Toolkit expedites the creation of command bots, and TeamsFX provides a layer of abstraction that simplifies working with bot framework. Create a command bot using Teams Toolkit, look at what was scaffolded, see Adaptive Cards in UI and then go deep into the code to understand implementation. Add command bots to a team, chat or meeting. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on October 11, 2022.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrinder

Supporting materials
• Documentation - Teams Toolkit Overview | https://learn.microsoft.com/microsoftteams/platform/toolkit/teams-toolkit-fundamentals?pivots=visual-studio-code
• Documentation - Create a new Teams project | https://learn.microsoft.com/microsoftteams/platform/toolkit/create-new-project?pivots=visual-studio-code
• Documentation - TeamsFx SDK | https://learn.microsoft.com/microsoftteams/platform/toolkit/teamsfx-sdk
• Repo - Microsoft Teams Toolkit | https://github.com/OfficeDev/TeamsFx

Related demos
• Demo - Getting started with Teams Toolkit for Visual Studio – Garry Trinder (Microsoft) | @garrytrinder | https://youtu.be/qFxLUagga80?t=1310
• Demo - Build your first Notification bot for Microsoft Teams with Teams Toolkit for Visual Studio Code – Garry Trinder (Microsoft) | @garrytrinder | https://youtu.be/X3spdOS4jOk?t=1203

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

3 participants
26 minutes

bots

bot

toolkit

tasks

command

chat

execute

teamsfx

debug

launch

29 Sep 2022

In this 18-minute developer-focused demo, Markus Möller uses Teams stageView and real-time collaboration based on FluidFramework and Azure Fluid Relay service in this solution. Scenario: participants select a movie, audience favorite identified, group watches winning selection in stageView. Meeting owner Schedules a Teams meeting, adds the “Tab Meeting Vote Movie Fluid” app, and inserts up to 3 movie options in app. Meeting participants see movie options in right sidebar. Voting results are updated nearly instantaneously. Better synchronization to come with Teams Live Share.. This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on September 29, 2022.

Demo Presenter
• Markus Möller (Avanade) | @Moeller2_0

Supporting materials
• Article - Teams Meeting apps – A sample for in-Meeting experience and stageView (Vote Movies) | https://mmsharepoint.wordpress.com/2022/05/26/teams-meeting-apps-a-sample-for-in-meeting-experience-and-stageview-vote-movies/
• Article - Use FluidFramework in a Microsoft Teams app | https://mmsharepoint.wordpress.com/2022/06/25/use-fluidframework-in-a-microsoft-teams-app/
• Sample - Tab Meeting Vote Movie - Microsoft Teams App | https://github.com/pnp/teams-dev-samples/tree/main/samples/tab-meeting-stageview-vote-movie
• Sample - Tab Meeting StageView Vote Movie Fluid - Microsoft Teams App | https://github.com/pnp/teams-dev-samples/tree/main/samples/tab-meeting-stageview-vote-movie-fluid
• Documentation - Live Share SDK | https://learn.microsoft.com/microsoftteams/platform/apps-in-teams-meetings/teams-live-share-overview

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
18 minutes

demo

collaboration

chat

apps

remote

recording

syncing

users

movie

configure

29 Sep 2022

In this 12-minute developer-focused demo, Luise Freese and Lee Ford enable Teams owners to send positive affirmations to Teams users. Design goals: Secret-less (uses managed identity), server-less (Runs in Azure cloud shell, no package installed locally), and open source. Architecture – uses Azure Functions, a bot, assembles vibe from phrases stored in Cosmos DB, and sends as Adaptive Card into a Teams conversation. Two types of interactions (entry points) for bot to get vibes (listening to messages (@mention) or based on a schedule (durable function). This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on September 29, 2022.

Demo Presenters
• Lee Ford (Symity) | @lee_ford
• Luise Freese | @LuiseFreese

Supporting materials
• Repo - Good Vibes generator | https://github.com/working-on-it/good-vibes-generator
• Guidance - Deployment guide | https://github.com/working-on-it/good-vibes-generator/blob/main/docs/deploymentGuide.md
• Documentation - What are Durable Functions? | https://learn.microsoft.com/azure/azure-functions/durable/durable-functions-overview

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

3 participants
12 minutes

bots

microsoft

message

chat

users

greeting

demo

app

shortly

uk

27 Sep 2022

In this 15-minute developer focused demo – Ayça Baş shows viewers how to build a productivity dashboard app (Teams tab) using the Teams Toolkit, .NET and Microsoft Graph Toolkit (MGT) to design tab in Visual Studio 2022. MGT components – agenda, todo, and file-list are used to deliver calendar events, Microsoft To Do tasks and files on dashboard. Create default tab from template, run it and then customize it (update placeholder values for authentication, add components). Now run your completed dashboard! This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on September 27, 2022.

Demo Presenter
• Ayça Baş (Microsoft) | @aycabs

Supporting materials
• Demo - Getting started with Teams Toolkit for Visual Studio – Garry Trinder (Microsoft) | @garrytrinder
• Tools - Microsoft Graph Toolkit | https://github.com/microsoftgraph/microsoft-graph-toolkit
• Documentation - Get started with Microsoft Graph Toolkit | https://learn.microsoft.com/graph/toolkit/get-started/overview
• Dev Playground - Microsoft Graph Toolkit: UI Components and Authentication Providers for Microsoft Graph | mgt.dev
• Documentation - Publish Teams apps using Teams Toolkit | https://learn.microsoft.com/microsoftteams/platform/toolkit/publish
• Article (Tutorial) - Build a productivity dashboard with Microsoft Teams Toolkit for Visual Studio | https://devblogs.microsoft.com/microsoft365dev/build-a-productivity-dashboard-with-microsoft-teams-toolkit-for-visual-studio/
• Tools – Microsoft Teams Toolkit | https://github.com/OfficeDev/TeamsFx
• Learn - Teams Toolkit overview for Visual Studio | https://learn.microsoft.com/microsoftteams/platform/toolkit/teams-toolkit-overview-visual-studio
• Demo - Introduction to Microsoft Teams Toolkit – John Miller (Microsoft) | @jmillerdev

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
16 minutes

toolkit

dashboard

apps

bot

microsoft

tasks

designing

demos

chat

teams

27 Sep 2022

In this 17-minute developer/designer focused demo, John Miller delivers a comprehensive walk through of Microsoft’s end-to-end approach to Teams app development that’s embodied in the structure of the Microsoft Teams Toolkit. Overview on core elements of the Teams Toolkit (CLI, VS Code, Visual Studio, SDK). Deep dive into layout and features (samples, scenario-based outcome templates, sandbox, etc.) of the VS Code extension that jump starts a developer’s integrated Teams development journey. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on September 13, 2022.

Demo Presenter
• John Miller (Microsoft) | @jmillerdev

Supporting materials
• Marketplace – Microsoft Teams Toolkit for Visual Studio Code | https://marketplace.visualstudio.com/items?itemName=TeamsDevApp.ms-teams-vscode-extension
• Repo - Microsoft Teams Toolkit | https://github.com/officedev/teamsfx

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
18 minutes

toolkit

teams

app

overview

users

workflows

platform

provisioning

projects

introduce

20 Sep 2022

In this 30-minute developer focused demo, Garry Trinder guides viewers through creating, debugging and deploying Microsoft Teams apps built using Teams Toolkit for Visual Studio 2022, released GA in August 2022. Step through Toolkit installation and project creation process. Note the available project templates (notification and command bots, tab, and message extension). Presenter creates tab and bot projects. See configuration and components in code behind scenes. Tips to speed up development time throughout, and questions answered at end. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on September 20, 2022.

Demo Presenter
• Garry Trinder (Microsoft) | @garrytrinder

Supporting materials
• Demo - Introduction to Microsoft Teams Toolkit – John Miller (Microsoft) | @jmillerdev
• Learn - Teams Toolkit overview for Visual Studio | https://learn.microsoft.com/microsoftteams/platform/toolkit/teams-toolkit-overview-visual-studio
• Documentation - Microsoft Teams JavaScript client SDK | https://learn.microsoft.com/javascript/api/overview/msteams-client
• Repo - Teams/Fx | https://github.com/OfficeDev/TeamsFx

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
30 minutes

toolkit

tooling

sdk

helpers

deploying

apps

microsoft

launch

team

v2

23 Aug 2022

In this 13-minute developer focused demo, Eoin O’Brien points out how in a Microsoft Teams channel tab, one may create a conversation about an external event like an incident ticket including conversation’s context. Implementation - get Service URL from bot install activity, create a conversation using a Bot ConnectorClient, send conversationId to tab to be used in conversational tabs, and open conversation in Tab side panel. CodeTour walk through of presenter’s proof-of-concept sample. Supports Omnichannel queries, job application and incident ticket management conversations. This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on July 21, 2022.

Demo Presenter
• Eoin O'Brien (Microsoft)

Supporting materials
• Sample - Proactive Tab Conversations | https://github.com/OfficeDev/Microsoft-Teams-Samples/tree/main/samples/bot-tab-conversations/csharp
• Documentation - Create conversational tabs | https://docs.microsoft.com/microsoftteams/platform/tabs/how-to/conversational-tabs
• Documentation - Messages in bot conversations | https://docs.microsoft.com/microsoftteams/platform/bots/how-to/conversations/conversation-messages
• Documentation - ConversationsExtensions.CreateConversationAsync Method | https://docs.microsoft.com/dotnet/api/microsoft.bot.connector.conversationsextensions.createconversationasync

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

2 participants
13 minutes

conversational

conversation

conversations

chat

communication

bots

collaboration

tabs

context

workflow

28 Jul 2022

In this 13-minute demo, use Visual Studio 2022 and Web Technologies (Blazor) to create a Microsoft Teams tab and connect the tab to Microsoft Graph. Thomy Gölles steps through what is Blazor, the installation of Microsoft Teams Toolkit (Preview) for Visual Studio, and finally an F5 demo for viewers to appreciate what’s immediately available like authentication, end point app settings, user secrets management, Tab Razor page, and Graph Razor component and calls delivered after installing and using the Microsoft Teams App template. Tools used include Blazor – client-side and server-side, SignalR API for communications between client and server, and Microsoft Teams Toolkit.

Demo Presenter
• Thomy Gölles | @thomyg

Supporting materials
• Repo - Microsoft Teams Toolkit | https://github.com/OfficeDev/TeamsFx
• Documentation - Teams Toolkit for Visual Studio | https://docs.microsoft.com/microsoftteams/platform/toolkit/visual-studio-overview
• Tool – Blazor | https://Blazor.net
• Tool – Microsoft Teams Toolkit | https://github.com/OfficeDev/TeamsFx

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community blog - https://pnp.github.io/blog
• Microsoft 365 Platform Community - http://aka.ms/m365/community

1 participant
13 minutes

blazer

toolkit

blaze

blazerish

teamsfx

interface

debugging

apps

browser

creating

20 Jul 2022

In this 14-minute citizen developer-focused demo, Norn Young shares one way to save time finding information in Teams. Use Power Automate to identify customer channels across 100s of Teams, link an account record to a specific Teams channel, and see a dynamic “Open Teams” button on the model-driven app command bar. Account and Channel information is stored in Dataverse. The Model-driven app allows users to connect an Account to a Teams channel. Enjoy the rapid, yet comprehensive explanation of flow logic. This PnP Community demo is taken from the Microsoft Power Platform community call – July 2022, recorded on July 20, 2022.

Demo Presenter
• Norm Young (Microsoft MVP) | @stormin_30

Supporting materials
• Blog – Norm Young | https://normyoung.ca/

Stay connected
• Twitter https://twitter.com/microsoft365dev
• Call attention to your great work by using #PowerAppsCC and #PnPWeekly on Twitter.

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community Blog - https://aka.ms/m365pnp/blog
• Microsoft 365 Platform Community - https://aka.ms/m365/community

2 participants
14 minutes

workflow

leveraging

users

dataverse

connect

client

backend

app

powerautomate

teams

23 Jun 2022

Why build your own version of Microsoft Teams? In this 16-minute developer-focused demo, Sohil Bhalla addresses this question with a business case and architecture. For his solution, he uses a Microsoft Graph Toolkit provider, mgt-get components, back-end implementation (.NET 5), Microsoft Graph change subscription, SignalR implementation, client-side changes to get latest messages from Teams and responds to all Microsoft Graph calls (Proxy Provider). See demo of near instantaneous chat and notifications in the non-Teams app and Teams App side-by-side. This PnP community demo is taken from the Microsoft 365 & Power Platform Development community call recorded on June 23, 2022.

Demo Presenter
• Sohil Bhalla (Codeless Technology) | @SohilBhalla

Supporting materials
• Article - Build your own Microsoft Teams using Microsoft Graph Toolkit and .NET Core API and integrate using web components | https://pnp.github.io/blog/post/build-teams-using-graph-toolkit/

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community

3 participants
16 minutes

microsoft

teamshare

backend

implementation

toolkit

setup

customizable

users

app

communication

12 May 2022

In this 11-minute developer focused demo, bot expert Stephan Bisser initiates an SSO-based bot creation project using yo Teams, an Azure bot service instance, and an Azure AD App registration. Step-by-step starting in Azure, add a new OAuth setting (Configuration), select API permissions, and Expose an API. Build your bot using yo teams, update Teams app manifest, etc. This bot starts by authenticating user – token from Azure AD or Teams, then calls Graph for user related information. This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on May 12, 2022.

Demo Presenter
• Stephan Bisser (Solvion) | @stephanbisser

Supporting materials
• Tool - Microsoft Teams App Project Generator - #YoTeams | https://github.com/pnp/generator-teams
• Documentation - Single sign-on (SSO) with Microsoft Teams bots | https://docs.microsoft.com/learn/modules/msteams-sso/6-bots-sso
• Training - SSO Teams Bot - Microsoft Teams App | https://github.com/OfficeDev/TrainingContent/tree/master/Teams/80%20Using%20Single%20Sign-On%20with%20Microsoft%20Teams/Demos/02-learn-msteams-sso-bot
• Documentation - Single sign-on (SSO) support for bots | https://docs.microsoft.com/microsoftteams/platform/bots/how-to/authentication/auth-aad-sso-bots

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp

2 participants
11 minutes

bot

demo

sso

azure

authentication

api

app

configured

registration

host

5 May 2022

In this 15-minute developer-focused demo, Thomas Gölles shows off a sample tab for accessing a Teams site’s profile (a very useful developer resource) leveraging Graph and SPO API endpoints to get the information. Authentication by TeamsFx SSO and certificate for PnP Core. The app is built using TeamsFX .NET library, Blazor, Microsoft Graph and Visual Studio. From tab, select a Team, view the Team’s properties, installed apps, channels, team members, etc. No need to go to Postman or Graph Explorer for this information. This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on April 28, 2022.

Demo Presenter
• Thomas Gölles (Solvion) | @thomyg

Supporting materials
• Tools - Microsoft Teams Framework (TeamsFx) | https://github.com/OfficeDev/TeamsFx
• Tools - Blazor | https://dotnet.microsoft.com/apps/aspnet/web-apps/blazor
• Demo - TeamsFx .NET - Current Updates - April 2022 | https://youtu.be/5yULqXWIz2M?t=801 |– Thomy Gölles (Solvion) | @thomyg

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp

2 participants
15 minutes

teamsfx

demo

toolkit

backend

graphical

introduction

ui

project

launch

dotnet

3 May 2022

In this 12-minute developer focused demo – Erin Bailie shows viewers how to use the same development tooling to expose a Teams app in 3 host environments. Start by downloading the latest TeamsJS v2 SDK. Then open VS Code and run 2 commands to upgrade the Teams app package so the app will run in other hosts and to upgrade the SDK to point to TeamsJS v2.0. Done! Learn more about M365 cross stack tooling journey here and at Microsoft Build. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on May 3, 2022.

Demo Presenter
• Erin Bailie (Microsoft)

Supporting materials
• Tools - Teams Toolkit (Preview) | aka.ms/VSTeamsToolkit
• Documentation - Microsoft Teams JavaScript client SDK v2 Preview | aka.ms/TeamsJSSDK
• Demo - Extending Teams apps to Outlook and Office.com – Saurabh Bhatia (Microsoft) | @iamSBTron | https://youtu.be/JckgmonMbCM?t=1776
• Topic related sessions at Microsoft Build | May 24-26, 2022 | Register now http://register.build.microsoft.com

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp

2 participants
12 minutes

apps

app

applications

microsoft

admins

developers

sdk

outlook

365

evolving

2 May 2022

In this 13-minute demo, Thomy gives a comprehensive overview on Microsoft Teams Toolkit for Visual Studio including a comprehensive demo.

📽️ Presenter: Thomy Goelles (Solvion) | @thomyg

Resources:
✔️ https://github.com/OfficeDev/TeamsFx
✔️ https://aka.ms/m365pnp
✔️ https://pnp.github.io/blog

1 participant
13 minutes

blazer

toolkit

blaze

blazerish

teamsfx

interface

debugging

browser

engine

creating

26 Apr 2022

In this 12-minute developer focused demo – Saurabh Bhatia uses the Microsoft Teams Toolkit in VS Code to create, test, provision and deploy in a tenant and cloud, a “Hello World” Teams application (personal tab) that runs across Teams, Outlook and Office.com. The tool prompts developers though all steps including signing into (downloading, if necessary) Microsoft 365 and Azure test tenants. Q&A addresses platform integrations including SPFx alignment, Office js, and desktop app integration – the unification journey. More new capabilities to be announced at Microsoft Build. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on April 26, 2022.

Demo Presenter
• Saurabh Bhatia (Microsoft) | @iamSBTron

Supporting materials
• Toolkit - Microsoft Teams Toolkit for Visual Studio Code | aka.ms/VSCodeTeamsToolkit
• Documentation - Microsoft Teams JavaScript client SDK v2 Preview | https://docs.microsoft.com/microsoftteams/platform/m365-apps/using-teams-client-sdk-preview

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp

2 participants
12 minutes

apps

app

application

setups

office

demos

launch

plans

cap

imagine

20 Apr 2022

In this 7 minute developer-focused demo, Hugo shows how to take an old version of an SPFx solution and update it with CLI for Microsoft 365. He also provides guidance on when to do this and why. 💡

🚀 Presenter: Hugo Bernier (Microsoft) | @bernierh

Resources:
✔️ https://pnp.github.io/cli-microsoft365/
✔️ https://aka.ms/m365pnp
✔️ https://pnp.github.io/blog

1 participant
8 minutes

sharepoint

upgrade

downloading

version

spfx110

cloud

installation

microsoft

project

package

19 Apr 2022

In this 8-minute developer focused demo – Saurabh Bhatia delivers the first in a series of application extensibility demos. Microsoft is delivering on an Ignite commitment to enable developers to build a personal app once and expose it across hosts – Teams, Outlook, Office.com. In this session, modify a simple Teams app to run across hosts. Two changes - update manifestVersion to “m365DevPreview” and reference “v2.0.0.beta.2” teams-js in package json. Host specific code will be addressed in an upcoming demo. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on April 19, 2022.

Demo Presenter
• Saurabh Bhatia (Microsoft) | @iamSBTron

Supporting materials
• Sample - Getting Started with Todo List Sample
• Documentation - Teams Toolkit Overview
• Documentation - Extend Teams apps across Microsoft 365

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp

2 participants
8 minutes

tabs

apps

office

outlooking

hosts

users

personal

tasks

collaborate

chats

15 Apr 2022

In this 13-minute developer-focused demo, Mohamed Ashiq Faleel shares a slick solution for posting a message - an Adaptive Card with deep link or text message, to any Teams channel (except private channel) or Teams activity feed (priority message), regardless of if you are a member of the targeted channel! Uses Bot Framework REST API from a Power Automate Cloud Flow. The Power App is connected to 2 SharePoint lists storing Teams details and sent messages. Possible additional blog posts on solution in Mohamed’s blog. This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on March 17, 2022.

Demo Presenter: Mohamed Ashiq Faleel (MVP) | @AshiqFaleel

Supporting materials:
• Article - Send Teams channel message aka proactive message using custom Teams bot and Power Automate – Part 1 | https://ashiqf.com/2022/02/28/send-an-adaptive-card-message-in-teams-aka-proactive-message-using-custom-teams-bot-and-power-automate-part-1/
• Article - Send Teams channel message aka proactive message using custom Teams bot and Power Automate – Part 2 | https://ashiqf.com/2022/03/06/send-teams-channel-message-aka-proactive-message-using-custom-teams-bot-and-power-automate-part-2/
• Documentation - Send activity feed notifications to users in Microsoft Teams | https://docs.microsoft.com/graph/teams-send-activityfeednotifications
• Documentation – Authentication with the Bot Connector API | https://docs.microsoft.com/azure/bot-service/rest-api/bot-framework-rest-connector-authentication?view=azure-bot-service-4.0

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
13 minutes

communicate

app

powerapps

applications

communicator

messages

notification

connector

capability

microsoft

14 Apr 2022

In this 24-minute developer focused demo, Thomy Gölles delivers a run-down on the latest in Teams Fx (Microsoft Teams Framework) - a .NET library encapsulating common functionality and integration patters for developers building apps hosted in Microsoft Teams. Use .NET (server-side) and React (client-side) languages, CLI, built-in SSO, GraphClient Auth provider, Blazor templates, extended by Teams Toolkit in VS 2022 (preview). See scaffolding out a project (create personal tab) using Microsoft Teams App template in VS 2022, add Teams Toolkit, Razor Class Library. This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on April 14, 2022.

Demo Presenter
• Thomy Gölles (Solvion) | @thomyg

Supporting materials
• Repo - Microsoft Teams Framework (TeamsFx) | https://github.com/OfficeDev/TeamsFx
• Tool – Blazor - Build client web apps with C# | https://dotnet.microsoft.com/apps/aspnet/web-apps/blazor

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp

2 participants
25 minutes

teamsfx

teams

teamstrook

context

framework

fx

thinking

language

bot

net

12 Apr 2022

In this 17-minute developer focused demo – Waldek Mastykarz and Anoop Tatti share the latest fully documented and available sample highlighting an end-to-end Microsoft 365 solution. Includes 2 ACEs, Viva Connections Dashboard, a list, an SPFx web part - Teams personal app using Microsoft Graph and MGT for data. See the app in action – initiate wellbeing request in ACE Card View with Quick View, then see details, approve, or reject in Teams Personal App. Step through code and view supporting resources. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on April 12, 2022.

Demo Presenters
• Waldek Mastykarz (Microsoft) | @waldekm
• Anoop Tatti (Content+Cloud) | @anooptells

Supporting materials
• Sample - Wellbeing days requests and reminder - Adaptive Cards Extensions and Teams personal app | https://github.com/pnp/spfx-reference-scenarios/tree/main/samples/ace-wellbeing
• Demo - Getting started on building Microsoft Viva Connection adaptive card components using SPFx | https://www.youtube.com/watch?v=KQGsY5fvLaY&AB_channel=Microsoft365Community
• Ignite session - Get started with Microsoft Viva Connections Extensibility | https://aka.ms/CONLL112

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp

3 participants
18 minutes

applications

demo

microsoft

users

adaptive

connections

insights

viva

sharepoint

idea

12 Apr 2022

In this 21-minute developer focused demo – Microsoft presenters SaiBhavya Reddy and Eoin O'Brien educate viewers on Stage View, side panel, in-meeting apps, and the new programmatic sharing of content to stage capability in this document signing POC demo. Workflow - create a document, create a meeting (authorized viewers, signers invited), add your app to meeting (tab), use shared capability to share document during meeting. Sign offs are reflected in UI as occur. See code and get sample today. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on April 12, 2022.

Demo Presenters
• SaiBhavya Reddy (Microsoft)
• Eoin O'Brien (Microsoft)

Supporting materials
• Documentation - Share app content to stage API | https://docs.microsoft.com/en-us/microsoftteams/platform/apps-in-teams-meetings/api-references?tabs=dotnet#share-app-content-to-stage-api
• Documentation - Share entire app to stage | https://docs.microsoft.com/microsoftteams/platform/apps-in-teams-meetings/enable-and-configure-your-app-for-teams-meetings#share-entire-app-to-stage
• Documentation - Share specific parts of the app to stage | https://docs.microsoft.com/microsoftteams/platform/apps-in-teams-meetings/enable-and-configure-your-app-for-teams-meetings#share-specific-parts-of-the-app-to-stage
• Documentation – People Picker in Adaptive Cards | https://docs.microsoft.com/microsoftteams/platform/task-modules-and-cards/cards/people-picker
• Step-by-Step - Share meeting stage in Teams | https://docs.microsoft.com/microsoftteams/platform/sbs-meetings-stage-view
• Sample - In-Meeting Document Signing | https://github.com/OfficeDev/Microsoft-Teams-Samples/tree/main/samples/meetings-share-to-stage-signing/csharp

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp

3 participants
21 minutes

sharing

presentation

communicating

chat

sharepoint

interactive

brainstorming

users

mockup

stage

6 Apr 2022

In this 5 minute demo, Bob walks through how to install and approve three different kind of apps - Microsoft apps, 3rd party apps and custom apps via the Teams Admin Center. He shows permission and setup policies to effectively manage apps in the tenant and even customize the app store.

Presenter: Bob German (Microsoft) | @Bob1German

Resources:
https://docs.microsoft.com/en-us/microsoftteams/create-a-team-template
https://aka.ms/m365pnp
https://pnp.github.io/blog

1 participant
5 minutes

apps

app

application

admin

administrator

manage

microsoft

setup

workflow

users

22 Mar 2022

In this 17-minute developer focused demo – Anuj Gupta steps through how a user is able to share link to an asset in Teams, the link calls app and gets “unfurled” into an Adaptive Card with actions. User sends card via Bot to Recipient. Recipient may click “Review in Meeting” button (action) invoking a task module that creates a meeting for User and Recipient to collaborate. Web App creates side panel tab, task module, authenticates user, calls Graph APIs and deep links. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on March 22, 2022.

Demo Presenter: Anuj Gupta (Microsoft)

Supporting materials:
• Samples Repo – Link unfurling meeting sample | https://github.com/OfficeDev/Microsoft-Teams-Samples/tree/main/samples/msgext-link-unfurling-meeting/csharp
• Documentation - Bots in Microsoft Teams | https://docs.microsoft.com/microsoftteams/platform/bots/what-are-bots
• Tools – Bot Framework SDK | https://github.com/microsoft/botframework-sdk
• Documentation - Link unfurling | https://docs.microsoft.com/microsoftteams/platform/messaging-extensions/how-to/link-unfurling
• Documentation - Designing Adaptive Cards for your Microsoft Teams app | https://docs.microsoft.com/microsoftteams/platform/task-modules-and-cards/cards/design-effective-cards
• Documentation - Apps for Teams meetings | https://docs.microsoft.com/microsoftteams/platform/apps-in-teams-meetings/teams-apps-in-meetings
• Documentation - Designing task modules for your Microsoft Teams app | https://docs.microsoft.com/microsoftteams/platform/task-modules-and-cards/task-modules/design-teams-task-modules
• Documentation - Create deep links | https://docs.microsoft.com/microsoftteams/platform/concepts/build-and-test/deep-links

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp/videos

1 participant
17 minutes

workflow

demo

dashboard

users

implementation

preview

interacts

session

app

scenario

17 Mar 2022

In this 11-minute developer focused demo, Tom Resing and Mark Allen show off a Microsoft Teams app sample that allows users to migrate Gmail inbound email filters as Outlook new message rules. Two migration options – fetch filters directly from Gmail or Upload a Gmail filter export (XML). Uses Fluent UI controls, Teams Toolkit, Graph authentication and client side React scripting. Verify migration configuration in Outlook Rules. Presenters step through code for both migration options. Works reliably on Teams web client, needs adjustments for Desktop client. This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on March 17, 2022.

Demo Presenters
• Tom Resing (Microsoft) | @resing
• Mark Allan (MVP) | @MarkXA

Supporting materials:
• Move Your Filters app - https://github.com/pnp/teams-dev-samples/tree/main/samples/tab-move-your-filters

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

4 participants
11 minutes

gmail

emails

email

inbox

outlook

filters

microsoft

tweeted

hack

8 Mar 2022

In this 16-minute developer focused demo – Wajeed Shaikh details how presence change notifications are delivered to users courtesy of Bot + Graph. The Microsoft Graph REST API uses a webhook mechanism to deliver change notifications to user. The bot subscribes to presence change notification and notifies when user status is changed. Clearly defined execution steps shown along with targeted code walkthrough for configuring and running this sample locally. Uses Bot Framework SDK v4, Graph APIs, and subscription service. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on March 8, 2022.

Demo Presenter: Wajeed Shaikh (Microsoft) | @Wajeed_Shaikh

Supporting materials:
• Repo - Microsoft Teams Samples | aka.ms/TeamsSamples
• Sample – Graph change notification | https://github.com/OfficeDev/Microsoft-Teams-Samples/tree/main/samples/graph-change-notification
• Documentation - Support and feedback | aka.ms/TeamsPlatformFeedback
• Documentation – Send proactive messages | https://docs.microsoft.com/microsoftteams/platform/bots/how-to/conversations/send-proactive-messages?tabs=dotnet
• Documentation - Set up notifications for changes in user data | https://docs.microsoft.com/graph/webhooks
• Learn - Use Change Notifications and Track Changes with Microsoft Graph | https://docs.microsoft.com/learn/modules/msgraph-changenotifications-trackchanges/

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp/videos

1 participant
14 minutes

bot

notification

demo

graph

setup

chat

webhook

manifest

logged

azure

3 Feb 2022

In this 10-minute developer focused demo, Lee Ford delivers a simple (request/response capability) Teams bot that gets weather information using an outgoing webhook. A user @ mentions the webhook (@weather) and a location (London) triggering an Azure function, that calls the OpenWeatherMap API for local weather information. An Adaptive Card is returned to the user with weather conditions. Technically, any member of a Team can create this simple webhook solution that side-steps the need to create and register of a full-fledged bot in Azure. This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on February 3, 2022.

Demo Presenter: Lee Ford (Symity Ltd) | @lee_ford

Supporting materials:
• Article - Make a bot for simple interactions in Teams using a Webhook | https://techcommunity.microsoft.com/t5/microsoft-365-pnp-blog/make-a-bot-for-simple-interactions-in-teams-using-a-webhook/ba-p/3064378
• Sample - teams-webhook-weatherbot-sample | https://github.com/leeford/teams-webhook-weatherbot-sample

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
10 minutes

webhook

hooks

bots

simple

context

setup

team

message

spot

azure

3 Feb 2022

In this 12-minute developer focused demo, Albert-Jan Schot wanted a way to quiz himself on the details of what he read 3 months ago. Happen to keep a list of what you read in SharePoint? Want to create a no code solution to quiz yourself on past reads using Power Automate that pulls details transformed into questions from your list, shuffles the array of questions (for quiz experience), and renders them on an Adaptive Card that also evaluates your response? This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on February 3, 2022.

Demo Presenter: Albert-Jan Schot (BLIS.digital) | @appieschot

Supporting materials:
• Article - Shuffle an array with Power Automate | https://www.cloudappie.nl/shuffle-array-power-automate/

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp/videos

2 participants
12 minutes

reading

reminders

readable

goodreads

synced

book

app

adaptive

thinking

demo

28 Jan 2022

In this 8-minute developer focused demo, James Skay shows that in addition to purchasing a Teams app in AppSource, users now see a subscription “button” when accessing an app in the Teams App Store as well as in the Microsoft Teams Admin Center. The button is accessing your published app in AppSource along with the platform’s transaction capabilities. Learn about the 5-step publishing process, licensing options, purchasing options, and financial incentives for developers to create and publish Teams apps in AppSource. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on January 4, 2022.

Demo Presenter: James Skay (Microsoft) | @JamesSkay

Supporting document:
• Documentation - Include a SaaS offer with your Microsoft Teams app | aka.ms/teamsmonetization/getstarted

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp/videos

1 participant
8 minutes

apps

app

monetize

appsource

microsoft

subscriptions

transactable

users

teams

commercial

20 Jan 2022

In this 12-minute developer focused demo, Stephan Bisser addresses what is yo teams (a Microsoft Teams app generator) and how to use it to build a bot. After installing Yeoman generator and Gulp CLI task manager, install npm i -g generator-teams. Create a project. In VS Code step through files generated by yo teams. Use gulp build, gulp manifest and gulp serve. Upload created bot to Teams site and appreciate its out-of-box capabilities. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on January 20, 2022.

Demo Presenter: Stephan Bisser (Solvion) | @stephanbisser

Supporting materials:
• Repo - Microsoft Teams App Project Generator - #YoTeams | aka.ms/yoteams
• Documentation - Yo Teams - the Microsoft Teams app generator | https://pnp.github.io/generator-teams/
• Documentation - Single sign-on (SSO) support for bots | https://docs.microsoft.com/en-us/microsoftteams/platform/bots/how-to/authentication/auth-aad-sso-bots

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
12 minutes

application

teams

demo

microsoft

introduce

project

manage

version

npm

chat

11 Jan 2022

In this 16-minute developer focused demo – Wajeed Shaikh instructs this sample “Bot daily task reminder" is about sending a proactive chat message/request to app users. Users are able to schedule a recurring task and get a reminder at scheduled times via Adaptive Cards. Comprehensive walk-through from cloning sample repo, to creating and registering an Azure bot, to updating endpoints, creating App manifest file and sideloading into your dev tenant. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on January 11, 2022.

Demo Presenter: Wajeed Shaikh (Microsoft)

Supporting materials:
• Microsoft Teams Samples - #15 Bot daily task reminder | http://github.com/officedev/microsoft-teams-samples
• Documentation – Send Proactive Messages | https://docs.microsoft.com/microsoftteams/platform/sbs-send-proactive
• Documentation – Proactive Messages | https://docs.microsoft.com/microsoftteams/platform/bots/how-to/conversations/send-proactive-messages?tabs=dotnet
• Feedback – Teams Feedback | aka.ms/TeamsPlatformFeedback

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp/videos

2 participants
16 minutes

demo

tasks

app

scheduler

reminders

bot

execute

launch

troubleshooting

sending

11 Jan 2022

In this 14-minute developer focused demo, Mike Hollinshead and Derek Cash-Peterson deliver an overview of Learning Pathways, integration with Viva Learning, platform updates, making Microsoft training materials available in your tenant, configuring to expose certain content to your organization, and adding your customer’s training materials to a custom playlist. All content flowing into Learning Pathways is also flowing into Viva Learning. Translation - if you’ve invested in Learning Pathways, that content is being integrated into Viva Learning. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on December 9, 2021.

Demo Presenters:
• Mike Hollinshead (Microsoft) | @mahollinshead
• Derek Cash-Peterson (Sympraxis Consulting) | @spdcp

Supporting materials:
• Documentation - Microsoft 365 Learning Pathways Content Updates (December update) | https://docs.microsoft.com/office365/customlearning/custom_contentupdates#december-2021-content-updates
• Documentation - Microsoft 365 learning pathways | https://docs.microsoft.com/office365/customlearning/
• Look book – SharePoint look book | https://lookbook.microsoft.com/
• Repo – Microsoft 365 learning pathways | https://github.com/pnp/custom-learning-office-365

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
14 minutes

pathways

learning

users

going

viva

pmp

asks

enhance

respect

sharepoint

8 Dec 2021

In this 35-minute all audiences-focused demo, Luise Freese and Carmen Ysewijn – share their creation - The Canvas app that looks like a Microsoft Teams Native app that deliberately prompts a team owner through the entire Teams provisioning process. With support from Power Apps, Azure Logic Apps, Managed Identity, Dataverse (full), Graph, Deployment tools and Documentation Genie delivers a reliable, secure, informative, easy to deploy and truly enterprise ready solution. The presenters’ step through the configuration of a Team that’s provisioned by Logic Apps. This PnP Community demo is taken from the Microsoft Power Apps community call – November 2021, recorded on November 17, 2021.

Demo Presenters:
• Luise Freese | @LuiseFreese
• Carmen Ysewijn (Qubix) | @CarmenYsewijn

Supporting documents:
• Blog - ProvisionGenie - an open-source provisioning engine for Microsoft Teams | https://techcommunity.microsoft.com/t5/microsoft-365-pnp-blog/provisiongenie-an-open-source-provisioning-engine-for-microsoft/ba-p/2796434
• Documentation - ProvisionGenie | https://provisiongenie.com/
• Repo – ProvisionGenie | https://github.com/ProvisionGenie/ProvisionGenie

Stay connected:
• Twitter https://twitter.com/microsoft365dev
• YouTube https://aka.ms/m365pnp/videos
• Blogs https://aka.ms/m365pnp/community/blog
• Call attention to your great work by using #PowerAppsCC and #PnPWeekly on Twitter.

3 participants
35 minutes

provisioning

provision

provisioned

provisiong

users

suggestions

teamification

app

sharing

genie

16 Nov 2021

In this 19-minute developer focused demo, Loki Meyburg delivers a brilliant overview on a unified developer experience - power everything in Teams with a Bot back-end and an Adaptive Cards front-end with chat bots, messaging extensions, task modules and tabs! Step through setting up a Bot in Azure, building a tab with Adaptive Cards, adding a new card - creating card in Designer and copying JSON into VS Code, and finally rendering new card in Tab. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on November 16, 2021.

Demo Presenter: Loki Meyburg (Microsoft) | @LokiMeyburg

Supporting materials:
• Documentation - Build tabs with Adaptive Cards | https://docs.microsoft.com/microsoftteams/platform/tabs/how-to/build-adaptive-card-tabs
• Designer - adaptivecards.io/designer | https://adaptivecards.io/designer

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp/videos

3 participants
19 minutes

adaptive

apps

applications

cards

interactive

tabs

accessibility

workflow

scroll

drawbacks

11 Nov 2021

In this 13-minute citizen developer focused demo, Luise Freese & Carmen Ysewijn show how ProvisionGenie blends learning with the provisioning process. The app elegantly and non-technically prompts user through Group, Site and Channel configuration. Team owner adds members and owners, libraries, columns and lists. Uses Logic Apps behind scenes to provision resources. Integrates Power Apps for UI, Azure Logic Apps (flows - actions), Managed Identity (authentication), Dataverse (data storage), Deployment (script and ARM template files) and has great documentation. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on November 11, 2021.

Demo Presenters:
• Luise Freese | @LuiseFreese
• Carmen Ysewijn (Qubix) | @CarmenYsewijn

Supporting materials:
• Documentation - ProvisionGenie | https://provisiongenie.com/
• Repo – ProvisionGenie | https://github.com/ProvisionGenie/ProvisionGenie

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
13 minutes

provisioning

provision

offers

manage

adding

collaboration

having

consultant

juni

highness

4 Nov 2021

In this 12-minute developer-focused demo, Rabia Williams introduces viewers to a bot that operates across Microsoft Teams and Outlook thanks to Universal actions. She showcases 3 Adaptive Card features - Sequential workflow (concurrently awaits/tracks action from initiator and each participant), Up-to-date cards (real-time refresh across all users’ cards) and Contextual views (Reader’s view changes based on role). Sample created with node JS/Type script and Yeoman Generator for Bot v4. Step through well commented code. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on October 14, 2021.

Demo Presenter: Rabia Williams (Microsoft) | @williamsrabia

Supporting materials:
• Article - Universal Actions for Adaptive Cards in a NodeJs project | https://rabiawilliams.com/teams/uam-bot/
• Sample - Card Bot - Bot showcasing the Adaptive Card Universal Action Model in Node/TypeScript | https://github.com/pnp/teams-dev-samples/tree/main/samples/bot-uam-cardbot
• Documentation - Universal Actions for Adaptive Cards | https://docs.microsoft.com/microsoftteams/platform/task-modules-and-cards/cards/universal-actions-for-adaptive-cards/overview?WT.mc_id=m365-42737-rwilliams&tabs=mobile
• Documentation - Bots and SDKs | https://docs.microsoft.com/microsoftteams/platform/bots/bot-features#bots-with-the-microsoft-bot-framework?WT.mc_id=m365-42737-rwilliams&tabs=mobile
• Samples - BotBuilder-Samples | https://github.com/Microsoft/BotBuilder-Samples/tree/main/samples/javascript_nodejs
• Demo - TCS’ Incident Management Teams app integrates Universal Actions for Adaptive Cards | https://www.youtube.com/watch?v=FaBGvnAzAS4

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
12 minutes

adaptive

capabilities

cardbots

demo

users

features

workflow

pnp

actions

game

4 Nov 2021

How do I say that person’s name? In this 14-minute developer-focused demo, Markus Möller delivers a virtual assistant – the means to capture and subsequently hear upon demand, the pronunciation of a meeting participant’s name. Start by creating a meeting and install Teams app into the meeting. See experience in UI from scheduler and participant perspectives. Understand usage prerequisites, pre-meeting and in-meeting experiences, and step through core code - Teams manifest, handling device types, meeting status, custom audio control. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on October 14, 2021.

Demo Presenter: Markus Möller (Avanade) | @ Moeller2_0

Supporting materials:
• Article - Meeting apps in Microsoft Teams (1) – Pre-meeting | https://mmsharepoint.wordpress.com/2021/09/07/meeting-apps-in-microsoft-teams-1-pre-meeting/
• Sample - tab meeting record name - Microsoft Teams App | https://github.com/pnp/teams-dev-samples/tree/main/samples/tab-meeting-record-name
• Documentation - Apps for Teams meetings | https://docs.microsoft.com/microsoftteams/platform/apps-in-teams-meetings/teams-apps-in-meetings

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
14 minutes

chat

demo

recording

users

app

microsoft

presenting

pre

important

28 Oct 2021

In this 12-minute demo, Albert-Jan Schot shows how with existing cmdlets in CLI, query criteria and a business objective (to identify champions), Tenant Admins can modify general site wide reporting (i.e., chat, file activity) to precisely identify the top active Microsoft Teams contributors or SharePoint users within a timeframe. For chat ranking in a channel - count messages, replies, likes and comments by contributor. Via Webhook, send Adaptive Card to top three performers in time period. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on October 28, 2021.

Demo Presenter: Albert-Jan Schot (BLIS.digital) | @appieschot

Supporting materials:
• Tool - CLI for Microsoft 365 | https://aka.ms/cli-m365
• Repo - CLI for Microsoft 365 | https://github.com/pnp/cli-microsoft365
• Article - Recognize active team members with the CLI for Microsoft 365 | https://www.cloudappie.nl/recognize-active-team-members-cli-microsoft-365/
• Article - Recognize contributions using the CLI for Microsoft 365 | https://www.cloudappie.nl/recognize-contributions-clim365/
• Article - How to send Adaptive Cards with CLI Microsoft 365 | https://techcommunity.microsoft.com/t5/microsoft-365-pnp-blog/how-to-send-adaptive-cards-with-cli-microsoft-365/ba-p/2143466
• Tool – Adaptive Cards IO Designer | https://www.adaptivecards.io/designer/

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
12 minutes

sharepoint

users

managed

demos

dashboard

activity

session

microsoft

cli

docker

12 Oct 2021

In this 13-minute developer focused demo, Vesa Juvonen shows viewers the Teams Toolkit v2.7 for VS Code, in preview, has native support for debugging SharePoint Framework solutions directly inside the Microsoft Teams workbench! In this walk through, Vesa uses Toolkit v2.7 to quickly create a Teams app hosted in Azure, sets a breakpoint, runs npm install and gets a debug error. Great, working as expected! Among other things, demo exemplifies new generation of multi-product toolkits. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on October 12, 2021.

Demo Presenter: Vesa Juvonen (Microsoft) | @vesajuvonen

Supporting materials:
• Tools - Teams Toolkit (Preview) | https://marketplace.visualstudio.com/items?itemName=TeamsDevApp.ms-teams-vscode-extension
• Documentation - Build apps with the Teams Toolkit and Visual Studio Code | https://docs.microsoft.com/microsoftteams/platform/toolkit/visual-studio-code-overview

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp/videos

1 participant
13 minutes

microsoft

sharepoint

toolkit

debugging

demo

dashboard

hosting

v2

package

designing

7 Oct 2021

In this 12-minute developer-focused demo, Paolo Pialorsi delivers an inspirational demo/sample (react-teams-lead-dashboard) showing how to create a dashboard using tools, libraries and techniques for developing “modern” Microsoft 365 solutions. Uses Teams Personal app (configurable on per user basis and with multiple tabs), SharePoint client-side web part, UI fully integrated with Microsoft Teams and automated provisioning of fields, lists through Microsoft Graph. Render dashboard in Teams or SharePoint Online. This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) – Bi-weekly sync call recorded on October 7, 2021.

Demo Presenter: Paolo Pialorsi (PiaSys) | @PaoloPia

Supporting materials:
• Sample - Lead Assist Dashboard | https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-teams-lead-dashboard
• Documentation - Build for Microsoft Teams using SharePoint Framework | https://docs.microsoft.com/sharepoint/dev/spfx/build-for-teams-overview
• Documentation - Use Microsoft Graph in your solution | https://docs.microsoft.com/sharepoint/dev/spfx/web-parts/get-started/using-microsoft-graph-apis
• Documentation - Microsoft Graph Toolkit: UI Components and Authentication Providers for Microsoft Graph | https://docs.microsoft.com/graph/toolkit/overview
• Tools - Reusable React controls for your SharePoint Framework solutions | https://pnp.github.io/sp-dev-fx-controls-react/
• Article - The easiest way to store user settings of your Microsoft 365 app | https://blog.mastykarz.nl/easiest-store-user-settings-microsoft-365-app/

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp/videos

2 participants
12 minutes

micro365

sharepoint

toolkit

demo

micrograph

tasking

sample

provisioning

dashboard

package

30 Sep 2021

In this 10-minute developer-focused demo, Lee Ford delivers an application sample that allows Microsoft Teams to interact with external users via Web Chat. Uses Bot Framework, Azure Cosmos DB to store conversations, adaptive cards and activity handlers for conversation. Architecture and code reviewed. External user submits request in Web Chat form. Communications about request limited to internal Teams channel except when Bot is @ mentioned. Easily add new channel, web chat bot to app. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on September 30, 2021.

Demo Presenter: Lee Ford (Symity) | @lee_ford

Supporting materials:
• Sample - Teams WebChat Sample | https://github.com/leeford/teams-webchat-sample

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
10 minutes

chat

chats

webchat

bot

web

app

microsoft

client

relaying

effectively

30 Sep 2021

In this 13-minute developer-focused demo, Thomas Gölles – uses a Gamefication approach for displaying activity from a Microsoft Teams channel. This sample uses TeamsFx for scaffolding a Teams Blazor project, calls Microsoft Graph to retrieve messages and reactions and a simple UI to visualize the Leaderboard. Populate dropdowns with Team and Channel IDs. App counts and returns score data for evaluated activities (messages initiated, reactions, responses) for user selected activity in targeted Teams Channel. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on September 30, 2021.

Demo Presenter: Thomas Gölles (Solvion) | @thomyg

Supporting materials:
• Documentation - Prerequisites: Get started with Microsoft Teams app development | https://docs.microsoft.com/en-us/microsoftteams/platform/get-started/prerequisites?tabs=vs
• Issues – OfficeDev/TeamsFx | https://github.com/OfficeDev/TeamsFx/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc
• Video demo - Getting stated with Microsoft Teams Toolkit and Blazor | https://www.youtube.com/watch?v=WPnZgcjr6PI
• Article - Recognize active team members with the CLI for Microsoft 365 | https://www.cloudappie.nl/recognize-active-team-members-cli-microsoft-365/
• Repo - TeamsLeaderboard | https://github.com/thomyg/TeamsLeaderboard
• Video - Getting started with Blazor for Teams Development - E32 | https://www.youtube.com/watch?v=nqCZLTm_ues

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
13 minutes

teamsfx

team

toolkit

blazer

leaderboard

demo

helper

app

project

thinking

16 Sep 2021

In this 14-minute developer-focused demo, Stephan Bisser creates a new bot in Composer (use Core Bot with Language template), sets up Language Understanding in Azure, installs the Teams package into the new project (in Composer), adds triggers to operate in Teams and to receive and respond to orders. Conduct your Pizza business via an Adaptive Card and task modules. Build task modules using Bot Framework Composer without writing (almost) any code! This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on September 16, 2021.

Demo Presenter: Stephan Bisser (Solvion) | @stephanbisser

Supporting materials:
• Documentation - Bot Framework Composer documentation | https://aka.ms/bfcomposer
• Article - Bot Framework Composer Series - 3 - Teams Task Modules | https://bisser.io/bot-framework-composer-series-3-teams-task-modles/
• Repo - microsoft/BotFramework-Composer | https://github.com/microsoft/BotFramework-Composer

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
14 minutes

bot

bots

demo

tutorial

project

package

app

ontask

composer

nodejs

12 Aug 2021

In this 13-minute developer-focused demo, Sathya Raveendran shows the seamless interoperation between Azure Communication Services (ACS) and Microsoft Teams that enables a business user with a Teams license to have a video call/chat with a citizen consumer who doesn’t have a Teams license. The B2C solution uses a Bot for agent routing, adaptive cards for communications, and ACS for a web-based video call from desktop or mobile. Access the sample in the PnP samples repository. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on July 22, 2021.

Demo Presenter: Sathya Raveendran (Microsoft)

Supporting materials:
• Sample - Azure Communication Services – Teams InterOp with Call Routing | https://github.com/pnp/teams-dev-samples/tree/main/samples/app-acs-calling

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
13 minutes

app

applications

interoperability

demo

interface

sdk

communication

users

services

acs

5 Aug 2021

In this 10-minute developer-focused demo, April Dunnam shows a new capability for collaborating in a Power App within a Microsoft Teams meeting using Main Stage (Developer Preview) – that allows app content from meeting side panel to take full screen. Requires minor modification to manifest file – create option to add app to side panel. Upload custom app to Teams, create new meeting, add app to meeting sidebar, broadcast app to Main Stage. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on August 5, 2021.

Demo Presenter: April Dunnam (Microsoft) | @aprildunnam

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
11 minutes

powerapps

app

powerpoint

chat

demo

collaborate

preview

presentation

tabs

teams

22 Jul 2021

In this 10-minute developer-focused demo, Markus Möller calls on an action-based messaging extension created with the Teams Yeoman Generator to post a simple adaptive card to a Microsoft Team's news channel. Post 'as a bot' and with an action to update the same adaptive card again and again, as opposed to a 1-time execution. Use workflow to cap number of permissible card updates, if necessary. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on July 22, 2021.

Demo Presenter - Markus Möller (Avanade) | @Moeller2_0

Supporting materials:
• Blog - How to update an AdaptiveCard with a Teams Messaging Extension | https://mmsharepoint.wordpress.com/2021/05/05/how-to-update-an-adaptivecard-with-a-teams-messaging-extension/
• Sample - Action Preview - Microsoft Teams App | https://github.com/pnp/teams-dev-samples/tree/main/samples/msgext-action-preview

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
10 minutes

messaging

message

card

send

demo

preview

adaptive

presenting

workflow

introduction

21 Jul 2021

In this 8-minute business user focused demo, Emily Mancini delivers an overview of a COVID-19 Attestation solution that can help your organization manage the status and contact tracing of your employees through an easy to use Check-In form and front desk dashboard. The video starts with an overview of the challenges this solution addresses and then gives a step by step review of all the features.

Demo Presenter: Emily Mancini (Sympraxis Consulting) | @EEMancini

Supporting documents:
• Solution - SharePoint Framework Reference Samples | https://github.com/pnp/spfx-reference-scenarios

Stay connected:
• Twitter - https://twitter.com/microsoft365dev
• YouTube - https://aka.ms/M365DevYouTube
• Microsoft 365 Developer Blog - https://aka.ms/M365DevBlog
• Microsoft 365 PnP Blog - https://aka.ms/m365pnp/community/blog

1 participant
8 minutes

stressful

attestation

colleagues

responsibilities

support

office

personal

home

covid19

returning

21 Jul 2021

In this 10-minute business user focused demo, Emily Mancini delivers an overview of a World Clock solution that can help you and your teams manage scheduling meetings across time zones. The video starts with an overview of the challenges this solution addresses and then gives a step-by-step review of all the features.

Demo Presenter: Emily Mancini (Sympraxis Consulting) | @EEMancini

Supporting documents:
• Solution - SharePoint Framework Reference Samples | https://github.com/pnp/spfx-reference-scenarios

Stay connected:
• Twitter - https://twitter.com/microsoft365dev
• YouTube - https://aka.ms/M365DevYouTube
• Microsoft 365 Developer Blog - https://aka.ms/M365DevBlog
• Microsoft 365 PnP Blog - https://aka.ms/m365pnp/community/blog

1 participant
10 minutes

clock

scheduling

workflow

workplace

coworkers

world

communicate

distractions

app

collaborative

15 Jul 2021

Through this 26-minute developer-focused demo, Julie Turner and Derek Cash-Peterson walks viewers through a personal app that collects information from users and provides a custom dashboard for working with the results. Dashboard has a Viva Connection COVID-19 attestation card built with Adaptive Card Extensions (ACE) and SPFx v1.13. From Card View, users answer attestation questions in Quick View. A cool capability - questions on Quick View card can be updated by Admin without having to modify Quick View template! This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) – Bi-weekly sync call recorded on July 15, 2021.

Demo Presenters:
• Julie Turner (Sympraxis Consulting) | @jfj1997
• Derek Cash-Peterson (Sympraxis Consulting) | @spdcp

Supporting content:
• Sample - SharePoint Framework Reference Samples | https://github.com/pnp/spfx-reference-scenarios

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

3 participants
26 minutes

administer

offices

application

risk

exposing

consulting

attestations

home

contact

fever

9 Jul 2021

In this 17-minute all audiences-focused demo, Florian Grasel - a first timer documents the journey - a 7-step process of going from idea to app in AppSource. Solid tips beyond the process that every product team should consider ranging from extension opportunities and testing to devices and post publishing maintenance. Prepare to fail gracefully and learn openly as the journey includes working closely with a Microsoft submissions team that’s completely interested in your success. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on June 24, 2021.

Demo Presenter - Florian Grasel (Smarter Business Solutions GmbH) | @trailbeard

Supporting materials:
• Documentation - Publish your app to the Microsoft Teams store | https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/deploy-and-publish/appsource/publish
• Documentation - Commercial marketplace certification policies | https://docs.microsoft.com/en-us/legal/marketplace/certification-policies
• App – TagTeam | https://appsource.microsoft.com/en-us/product/office/WA200002829

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
17 minutes

app

idea

functionality

insights

started

bot

adaptive

platform

share

microsoft

1 Jul 2021

In this 17-minute developer-focused demo, Aarthi Kumar shows the time tracking component (Time Clock APIs) in the Teams Shifts Application that provides clock in / out, timesheet edit and more capabilities and that also auto-syncs to Payroll / T&A apps like Cronos, Workday, ADP, Ceridian SAP. Call the APIs to integrate with your customer’s payroll and T&A systems using Time Clock APIs (beta). Supports CRUD operations and WebHooks. Request handling guidance in the documentation. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on June 10, 2021.

Demo Presenter: Aarthi Kumar (Microsoft)

Supporting materials:
• Documentation - shift resource type | https://docs.microsoft.com/en-us/graph/api/resources/shift?view=graph-rest-1.0
• Documentation - timecard resource type | https://docs.microsoft.com/en-us/graph/api/resources/timecard?view=graph-rest-beta
• Documentation – Webhook to Shifts changes | https://docs.microsoft.com/en-us/graph/api/resources/workforceintegration?view=graph-rest-1.0

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
17 minutes

workflows

shifts

scheduling

timesheets

clocked

workday

api

workforce

payroll

automated

17 Jun 2021

During this 21-minute developer-focused demo, Julie Turner and Derek Cash-Peterson deliver a Team Time Clock app as a Teams app, Personal app and as a Viva Dashboard Card (SPFx web part + Adaptive Card extension) based on a solution originally created by Bob German (Microsoft) @bob1german. On Card, see high level information (people and time) and deep link into Teams to schedule meeting experience. Based on when people prefer to meet (green times), select time by aligning green fields in time slot. Full code walkthrough, many features. This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) – Bi-weekly sync call recorded on June 17, 2021.

Demo Presenters:
• Julie Turner (Sympraxis Consulting) | @jfj1997
• Derek Cash-Peterson (Sympraxis Consulting) | @spdcp

Supporting materials:
• Sample - SharePoint Framework Reference Samples | https://github.com/pnp/spfx-reference-scenarios
• Article - hTWOo v0.3.0 released – Teams Splash Cards, Placeholder and demo | https://n8d.at/htwoo-v0-3-0-release
• Tool - ABOUT HTWOO UI | http://my.n8d.at/hTWOo

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

3 participants
21 minutes

scheduling

schedule

clock

time

app

timelines

project

work

users

remote

15 Jun 2021

In this 15-minute developer-focused demo, Sathya Raveendran and Arun Kumar Anaparthi introduce viewers to Document Manager – an asset management system sample app that makes use of Microsoft Teams platform capabilities to simplify searching, retrieving, sharing, contributing, and governing assets. Uses messaging extensions to find documents, task module to upload documents, Graph APIs, and creates awareness of / gains approvals on assets leveraging user specific views in Adaptive Cards. Stores documents awaiting approval in a staging folder in library. This PnP Community demo is taken from the Microsoft Teams community call – June 2021, recorded on June 15, 2021.

Demo Presenters:
• Sathya Raveendran (Microsoft)
• Arun Kumar Anaparthi (Zen3 Infosolutions)

Supporting documents:
• Documentation - Messaging extensions – Search Commands | https://docs.microsoft.com/en-us/microsoftteams/platform/messaging-extensions/what-are-messaging-extensions#search-commands
• Documentation - User Specific Views | https://docs.microsoft.com/en-us/microsoftteams/platform/task-modules-and-cards/cards/universal-actions-for-adaptive-cards/user-specific-views
• Repo - Document Manager | https://github.com/pnp/teams-dev-samples/tree/main/samples/msgext-bot-SPUploader

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

3 participants
15 minutes

sharepoint

workflow

asset

users

collaborating

adaptive

apps

management

backend

repository

15 Jun 2021

In this 15-minute developer-focused demo, Zhenya Savchenko helps developers create and deploy Microsoft Teams apps with integrated identity, access to cloud storage, data from Microsoft Graph, and other services in Azure and Microsoft 365 with a “zero-configuration” approach (single-line statements and no side trips to Azure and ADD) to the developer experience. Efficiently configures front-end, back-end, bot at same time. Simplifies creation of proof-of-concepts! Get the toolkit through the Extensions Marketplace in VS Code. This PnP Community demo is taken from the Microsoft Teams community call – June 2021, recorded on June 15, 2021.

Demo Presenter - Zhenya Savchenko (Microsoft)

Supporting materials:
• Dev Tools - Microsoft Teams Toolkit for Visual Studio Code | http://aka.ms/teams-toolkit

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
15 minutes

toolkit

setups

ui

backend

apps

bots

debugging

version

team

sharepoint

15 Jun 2021

In this 15-minute developer-focused demo, Sébastien Levert showcases how to build a solution leveraging the Microsoft Teams Activity Feed API for sending notifications to selected users. See how activities (notifications) are gated in the manifest. Create a Kudos app (approximately 100 lines code) with appropriate Graph services permissions, layout UI using Fluent UI components, add uses out-of-box controls from Microsoft Graph Toolkit. Activity feed is now a fully supported workload. This PnP Community demo is taken from the Microsoft Teams community call – June 2021, recorded on June 15, 2021.

Demo Presenter: Sébastien Levert (Microsoft) | @sebastienlevert

Supporting documents:
• Blog – Microsoft Graph Mailbag | https://aka.ms/MSGraphMailbag
• Dev Tool - Microsoft Graph Toolkit | https://aka.ms/mgt
• Library - Microsoft Graph JavaScript Client Library | https://github.com/microsoftgraph/msgraph-sdk-javascript
• Sample - Kudos App (Teams Activity Feed API) | https://github.com/pnp/teams-dev-samples/tree/main/samples/tab-activity-feed
• Blog - Microsoft Graph Mailbag – Create engaging apps with the Microsoft Teams Activity Feed API | https://developer.microsoft.com/en-us/graph/blogs/microsoft-graph-mailbag-create-engaging-apps-with-the-microsoft-teams-activity-feed-api/

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
15 minutes

microsoft

apps

bots

activity

graph

teamwork

users

demo

interface

notifications

27 May 2021

In this 15-minute developer-focused demo, Thomy Gölles steps shows viewers a way to send activity notifications from both apps that live outside Teams and others (like static tabs) inside Teams, to Teams tabs, bots, chat. Using activity feed notification APIs in Microsoft Graph, the presenter reviews types of metadata on messages, requirements for sending defined activity type notifications, app registration, consent, manifest, notifications settings in Teams, etc. He steps through the code for simple and advanced notifications. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on May 27, 2021.

Demo Presenter: Thomas Gölles (Solvion) | @thomyg

Supporting materials:
• Documentation - Send activity feed notifications to users in Microsoft Teams | https://docs.microsoft.com/en-us/graph/teams-send-activityfeednotifications
• Video - Microsoft Teams – Use the teamwork Microsoft Graph endpoint | https://www.youtube.com/watch?v=G33bN7cl2QU&t=3536s
• Documentation - Create deep links | https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/build-and-test/deep-links

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
15 minutes

activity

bot

app

users

icon

preview

details

metadata

notification

microsoft

18 May 2021

In this 14-minute developer-focused demo, Rick van Rousselt steps through meeting extensions (apps) organized in 3 categories - pre-meeting (tab), in-meeting (side panel tab, pop-up, extension, and bot) and post-meeting (tab). Needed manifest updates are called out. Microsoft Forms is a great meeting extension. Rick creates a meeting, add the Forms app to it and helps viewer observe how Forms does configuration. Meeting extensions are built on top of tabs, bots and messaging extensions. This PnP Community demo is taken from the Microsoft Teams community call – May 2021, recorded on May 18, 2021.

Demo Presenter - Rick van Rousselt (Advantive) | @RickVanRousselt

Supporting materials:
• Blog - Rick's blog | https://www.rickvanrousselt.com

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
15 minutes

chat

microsoft

app

extensions

user

office

preview

plannings

cumbersome

prerequisites

4 May 2021

In this 18-minute developer-focused demo, Fabian Williams from the Microsoft Graph team delivers a straight-forward decision criterion for creating an Online Meeting using the Calendar Events API or the Cloud Communications API (Microsoft Teams) based on specific meeting requirements. Step through 7 questions to ask yourself when to use what method. The decision is largely based on the need for a rich integrated Microsoft client (Outlook/Teams) experience or 3rd party application integration that also includes Microsoft chat integration. Includes Q&A. This PnP Community demo is taken from the Microsoft Graph community call – May 2021, recorded on May 4, 2021.

Demo Presenter - Fabian Williams (Microsoft) | @fabianwilliams

Supporting documents:
• Documentation - Calendar API | https://docs.microsoft.com/en-us/graph/api/resources/event?view=graph-rest-1.0
• Documentation - Cloud Communications API | https://docs.microsoft.com/en-us/graph/api/application-post-onlinemeetings?view=graph-rest-1.0&tabs=http
• Documentation - Choose an API in Microsoft Graph to create and join online meetings | https://docs.microsoft.com/en-us/graph/choose-online-meeting-api
• Documentation - Microsoft Graph throttling guidance | https://docs.microsoft.com/en-us/graph/throttling
• Documentation - Exchange Online limits | https://docs.microsoft.com/en-us/office365/servicedescriptions/exchange-online-service-description/exchange-online-limits
• Documentation - Cloud Communications service limits | https://docs.microsoft.com/en-us/graph/throttling#cloud-communication-service-limits

Stay connected:
• Twitter - https://twitter.com/microsoft365dev
• YouTube - https://aka.ms/M365DevYouTube
• Microsoft 365 Developer Blog - https://aka.ms/M365DevBlog
• Microsoft 365 PnP Blog - https://aka.ms/m365pnp/community/blog

4 participants
18 minutes

conferencing

teleconferencing

conversations

users

outlook

conference

microsoft

scheduling

enablement

join

20 Apr 2021

In this 16-minute Developer-focused demo, Stephan Bisser opens with the basics - Bots are used for Chat, Messaging Extensions, Task Modules, and more. There are 3 options for building Bots - Bot Framework SDK, Bot Framework Composer, and Power Virtual Agents. Same technology behind scenes, just matter of abstraction and options for extensibility. The recommended low code and very extensible option with templates containing triggers and dialogs for Microsoft Teams is Composer. Tour the latest Composer capabilities with installation, configuration and build tips. This PnP Community demo is taken from the Microsoft Teams community call – April 2021, recorded on April 20, 2021

Demo Presenter: Stephan Bisser (Solvion) | @stephanbisser

Supporting documents:
• Article - Bot Framework Composer Series - 1 - Use Adaptive Cards | https://bisser.io/bot-framework-composer-series-1-use-adaptive-cards/
• Repo - Microsoft Bot Framework Composer | https://github.com/Microsoft/BotFramework-Composer/
• Documentation - Bot Framework Composer documentation | https://docs.microsoft.com/en-us/composer/
• Documentation - Azure Bot Service documentation | https://docs.microsoft.com/en-us/azure/bot-service/?view=azure-bot-service-4.0

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
16 minutes

bot

bots

podbot

package

microsoft

demos

tool

platform

sdk

preview

20 Apr 2021

If you have web-based apps, they can be surfaced in a Microsoft Teams tab (iFrame). In this 15-minute Developer-focused demo, Rick Van Rousselt examines security options – start with protection built into your app and add external access control by Teams. Add apps on Personal (static) or Group (Teams aware static) tabs after adding app to App Studio. Build tips: Make your app Teams aware, use different contentUrl and websiteUrl, use responsive apps, use simple app navigation. This PnP Community demo is taken from the Microsoft Teams community call – April 2021, recorded on April 20, 2021.

Demo Presenter: Rick Van Rousselt (Advantive) | @RickVanRousselt

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
15 minutes

apps

browser

microsoft

applications

internets

accessible

teamsclient

download

iframeable

exe

20 Apr 2021

In this 15-minute Developer-focused demo, Albert-Jan Schot shows how to easily extend Microsoft Teams by embedding client-side SPFx web parts or personal applications (not Teams applications) in Teams tabs. Requires running SPFx v1.8 or later and execution is in the context of the SPO site behind the Team. No coding, no hosting, no Azure registration, just package and deploy. Step through app creation using the SharePoint generator, create a Teams tab, and add tab to a Team. This PnP Community demo is taken from the Microsoft Teams community call – April 2021, recorded on April 20, 2021.

Demo Presenter - Albert-Jan Schot (Portiva) | @appieschot

Supporting materials:
• Samples - Samples by JavaScript Framework | https://pnp.github.io/sp-dev-fx-webparts/
• Documentation - Building Microsoft Teams Tabs using SharePoint Framework | https://docs.microsoft.com/en-us/sharepoint/dev/spfx/integrate-with-teams-introduction
• Documentation - Build a Me-experience in Microsoft Teams | https://docs.microsoft.com/en-us/sharepoint/dev/spfx/build-for-teams-me-experience

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
15 minutes

sharepoint

teamster

team

hosts

backend

tooling

enable

package

framework

synced

15 Apr 2021

In this 16-minute Developer-focused demo, Leon Armston delivers the next stage in the evolution of his London Underground - Tube Status solution. An interactive Tube bot in Power Virtual Agents, using Power Automate, and configuring your Azure environment for Azure API Management and Azure Functions. Dataverse for Teams allows users to leverage Azure API Management service using a custom connector in Power Platform. See solution architecture, execution triggers, rules, calls and more. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on April 15, 2021.

Demo Presenter: Leon Armston (Intelogy) | @LeonArmston

Supporting materials:
• Blog – Create a London Underground Line Status Bot using Power Virtual Agents & Azure Management API in Dataverse for Teams | https://www.leonarmston.com/2021/02/create-a-london-underground-line-status-bot-power-virtual-agents-azure-azure-management-api-in-dataverse-for-teams/
• Blog - Azure API Management connector on the Power Platform | https://powerapps.microsoft.com/en-us/blog/azure-api-management-connector-on-the-power-platform/

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
16 minutes

bots

interactive

dataverse

powerapps

remotely

demoed

platform

functionality

connector

api

13 Apr 2021

In this 36-minute all audiences-focused demo, Microsoft program managers Tejas Mehta and Prateek Dudeja demystify this employee centric app in Teams that delivers one stop access to internet resources, global search, contextual actions, and company branded experience. A SharePoint home site powered by Microsoft Teams, backed by Microsoft security, privacy and compliance. No additional licensing, just switch it on. Use SPFx to extend desktop today, mobile devices later this summer. Create Viva Connections app package in PowerShell, upload to Teams Admin Center, manage user access, pin app for users. This PnP Community demo is taken from the SharePoint monthly community call recorded on April 13, 2021.

Demo Presenters:
• Tejas Mehta (Microsoft) @tpmehta
• Prateek Dudeja (Microsoft) @PrateekDudeja4

Supporting documents:
• Documentation - Add Viva Connections for Microsoft Teams desktop | https://docs.microsoft.com/en-us/SharePoint/viva-connections
• Overview - Microsoft Viva | https://aka.ms/Viva
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

3 participants
36 minutes

viva

sharepoint

introductions

connections

discussion

communicators

vesa

collaboration

admin

prathik

8 Apr 2021

In this 18-minute Developer-focused demo, Vesa Juvonen positions Microsoft Viva as a suite of products. One product - Viva Connections is an integrated experience with Microsoft Teams and SharePoint backed by Microsoft security, privacy, and compliance. Viva Connections is extensible – create/use existing extensions and web parts using SPFx. Customers/Partners determine what capabilities specifically to make available in their Viva Connections implementation (UX). The Worldwide roll out of Viva Connections capabilities will occur over months - a journey. This demo is taken from the SharePoint Framework community call recorded on April 8, 2021.

Demo Presenter: Vesa Juvonen (Microsoft) | @vesajuvonen

Supporting materials:
• Website - Microsoft Viva Connections | https://aka.ms/VivaConnections
• Blog Post - Install Viva Connections today | https://techcommunity.microsoft.com/t5/microsoft-viva-blog/install-viva-connections-today/ba-p/2245410
• Look book - SharePoint look book | https://lookbook.microsoft.com/
• Documentation - Embedding modern SharePoint pages in Microsoft Teams as personal apps (preview) | https://docs.microsoft.com/en-us/sharepoint/dev/features/embed-pages-to-teams

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
18 minutes

sharepoint

connections

accessibility

usability

virtual

users

viva

intranet

microsoft

extensions

6 Apr 2021

During this 13-minute Developer-focused example, David Ramalho overviews a simple web part for sending a message from a SharePoint page to a recipient’s mailbox or into a Microsoft Teams chat using Microsoft Graph. Conversation elements include send email, my profile information, target user’s principal name, get chat ID (determines if existing chat or creates new). Uses Microsoft Graph APIs, PnP People Picker, React hooks and code snippets found in Graph Explorer. This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) – Bi-weekly sync call recorded on March 25, 2021.

Demo Presenter: David Ramalho (Storm Technology) | @DavRamalho

Supporting materials:
• Article - Send a message to Microsoft Teams using Microsoft Graph in SPFx | https://sharepoint-tricks.com/send-a-message-to-microsoft-teams-using-microsoft-graph-in-spfx/
• Documentation - Message Teams User | https://github.com/pnp/sp-dev-fx-webparts/tree/master/samples/react-teams-message-user
• Graph Explorer – https://developer.microsoft.com/graph/graph-explorer

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
13 minutes

serpent

message

demon

witch

naughty

storm

head

whi

ronald

hosting

1 Apr 2021

In this 12-minute Developer-focused demo, data scientist – Kathy (Qingyu) Xu and MVP Paolo Pialorsi team to show one way Microsoft Teams delivers a SSO personal app experience to consume and share data and analytics from an external data catalog in a Microsoft 365 environment. This Proof-of-Concept solution includes search and message composition capabilities. App created in yoTeams v3.0, .NET back-end, Security Vault, consuming Alation (data catalog) APIs Uses Fluent and React Northstar library components for Teams. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on April 1, 2021.

Demo Presenters:
• Kathy (Qingyu) Xu (Pfizer)
• Paolo Pialorsi (PiaSys) | @PaoloPia

Supporting materials:
• Documentation - Create your first Microsoft Teams app using the Yeoman generator | https://docs.microsoft.com/en-us/microsoftteams/platform/tutorials/get-started-yeoman
• Documentation - Single sign-on (SSO) support for tabs | https://docs.microsoft.com/en-us/microsoftteams/platform/tabs/how-to/authentication/auth-aad-sso
• Documentation - Microsoft identity platform and OAuth 2.0 On-Behalf-Of flow | https://docs.microsoft.com/en-us/azure/active-directory/develop/v2-oauth2-on-behalf-of-flow
• Library - Fluent UI - React Northstar | https://fluentsite.z22.web.core.windows.net/0.53.0
• Templates & Components - Teams React UI Library | https://dev-int.teams.microsoft.com/storybook/main/index.html

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

3 participants
12 minutes

backend

dissolution

behalf

aisla

esthete

troubles

architecture

withdetto

integrative

set

24 Mar 2021

In this 11-minute developer-focused demo, Bob German shepherds viewers through the creation of a simple bot that’s installed in Microsoft Teams and calling Microsoft Graph within 15 minutes! Step-by-step - Name your bot, add a trigger, use ngrok to make bot work in Teams, register bot, create an app (in App Studio), install bot locally, connect it to Microsoft Graph, create trigger to respond with person’s title from profile, ask question in Teams! This PnP Community demo is taken from the Microsoft Teams community call – March 2021, recorded on March 16, 2021.

Demo Presenter: Bob German (Microsoft) | @Bob1German

Supporting documents:
• Repo - Microsoft Bot Framework Composer | https://aka.ms/BotComposer
• Documentation - Bot Framework Emulator | https://aka.ms/BotFwkEmulator
• App - Download & setup ngrok | https://aka.ms/ngrok
• Documentation - Instructions to register your bot and an application that can call the Microsoft Graph | https://aka.ms/BotBuilderAAD

Stay connected:
• Twitter https://twitter.com/microsoft365dev
• YouTube https://aka.ms/M365DevYouTube
• Blogs https://aka.ms/M365DevBlog

1 participant
11 minutes

bots

bot

demo

robots

app

emulator

tools

azure

dialog

recording

18 Mar 2021

In this 13-minute Developer-focused demo, Wictor Wilén picks up the newest Microsoft Teams App Project Generator - #YoTeams at the Repo and proceeds to take viewers from generator installation, project creation – scaffolding of files, to and explains VS code files. Note: not using class based React components but using functional components and React hooks. Then create a build and install app – a configurable tab, in Teams. New V3 capabilities called out through demo. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on March 18, 2021.

Demo Presenter: Wictor Wilén (Avanade) | @wictor

Supporting material:
• Repo - Microsoft Teams App Project Generator - #YoTeams | https://aka.ms/yoteams

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
13 minutes

package

configure

sharepoint

npm

toolkit

generator

upload

manage

team

yo

16 Mar 2021

In this 20-minute developer-focused demo, Microsoft presenters Anuj Bahl and Shubham Chauhan introduce viewers to four device capabilities (Image, Location, Mic, and Scanner APIs) now in Teams Client JS SDK that developers can utilize for extending bots, tabs, messaging extensions and personal apps, in mobile apps. Reviewed mobile device capabilities Roadmap, 3 UI demos, and scenarios with API configurations. Have a look at the mobile People Picker Control in development. API documentation with code snippets is current. This PnP Community demo is taken from the Microsoft Teams community call – March 2021, recorded on March 16, 2021.

Demo Presenters:
• Anuj Bahl (Microsoft)
• Shubham Chauhan (Microsoft)

Supporting documents:
• BlogPost - Four device capabilities developers can utilize for Microsoft Teams mobile apps | https://aka.ms/devicecapabilities
• Documentation - Build apps for Microsoft Teams | https://aka.ms/TeamsDevDocs
• Documentation - Device capabilities | https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/device-capabilities/device-capabilities-overview?view=msteams-client-js-latest
• Documentation - Request device permissions for your Microsoft Teams app | https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/device-capabilities/native-device-permissions?view=msteams-client-js-latest&tabs=desktop
• Documentation - Integrate media capabilities | https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/device-capabilities/mobile-camera-image-permissions?view=msteams-client-js-latest
• Documentation - Integrate QR or barcode scanner capability | https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/device-capabilities/qr-barcode-scanner-capability?view=msteams-client-js-latest
• Documentation - Integrate location capabilities | https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/device-capabilities/location-capability
• Documentation - Microsoft Teams JavaScript client SDK | https://docs.microsoft.com/en-us/javascript/api/overview/msteams-client?view=msteams-client-js-latest

Stay connected:
• Twitter https://twitter.com/microsoft365dev
• YouTube https://aka.ms/M365DevYouTube
• Blogs https://aka.ms/M365DevBlog

4 participants
20 minutes

apps

bots

android

devices

messaging

capabilities

platform

mobile

users

workflow

11 Mar 2021

During this 42-minute developer-focused demo, Shiladitya Saha and Karan Thapar thoroughly explain the new Action.Execute action type that synchronizes activity (payload) in the back-end while rendering cards natively in Teams and Outlook front-ends. Also shown - Contextual views in Teams bots/adaptive cards - individualized cards by role and Sequential Workflows support on Teams - progress through a multi-step process in a single adaptive card using auto invoke and synchronized refresh capabilities. Look for Action.Execute in Schema 1.4 and capability support by Teams and Outlook in mid-April. This demo is taken from the Adaptive Cards community call - March 2021, recorded on March 11, 2021.

Demo Presenters:
• Shiladitya Saha (Microsoft - Teams)
• Karan Thapar (Microsoft - Outlook)

Supporting materials:
• https://github.com/Microsoft/AdaptiveCards/issues/2268

Learn more:
• Twitter https://twitter.com/microsoft365dev
• YouTube https://aka.ms/M365DevYouTube
• Blogs https://aka.ms/M365DevBlog

10 participants
42 minutes

adaptive

cards

applications

actionable

insights

accounts

summarize

extensibility

interact

benefits

4 Mar 2021

In this 12-minute video, Dan Wahlin explains what Azure Communication Services is and how you can use it in your application to extend it with real-time multimedia voice, video, and telephony-over-IP communication features.

Demo Presenter: Dan Wahlin (Microsoft) | @DanWahlin

More information:
• Azure Communication Service Docs - https://docs.microsoft.com/en-us/azure/communication-services/overview/?WT.mc_id=m365-0000-dwahlin
• Communication Services Web Calling Hero Demo - https://github.com/Azure-Samples/communication-services-web-calling-hero/?WT.mc_id=m365-0000-dwahlin
• Communication Services Chat Hero Demo - https://github.com/Azure-Samples/communication-services-web-chat-hero/?WT.mc_id=m365-0000-dwahlin
• Using Voice and Video - https://docs.microsoft.com/en-us/azure/communication-services/quickstarts/voice-video-calling/getting-started-with-calling?pivots=platform-web&WT.mc_id=m365-0000-dwahlin
• Using Chat - https://docs.microsoft.com/en-us/azure/communication-services/quickstarts/chat/get-started?pivots=programming-language-javascript&WT.mc_id=m365-0000-dwahlin
• Using SMS - https://docs.microsoft.com/en-us/azure/communication-services/quickstarts/telephony-sms/send?pivots=programming-language-javascript&WT.mc_id=m365-0000-dwahlin
• Azure Communication Services Pricing - https://azure.microsoft.com/en-us/pricing/details/communication-services/?WT.mc_id=m365-0000-dwahlin

Learn more:
• Learn more about the Microsoft 365 Community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
12 minutes

conferencing

apps

communications

services

sms

chat

multimedia

azure

microsoft

demo

1 Mar 2021

In this 21-minute citizen developer-focused demo, Tomasz Poszytek ushers’ viewers through 3 practical usage scenarios 1) facilitating business processes, like approvals, with Adaptive Cards, 2) sending and receiving data from Adaptive Cards in Microsoft Teams and 3) sending and receiving data from Adaptive Cards as Actionable Messages in Outlook. Examine flows in Power Automate, Preview cards in Azure Actionable Message Designer and register your services in the Actionable Email Developer Dashboard to publish actionable messages. Q & A throughout. This PnP Community demo is taken from the Microsoft Power Apps community call - February 2021, recorded on February 17, 2021.

Demo Presenter: Tomasz Poszytek @TomaszPoszytek

Supporting documents:
• Related Demos and Blog Posts - Tomasz Poszytek - https://aka.ms/poszytek
• Tool - Azure Actionable Message Designer | https://amdesigner.azurewebsites.net/
• Tool – Adaptive Cards Designer | https://adaptivecards.io/designer/
• Documentation - Register your service with the actionable email developer dashboard | https://docs.microsoft.com/en-us/outlook/actionable-messages/email-dev-dashboard

Stay connected:
• Twitter https://twitter.com/microsoft365dev
• YouTube https://aka.ms/M365DevYouTube
• Blogs https://aka.ms/M365DevBlog

3 participants
21 minutes

approvals

approver

demos

preview

users

workflow

adaptive

dashboard

scenarios

messages

16 Feb 2021

In this 17-minute Developer-focused demo, Ayca Bas demonstrates on how to get started on building bots using Microsoft Teams Toolkit. The Microsoft Teams Toolkit extension enables you to create, debug and deploy Teams apps directly from Visual Studio Code. It's a great tool to streamline your development experience for Microsoft Teams with support for different extensibility options and automatic publishing of the solution to corporate catalog and to public store.

Demo Presenter: Ayca Bas (Microsoft) | @aycabs

Supporting document:
• Microsoft Teams developer documentation | https://docs.microsoft.com/en-us/microsoftteams/platform/?WT.mc_id=m365-15744-cxa
• Documentation - Build apps with the Teams Toolkit and Visual Studio Code | https://docs.microsoft.com/en-us/microsoftteams/platform/toolkit/visual-studio-code-overview?WT.mc_id=m365-15744-cxa
• Documentation - What are conversational bots in Microsoft Teams? | https://docs.microsoft.com/en-us/microsoftteams/platform/bots/what-are-bots?WT.mc_id=m365-15744-cxa

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
17 minutes

demobot

bot

bots

demo

toolkit

team

app

microsoft

installing

start

16 Feb 2021

In this 16-minute Developer-focused demo, Microsoft presenters Sathya Raveendran and Arun Kumar Anaparthi introduce the audience to a new PnP sample app that leverages Graph APIs to deliver: Calling & Meeting bot that initiates and pulls participants into a call, a Teams app that automatically gets added to a meeting scope, capture notes/Q&A (transcript) during meeting and saving it in OneNote, and capture attendance of who actually joined the call. Identified use scenarios including Education, Enterprise, Helpdesk Contact Center. This PnP Community demo is taken from the Microsoft Teams community call - February 2021, recorded on February 16, 2021.

Demo Presenters:
• Sathya Raveendran (Microsoft)
• Arun Kumar Anaparthi (Microsoft)

Supporting documents:
• Repo - Create Microsoft Teams Meeting with Calling & Meeting Bot, and add a custom app to the meeting programmatically- Sample code | https://github.com/pnp/teams-dev-samples/tree/master/samples/app-virtual-events-meeting-extensibility
• Teams Documentation - Apps in Teams meetings | https://docs.microsoft.com/en-us/microsoftteams/platform/apps-in-teams-meetings/teams-apps-in-meetings
• Graph Documentation – Add App to chat | https://docs.microsoft.com/en-us/graph/api/chat-post-installedapps?view=graph-rest-beta&tabs=http
• Graph Documentation - Calls and online meetings bots | https://docs.microsoft.com/en-us/microsoftteams/platform/bots/calls-and-meetings/calls-meetings-bots-overview
• Graph Documentation – List participants | https://docs.microsoft.com/en-us/graph/api/call-list-participants?view=graph-rest-1.0&tabs=http
• Graph Documentation - Graph notebook | https://docs.microsoft.com/en-us/graph/api/onenote-post-notebooks?view=graph-rest-1.0&tabs=http

Stay connected:
• Twitter https://twitter.com/microsoft365dev
• YouTube https://aka.ms/M365DevYouTube
• Blogs https://aka.ms/M365DevBlog

2 participants
17 minutes

apps

app

bots

demo

capabilities

interface

session

participants

snapshot

teams

4 Feb 2021

In this 17-minute Developer-focused demo, Mike Berglund opens with an overview of Blazor and some of the challenges of building Teams apps with Blazor. There is a fair amount of boilerplate code that needs to be written. So the presenter decided to write and share that boilerplate code found in the Blazorade Teams component library, in preview. Now writing apps with Blazor is greatly simplified! Step through the creation of a simple personal tab application created with Blazor. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on February 4, 2021.

Demo Presenter: Mika Berglund (Valtti) | @MikaBerglund

Supporting materials:
• Demo Script - Microsoft Teams with Blazor | https://mikaberglund.com/pnp-dev-general-community-call-demo-feb-4-2021/
• Documentation - Introduction to ASP.NET Core Blazor | https://docs.microsoft.com/en-us/aspnet/core/blazor/?view=aspnetcore-5.0
• Repo - Blazorade Teams | https://github.com/Blazorade/Blazorade-Teams/wiki
• Website – Blazor University | https://blazor-university.com/

Learn more:
• Microsoft Teams platform documentation - https://docs.microsoft.com/en-us/microsoftteams/platform/?WT.mc_id=m365-15744-cxa
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
17 minutes

blazer

blazery

blazeraid

blaze

browsers

frameworks

apps

runtime

backend

microsoft

4 Feb 2021

In this 11-minute Developer/Citizen Developer-focused demo, Kiran Thomas unveils new capabilities that enable Ask Away to work efficiently during meetings. Crowdsource questions for your next Q&A, collect questions live or in chat during meetings, upvote on questions and stack rank responses in real-time. During demo, create a session, ask/answer questions, end session, view asked/answered questions from other sessions presented in pick list. V2.0 is due to release in Q1 of 2021 calendar year. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on February 4, 2021.

Demo Presenter: Kiran Thomas (Microsoft) | @NotKiran

Supporting document:
• Document: Ask Away | https://docs.microsoft.com/en-us/microsoftteams/platform/samples/app-templates#ask-away

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
11 minutes

askaway

app

users

hosting

away

preview

template

azure

planning

asco

2 Feb 2021

In this 19-minute Developer-focused demo, Stefan Bauer shows viewers how to make changes to the styling of a web part by creating variants on office UI fabric – site theming within a web part. Add a theme variant object to an SPFx web part. Redefine the CSS variables within the web part’s event handler. The theme variants are then available and called as CSS variables. This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) – Bi-weekly sync call recorded on January 14, 2021.

Demo Presenter: Stefan Bauer (N8D) | @StfBauer

Supporting document:
• Article - Develop SPFx web parts for different section designs using CSS | https://n8d.at/develop-spfx-web-parts-for-different-section-designs-using-css/

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
19 minutes

css

styling

backgrounds

colors

webparty

settings

themestate

variant

diff

dash

28 Jan 2021

For this 15-minute Developer-focused demo, Hugo Bernier delivers a demo on behalf of web part creator João Mendes showing viewers a web part that displays your upcoming calendar events. Built leveraging the Microsoft Graph Toolkit in SPFx and customized using Fluent UI Fabric Controls, this web part supports themes, section background colors, and may be used as SharePoint web part, a Microsoft Teams personal app or a Teams tab. Each event displays details using the Fluent UI document card control in a calendar view. This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) – Bi-weekly sync call recorded on January 28, 2021.

Demo Presenter: Hugo Bernier (Tahoe Ninjas) | @bernierh

Sample creator: João Mendes | @joaojmendes

Supporting materials:
• Source code - React-mgtEvents | https://github.com/pnp/sp-dev-fx-webparts/tree/master/samples/react-mgtEvents
• Samples - Samples by JavaScript Framework | https://aka.ms/spfx-webparts
• Sandbox - Microsoft Graph Toolkit Playground | https://mgt.dev/

Learn more:
• SharePoint Framework documentation - https://aka.ms/spfx
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
15 minutes

microsoft

preview

toolkit

demo

sample

presenting

joao

webparts

graph

scheduling

14 Jan 2021

PnP Samples are a means to kick start your development efforts. In this 11-minute Developer-focused demo, David Warner and Hugo Bernier show the PnP Samples inventory that includes nearly 450 validated samples contributed by 250 community members. Tour the PnP Samples browser and learn about sort classifications including sort by compatibility. See how the presenters find 2 web parts, evaluate compatibility for the target dev environment and learn tricks to avoid compatibility issues. This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) – Bi-weekly sync call recorded on January 14, 2021.

Demo Presenters:
• David Warner (Catapult Systems) | @DavidWarnerII
• Hugo Bernier (Tahoe Ninjas) | @bernierh

Supporting materials:
• SPFx web parts samples repository - Samples by JavaScript Framework | https://aka.ms/spfx-webparts
• SPFx extensions samples repository - Samples by JavaScript Framework | https://aka.ms/spfx-extensions
• Website - PnP Sharing is Caring | https://aka.ms/sharing-is-caring
• Repo - Content Query web part | https://github.com/pnp/sp-dev-fx-webparts/tree/master/samples/react-content-query-online

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

3 participants
11 minutes

samples

sample

sharepoint

toolkit

downloaded

contributor

browsers

demo

pnp

visit

21 Dec 2020

Watch this cool holiday Secret Santa gift exchange demo utilizing Microsoft Teams and Power Apps integrations by April Dunnam @AprilDunnam.

This video is taken from the December Microsoft Teams community call
https://youtu.be/pYok2qqvsLw

Stay connected
Twitter https://twitter.com/microsoft365dev
YouTube https://aka.ms/M365DevYouTube
Blogs https://aka.ms/M365DevBlog

6 participants
18 minutes

powerapps

powerapp

backend

demo

apps

dataverse

package

bot

platform

secret

17 Dec 2020

In this 7-minute Developer - focused demo, Rabia Williams delivers a 3-tab, single manifest file, SPFx Personal App implementation of the me experience. The tabs are Planning, Insights, and Settings. Planning (my agenda, tasks, and documents) and Insights (files shared, trending, modified) tabs are built with the Microsoft Graph Toolkit – nice because the builder need not worry about the data side of things. The app uses mgt-react package for components. This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) – Bi-weekly sync call recorded on December 17, 2020.

Demo Presenter: Rabia Williams (Microsoft) | @williamsrabia

Supporting materials:
• Sample - Me experience | https://github.com/pnp/teams-dev-samples/tree/master/samples/tab-spfx-me-experience
• Blog - Me Experience in Microsoft Teams using Microsoft Graph Tookit and SPFx | https://rabiawilliams.com/teams/me-experience/
• Documentation - Build a Me-experience in Microsoft Teams | https://docs.microsoft.com/en-us/sharepoint/dev/spfx/build-for-teams-me-experience

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
7 minutes

toolkit

app

personal

insights

settings

tabs

tasks

planning

user

sharepoint

10 Dec 2020

In this 12-minute Developer-focused demo, Sébastien Levert creates a new Teams App. In the index.html page you will create, add the Microsoft Teams Toolkit and Microsoft Graph Toolkit, add the Teams provider and MSAL provider, then drop in components – Login, Agenda, Person, Person card, People Picker and To-Do. Then view your page on localhost. Consent to permissions required and finally install the App in Teams, no configuration required! This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on December 10, 2020.

Demo Presenter: Sébastien Levert (Microsoft) | @sebastienlevert

Supporting materials:
• Website - Get started with Microsoft Graph | https://developer.microsoft.com/en-us/graph/get-started
• Website – Graph Explorer | https://developer.microsoft.com/en-us/graph/graph-explorer
• Documents - Microsoft Graph documentation | https://docs.microsoft.com/en-us/graph/
• Repo – Microsoft Graph Toolkit | https://github.com/microsoftgraph/microsoft-graph-toolkit
• Solutions - Microsoft Graph partner solutions | https://developer.microsoft.com/en-us/graph/partners

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
12 minutes

toolkit

microsoft

graph

demo

sdk

ui

app

start

tasks

vue

26 Nov 2020

In this 18-minute Developer-focused demo, Rabia Williams steps through building a search-based messaging extension for Microsoft Teams using the Microsoft Teams Toolkit. Users type a term into the extension that calls an external system – GIPHY API, and with the information returned, a card is created that can be inserted into chat. Extension sample uses Microsoft Teams Toolkit, node.js, and bot. Extensions drive team engagement – find info in context, grab attention, and drive actions. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on November 26, 2020.

Demo Presenter: Rabia Williams (Microsoft) | @williamsrabia

Supporting materials:
• Blog - How to build your own search based GIPHY app with Microsoft Teams Toolkit | https://rabiawilliams.com/teams/search-msgext-giphy/
• Repo - Giphy Search Messaging Extension | https://github.com/pnp/teams-dev-samples/tree/master/samples/msgext-search-giphy
• PnP Samples - Microsoft Teams Development Samples | https://pnp.github.io/teams-dev-samples/
• Document - Create a messaging extension using App Studio | https://docs.microsoft.com/en-us/microsoftteams/platform/messaging-extensions/how-to/create-messaging-extension
• Toolkit - Microsoft Teams Toolkit for Visual Studio Code | https://marketplace.visualstudio.com/items?itemName=TeamsDevApp.ms-teams-vscode-extension

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
18 minutes

messaging

suggesting

app

microsoft

conversational

bots

project

user

extensions

teams

25 Nov 2020

In this demo, Vivek Bavishi shares how to use Microsoft Teams and Flow, including Power Automate app in Teams, trigger Flow from Teams messages and model Flows with Adaptive Cards.

Resources
New Power Automate App https://aka.ms/AAaf5x7
Trigger flow from Teams messages https://aka.ms/AAaf5x8
Model Flows with adaptive cards https://aka.ms/AAaelkt

This demo was taken from the November community call https://youtu.be/fG2_YDG5EDU

To attend the live, monthly community calls, download the series at
https://aka.ms/powerappscommunity call

Stay connected
Twitter https://twitter.com/microsoft365dev
YouTube https://aka.ms/M365DevYouTube
Blogs https://aka.ms/M365DevBlog

2 participants
12 minutes

automate

automated

flow

power

demo

manage

editing

microsoft

actionable

adapter

24 Nov 2020

Watch this community demo by Nooriz Khamis and Jose Louis from CloudSpark Labs showing their Microsoft Teams Content Explorer app.

Resources:
Content Explorer App on GitHub https://aka.ms/AAaexl3

This demo is taken from the November Microsoft Teams community call.
To join future calls, please download the series at https://aka.ms/microsoftteamscommunitycall

Stay connected
Twitter https://twitter.com/microsoft365dev
YouTube https://aka.ms/M365DevYouTube
Blogs https://aka.ms/M365DevBlog

2 participants
14 minutes

sharepoint

microsoft

collaboration

browser

developers

users

project

helpers

editing

document

24 Nov 2020

Karthig Balendran and Allen Snow from Microsoft share the Microsoft identity platform integration for the Teams Toolkit.

Resources:
Teams Toolkit blog details https://aka.ms/AAaexlb
Teams Toolkit docs https://aka.ms/AAaej2n

This demo is taken from the November Microsoft Teams community call.
To join future calls, please download the series at https://aka.ms/microsoftteamscommunitycall

Stay connected
Twitter https://twitter.com/microsoft365dev
YouTube https://aka.ms/M365DevYouTube
Blogs https://aka.ms/M365DevBlog

2 participants
20 minutes

server

apps

microsoft

provisioning

azure

sdk

launch

backend

sso

admins

24 Nov 2020

Ojasvi Choudhary and Tatiana Cristea share information about single sign-on for Microsoft Teams Bots. Learn what's new.

Resources:
SSO for Bots Docs https://aka.ms/AAaeizy

This demo is taken from the November Microsoft Teams community call.
To join future calls, please download the series at https://aka.ms/microsoftteamscommunitycall

Stay connected
Twitter https://twitter.com/microsoft365dev
YouTube https://aka.ms/M365DevYouTube
Blogs https://aka.ms/M365DevBlog

1 participant
12 minutes

authentication

bot

bots

authenticate

admins

requires

enabled

signing

behalf

board

5 Nov 2020

In this 15-minute Site Admin focused demo, Nidhi Sharma shows a New Employee Onboarding (NEO) – a out-of-box solution based on customer input, and a collaboration between the SharePoint team’s new employee onboarding hub template in look book (including cost-effective content back-end and lists), and Microsoft Teams NEO app front-end. Onboarding is broken into a series of User Flows – that organize, remind, update, prompt, track, route, close tasks to efficiently deliver a structured and complete onboarding experience – day 1 to 90+.This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on October 15, 2020.

Demo Presenter: Nidhi Sharma (Microsoft) | @nidsonbirdie

Supporting materials:
• Documentation - App Templates for Microsoft Teams | https://docs.microsoft.com/microsoftteams/platform/samples/app-templates?WT.mc_id=m365-15744-cxa
• New employee onboarding Microsoft Teams app template in Github - https://github.com/OfficeDev/microsoft-teams-apps-newemployeeonboarding
• Look book template - New Employee Onboarding Hub - Connect, Engage, Inform | https://lookbook.microsoft.com/details/75e60a32-9849-4ed4-b83e-b2b08983ad19?WT.mc_id=m365-15744-cxa
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
15 minutes

sharepoint

onboarding

share

users

collaboration

team

introduce

microsoft

employees

deploying

29 Oct 2020

In this 10-minute Citizen Developer-focused demo, Kiran Thomas cites how the Contact Group Lookup Microsoft Teams app template provides a way to easily surface and interact with members of Outlook groups (Distribution Lists) in Teams. Create a group(s) in Outlook, install app template, and then add group(s) to the app. Using the app – quickly view and chat with members, see their status on Teams, and even start a group chat with multiple members of the Contact Group. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on October 29, 2020.

Demo Presenter: Kiran Thomas (Microsoft) | @NotKiran

Supporting materials:
• Document - Contact Group Lookup | https://docs.microsoft.com/en-us/microsoftteams/platform/samples/app-templates#contact-group-lookup-
• Repo - Contact Group Lookup App Template | https://github.com/OfficeDev/microsoft-teams-app-contactgrouplookup

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
10 minutes

apps

template

contact

customizing

demo

users

organization

groups

favorites

github

23 Oct 2020

Reza Dorrani (@rezadorrani) walks through his expense report solution built leveraging Power Apps, Power Automate and Power Virtual Agents for Microsoft Teams with Project Oakdale. The solution also includes receipt scanning using Azure Cognitive Services. Project Oakdale is a built-in, low-code data platform for Microsoft Teams.

Expense Tracking Application package https://bit.ly/expensereportingsolution

Taken from the October Power Apps community call https://youtu.be/AxdFVpkAt5Q

Stay connected
Twitter https://twitter.com/microsoft365dev
YouTube https://aka.ms/M365DevYouTube
Blogs https://aka.ms/M365DevBlog

2 participants
16 minutes

powerapps

project

applications

oakdale

platform

backend

leverages

teamwork

ai

local

23 Oct 2020

Rajesh Rangarajan, Microsoft Teams Program Manager, shares how to design and build Microsoft Teams Apps for Meetings and how to deliver a unique user experience for each stage of the meeting lifecycle.

Apps for Meetings https://aka.ms/create_apps_in_meetings

Demo taken from the October Microsoft Teams community call
https://youtu.be/gwvHpKUM9Cg

Stay connected
Twitter https://twitter.com/microsoft365dev
YouTube https://aka.ms/M365DevYouTube
Blogs https://aka.ms/M365DevBlog

2 participants
18 minutes

presentation

users

hosting

admins

discussion

experience

introduced

platform

extensibility

chat

23 Oct 2020

Markus Moeller (@moeller2_0), Microsoft 365 Developer and Avanade Manager, demonstrates how a search-based messaging extension works with authentication to Microsoft Graph. In his scenario, he retrieves documents via Microsoft Graph from a SharePoint document library that are due for a review. A selected document is transformed to an Adaptive Card and posted to the messaging channel where users can “View” that document and directly set it to “Reviewed” with card actions.

Detailed blog https://mmsharepoint.wordpress.com

Demo taken from the October Microsoft Teams community call
https://youtu.be/gwvHpKUM9Cg

Stay connected
Twitter https://twitter.com/microsoft365dev
YouTube https://aka.ms/M365DevYouTube
Blogs https://aka.ms/M365DevBlog

1 participant
11 minutes

messaging

imessaging

executed

communicate

microsoft

bot

user

debug

preview

query

8 Oct 2020

In this 15-minute Developer - focused demo, Vardhaman Deshpande shows how to use SharePoint Framework to build a task modules in Microsoft Teams messaging extensions. Messaging extensions allow users to interact with applications within the context of their conversations – in a channel or group chat. Access SPFx task modules from Teams Compose Box, Tabs, Personal Apps as well as from Adaptive Cards. Static and dynamic extension use cases are explained. This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) – Bi-weekly sync call recorded on October 8, 2020.

Demo Presenter: Vardhaman Deshpande (Valo Intranet) | @vrdmn

Supporting materials:
• Blog post - Microsoft Teams messaging extensions using SPFx: Getting the message data with Microsoft Graph | https://www.vrdmn.com/2020/09/microsoft-teams-messaging-extensions.html
• Repo - spfx-teams-message-action | https://github.com/vman/spfx-teams-message-action

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
15 minutes

messaging

chats

extensions

tasks

message

bots

uspfx

platform

sharepoint

promoting

1 Oct 2020

In this 20-minute Site Admin focused demo, Pawan Gulati shows capabilities of this recently released app template built on Power Apps, Power Automate and SharePoint. Seamless Teams integration is a given. The template actually includes 3 apps – Building Admin, Building Security, and Building Access. Additionally, user activity is summarized in a Power BI dashboard. Step through creating a facility access request and approval, creating occupancy thresholds, defining eligibility questions and other configuration options. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on October 1, 2020.

Demo Presenter: Pawan Gulati (Microsoft) | @pawangulati

Supporting materials:
• Documentation - App Templates for Microsoft Teams | https://aka.ms/TeamsAppTemplates
• Repo - Building Access App Template | http://github.com/OfficeDev/microsoft-teams-apps-buildingaccess

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
20 minutes

tooling

app

powerapps

facilities

admins

remotely

access

planning

template

github

24 Sep 2020

In this 13-minute Developer - focused demo, Markus Möller lays out a key use case: Documents in a list are past due for review. Need to communicate review requirement to a Microsoft Teams user through task module. Communications is between SPFx and Bot Components and task is rendered in an Adaptive Card with 2 actions: View and Reviewed. Communications between Library and Task Module via Graph calls. This capability is available only in SPFx v1.11. This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) – Bi-weekly sync call recorded on September 24, 2020.

Demo Presenter: Markus Möller (Avanade) | @Moeller2_0

Supporting materials:
• Post - Use SPFx for Task Modules in Teams Messaging Extensions and access Microsoft Graph | https://mmsharepoint.wordpress.com/2020/09/03/use-spfx-for-task-modules-in-teams-messaging-extensions-and-access-microsoft-graph/
• Repo - msgext-spfx-graph-docreview | https://github.com/mmsharepoint/teams-docreview/tree/master/msgext-spfx-graph-docreview
• Repo - Document Review SPFx Messaging Extension | https://github.com/pnp/teams-dev-samples/tree/master/samples/msgext-spfx-graph-docreview

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
13 minutes

tasks

sharepoint

presenting

spfx

messaging

notice

executed

summary

document

microsoft

21 Sep 2020

In this 11-minute Site Owner-focused demo, Kiran Thomas shows a Power App-based Microsoft Teams app that provides a simple workflow where staff can check-in with a photo, location, and other details directly from within Microsoft Teams. The solution brings together capabilities of Teams, PowerApps, Adaptive Cards, Microsoft Power Automate, and of the user’s mobile device. Staff can receive reminders; supervisors can see check-in details as occur or in a roll-up report. This PnP Community call demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on September 3, 2020.

Demo Presenter: Kiran Thomas (Microsoft) | @NotKiran

Supporting materials:
• Documentation - Staff Check-ins | https://docs.microsoft.com/en-us/microsoftteams/platform/samples/app-templates#staff-check-ins-
• Repo - Staff Check-ins App Template | https://github.com/OfficeDev/microsoft-teams-apps-staffcheckins

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
12 minutes

staff

app

powerapps

template

employees

admin

client

equipment

service

checkings

8 Sep 2020

Need information about the person using your Bot? Want details about the Team your Bot is running in? Want to send an email, create a Microsoft Teams channel, update Microsoft SharePoint Online content, or set up tasks in Microsoft Planner? The key to all these common tasks is Microsoft Graph API. In this session, you'll learn about the Microsoft Graph and how to call it from various kinds of Microsoft Teams application features, including tabs, bots, and task modules. You'll learn how to call the Microsoft Graph on behalf of a user, or how to elevate permissions to do something the user isn't able to do on their own. Don't miss this opportunity to unlock the power of Microsoft Graph in your Microsoft Teams applications!

Speaker: Bob German (Microsoft) | @Bob1German

Supporting materials:
• Overview of Microsoft Graph - https://docs.microsoft.com/en-us/graph/overview
• Use the Microsoft Graph API to work with Microsoft Teams - https://docs.microsoft.com/en-us/graph/api/resources/teams-api-overview?view=graph-rest-1.0

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices (PnP) community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
32 minutes

graph

azurewebsites

microsoft

bots

toolchain

apis

sharepoint

complexity

delegated

workloads

8 Sep 2020

In this video, you learn how to get started with Microsoft Teams Apps development using the Yo Teams generator. Come along on the ride to get you all up to speed on how to build awesome Teams apps.

Speaker: Wictor Wilén (Avanade) | @wictor

Supporting materials:
• Build your First Microsoft Teams App - https://docs.microsoft.com/en-us/microsoftteams/platform/tutorials/get-started-yeoman
• Yo Teams Generator Tutorial - https://github.com/pnp/generator-teams/wiki/Build-Your-First-Microsoft-Teams-App

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices (PnP) community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
30 minutes

teams

toolkit

msteam

projects

microsoft

deploying

demos

v1

avant

chats

8 Sep 2020

Microsoft Teams is the ultimate tool for modern workplace collaboration, and developers have the power to make people's daily lives even more productive through Microsoft Teams customizations! We can bring content where it is needed the most, and reduce the time it takes to perform frequent tasks from minutes to seconds. For example, wouldn't it be great to be able to just click on a Teams message and have an option to add it as a new task in Microsoft To Do?

If that got you all hyped up, this is the session for you! Learn how you can create Teams tabs, bots, messaging extensions, webhooks, and connectors by utilizing the Azure PaaS services, and how to further enrich these customizations with adaptive cards and notifications.

In addition to the technical knowledge, you'll also get some exciting solution ideas to take back home and suggest to your customers. The goal of this session is to make it as easy as possible for you to start developing customizations for Teams from the technical perspective, and spark up some great development ideas to get you started.

Speaker: Laura Kokkarinen (Sulava) | @LauraKokkarinen

Supporting materials:
• How we can extend Microsoft Teams with custom apps - https://laurakokkarinen.com/how-we-can-extend-teams-with-custom-apps-the-non-technical-explanation/
• What is PaaS? - https://azure.microsoft.com/en-us/overview/what-is-paas/

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices (PnP) community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
30 minutes

customizations

microsoft

extensions

applications

manage

teams

azure

appsource

tabs

sharepoint

3 Sep 2020

In this 12-minute demo, Stephan Bisser shows viewers capabilities of Bot Framework Composer - a new open-source tool that allows ITPros and Citizen Developers to build a Help Bot that accesses information from Azure Active Directory and Microsoft To Do via Microsoft Graph and renders results using Adaptive Cards. One tool/environment to create dialogs, triggers, actions, etc. with little to no code. The Help Bot in this demo can Show Profile, Add Task and View Tasks. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on September 3, 2020.

Demo Presenter: Stephan Bisser (Solvion) | @stephanbisser

Supporting materials:
• Bot Framework Composer Series - 1 - Use Adaptive Cards | https://bisser.io/bot-framework-composer-series-1-use-adaptive-cards/
• Bot Framework Composer Series - 2 - Property management | https://bisser.io/bot-framework-composer-series-2-property-management/
• Repo - Microsoft Bot Framework Composer | https://github.com/microsoft/BotFramework-Composer
• Bot Framework Composer Documentation | https://docs.microsoft.com/composer
• botframework-skills | https://github.com/microsoft/botframework-skills/tree/preview-build2020/skills/declarative

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

2 participants
12 minutes

bots

bot

framework

tools

sdk

composer

app

studio

demo

automate

27 Aug 2020

In this 11-minute Developer focused demo, Erik Benke introduces us to a web part for building/adding a collapsible accordion style FAQ to a SharePoint page or Teams tab. Functionally, the code invokes a get list items method to grab items from targeted list, populates the accordion and renders the formatted result. Each accordion item has a header and panel. The web part leverages the react-accessible-accordion library designed to be Accessible (works well with screen readers) and can be easily customized via CSS. This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) – Bi-weekly sync call recorded on August 27, 2020.

Demo Presenter: Erik Benke (Mentor Graphics) | @erikjbenke

Supporting materials:
• Repo - SPFx Accordion Section FAQ Builder web part | https://github.com/pnp/sp-dev-fx-webparts/tree/master/samples/react-accordion-section

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
11 minutes

accessible

sharepoint

presentation

view

demo

users

accordion

pane

customizable

sections

12 Aug 2020

In this 13-minute Maker and Developer focused demo, Kiran Thomas – acquaints us with the targeted communications Microsoft Teams app template called Company Communicator. App templates are low-code / no-code (Samples) that work out-of-box, are customizable, well documented, and meet Microsoft’s security and privacy standards. Kiran authors a message and covers 3 post options – to a Teams’ General channel, as chat to an individual or to entire organization. This app template is posted in GitHub along with 28 other templates. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on July 23, 2020.

Demo Presenter: Kiran Thomas (Microsoft) | @NotKiran

Supporting materials:
• Company Communicator | https://docs.microsoft.com/en-us/microsoftteams/platform/samples/app-templates#company-communicator
• App Templates for Microsoft Teams | http://aka.ms/TeamsAppTemplates
• Company Communicator App Template | https://github.com/OfficeDev/microsoft-teams-company-communicator-app

Learn more:
• Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
• Visit the SharePoint PnP Developer Community YouTube channel: https://aka.ms/spdev-videos

2 participants
13 minutes

app

apps

application

communicator

ui

template

admins

users

demo

customizable

6 Aug 2020

In this 11-minute Developer - focused demo, Markus Möller introduces viewers to a search-based messaging extension using authentication to display, in a Microsoft Teams channel, all documents requiring review. Documents are stored in a document library. Retrieved documents are transformed into Adaptive cards with View and Review Action buttons. Review action connects to SharePoint via Graph. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on August 6, 2020.

Demo Presenter: Markus Möller (Avanade) | @Moeller2_0

Supporting materials:
• A Microsoft Teams Messaging Extension with Authentication and access to Microsoft Graph | https://mmsharepoint.wordpress.com/2020/07/03/a-microsoft-teams-messaging-extension-with-authentication-and-access-to-microsoft-graph-i/
• GitHub - Document Review Messaging Extension - Microsoft Teams App | https://github.com/mmsharepoint/teams-docreview/tree/master/extension

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

1 participant
11 minutes

messaging

communicate

app

microsoft

middleware

debugging

bot

demo

authentication

configure

23 Jul 2020

In this 12-minute Developer focused demo, Erwin van Hunen – shows several cmdlets for Microsoft Teams that are included with PnP PowerShell. Erwin steps through using a cmdlet to create a Team. Then with cmdlets using Microsoft Graph behind the scenes, Erwin connects to a tenant, adds a channel, adds/removes a tab, and adds a message to channel. Cmdlet help provides synopsis and syntax details. PnP PowerShell (v16.1 - July 2020 release) has these Teams cmdlets. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on July 23, 2020.

Demo Presenter: Erwin van Hunen (Valo Intranet) |@erwinvanhunen

Supporting materials:
• PnP Teams Cmdlets - How to connect | https://www.erwinmcm.com/pnp-teams-cmdlets/

Learn more:
• Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
• Visit the SharePoint PnP Developer Community YouTube channel: https://aka.ms/spdev-videos

2 participants
11 minutes

message

come

takes

wit

users

powershell

affairs

ask

pipa

kempi

14 Jul 2020

In this 40-minute IT Administrator focused feature overview, Sesha Mani and Nikita Bandyopadhyay walk through Microsoft 365 Information Barriers (IB) and how IB policies interplay with SharePoint, OneDrive and Teams experiences. Capabilities are demonstrated and Q&A addresses licensing, availability, future direction. Essentially, IB is a 2nd layer of authorization, the first being SP permissions, explicitly associated to people and sites for controlling access to and dissemination of information for compliance purposes. Information Barriers - already available for Teams was extended to SharePoint and OneDrive in June. This PnP Community demo is taken from the SharePoint (PnP) Community call – July 2020 – Monthly sync call recorded on July 14, 2020.

Topic Presenters:
• Sesha Mani (Microsoft) | @SeshaManiS
• Nikita Bandyopadhyay (Microsoft) | @nikbango

Supporting materials:
• Use information barriers with SharePoint | http://aka.ms/SPOInfobarriers
• Use information barriers with OneDrive | http://aka.ms/OneDriveInfobarriers
• Information barriers in Microsoft Teams | http://docs.microsoft.com/en-us/microsoftteams/information-barriers-in-teams

Learn more:
• Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
• Visit the SharePoint PnP Developer Community YouTube channel: https://aka.ms/spdev-videos

3 participants
40 minutes

sharepoint

sharing

informational

manage

microsoft

security

access

communicate

aware

technology

9 Jul 2020

In this 15-minute Maker focused demo, Kiran Thomas introduces viewers to Microsoft Teams App Templates (PnP Samples) – Low-code/No-code out-of-box plug-and-play apps that can be configured and extended. Three of the 26 available templates are highlighted: Company Communicator, FAQ Plus, and Icebreaker. Quick look at the Teams App Templates Catalog/Documentation. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on July 9, 2020.

Demo Presenter(s): Kiran Thomas (Microsoft) | @notkiran

Supporting materials:
• App Templates for Microsoft Teams | www.aka.ms/teamsapptemplates
Learn more:
• Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
• Visit the SharePoint PnP Developer Community YouTube channel: https://aka.ms/spdev-videos

2 participants
15 minutes

apps

microsoft

platform

overview

users

interface

tools

functionality

teams

manager

9 Jul 2020

In this 11-minute developer focused demo, Alex Terentiev shows a sample web part that stores a Microsoft Teams Personal App's - Web Part properties (configuration settings) using the custom Settings Panel and a custom hidden list located in the user's OneDrive. The properties service gets the user’s properties from the user's OneDrive via Microsoft Graph. This PnP Community demo is taken from the SharePoint Framework and JavaScript Special Interest Group (SIG) call recorded June 18, 2020.

Demo Presenter: Alex Terentiev (Sharepointalist) | @alexaterentiev

Supporting materials:
• React Teams Personal App Settings Web Part | https://github.com/pnp/sp-dev-fx-webparts/tree/master/samples/react-teams-personal-app-settings

Resources:
• Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
• Visit the SharePoint PnP Developer Community YouTube channel: https://aka.ms/spdev-videos

2 participants
11 minutes

configuration

sharepoint

settings

webparts

user

interface

hosted

storing

customize

onedrive

9 Jul 2020

In this 18-minute demo, Stephan Bisser shows Makers and Developers how they can use a new tool called Microsoft Bot Framework Composer to create a Bot from a template or from scratch and in one environment. Scenario defined for this session: Build a very simple Bot that can answer questions stored in a Q&A Maker knowledge base and implement language understanding. Bring to the table - Bot name, Q&A Knowledgebase ID, and basic understanding of Bot functionality. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on July 9, 2020.

Demo Presenter(s): Stephan Bisser (Solvion) | @stephanbisser

Supporting materials:
• Bot Framework Composer Documentation | http://aka.ms/bfcomposer
• Bot Framework Composer Series - 1 - Use Adaptive Cards | https://bisser.io/bot-framework-composer-series-1-use-adaptive-cards/
• GitHub - Microsoft Bot Framework Composer | https://github.com/microsoft/BotFramework-Composer
• Microsoft Bot Framework Web Chat | https://github.com/pnp/sp-dev-fx-webparts/tree/master/samples/react-bot-framework
• Bot Framework Chat React App Customizer | https://github.com/pnp/sp-dev-fx-extensions/tree/master/samples/react-application-botframework-chat
• Learn to Bot | http://bit.ly/LEARN-TO-BOT

Learn more:
• Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
• Visit the SharePoint PnP Developer Community YouTube channel: https://aka.ms/spdev-videos

2 participants
17 minutes

bots

bot

ai

conversational

intelligent

chat

platform

sophisticated

interface

app

24 Jun 2020

This tutorial will guide you on how to build and deploy a Microsoft Teams solution for multiple target environments such as dev, stage and production.

Demo presenter: Wictor Wilen (Avanade) | @wictor

Resources:
• More on the Teams Yeoman Generator: http://aka.ms/yoteams
• Build your First Microsoft Teams App - https://docs.microsoft.com/en-us/microsoftteams/platform/tutorials/get-started-yeoman
• Learn more about the Microsoft 365 developer community at: http://aka.ms/m365pnp

1 participant
7 minutes

package

application

developer

manifest

enterprise

deploy

devops

settings

staging

teams

24 Jun 2020

This tutorial will guide you on how to build Search Messaging Extensions for Microsoft Teams using the Microsoft Teams Yeoman generator (yo teams).

Demo presenter: Bob German (Microsoft) | @Bob1German

Resources:
• More on the Teams Yeoman Generator: http://aka.ms/yoteams
• Build your First Microsoft Teams App - https://docs.microsoft.com/en-us/microsoftteams/platform/tutorials/get-started-yeoman
• Learn more about the Microsoft 365 developer community at: http://aka.ms/m365pnp

1 participant
7 minutes

messaging

app

bot

command

extensions

preview

microsoft

user

queries

server

24 Jun 2020

This tutorial will guide you on how to use Microsoft Teams Yeoman generator (yo teams) to create bots for Microsoft Teams. Video covers how to get started with the Bot Framework configuration and how to build your custom bot experiences.

Demo presenter: Hugo Bernier | @bernierh

Resources:
• More on the Teams Yeoman Generator: http://aka.ms/yoteams
• Build your First Microsoft Teams App - https://docs.microsoft.com/en-us/microsoftteams/platform/tutorials/get-started-yeoman
• Learn more about the Microsoft 365 developer community at: http://aka.ms/m365pnp

1 participant
11 minutes

bot

bots

chat

creating

app

launch

server

team

portal

chieko

24 Jun 2020

This tutorial will guide you on how to create a customt ab with Microsoft Teams Yeoman generator (yo teams).

Demo presenter: Paolo Pialorsi (PiaSys) | @PaoloPia

Resources:
• More on the Teams Yeoman Generator: http://aka.ms/yoteams
• Build your First Microsoft Teams App - https://docs.microsoft.com/en-us/microsoftteams/platform/tutorials/get-started-yeoman
• Learn more about the Microsoft 365 developer community at: http://aka.ms/m365pnp

1 participant
6 minutes

generator

package

creating

project

configuration

debugging

script

provide

team

ui

11 Jun 2020

In this video we'll demonstrate the steps to take advantage of Microsoft Teams personal apps and how we can expose modern SharePoint corporate communication portal welcome page or other relevant content in Microsoft Teams as a no-code solution - only with configurations in the user interface.

Video also covers how to pin the portal to the Microsoft Teams left menu selection by default for the company employees. This is a great solution to combine best of both worlds by having corporate communications portal exposed for employees in their collaboration platform.

Demonstrated solution works in Microsoft Teams in all different clients - web, desktop and mobile.

Notice that this capability is provided as a preview integration path - and we will be improving this feature and integration further in future.

Resources on the covered topics:

- Documentation and tutorial on embedding SharePoint pages in Microsoft Teams as a personal app - https://docs.microsoft.com/en-us/sharepoint/dev/features/embed-pages-to-teams
- Microsoft Look Book - https://lookbook.microsoft.com
- Manage app setup policies in Microsoft Teams - https://docs.microsoft.com/en-us/microsoftteams/teams-app-setup-policies

Video has been recorded in June 2020. We will keep on evolving this guidance as new native capabilities are released.

1 participant
22 minutes

sharepoint

microsoft

share

exposing

intranets

communication

users

collaborate

access

suggest

28 May 2020

In this 15-minute developer focused demo, Thomy Göelles introduces us to a Microsoft Teams use case for Blazor - an open-source interactive web framework being developed by Microsoft and part of .NET using C#. Viewers will see how authentication flows from Teams to your Blazor tab, how to call Microsoft Graph endpoints, how get the current Teams token, and how the "Blazored PnP Team Roster" Teams tab was created. This PnP Community demo is taken from the bi-weekly Microsoft 365 – General M365 development Special Interest Group (SIG) community call recorded on May 28, 2020.

Demo Presenter: Thomy Göelles (Solvion) | @thomyg

Supporting materials:
• Blazor web site | https://dotnet.microsoft.com/apps/aspnet/web-apps/blazor
• Blog post around the showed sample | https://thomy.tech/microsoft-teams-tab-with-blazor/

All Microsoft 365 PnP Community demos, training and call videos: https://aka.ms/spdev-videos

Learn more about the Microsoft 365 PnP developer community at: http://aka.ms/m365pnp

2 participants
15 minutes

blazer

browsers

vps

client

vm

backend

topic

applications

microsoft

laser

21 May 2020

In this 6-minute developer focused demo, Vesa Juvonen delivers a preview of a Microsoft Teams solution that uses an SPFx Leads Management System web part, to interact with a LOB Leads Management system – API integration via Bot and SPFx messaging extensions. The M365 solution draws upon capabilities of Microsoft Graph, Bot Framework, SharePoint, SharePoint Framework, Teams, Azure, To Do/Planner and Adaptive Cards. This is a preview because Task modules (messaging extensions) are not yet supported. Messaging extensions are supported in SharePoint Framework v1.11, to be released by end of June 2020. This demo is extracted from the bi-weekly PnP community – SharePoint Framework and JavaScript Special Interest Group (SIG) call recorded May 21, 2020.

Presenter: Vesa Juvonen (Microsoft) | @vesajuvonen

Supporting materials:
• Leads Management System - LOB solution demo | https://github.com/pnp/sp-dev-solutions/tree/master/solutions/LeadsLOBSolution

All Microsoft 365 & SharePoint Community - PnP demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/m365pnp

1 participant
6 minutes

implementing

wakeboard

hosted

setup

enterprise

task

controller

repository

microsoft

bots

14 May 2020

Need hosted or server-side processing for your app? Creating a Teams app and you want also to deploy it to SharePoint Online as a web part or as a full-page app? In this 18-minute demo, Wictor Wilén, steps viewers the creation/simple configuration of a Microsoft Teams tab (app) using the latest yo Teams generator, publishing the app in Teams and SharePoint Online app catalogs and finally adding the app to a Teams tab and to SharePoint pages as a web part and as a full page app. Usage scenarios are discussed briefly at the end of this demo.

This PnP Community demo is taken from the bi-weekly Microsoft 365 – General M365 development Special Interest Group (SIG) community call recorded on May 14, 2020.

Demo Presenter: Wictor Wilén (Avanade) | @wictor

Supporting materials:
• http://aka.ms/yoteams
• Community Demo – Implementing a Single sign-on (SSO) Microsoft Teams tab using yo Teams | https://www.youtube.com/watch?v=zc9S270c-Dg
• Community Demo - Getting started on using yo Teams for building your Microsoft Teams solutions | https://www.youtube.com/watch?v=w0OrFkzNC10

All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/m365pnp.

2 participants
15 minutes

sharepoint

server

provider

browser

hosted

rendering

api

application

upload

sharpen

14 May 2020

In this 26-minute developer focused demo, Paolo Pialorsi steps through 3 tenant provisioning scenarios leveraging templates in the PnP Provisioning engine along with the corresponding PowerShell scripts to provision Teams and SPO sites with related content. Provisioning scenarios include: 1) Provision Team site using credentials of 1 person, 2) Provision Team site using an app only context and certificate, and 3) Provision a site collection (SPO site and library) and a connected Team site with SharePoint doc library tab, using a sequence of templates. In each scenario, General and Private Teams channels are provisioned. Optionally, a welcome message, tabs, landing page and/or document libraries are provisioned at the same time.

This PnP Community demo is taken from the bi-weekly Microsoft 365 – General M365 development Special Interest Group (SIG) community call recorded on May 14, 2020.

Demo Presenter: Paolo Pialorsi (Piasys) | @PaoloPia

Supporting materials:
• Community Demo – Introduction to Initialize-PnPPowerShellAuthentication cmdlet | https://www.youtube.com/watch?v=QWY7AJ2ZQYI

All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/m365pnp.

2 participants
25 minutes

provisioning

provisioned

provision

templates

configuration

delegated

tenant

sharepoint

users

teams

12 May 2020

In this 45-minute administrator/developer focused tour of the latest security controls and sensitivity labeling capabilities available today or soon in SharePoint, OneDrive and Microsoft Teams, Microsoft (GPM), Sesha Mani, shows protective capabilities aligned to 4 data security pivots - users, devices, locations, and information. There are demos of manually creating a sensitivity label in the Microsoft 365 Compliance Center, configuring automatic (rules-based) classification/labeling policies, auditing capabilities available in Content Explorer, and of a capability called: “Protect sensitive information from the get-go” - block external access to newly published content by default until a Data Loss Prevention (DLP) scan verifies sensitivity. The session concludes with Roadmap and Q&A.

This PnP community demo is taken from the monthly SharePoint Community (PnP) call recorded on May 12, 2020.

Presenter: Sesha Mani (Microsoft) | @SeshaManiS

Supporting materials:
• Sensitivity Labels with protection in SharePoint and OneDrive (GA) | https://aka.ms/M365FilesLabelsGA
• Sensitivity Labels to protect content in SharePoint sites, Microsoft Teams and Microsoft 365 groups (Public Preview) | https://aka.ms/M365SitesLabels
• Automatic Classification of content with Sensitivity Labels (Public Preview) | https://aka.ms/SPOAutoClassification

All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/m365pnp.

2 participants
45 minutes

security

privacy

remotely

compromised

authentication

sharepoint

risk

manage

vpn

trust

10 May 2020

This 10 minute video will show you how to use Bot State so the web service that implements your bot can be stateless. You'll learn about how bots using the Azure Bot Builder SDK manage information about the conversation and the users in it, how to choose and configure a Bot state provider (JavaScript), and how to use conversation and user state in a Bot (JavaScript)

Presenter: Bob German (Microsoft) | @Bob1German

Supporting materials:

• Teams Dev Center: https://developer.microsoft.com/en-us/microsoft-teams
• Microsoft Bot Framework: https://dev.botframework.com/
• Create a Bot for Microsoft Teams: https://docs.microsoft.com/en-us/microsoftteams/platform/bots/how-to/create-a-bot-for-teams

PnP videos for Teams developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWG3R399jMSrt1eFa5KErvc

PnP videos for Teams low-code developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OUEuwES5Zn66qUdUdD60PCZ

1 participant
10 minutes

bots

bot

recall

communicates

dialogue

tracking

demo

server

state

turn

10 May 2020

This video is part 3 of a 3 part series on building conversational bots for Microsoft Teams. This part shows how to build a bot that takes commands using natural language with Adaptive Cards. You will learn how to use an adaptive card to capture information from a bot dialog, and how to update the adaptive card right in the Teams conversation to notify users of status changes. It also shows how to access Team roster using the Bot Builder SDK 4.6+.
Sample code in C# is provided; the concepts are the same in other languages.

Presenter: Bob German (Microsoft) | @Bob1German

Supporting materials:

• Adaptive Cards: https://adaptivecards.io
• Sample bot code: https://aka.ms/ConsultingBot
• Microsoft Bot Framework: https://dev.botframework.com/
• Teams Dev Center: https://developer.microsoft.com/en-us/microsoft-teams

PnP videos for Teams developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWG3R399jMSrt1eFa5KErvc

PnP videos for Teams low-code developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OUEuwES5Zn66qUdUdD60PCZ

1 participant
17 minutes

conversational

bot

conversations

chat

dialogue

interacts

adaptive

threading

demos

consulting

10 May 2020

This 16 minute video is part 1 of a 3 part series on building conversational bots for Microsoft Teams. This part introduces the Language Understanding Intelligent Service (LUIS) in Microsoft Azure, and shows how to use it to predict the user's intent and details about the user's request (called entities). Sample code in C# is provided; the concepts are the same in other languages.

Presenter: Bob German (Microsoft) | @Bob1German

Supporting materials:

• Sample bot code: https://aka.ms/ConsultingBot
• LUIS: https://luis.ai
• Microsoft Bot Framework: https://dev.botframework.com/
• Teams Dev Center: https://developer.microsoft.com/en-us/microsoft-teams

PnP videos for Teams developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWG3R399jMSrt1eFa5KErvc

PnP videos for Teams low-code developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OUEuwES5Zn66qUdUdD60PCZ

1 participant
17 minutes

bots

bot

conversational

dialogue

intelligent

ai

contextual

app

project

tutorial

10 May 2020

This video is part 2 of a 3 part series on building conversational bots for Microsoft Teams. This part introduces the concept of bot dialogs and shows how to use them to prompt users for any missing or ambiguous information in their request. Sample code in C# is provided; the concepts are the same in other languages.

Presenter: Bob German (Microsoft) | @Bob1German

Supporting materials:

• Sample bot code: https://aka.ms/ConsultingBot
• Microsoft Bot Framework: https://dev.botframework.com/
• Teams Dev Center: https://developer.microsoft.com/en-us/microsoft-teams

PnP videos for Teams developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWG3R399jMSrt1eFa5KErvc

PnP videos for Teams low-code developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OUEuwES5Zn66qUdUdD60PCZ

1 participant
14 minutes

bots

bot

conversational

dialogue

intelligent

understanding

automatically

messages

client

contoso

10 May 2020

This 15 minute video will show you how to get started with a Node.js or C# bot for Microsoft Teams. You will learn how to:

1. Generate a bot in JavaScript or C#
2. Access your bot using the Bot Framework Emulator
3. Use ngrok to expose your bot on the Internet
4. Register your Bot and add security
5. Create an App in Teams for the bot

Presenter: Bob German (Microsoft) | @Bob1German

Supporting materials:

• Teams Dev Center: https://developer.microsoft.com/en-us/microsoft-teams
• Microsoft Bot Framework: https://dev.botframework.com/
• Create a Bot for Microsoft Teams: https://docs.microsoft.com/en-us/microsoftteams/platform/bots/how-to/create-a-bot-for-teams

PnP videos for Teams developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWG3R399jMSrt1eFa5KErvc

PnP videos for Teams low-code developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OUEuwES5Zn66qUdUdD60PCZ

1 participant
15 minutes

bots

bot

botch

chat

app

messages

setup

interface

debugging

azure

10 May 2020

This 14-minute video introduces the idea of Adaptive Cards - lightweight nuggets of interactive content that you can embed in Teams and many other applications. It's intended for developers and low-code developers who will use adaptive cards in Microsoft Teams or other applications.
Live JavaScript samples are provided which show how to use adaptive card templating and the adaptive card template service.

Presenter: Bob German (Microsoft) | @Bob1German

Supporting materials:

• Adaptive Cards: https://adaptivecards.io
• Sample 1: https://bit.ly/ACTemplates1
• Sample 2: https://bit.ly/ACTemplates2

PnP videos for Teams developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWG3R399jMSrt1eFa5KErvc

PnP videos for Teams low-code developers: https://www.youtube.com/playlist?list=PLR9nK3mnD-OUEuwES5Zn66qUdUdD60PCZ

1 participant
14 minutes

adaptive

cards

card

adapter

applications

interactive

embed

tabs

host

microsoft

7 May 2020

In this 9-minute developer focused demo, Ramin Ahmadi shares an idea for orgs that use Yammer. His web part allows users to Praise colleagues from a Teams tab or Sharepoint page. In the web part, you can search for people, add a message, select a Yammer Group, select a praise representation icon and preview the post in Yammer. The web part uses the Yammer REST API SPFx web part, React hooks, SPFx people picker control, and gets tokens for authenticating to M365 resources from Azure AD. This demo is extracted from the bi-weekly PnP community – SharePoint Framework and JavaScript Special Interest Group (SIG) call recorded May 7, 2020.

Presenter: Ramin Ahmadi (Content and Code) | @raminahmadi1986

Supporting materials:
• Sample: React Yammer API https://github.com/pnp/sp-dev-fx-webparts/tree/master/samples/react-yammer-api
• Sample: React Yammer Praise https://github.com/pnp/sp-dev-fx-webparts/tree/master/samples/react-yammer-praise

All Microsoft 365 & SharePoint Community - PnP demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/m365pnp

2 participants
9 minutes

yammer

communicate

client

hosting

users

token

authenticate

admin

app

sharepoint

23 Apr 2020

In this 13-minute developer focused demo, Hugo Bernier delivers both a SPFx web part (Adaptive Cards Host) that you can use to display Adaptive Cards in your SharePoint applications and the core AdaptiveCards control responsible for rendering the card. The Host web part works with any/all Adaptive Card schemas (available at https://adaptivecards.io) and it will render them as if they were native to SharePoint. The web part allows you to configure template JSON and – optionally – data JSON to render, specifically for this demo, the “Activity update sample” from the adaptivecards.io site. In time, the AdaptiveCard control will be made available in the PnP reusable controls library. This demo is extracted from the bi-weekly PnP community – SharePoint Framework and JavaScript Special Interest Group (SIG) call recorded April 23, 2020.

Presenter: Hugo Bernier (Tahoe Ninjas) | @bernierh

Supporting materials:
• Adaptive Cards Host | https://github.com/SharePoint/sp-dev-fx-webparts/tree/master/samples/react-adaptivecards
• Adaptive Cards web site | https://adaptivecards.io/

All Microsoft 365 & SharePoint Community - PnP demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o

Learn more about the SharePoint developer community at: http://aka.ms/m365pnp

2 participants
13 minutes

card

adaptive

cards

users

user

presenting

host

demo

loading

expert

22 Apr 2020

In this video we'll walkthrough the steps on creating a complex Microsoft Teams personal apps using SharePoint Framework. Video shows how to use Microsoft Teams App Studio to create a manifest for SharePoint Framework solution which can provide a multi-tab experience and potentially to include also a bot on the personal solution.

This setup is aligning with the design guidance for the Microsoft Teams personal apps to have standard set of tabs for end users. Video demonstrates creation of the solution manifest file manually, rather than taking advantage of the standard "Sync to Teams" synchronization for getting SharePoint Framework solutions also available in Microsoft Teams.

Resources:

- Microsoft Teams Personal Apps - Design Guidance - https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/design/personal-apps
- Creating manifest manually for SharePoint Framework solutions - https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/guidance/creating-team-manifest-manually-for-webpart
- Getting started tutorial on creating Microsoft Teams channel tabs with SharePoint Framework - https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/using-web-part-as-ms-teams-tab

Learn more about the Microsoft 365 & SharePoint developer community at: http://aka.ms/m365pnp.

1 participant
32 minutes

sharepoint

applications

personal

apps

manage

microsoft

multi

platform

version

permissions

2 Apr 2020

Creating a new or exposing one of your existing SPFx web applications in a Teams tab and you need to verify user is signed-in? In this 20-minute demo, Wictor Wilén shows tab features in preview version (2.13.0-preview2) of yo Teams that address SSO requirements. This developer demo shows simplified behind-the-scenes configuration and token management necessary to ensure the people viewing your app exposed in a Teams tab are authorized to view it. Look for a release build of yo Teams with tab SSO enablement in mid-April. This demo is extracted from the bi-weekly Microsoft 365 PnP community – General M365 Developer Special Interest Group (SIG) call recorded April 2, 2020.

Presenter: Wictor Wilén (Avanade) | @wictor

Supporting materials:
• PnP Weekly - Ep 77 | https://youtu.be/gq8AgxjnTcE
• Getting Started using yo Teams | https://youtu.be/w0OrFkzNC10

All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/m365pnp.

1 participant
20 minutes

setup

tabs

server

registrations

sharepoint

configurable

manage

microsoft

teams

preview

19 Mar 2020

This PnP Community demo is taken from the bi-weekly Microsoft 365 – General M365 development Special Interest Group (SIG) community call recorded on March 19, 2020.

If you are new to Teams app development, then this 16-minute premier is a must view demo. Wictor Wilen quickly and neatly steps through installing (scaffold out a Teams project) and using Yo Teams - the Microsoft Teams app generator. Yo Teams has been around for 3 years and in used to build Teams apps - tabs, bots, messaging extensions, etc. The generator has capabilities SPFx does not have - client and server side tabs, bots, connectors, web hooks... The Repo has solid Quick Starts, tutorials, samples, and guidance. The presenter also does a good job calling out the differences between SharePoint and Teams generators throughout the demo.

Demo Presenter: Wictor Wilen (Avanade) | @wictor

Supporting materials:
• Yo Teams GitHub repo: https://aka.ms/yoteams

All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/sppnp.

2 participants
16 minutes

generator

starters

started

nodejs

project

setup

server

sharepoint

micro

pnp

10 Mar 2020

This engineering demo is taken from the monthly SharePoint Community (PnP) call recorded on March 10, 2020.

In this 40-minute update with demos, Tejas Mehta and Prateek Dudeja - SharePoint Program Managers at Microsoft, deliver a 2-part session on SharePoint and Microsoft Teams – better together updates.

• Part 1: Getting the most out of current Teams integrations - Groupify & Teamify, Lists & Libraries, and Pages and News. Teamify = add a Team to a Group and Groupify = add a group to a Team site.
• Part 2: A glimpse into what's coming - Teamify v2, New pages tab, and richer SharePoint resources in chat – Adaptive Cards.
• Q&A

Presenters:
• Tejas Mehta (Microsoft) | @tpmehta
• Prateek Dudeja (Microsoft)

All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/sppnp.

3 participants
40 minutes

collaboration

sharing

collaborate

sharepoint

teamwork

discussions

communicate

manage

presenting

attention

13 Feb 2020

In this guidance video, we concentration how to build Microsoft Teams personal apps using SharePoint Framework. We introduced a capability to build Microsoft Teams tabs with SharePoint Framework with the v1.8 and with the 1.10, you can also implement personal apps with SharePoint Framework.

Any SharePoint Framework web part can be updated to be a Microsoft Teams tab or personal app without requirements for code changes, just by updating solution metadata - it does not get easier than this.

Key advantages on using SharePoint Framework for the Microsoft Teams development are the following:

- Unified development experience with Microsoft Teams, SharePoint and Office add-ins (currently in preview)
- Automatic hosting of your solution - no need for Azure web sites or other host setup
- Streamlined deployment and operations - You can simply deploy your solution as Microsoft Teams app using UX elements available for administrators with one click publishing of your solution
- Easy management of Graph and API permissions with the SharePoint Framework model
- Direct access on underlying storage and other services in SharePoint and OneDrive
- Optimized load times with Office 365 CDN settings automatically applied, if feature is enabled in the tenant level (it's free, so you should do it)

Video covers following assets and resources:

- Step-by-Step tutorial for creating Microsoft Teams tab or personal app using SharePoint Framework - https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/using-web-part-as-ms-teams-tab
- Office 365 CLI - for easy solution upgrades (it's magic) - https://pnp.github.io/office365-cli/
- Leads solution - Works as a Teams tab, Teams personal app, SharePoint app page or SharePoint web part - https://github.com/SharePoint/sp-dev-solutions/tree/master/solutions/LeadsLOBSolution

More details around the different assets and community efforts from http://aka.ms/sppnp

1 participant
15 minutes

sharepoint

microsoft

applications

download

admin

office

easy

access

host

micro

13 Feb 2020

This PnP community demo is taken from the bi-weekly SharePoint Developer Community – SharePoint Framework and JavaScript Special Interest Group (SIG) call recorded on February 13, 2020

In this 20-minute demo, Sébastien Levert – MVP, reviews 2 ways to insert a React Calendar component into a Teams: 1) as a Teams Channel tab (events only from the team calendar) or 2) as a Personal App (events from both the team and your personal calendars). Showcased is the power and diversity of an SPFx web part - as it and SPFx web parts generally can be placed in products spanning the productivity suite, i.e., SharePoint, Teams tab, Teams Personal App, Office Add-ins.... Quit building calendars and save time getting data courtesy of Microsoft Graph. This web part also delivers the right color calendar as it detects and adopts destination page color theme.

Presenter:
• Sébastien Levert (Valo Intranet) | @sebastienlevert

Supporting materials:
• Video: No-code solution to expose your modern SharePoint Online corporate portal in Microsoft Teams | https://www.youtube.com/watch?v=WyB4MBQwICs
• Video: AMA on SharePoint Framework current and vNext | https://www.youtube.com/watch?v=FNx6I5-wfTo
• Video: PnPjs v2 Deep Dive on Selective Imports | https://www.youtube.com/watch?v=xekNSc3GAtY
• PnP SPFx Web Part Samples | https://github.com/SharePoint/sp-dev-fx-webparts
• Full sized JavaScript Calendar | https://fullcalendar.io
• Fluent UI React | https://github.com/microsoft/fluent-ui-react

All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/sppnp.

2 participants
20 minutes

sharepoint

share

project

software

hosts

tooling

spf

enhancement

showcase

webparts

4 Feb 2020

This PnP community demo is taken from the bi-weekly SharePoint Developer Community - General Development Special Interest Group (SIG) call recorded on January 23, 2020.

In this 11-minute video, Chris Kent, Microsoft MVP and Office 365 Practice Lead at DMI, previews how a SharePoint list in a Microsoft Teams tab can be formatted in SharePoint from within the Teams tab. Note: This new formatting capability presently available only in the Teams Targeted Release, looks quite promising for SR. Formatting in SharePoint is fully supported in Teams with few exceptions. In the PnP list formatting repo on GitHub, there are 70 list column and view formatting code samples that one can simply copy and paste into the list’s column settings. Also shown in this demo was the addition of deep links - into chat, into tabs, into scheduling dialog, etc., in a list column.

Presenter: Chris Kent (DMI) | @theChrisKent

Supporting materials:
• Docs: https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/build-and-test/deep-links#deep-linking-to-a-chat
• Sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/multi-person-teams-chat-link
• Sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/multi-person-facepile

All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/sppnp.

1 participant
11 minutes

sharepoint

formatting

horses

settings

bringing

changes

note

presentation

collaborative

mess

3 Feb 2020

This tutorial will guide you through on how you can use SharePoint Framework to build a custom solution, which can then be surfaced in both SharePoint and in Microsoft Teams as a tab.

You can use the same code base across Office 365 as SharePoint, Microsoft Teams or Office add-in solution.

You can find the written version of this tutorial from the following location - https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/using-web-part-as-ms-teams-tab

January 2020 version using SharePoint Framework 1.10.

More details around SharePoint Framework from http://aka.ms/spfx

Get involved on the SharePoint & Microsoft 365 Patterns and Practices - reusable controls, components, open-source projects, community calls and much more. See more details from http://aka.ms/sppnp

Sharing is caring!

1 participant
24 minutes

sharepoint

themes

tutorial

user

downloaded

webpart

tabs

microsoft

starting

teamstepps

30 Jan 2020

This PnP community demo is taken from the bi-weekly SharePoint Developer Community – SharePoint Framework and JavaScript Special Interest Group (SIG) call recorded on January 30, 2020.

In this 8-minute video, Bob German - Partner technical architect at Microsoft, presents a low code solution for surfacing personal/private SharePoint applications in Teams and Group Chats. The SPFx solution is an easily configurable SharePoint Tabs web part – that allows users to add a tab in the top nav of their Teams site that links to a targeted SharePoint page/application. Up until this point, the options have been: Users can add a link to an application in their personal Teams sidebar – "Status tabs" or to pull in a custom solution. Site Administrators can easily add the web part to the Teams app gallery.

Presenter:
• Bob German (Microsoft) | @Bob1German

Supporting materials:
• Blog article: Building Microsoft Teams apps with SharePoint Pages – Part 1, Get Started - https://bob1german.com/2020/01/06/teams-apps-with-sharepoint1/ | Bob German (Microsoft) | @Bob1German
• Blog article: Building Microsoft Teams apps with SharePoint Pages – Part 2, Build your Own - https://bob1german.com/2020/01/07/teams-apps-with-sharepoint2/ | Bob German (Microsoft) | @Bob1German

All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/sppnp.

2 participants
8 minutes

sharepoint

provisioning

user

administration

editing

apps

microsoft

capabilities

project

sidebar

23 Jan 2020

This PnP community demo is taken from the bi-weekly SharePoint Developer Community - General Development Special Interest Group (SIG) call recorded on January 23, 2020.

In this 17-minute video, the presenters Franck Cornu - Office 365 developer and owner of Aequos in Montreal and Vincent Biret – Microsoft MVP, now Program Manager on the Microsoft Graph team, have created a tutorial/workshop with excellent documentation on how to create an end-to-end Office 365 groups provisioning solution. Get hands on experience with how technologies including: .NET Core, TypeScript development, Azure Functions, Azure Logic Apps, Microsoft Graph, PnP PowerShell, and PnP Provisioning, work together to deliver this automated provisioning solution.

Presenters:
• Vincent Biret (Microsoft) | @baywet
• Franck Cornu (aequos) | @FranckCornu

Supporting materials:
• Workspace Provisioning Tutorial - https://github.com/pnp/tutorial-workspace-provisioning
• SharePoint Provisioning essentials - https://laurakokkarinen.com/teams-and-sharepoint-provisioning-what-why-and-how/ | Laura Kokkarinen (Sulava) | @laurakokkarinen

All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint developer community at: http://aka.ms/sppnp.

3 participants
17 minutes

provisioning

provision

workshop

publishing

graphs

repository

users

microsoft

concerns

groups

21 Jan 2020

This SharePoint focused demo was extracted from the Microsoft Graph Developer Community call recorded on January 7, 2020. The entire 60-minute call/demo is found at: https://youtu.be/efcg0n6iRco

In this 13-minute extract, Jeremy Thake (Microsoft Graph) and Todd Baginski (Microsoft MVP) share a cross-platform solution called Meeting Capture app. The result of a collaborative effort in which many M365 orgs including SharePoint (Vesa Juvonen), Graph (Ben Summers, Nikola Metulev), and Teams (Joey Glocke). The sample app was created for and shown at Microsoft Ignite 2019 and continues to evolve. In the first 7 minutes of this session, Jeremy gives viewers a capabilities overview of the all-in-one meeting notes tool. Then in the last 6 minutes, Todd explains the role played by SharePoint namely to store documents and to display meeting events and tasks assigned for the selected call either within SharePoint or inside a Microsoft Teams tab. The web part retrieves task information for meetings aligned to a specific Teams’ channel via the Graph API. For meetings created with this app, all pre-read documents as well as attachments collected during a meeting, are stored in the meeting related SharePoint folder created when the meeting was created.

In the full Graph call recording, Jeremy and Todd are joined by Nikola Metulev (Microsoft Graph), who explains how The Microsoft Graph Toolkit was used for this solution.

Meeting Capture capabilities include: Meeting scheduling, document/notes/agenda capture, task assignments, meeting logistics reporting/approvals. The app is effectively a single functional front-end that connects to a host of platform services each of which may be accessed separately or via the Meeting Capture app. This uniting palate of capabilities is neatly tucked into Microsoft’s robust Teams unified communications platform.

The Meeting Capture App incorporates: Graph API, Azure Services (AD, registration, permissions, SQL), SharePoint/SPFx, Outlook, Planner, SQL, OneNote, Teams, Graph Toolkit, App Studio, Power Automate.

Presenters:
• Overview: Jeremy Thake (Microsoft) | @jthake
• Function: Todd Baginski (Canviz) | @toddbaginski

Supporting materials:
• Code for the Meeting Capture App https://github.com/microsoftgraph/meetings-capture-sample Todd Baginski (Microsoft) | @toddbaginski
• Using Microsoft Graph APIs in your solution https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/using-microsoft-graph-apis
• End to end demonstration of the Meeting Capture application functionality https://youtu.be/i2dqLM_ciUA

All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2

Learn more about the SharePoint/Office 365 developer community at: http://aka.ms/sppnp.

2 participants
13 minutes

committee

members

attendee

governance

discussions

user

schedule

app

suggestions

tab

Microsoft 365 Community / Microsoft Teams

28 Sep 2023

13 Sep 2023

22 Aug 2023

22 Aug 2023

10 Aug 2023

18 Jul 2023

13 Jul 2023

6 Jul 2023

4 Jul 2023

27 Jun 2023

27 Jun 2023

13 Jun 2023

12 Jun 2023

23 May 2023

16 May 2023

9 May 2023

9 May 2023

4 May 2023

2 May 2023

2 May 2023

26 Apr 2023

25 Apr 2023

25 Apr 2023

20 Apr 2023

18 Apr 2023

10 Apr 2023

6 Apr 2023

5 Apr 2023

4 Apr 2023

31 Mar 2023

30 Mar 2023

28 Mar 2023

28 Mar 2023

21 Mar 2023

20 Mar 2023

14 Mar 2023

7 Mar 2023

28 Feb 2023

28 Feb 2023

28 Feb 2023

15 Feb 2023

7 Feb 2023

27 Dec 2022

22 Dec 2022

6 Dec 2022

22 Nov 2022

15 Nov 2022

8 Nov 2022

26 Oct 2022

24 Oct 2022

18 Oct 2022

11 Oct 2022

29 Sep 2022

29 Sep 2022

27 Sep 2022

27 Sep 2022

20 Sep 2022

23 Aug 2022

28 Jul 2022

20 Jul 2022

23 Jun 2022

12 May 2022

5 May 2022

3 May 2022

2 May 2022

26 Apr 2022

20 Apr 2022

19 Apr 2022

15 Apr 2022

14 Apr 2022

12 Apr 2022

12 Apr 2022

6 Apr 2022

22 Mar 2022

17 Mar 2022

8 Mar 2022

3 Feb 2022

3 Feb 2022

28 Jan 2022