Contoso Retail Dashboard

The idea behind the sample

This is a sample end-to-end application, based on demo sample data, that shows you how to create a Microsoft Teams personal app with SharePoint Framework, hosting the solution also in Outlook.com and in the Office portal as a Microsoft 365 app. The solution also provides a sample Adaptive Card Extension (ACE) for Microsoft Viva Connection, still built with SharePoint Framework. The sample illustrates how to connect the ACE with the Teams personal app, providing custom arguments to the Teams personal app via deep links defined in the ACE. Last but not least, the solution illustrates how to create a Teams Message Extension for Search using Microsoft Teams Toolkit.

Make it your own

Start with the author's setup instructions, explore the implementation, and adapt the pattern to your environment. Sample code stays in its original repository, together with its requirements, license and contribution history.

A closer look

Keep exploring

• Getting started with SharePoint Framework — Introduction about how to develop Microsoft 365 extensions using SharePoint Framework.
• Build your first SharePoint Adaptive Card Extension — Learn how to develop your first Adaptive Card Extension (ACE) using SharePoint Framework (SPFx).
• Building for Microsoft teams — Learn how to develop for Microsoft Teams using SharePoint Framework.
• Use Microsoft Graph in your solution — Learn how to consume Microsoft Graph using SharePoint Framework (SPFx).
• Teams Toolkit Overview — Microsoft Teams Toolkit Overview.
• Add single sign-on to Teams app — Add single sign-on to Teams app.
• Microsoft 365 Patterns and Practices — Guidance, tooling, samples and open-source controls for your Microsoft 365 development.

Keep the ideas flowing

• Card Composition
• Upcoming Events Viewer
• HTML QuickView basic demo
• React HTML Quickview