Viva Connections & SharePoint Framework Community Call – 16th of June, 2022

Call summary

Welcome to the bi-weekly call focused on Microsoft 365 client-side development. In this call, we focus on using Viva Connections and SharePoint Framework to build solutions for Microsoft Teams and SharePoint Online.

New this week

• Agenda set for Microsoft 365 platform call - Tuesday, June 21, 8:00 am PT | aka.ms/m365-dev-call
  • Latest news from Microsoft engineering on Microsoft 365 topics
  • Monthly community contributors
  • Rabeb Othmani - Microsoft Graph Postman
  • Nik Charlebois - Using the Microsoft Graph PowerShell SDK for common operations
  • Alex Kwan - Get started with UI Library for Azure Communication Services
• Project releases
  • SharePoint Framework (SPFx) - v1.15 (RC) – includes list and library form extensibility
  • PnPjs Client-Side Libraries - v3.4.0 GA
  • CLI for Microsoft 365 – v5.4.0 preview
  • PnP Modern Search – v4.7.0 preview
• Web part samples
  • Page Navigator - Jasey Waegebaert | @JWaegebaert
  • React Script Editor Felix Bohnacker | felixbohnacker
• ACE samples
  • New - Card Composition – Multi Card View - Marcin Wojciechowski | @mgwojciech
  • Updated - My M365 Groups - New Search & Grouping - Nanddeep Nachan | @NanddeepNachan
• Microsoft 365 PnP Weekly – Episode 170 (June 13th) with Kraków, Poland based SharePoint developer at Valo Solutions - Marcin Wojciechowski | @mgwojciech | video | podcast
• Microsoft 365 PnP Weekly – Episode 169 (June 6th) with Belgium based Microsoft 365 Solution Architect and MVP at Qubix - Yannick Reekmans | @YannickReekmans | video | podcast

Demos

Building a safer custom Content Editor Web Part​ with SPFx – what happened to the CEWP/SEWP’s in the move from classic to modern? Thanks to SPFx and presenter, the content web part is back. Built with a Governance, not a technical approach to address security and governance issues. Meet the Cherry-Picked Content web part. Uses only snippets from approved libraries, and hardcoded in web part, from which user is allowed to Pick. Getting started on using GitHub Codespaces with your SharePoint Framework solutions​ – opens with a great premier on GitHub Codespaces cloud-based development environment – what it is, what can you do with it, limits during beta, and cost. Step through creating and configuring a basic Codespaces container for a project. Then learn about the presenter’s template - SPFx GitHub Codespaces Container, and step through setting up a new container pre-configured for your SPFx project in minutes! MyShifts – SharePoint Framework Viva Connections - Adaptive Card Extension – call Microsoft Graph API from an ACE, use Graph to store/read user’s preferences on user’s OneDrive. Uses card view (to display logged in user’s immediate upcoming Shift on a team) and quick view cards to display additional shifts, other teams and team selection confirmations. Delivers a Personalized Experience on the user’s Viva Connections dashboard. Complete CodeTour in this ACE sample.

The host of this call is Patrick Rodgers (Microsoft) | @mediocrebowler. Q&A takes place as always in chat throughout the call.

Agenda items

• SharePoint Framework - Vesa Juvonen (Microsoft) | @vesajuvonen – 7:09https://youtu.be/3_QF94JWIlk?t=476
• PnPjs Client-Side Libraries - Julie Turner (Sympraxis Consulting) | @jfj1997 – 8:45
• CLI for Microsoft 365 - Patrick Rodgers (Microsoft) | @mediocrebowler – 11:03
• PnP SPFx Controls - Patrick Rodgers (Microsoft) | @mediocrebowler – 11:52
• PnP Modern Search - Patrick Rodgers (Microsoft) | @mediocrebowler – 13:02
• PnP Samples - Hugo Bernier (Microsoft) | @bernierh – 13:37
• PnP SPFx ACEs Samples - David Warner II (Microsoft) | @DavidWarnerII –14:55
• Demo - Building a safer custom Content Editor Web Part​ with SPFx – Christophe Humbert | @Path2SharePoint – 16:39
• Demo - Getting started on using GitHub Codespaces with your SharePoint Framework solutions​ – Emanuele Bartolesi (SoftwareONE) | @kasuken – 33:44
• Demo - MyShifts – SharePoint Framework Viva Connections - Adaptive Card Extension – Siddharth Vaghasia | @siddh_me – 50:50

Actions

• Opt into the PnP Recognition Program | aka.ms/m365pnp-recognition
• Register for upcoming Sharing is Caring events:
  • Writing for the Web | Thursday, June 23, 12pm PT | 3pm ET | 9pm CET - Register
  • Writing for the Web | Monday, June 27, 10am PT | 1pm ET | 7pm CET - Register
  • Power Platform Samples Contributor | Wednesday, June 29, 10:00 am PT - Register
  • Maturity Model Practitioners | Register
  • PnP Office Hours – 1:1 session | Register
  • PnP Buddy System | Request a Buddy
• Register for the Microsoft 365 Developer Program and get a free developer tenant
• Get started with free training modules covering Microsoft 365 platform capabilities.
• Visit the Microsoft 365 Unified Sample Solution Gallery from Microsoft and community.
• Sign up to Share your story in the Learn from the community series.
• Request a Demo spot on the call | https://aka.ms/m365pnp/request/demo
• Download the recurrent invite for this call | https://aka.ms/spdev-spfx-call

