Me experience
A Me-experience in Microsoft Teams using SharePoint Framework where users can start their day and see their personal information using Microsoft Graph Toolkit React components.
Summary
Multiple web parts in multiple tabs, using REACT and SPFx. Respects multiple theme in Teams and also have user's settings stored in Open extensions making it completely personalised.
Used SharePoint Framework Version
Applies to
Get your own free development tenant by subscribing to Microsoft 365 developer program
Solution
| Solution | Author(s) |
|---|---|
| Rabia Williams | @williamsrabia |
Version history
| Version | Date | Comments |
|---|---|---|
| 1.1 | June 10, 2021 | Replaced custom Files component with MGT FileList component |
| 1.0 | November 08, 2020 | Initial release |
Disclaimer
THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.
Minimal Path to Awesome
- Clone this repository
- Ensure that you are at the solution folder
- in the command-line run:
- npm install
- Bundle and package up the solution (use below script) and deploy to
SharePointAppcatalog
gulp bundle --ship
gulp package-solution --ship
-
Download the
Me.zipfile from the folder ./teams -
Upload it in your Teams (provided you have access, or send it to the IT admin who will be able to upload it for you)
Kudos 👏🏽
- Microsoft Graph Open Extensions blog by Joao Mendes for providing great sample with themes applied for Teams and open extensions used for user settings.
References
- Microsoft Graph Toolkit React components.
- Getting started with SharePoint Framework
- Building for Microsoft teams
- Use Microsoft Graph in your solution
- Publish SharePoint Framework applications to the Marketplace
- Microsoft 365 Patterns and Practices - Guidance, tooling, samples and open-source controls for your Microsoft 365 development