SharePoint Framework Special Interest Group (SIG) bi-weekly community call recording from October 7th is now available from the Microsoft 365 Community YouTube channel at http://aka.ms/m365pnp/videos. You can use SharePoint Framework for building solutions for Microsoft Teams and for SharePoint Online.
A reminder to tune in each Tuesday for the new Microsoft 365 platform community call. Topics for the call on October 12 are Progressive Web Apps and Beyond: Supercharging OneDrive & SharePoint web apps and Hands-on with Microsoft Graph File Uploads and Downloads. The time is now to register for Hacktoberfest 2021. Register for training events in October – November hosted by Sharing is Caring. Register for the PnP Recognition Program. SharePoint Framework v1.13 GA nearing release will include Viva Connections extensibility support, General Availability of Adaptive Card Extensions (ACEs), Microsoft Teams Workbench for SharePoint Framework, tool support, image rendering APIs and more.
PnP project releases shipped - PnPjs Client-Side Libraries v3.0.0 early preview, and CLI for Microsoft 365 v4.0.0 GA with breaking changes.
Latest project updates include: (Bold indicates update from previous report 2 weeks ago)
|PnP Project||Current version||Release/Status|
|SharePoint Framework (SPFx)||v1.12.1 GA, v1.13 Beta Viva.20||v1.13 GA (on a Tuesday soon)|
|PnPjs Client-Side Libraries||v2.9.0 GA, v3.0.0 early preview||
|CLI for Microsoft 365||v3.13.0 Preview, v4.0.0 GA||
|Reusable SPFx React Controls||
v2.9.0 (SPFx v1.11), v3.3.0 (SPFx v1.12.1)
|Reusable SPFx React Property Controls||v2.7.0 (SPFx v1.11), v3.2.0 (SPFx v1.12.1)|
|PnP SPFx Generator||v1.16.0||v1.17.0 on the way|
|PnP Modern Search||v4.3.0 & v3.21.0||Release expected any day|
Additionally, 1 extension and 6 web part and 6 ACE samples delivered in the last 2 weeks! Wowmazing! Thank you all for your contributions. The host of this call is Patrick Rodgers (Microsoft) | @mediocrebowler. Q&A takes place as always in chat throughout the call.
Not an empty seat in the house. Nice seeing everyone on the call. Please join again soon.
Create new Team using Viva Connections ACEs components from the Dashboard – overview of ACEs (Adaptive Card Extensions) - Dashboard, Card view and Quick view. Integration with Microsoft Graph APIs. Handling clicks in Card and Quick views to create a team from desktop or mobile dashboards. Creates team using Graph API method. Thorough code walk-through. Button on “Team Create Request” card to “Open Form” – opens Quick view. Team creation is confirmed on Quick view.
Building Microsoft Teams data dashboard with SharePoint Framework – 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.
SPFx Design Patterns – Asynchronous Rendering – slow web parts slows pages, slows Teams apps, and often is attributed to web part rendering as opposed to being hung or frozen. Waiting on data slows rendering. OOB rendering is commonly synchronous. The fix - asynchronous rendering with isRenderAsync. Referenced samples here use this method. For better user experience, use progress indicators (spinners, bars, shimmer interface) to make rendering seem faster.
SPFx web part samples: (https://aka.ms/spfx-webparts)
PnP SPFx ACEs https://aka.ms/spfx-aces
Thank you for your great work. Samples are often showcased in Demos.
Additional resources around the covered topics and links from the slides.
D1: Samples - ace-cardgallery
D1: Documentation - Overview of Viva Connections Extensibility
D2: Sample - Lead Assist Dashboard
D2: Documentation - Build for Microsoft Teams using SharePoint Framework
D2: Documentation - Use Microsoft Graph in your solution
D3: Tools – Fluent UI - Shimmer web
D3: Sample - React HTM (Hyperscript Tagged Markup) Templating
D3: Sample - Microsoft Graph People Search
Other mentioned topics:
Upcoming calls | Recurrent invites: (Subject to Updates in September)
“Sharing is caring”
Microsoft 365 PnP team, Microsoft - 8th of October 2021
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.