Demo references

• Building a safer custom Content Editor Web Part​ with SPFx
  • Sample - Cherry picked content
  • Article - Aiming for a safer Content Editor Web Part
  • Sample - dangerous-content-web-part
  • Issue - Make React-Script-Editor more secure #2228
  • Tool – MGT
  • Sample - Script editor web part for modern pages built in React
• Getting started on using GitHub Codespaces with your SharePoint Framework solutions​
  • Template - SPFx GitHub Codespaces Container
  • Site – GitHub Codespaces - Blazing fast cloud developer environments
  • Documentation - GitHub Codespaces overview
  • Repo - GitHub Codespaces (Default Linux Universal)
  • Documentation - devcontainer.json reference
  • Repo - VS Code Remote / GitHub Codespaces Container Definitions
  • Register - Sign up for the Codespaces beta
• MyShifts – SharePoint Framework Viva Connections - Adaptive Card Extension
  • Sample - My Upcoming Shifts
  • Article - The easiest way to store user settings of your Microsoft 365 app

Thank you for your great work. Samples are often showcased in Demos.

Open-source project status

General Resources

• Viva Connections https://aka.ms/VivaConnections
• Archives - Microsoft 365 PnP Weekly - Videos, Podcasts  
• Tools - Teams Toolkit (v2.2 Preview) 
• Tools - Microsoft Teams Framework (TeamsFx) 
• Gallery - Microsoft 365 Extensibility look book gallery   
• Microsoft Build sessions guide (Modern Work Digital Brochure) - aka.ms/modernworkbuildsessions
• SharePoint Framework - v1.12.1 npm install –g @microsoft/generator-sharepoint@next
• CLI for Microsoft 365 v3
• CodeTour
• Sharing is Caring | aka.ms/sharing-is-caring
• Tools - PnP Modern Search v4  | https://aka.ms/pnp-search
• M365 PnP site | aka.ms/m365pnp
• SharePoint Starter Kit v2
• Blog: “A Lap Around Microsoft Graph Toolkit” blog series
• New Microsoft 365 Patterns and Practices (PnP) team model with new community leads
• Microsoft 365 Community Content (non-Dev docs)
• PnP SPFx web part samples
• PnP SPFx extension samples
• GitHub PnPjs
• Tutorials - Getting started with SharePoint Framework v1.10 Tutorials (12 videos)
• Tutorials - Getting started with SharePoint Framework v1.10 Extensions (6 videos)
• Docs - Tutorials and training material for SharePoint Development
• SPFX Training Package
• SPFx Web Parts
• SPFx Extensions
• SPFx Library Components
• Documentation - PnPjs v2 documentation
• Link - Microsoft 365 developer training
• Link - Office 365 Developer Program
• Latest documentation on SharePoint Framework
• Found an issue with SharePoint Dev? - please let us know at https://aka.ms/spdev-issues
• Reusable web part property controls
• Reusable react controls for SharePoint Framework solutions
• Reusable controls webcast
• CLI for Microsoft 365
• PnP SPFx Yeoman Generator - Extends the out-of-the-box experience with open-source community capabilities
• SharePoint Dev UserVoice - for new feature requests

Other mentioned topics

• SharePoint dev documentation
• SharePoint dev issue list

Upcoming calls | Recurrent invites

• Microsoft 365 platform call | Tuesday, June 21, 8:00 am PT – https://aka.ms/m365-dev-call (weekly)
• M365 General Dev call | Thursday, June 23, 7:00 am PT - https://aka.ms/m365-dev-sig (bi-weekly)
• Viva Connections & SharePoint Framework call | Thursday, June 30, 7:00 am PT - https://aka.ms/spdev-spfx-call (bi-weekly)
• Office add-in monthly call | Wednesday, July 13, 8:00 am PT - https://aka.ms/officeaddinscall (monthly)
• Adaptive Cards monthly call | Thursday, July 14, 9:00 am PT - https://aka.ms/adaptivecardscommunitycall (monthly)
• Power Platform monthly call | Wednesday, July 20, 8:00 am PT - https://aka.ms/PowerAppsMonthlyCall (monthly)
• Microsoft Identity Platform call | Thursday, July 21, 9:00 am PT - https://aka.ms/IDDevCommunityCalendar (monthly)

About

Viva Connections & SharePoint Framework bi-weekly calls are targeted at anyone who is interested in the JavaScript-based development towards Microsoft Connections, Microsoft Teams, SharePoint Online, and also on-premises. Calls are used for the following objectives.

• SharePoint Framework engineering update from Microsoft
• Talk about PnP JavaScript Core libraries
• CLI for Microsoft 365 Updates
• SPFx reusable controls
• PnP SPFx Yeoman generator
• Share code samples and best practices
• Possible engineering asks for the field - input, feedback, and suggestions
• Cover any open questions on the client-side development
• Demonstrate SharePoint Framework in practice in Microsoft Viva, Microsoft Teams or SharePoint context
• You can download a recurrent invite from https://aka.ms/spdev-spfx-call. Welcome and join the discussion!

“Sharing is caring”

Microsoft 365 PnP team, Microsoft - 17th of June 2022