antoniogatti / tab-spfx-me-experience

Me experience

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

• SharePoint Framework
• Microsoft 365 tenant

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 SharePoint Appcatalog

gulp bundle --ship

gulp package-solution --ship

• Download the Me.zip file 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