Viva Connections & SharePoint Framework Community Call – 21st of March, 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

• Registration open for AMA (Ask me anything) – Viva ACE | Tuesday, April 26th - Register
• Announcing the new Microsoft 365 Unified Sample Gallery - More than 1060 samples | aka.ms/m365/samples.
• Agenda set for Microsoft 365 platform call - Tuesday, April 26, 8:00 am PT | aka.ms/m365-dev-call
  • Divyanka Pillai and Michelle Lee - Create an app that extends across Teams, Outlook, and Office
  • Waldek Mastykarz and Alex Terentiev - Easily fix errors in your SPFx projects with CLI for Microsoft 365
• Project releases
  • Updated preview of SharePoint Framework 1.15 – New release of the upcoming features. Includes List form extensibility!
  • CLI for Microsoft 365 v5.2
  • PnP Modern Search v4.6.1
• Extension samples
  • News Ticker - Sudharsan Kesavanarayanan | @sudharsank
• Web part samples (* in processing)
  • NEW: FluentUI 9* - Nick Brown | @techiekb
  • NEW: Tab Accordion with Rich Text Editing - Arun Kumar Perumal | arunkumarperumal
  • Cherry-Picked Content - Christophe Humbert | @Path2SharePoint
  • Birthdays - Milan Holemans
  • Dynamic Scalable Vector Graphics (SVG) - Nader Hadjebi | @nader2015
  • Tour Sample - Mike Homol | @homol
  • To Do Client with Vue.js - LOLCATATONIA | LOLCATAONIA
  • Pages Hierarchy - Nick Brown | @techiekb
  • NEW: Group Members - Nick Brown | @techiekb
• ACE samples
  • OneDrive Carousel – Image Card – Guido Zambarda | GuidoZam
  • OneDrive Carousel – Basic Card - Guido Zambarda | GuidoZam
  • Recent Files – Counter & View - Guido Zambarda | GuidoZam
  • Recent Files – Quick Access - João Mendes | @joaojmendes
• Microsoft 365 PnP Weekly – Episode 162 (April 18th) with Stockholm, Sweden based Principal Program Manager, Wictor Wilén (Microsoft) | @wictor | video | podcast
• Microsoft 365 PnP Weekly – Episode 161 (April 11th) with California, US based Power Platform Community Program Manager, David Warner (Microsoft) | @DavidWarnerII | video | podcast

Demos

• Introduction to Adaptive Card Design Gallery reusable reference sample – solution includes 12 Adaptive Card Extensions (ACEs) and a personal app that showcases the ACEs and how deep links surface in Teams. Each ACE (Event scheduling, café menu, Calendar…) showcases functionality like collapsing menus, scrolling through articles, conditional formatting, UI design, etc. From Teams app click to see ACE in Adaptive Cards Schema Explorer. Step through code for Event Scheduler ACE.
• Using Adaptive Cards control from the PnP control gallery in SPFx solutions – learn about and step through implementation of the “AdaptiveCardHost” PnP React component using the Adaptive Card SDK. The host control delivers the ability to change UI at runtime without having to recompile the SPFx solution. Simple configuration in property pane - select a card to render and apply a theme aligned to SharePoint or Teams environment. Uses Fluent UI. Step through code, future updates.
• Navigating Cards in Viva Connections ACEs – how we can manage navigation inside ACEs with SPFx. Every ACE has navigation properties (Navigators) that can be used to navigate across Card View(s) and Quick View(s). Functionality includes Read the current item ID, Register and Push, Pop & Replace. You can rely on these objects to precisely manage the ACE navigation flow and stack. Code for functionality including Start and Restart logic shown.

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:56
• PnPjs Client-Side Libraries - Julie Turner (Sympraxis Consulting) | @jfj1997 – 10:04
• CLI for Microsoft 365 - Patrick Rodgers (Microsoft) | @mediocrebowler – 11:53
• PnP SPFx Controls - Patrick Rodgers (Microsoft) | @mediocrebowler – 12:57
• PnP Modern Search - Patrick Rodgers (Microsoft) | @mediocrebowler – 13:52
• PnP Samples - Hugo Bernier (Microsoft) | @bernierh – 14:35
• PnP SPFx ACEs Samples - David Warner II (Microsoft) | @DavidWarnerII – 17:27
• Demo - Introduction to Adaptive Card Design Gallery reusable reference sample – Derek Cash-Peterson (Sympraxis Consulting) | @spdcp – 19:29
• Demo - Using Adaptive Cards control from the PnP control gallery in SPFx solutions – Fabio Franzini (Apvee Solutions) | @franzinifabio – 34:49
• Demo - Navigating Cards in Viva Connections ACEs – Paolo Pialorsi (PiaSys) | @paolopia – 47:57

Actions

• Mark your calendar for Microsoft Tech Days | Thursday, May 5, 2022.
• Register for Microsoft Build | May 24-26, 2022
• Register for Sharing is Caring events:
  • AMA (Ask me anything) – Viva ACE | Tuesday, April 26th, 9am PT - Register
  • Community Docs Session | Tuesday, May 17, 10:00 am PT - Register
  • Power Platform Samples – First Time Contributor | Monday, May 9, 10:30 am PT- Register
  • Maturity Model Practitioners | https://forms.office.com/Pages/ResponsePage.aspx?id=KtIy2vgLW0SOgZbwvQuRaXDXyCl9DkBHq4A2OG7uLpdUODY3NVRFQ0E4SFg5WlI1TU83WFJQRklZSy4uRegister
  • 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

• Introduction to Adaptive Card Design Gallery reusable reference sample
  • Samples - ace-designtemplate-gallery
  • App Store: From App Catalog > SharePoint Store > Search Viva
• Using Adaptive Cards control from the PnP control gallery in SPFx solutions
  • Tools – Schema Explorer
  • Controls - Adaptive Card Host
  • Sample - Adaptive Card Host control
• Navigating Cards in Viva Connections ACEs
  • Tools – Adaptive Cards Schema Explorer
  • Documentation – ViewNavigator
  • Sample - aces-navigation-demo

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, April 26, 8:00 am PT – https://aka.ms/m365-dev-call (weekly)
• M365 General Dev call | Thursday, April 28, 7:00 am PT - https://aka.ms/m365-dev-sig (bi-weekly)
• Viva Connections & SharePoint Framework call | Thursday, May 5, 7:00 am PT - https://aka.ms/spdev-spfx-call (bi-weekly)
• Office add-in monthly call | Wednesday, May 11, 8:00 am PT - https://aka.ms/officeaddinscall (monthly)
• Adaptive Cards monthly call | Thursday, May 12, 9:00 am PT - https://aka.ms/adaptivecardscommunitycall (monthly)
• Power Platform monthly call | Wednesday, May 18, 8:00 am PT - https://aka.ms/PowerAppsMonthlyCall (monthly)
• Microsoft Identity Platform call | Thursday, May 19, 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 - 22nd of April 2022