Microsoft 365 Community Viva Connections & SharePoint Framework, 18 May 2023

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: Viva Connections & SharePoint Framework Community call – 18th of May, 2023

Description

Viva Connections & SharePoint community call on May 18th.

Three demos: Introduction to updated SharePoint Starter Kit v3, Creating custom SPFx components for Microsoft Viva Connections for Education, and SPFx framework at Microsoft - Accelerator Domain Models.

Project releases: SharePoint Framework (SPFx) – v1.17.2 (GA), PnPjs Client-Side Libraries – v3.15 (GA), CLI for Microsoft 365 – v6.8 (beta), Viva Connections Toolkit for VS Code – v0.5.2 (GA), and 2 conversations.

Please see the blog post for this call for project updates, news and events details. The host of this call is Hugo Bernier (Microsoft) @bernierh. Q&A takes place as always in chat throughout the call.

Agenda
00:00 – Intro – Hugo Bernier (Microsoft) | @bernierh
06:05 – SharePoint Framework – Vesa Juvonen (Microsoft) | @vesajuvonen
08:12 – PnPjs Client-Side Libraries – Beau Cameron (Aerie Consulting) | @beau_cameron
09:48 – CLI for Microsoft 365 – Garry Trinder (Microsoft) | @garrytrinder
10:49 – Microsoft Graph Developer Proxy – Garry Trinder (Microsoft) | @garrytrinder
11:51 – PnP SPFx Controls – Alex Terentiev (Microsoft) | @alexaterentiev
12:49 – Viva Connections Toolkit for Visual Studio Code – Vesa Juvonen (Microsoft) | @vesajuvonen
15:09 – PnP Modern Search – Hugo Bernier (Microsoft) | @bernierh
15:31 – Together mode picture
16:38 – Demo – Introduction to updated SharePoint Starter Kit v3 – Eric Overfield (PixelMill) | @EricOverfield
28:34 – Demo – Creating custom SPFx components for Microsoft Viva Connections for Education – Jethro Seghers (Microsoft) | @jseghers
38:30 – Demo – SPFx framework at Microsoft - Accelerator Domain Models – Daniel Turley (Avanade)
57:12 – Closing

Learn more
• See the full blog post for this call in the Microsoft 365 platform community blog - https://aka.ms/community/blog
• Download invite for bi-weekly SharePoint Framework call at: https://aka.ms/spdev-spfx-call
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home

A

A

Hello and welcome to the Viva connections and SharePoint framework bi-weekly sync I'm, Hugo, Bernier I- will be your host for today, and our agenda for today is going to be we're going to have the latest updates on the SharePoint framework, we're going to update you on all our open source initiatives and then we're going to have some uh cool presentations really the stars of our show. Today we're going to have Eric Overfield who's, going to introduce us to the update to the SharePoint starter kit version.

A

Three Jethro Seekers is going to create custom, spfx components for Microsoft Viva connections for education and Daniel Durley is going to show us a SharePoint SharePoint framework at Microsoft accelerator domain models. Super awesome. Let's get started now. If you would like to contribute and to participate, there's a few ways that you can do that. One of the ways that you can do that is, you can actually watch our Power Platform and Microsoft 365 Community videos. You can subscribe to our YouTube channels and stay up to date.

A

We also have a whole bunch of LinkedIn groups for discussions again. We welcome you to participate here, and this is a great place to to connect with your peers and to chat with us.

A

We have open source initiatives in GitHub and you can participate by contributing by submitting issues and doing all sorts of cool things like that and we'll talk later about how we can help you getting started with those, and then we have sample galleries where you can use the samples to learn about the various technologies that we we talk about, but also for you to contribute. And finally, we have all sorts of Open Source initiatives and samples that he can contribute.

A

He can go to aka.ms, slash Community, slash home to find out more about all these initiatives, and we have committee calls if you want to stay up to date with, what's going on. We have what David likes to call the crystal ball into. What's coming up, what's new what's next, and so you can attend the Microsoft 365 and Power Platform calls the Power Platform call, which is monthly, the Microsoft identity platform office add-ins, and then we have more calls. You can follow up all the calls at akms.

A

Slash Community slash, calls to find out what's happening and you can download the recurrent invites to make sure you're there we'll see you there.

A

Now we have the Microsoft, 365 and Power Platform call coming up, and that's basically all Microsoft speakers, so you're hearing it directly from the horse's mouth and you'll get the latest news from Microsoft engineering on the Microsoft, 365 and Power Platform topics we're going to have, of course, our cool uh together mode and we're going to have dcpadour and handing Wang who are going to talk about updates to the Microsoft graph beta API for SharePoint Pages. We.

A

Which is going to who is going to talk about multi-geo support for site, Discovery and Microsoft graph, and, if you'd like to present to any of our calls, we welcome you to present if you've got some cool stuff to show. Everyone wants to see that everyone is welcome, just go to aka.ms, slash Community, request, slash demo and add in a few slashes at the end, just to make it fun and if you don't know how to contribute to the community but we'd love to share.

A

If you want to share some samples, you want to participate in GitHub, uh you can actually join our sharing your scanning sessions and to talk about that David I forgot. You were supposed to talk about it, so the.

B

A

That there's no such thing as uh too nice is David Warner David well,.

B

Thank you, Hugo yeah, well, friends, if you want to power up, yep, see we're on an 8-bit old school track here with vesa's tweet about a zip drive and everything so we're going old school Power up your ability to uh collaborate and contribute to the community. These sessions are live. They're in uh in teams calls together, they're, not recorded So, they are safe space and they provide Hands-On guidance. That's really.

B

The key here is uh teaching you and learning together on how you can contribute to the community understanding the landscape of GitHub and those things we are working on retooling our team right now to make sure that we're more scalable. We thank you. Thank you. Thank you for your patience.

B

We are going to be getting more sessions scheduled by the end of this week and bringing more on board so for those that have reached out be on the lookout for a uh a request for us to chat and for those that are looking for these sessions. Keep an eye out, probably maybe beginning of next week, is when you can look because I know, there's holidays and all that. So uh really really appreciate.

B

All that you're doing learn more AK dot, Ms, slash sharing is caring, and then, when you want to power up some more, we want to empower you with the recognition program. See got all the sounds today. uh This is a program that we are excited that everyone is embracing and it is not going anywhere in fact we're looking to expand it with more campaigns even more. uh It is a way to officially recognize the work that you're doing via credly badges, those same badges that you get when you're Microsoft certified.

B

These can sit right alongside those they can be shared on LinkedIn Twitter Associated, your LinkedIn profile print it out put on the wall put in your resume put on the fridge, send them to Mom, everybody loves them. It's no cost to opt in all we need you to do is go to AKA dot, Ms, slash, Community recognition, follow the information there and get you opted in, and we're actually improving the registration process here soon as well, so be on the lookout for some updates and changes that allow you to manage or change.

B

If you change your GitHub name or your email address, or anything like that, but definitely absolutely opt-in. If you have not already have any questions, don't hesitate to reach out you go back to you.

A

Thank you and you forgot, get a tattoo of.

C

Course all right, yes,.

A

uh It's just painful: every year you have to update the year.

B

I was just gonna, say: yeah I'm still paying for 2022.. Actually, all.

A

Right now to talk about the latest updates on the SharePoint framework. Here is vesa Yvonne.

C

Excellent, thank you here, girl. Let's go one step forward, so, first of all, the latest version is 1.17.2. I think we released this last week and unless I'm completely confused I think we did so. This is a new news, uh so one thing to notice here uh is that we are looking potentially doing 1.173, 1.17, uh four and so on so but we're basically changing here is the frequency of uh rolling out uh updates, especially if they are improvements uh or, let's say not, new capabilities.

C

So as long as we, whenever there's going to be new capabilities, new features, all of that then there's going to be 1.18 and that's already scheduled internally, uh but 1.17.3 might come up. 1.17.4 might come out as we are addressing issues and feedback which is uh provided through the GitHub issue list, so good to be aware of that, let's go to the following slide. Overall usage uh is growing uh significantly right. Now, our all-time biggest usage is on the 10th of May.

C

It's pretty amazing to see after what is it six years, the usage is just skyrocketing still, and it really shows the flexibility of the platform and- and we are highly appreciate that usage and everybody in engineering are super. Super um are presented on that, let's go to the following slide.

C

This is just a recap: 1.17.x is right now the latest version, and that was released in 12th of April and we have been releasing 1.17.1, uh sorry, one and two after that which are addressing uh additional things, so they were not really explicitly addressing what was in 1.17. They were addressing additional Things based on the feedback. 1.8 team is already scheduled internally. I cannot share it yet to date, but that's coming up uh absolutely this calendar year and 1.19 most likely this calendar year as well, but that's it from spfx site. Let's move forward, thank.

A

You Visa, we have a whole bunch of Open Source projects. Now these projects are actually built by the community for the community and to talk about some of our projects. Let's talk about the first project, the pmpgs. uh Are you talking about pmpgs, VOC, Cameron,.

D

Yeah thanks Hugo, um so last Friday we released version uh 3.15, um which included a bunch of um documentation updates. We had some significant updates to our batching timeline.

D

um So what originally started out as um the inability to batch fields to SharePoint list, and we actually found some larger issues where uh internal round trip calls um were working. So we introduced a new Behavior called batch number to support that um we've also added some new code to our timeline, where some observers were being added to our Factory objects, which caused some debugging issues.

D

um If you were improperly creating your sp5 objects, um we had an update to the uh SP default and graph default um behaviors, and then there was a caching bug within our new um Azure identity client. As always, you can get our nightly builds um using the npm install at V3 nightly and what's not listed here is we are working on version four of PNP JS. um It's not gonna, be a huge rewrite, but we will be extending a lot into Microsoft graph. This time around. We do have an issue open in the issues list.

D

If you want to provide feedback thoughts into version four, uh it's called version four release. We would love to hear any thoughts you might have back to.

A

You Hugo thank you uh thanks: everyone, who's contributing to ppjs and bo, uh and now to talk about the CLI for Microsoft 365.. Here's Gary printer.

E

Thank you uh yep, so we've got a new Beta release, obviously live for Microsoft 365. This is uh version 6.8. uh We have new commands for planner, powerapps per view, uh SharePoint and teams.

E

um So if those interest you please take a look at our release, notes at aka.ms, CLI, M365 notes, and we get all the details about all the changes that we've also made and various enhancements.

E

If you want to get hold of the the beta and try out yourself use the app next tag, if you're using our npm package or if you're using Docker use the next tag on there, like always, if you're interested in CLI or want to get started involved in the community best place to do that is to join our community server on Discord and also follow us on Twitter for the latest announcements at CLI, Microsoft 365.

E

next slide, um so Microsoft graph developer proxy. We don't have a a date from from last time. We when we released a 0.7, but we are actively working towards the next release, which is at 0.8, which we're due to release after build um at the end of the month, where we're kind of looking at improvements to the throttling and retry after Behavior, but also we're looking at a minimal API permission.

E

So this is a feature that you'll be able to run the proxy and then run your application, and it will track the requests that have been made and suggest the permissions that you should use um for at least amount of permissions, which I think is going to be really helpful for people who are security conscious and they don't give too many permissions away to their uh to their apps. But yeah. If you've used um the uh proxy we'd love to hear your feedback.

E

If you haven't go to ak.ms graph proxy, slash download where you'll find all the installers and our tutorial as well to try it out. And you go back to you.

A

Thank you and to talk about the reusable spfx controls. Here's my friend Alex Alex yep thank.

F

You Hugo, so we are on version 3 14 for react, controls and 313 for uh property controls. We're currently uh actively working on some uh I would say: internal changes in the control to uh it will be beneficial for contributors. We are updating to node.js V16, finally from v14 uh and uh we'll be updating to the latest version of uh spfx as well, when we're ready to release the next version, and please please, uh if you have something to to contribute as just fill out some bugs or maybe you're ready for some PRS.

F

Please do so. We are really appreciate all of your contributions and thank you back to you. Hugo.

A

Thank you, and what's better than having vesa give one update, is having vesa give two updates to talk about the Viva connections. Toolkit here is vesa.

C

Actually Adam is on the call and Adam likes to do that. I can say that I'm on a call so.

G

G

Visual Studio code extension created by the PMP Community for anyone who is working with spfx or Ace projects, so this is kind of extension that will boost your productivity in this area, so be sure to give it a try and check it out. We are still in better releases. There was a quite recent new uh 0.5.2, better release, which added a awesome capability regarding spfx area. Now you are able to scaffold a new project based on spfx Sample, coming from our PNP web parts and extension sample Gallery. So this is really really cool.

G

We also extended the update and the feedback section where you have more links that might be helpful for development, like Ace adaptive cards, graph, Explorer and link to our PNP Community. Basically, this extension is extension that for sure will be helpful so for someone that is beginning his journey with spfx, but also all for pro, so you can so, as you can see, we have like actions that uh that in the it will help you manage your spfx project like upgrade deploy validate. We also have a in welcome section where you can validate your environment.

G

If you have the installed the and check your dependencies, if they are a proper, of course scaffolding. So if you are new to spfx- and you are not familiar with node.js Technologies you're afraid of terminal here, the visual studio code extension will guide you through using DUI how to create a new project step by step, and we are eagerly waiting for your feedback and we are open for any contributions. So just please visit our GitHub repository on AKA dot, Ms, slash, V5, vs code fees code.

G

uh You can download the Viva connections to look at vs code from the vs code, Marketplace or directly from vs code, and please leave feedback in the comments of this code or or on the repository or you can try to reach me out on Twitter link it and whatever, whatever we are waiting for negative feedback. Any kind of feedback is positive feedback as well and uh back to you.

A

Thank you on the PNP modern search uh side of things we have lots of questions on GitHub usage is growing, uh we have version 4.8 and but nothing new. So please keep on contributing. Let us know how you're liking the modern search and what else you'd like to see, and we can't wait to see how you're using it and now, let's move on to the optional picture time. Everyone turn on your camera. Put on your makeup. Do your hair, except for you, David.

A

C

What what okay, when this is good? uh It's not too big selected today, I will not put my camera on. Let's wait. A few more seconds. I can see a lot of familiar phrases. uh The orange in the middle is always visible. Well, it's pretty good.

C

They have a few more few more seats in a room. Few more seats in a room, few more seats in a room and I will put the recording on and three two one. No pointing fingers come on. Let's say excellent! Thank you! Everybody for joining, really cool to have you on a call, and hopefully we'll see some of you in the European collaboration Summit next week. That's it! Let's go back on the slides, excellent.

A

Awesome, let me share my slides again and uh let's uh give the floor to Eric Overfield, to talk about introduction to the updates to the SharePoint starter kit version 3. Eric.

H

Excellent, thank you so much for uh having me today go ahead and share my screen everything's coming in good right on yeah. So thank you all um um good to be here good to be back.

H

uh We wanted to to be able to discuss the version three that was just released a couple months ago on the SP starter kit, which is really just an evolution of what we saw in V2, but it's designed to sort of pull together a lot of the stuff that we've, the PB community and everyone else is doing within SharePoint SharePoint, Dev, SharePoint provisioning all into one piece. So it's really easy for people to get started to see a provisioning template. That's got a couple thousand lines of code in it.

H

It releases all kinds of cool stuff. It puts all these things out there with web parts and extensions and all that fun stuff all into one one bundle. So uh these three just came out, and let's kind of quickly go over what that looks like some of the things that we did here, we updated to a much more modern version of SharePoint. Yes, well that nice Cadence it can be a challenge to get all 20 odd projects updated, so we'll always be a little behind, but hey 16 ones is pretty good, updated, fluent UI.

H

We got some a time at least a more modern version of ppjs. uh We were able to upgrade the um the Microsoft about toolkit to a much more current version, and this is also demonstrating use of the graph API. So if you're looking for that, big bundle that sort of has a whole bunch of stuff all together that you installed in about five ten minutes into a Dev tenant, and you get all the code great place for it.

H

We're demonstrating some libraries uh with those getting provisioned out so that they can get automatically activated within sites. We look to overall normalize our code. uh One of the great things of this project was completely Community Driven and every Dev did things a little differently. We attempted to to normalize more of the approaches we have to just be a little more consistent. We did remove support for uh on-prem. If you do want the there is an on-prem uh 2019 version uh in the V2 Branch.

H

So we left it there all for you, but we realized that that just wasn't it wasn't providing the value to attempt to maintain that. So we just said now: let's just stick with SharePoint online, where things are going, uh but it even has in some of the tab development components which it I know it's kind of simple, but still like. We just again want a complete package well as completed as can be that provides lots of different little things that were seen all over the place and pulling them all together.

H

I mean we use a lot of the PNP controls and all that stuff. It's it's a demo of everything um and then also we wanted to ensure that within the provisioning component you know we updated to the latest in the ux design and the layout capabilities. As of you know a few months ago, of course, that's going to continue to evolve and we will continue uh to to grow with that. So those are kind of the big aims of this big upgrade.

H

uh You can easily find it, of course, at SB, starter kits part of the community. um Easy stuff I always want to make sure we thank everyone. Who's been helping us, the two big ones here that really helped with the upgrade uh were shogany and Dong. So thank you both so much big thanks. Of course, everyone else has contributed as well. If I missed your name, I do apologize, is I basically used the GitHub commit to help do that. The the uh the chatter in the issues list has always been good as well.

H

So so thank you all so much what's included in the V3 component, so 16 web Parts, five extensions. There's a library component as well. There's two provisioning templates. So there's the full purchase, Union template pre-built for you, uh as well as the uh XML that you would use to to rebuild it.

H

If you want to rebuild a PNP file, there's another one for just the SharePoint framework components, because in V2 what we did was we split out all of the the um all of the different web parts and extensions all into individual svpkgs, to make it a little more manageable, a little more upgradeable and a little more useful for um for you all as well. So you could just grab the piece that you might have wanted uh so there's a a provision example just for that as well and then within the primary provisioning template.

H

If you want to look at like a larger provisioning example, what's it trying to do? Is this provision a collaboration site which turns into a hub site? This is all within one command, which is super nice, those who use the provision. Of course, you know this totally possible two team sites that are associated with that uh it pre-populates the mega menu.

H

It has 15 pages within the Hub site within that communication site with different components: different layouts added to it now the provisioning template, though I mean it's huge, and you can totally see how it's all done and uh once you provide. My suggestion is that you provisioned it first see. What's provisioned then go dig into those files and- and the read means I think- are reasonably good. uh I've I've edited a lot of them myself, so so it's uh you know how well did I do for you.

H

All I would be interested to know, but we really attempted to document all of these aspects of using the starter kit so that you can turn it into your own. I would really not like to see you install it and then go straight to production. To me, this whole point is it's that technology demonstrator that you can within minutes have a working example, and then you can spend hours days months years to do anything that you wanted to do and, of course, all open source. There's uh every there's, not anything in that.

H

That's proprietary that you can't uh turn into your own thing, so how to get started, how to go ahead, and just you know, work today. It's basically the same when we went from V1 to V2. That was a big one. V2 to V3 is much more simple, so you got a lot of documentation here.

H

Go you go from there pretty easy Once you uh once you clone the code you're going to commit you're, okay, you're gonna, commit connect, excuse me to your site and then you're, just gonna invoke that PVP template like that's it now, there's some configuration options which I have time if I have time for demo, I'll show you and that is in the documentation as well, but that is going to install everything. I've talked about within the within your that that tenant you connected to about five or ten minutes is what my experiences is.

H

It just takes time to get all those uh Solutions in and all that kind of stuff, but that that's the way it is. This will require attended admin permissions um primarily because we're going into the tenant.catalog uh we're going into the term store um all those requirements. The prerequisites they're all found in the documentation, we explain what it is. We tell you why we're doing what we're doing.

H

But again, you can always dig into the code to figure out why it is that we're doing it or or strip out the things that you don't want to do now what's nice is that there is an upgrade path here uh when you, you won't want to do a full provision per se, because you would be reprovisioning the sites themselves.

H

uh You'd probably want to do that to a new spot, but if you're just looking to upgrade all of the or any of the components that made up the whole uh the whole project, those are just one for one updates. There's all IDs are the same. That should work just well, you'll get all the greatest uh and latest in the the update that we did. If you want to do that and again, if you still want the on-prem, if you're still interested in that, we did attempt to document this as well.

H

You can always go back to the V2 Branch. You can go get the old, SharePoint, 2019 aspects that we completed and have at it and have fun so yeah pretty easy to get started. uh Okay, what it looks like when you provisioned this this would be a raw provision. uh You can see a lot of the pieces here, this, the the communication side, of course, that Megan Ave has already been updated.

H

You can see a lot of components here that some of them now are a little more out of the boxy, but everything your seniors actually custom. So if you were looking to take some other code or take some of the components that that were already available in SharePoint, but you want to tweak them, there's already code for you that that was built from scratch. So this isn't anything that came out of Microsoft engineering. This is just people rebuilt this stuff, um but you can see a lot of graph components over on the right.

H

You can see some some list, usage and whatnot kind of in the middle and hitting current weather and whatnot, which again you could do out of the box. But now you've got the code.

H

If you want to do it, some news, ropes and all kinds of fun things like that, so really cool things and and cool components that you can that you could include already, uh if you want to help uh ways that I think that that make sense install this and use it if you've, if you've used it in the past, you may want to get an update in it and look at see what we've done and uh go, install it again or just go dig into the code and see some of the updates that were made.

H

Go. Look at some of the commits you'll see some of those updates, we're always looking for any kind of feedback. Any kind of feature requests, uh any issues that you find a lot of times. We found issues that had to do more with uh the provisioning template or something so that's going to be interesting. I always look to make sure this all works for you and whatnot.

H

um Hey we're, always looking for PRS you've got new ideas. New features, new bug fixes my requests there. Kind of like any other project is, is try to keep your commits uh smaller. Don't do massive big updates, because they're harder for us to push merge in, especially if you got a bunch all happening at once.

H

So if there's an update to a solution, you know update that solution, commit it uh if you're working on documentation, you provide anything, do like a commit profile or something so it's easier to pick and choose and help massage everything into place.

H

um Let's see promote this I think this is a really good solution to help people get started with provisioning, where they want to start building a larger solution for themselves uh and then also I'm, always looking for any kind of uh content that can help promote it blog posts or recommendations or insights how-to videos- if you do them like um throw them somewhere, throw them in the issue in the issues list.

H

That would help me to help the community then promote what you're doing as well, because we just want to really help with the usage of that so um over. In the starter kit, I told you, it really is easy. uh We we start pretty quickly with getting started, and this is all in the the readme.

H

It's it's two major lines that you're looking for here, connect and invoke, um and then a command to make it go a little deeper would be something like where you can add the the um some parameters to say where you want the the three different sites to get created, so that could really help you get started and um that's it I mean if I went ahead and hit enter, which I'm not you're gonna within about five ten minutes out of that time, it's gonna, it's gonna, build your site.

H

You can see the site that I already showed you that screenshot of I mean it's. It's I think it's a good solution to help get started, especially when people are attempting to understand how to build provisioning uh within the solution itself, um pretty easy to use. There's a provisioning folder where you've got the dot PNP files that I talked about again. We talked about readme's on how to go even deeper into that, so I really I am pretty proud of the documentation. The community's helped build here, because this is a technology demonstrator solution.

H

You've got really good web Parts out there. You've got really good cases out there. You've got a lot of documentation on provisioning and stuff, but like this tries to pull it all together into one bundle so that you can use it for your org and get get started with that. um I did talk to you about the uh the provisioning template the raw XML files, so those are um uh that that's kind of fun.

H

You can just see that there's a whole bunch of cool stuff here about you know, adding to the app catalog we're building the sites, we're putting all the things in here. The thing that's sort of buried in documentation, but I want you to be able to find is where is it um yeah see now I've even lost it? uh It's the readme for getting for rebuilding the uh for rebuilding the template. The documentation is here.

H

I can definitely find it if you, if you get stuck with it, I can show you here that I got it I got it ready for us, though, building a templates easy you go into that that templates folder, where I talked about uh where the XML files for the prison generals. Are you read in the PNP template? That's simple! The next command is you just save it? This is really easy to do to create your own provisioning temples based on the solution. It's two commands. You read it in you, save it you're good to go.

H

You could build your own cool stuff, so yeah um I I, wish you all the luck with the solution. I hope you all find it very useful, with the update and I think Hugo I can send it on back to you.

A

Awesome, thank you and again, thanks to everyone who contributed to this initiative, uh including bo uh all right to move on to our next presenter Jethro Seegers uh from Microsoft who's, going to talk about creating custom, spfx components for Microsoft Viva connections for education.

A

I

A

We can see your screen.

I

Perfect, can you also hear me properly? We can hear you properly awesome, so my name is Jethro Segers I work for the higher education experiences team based in the education, engineering and I, really want to give you like a brief overview of Eva connections for Education. Maybe the first thing you're going to say is like if you've had connections for Education, what's so different about the education version for Viva connection, actually to be completely transparent and very honest, not a lot.

I

What we're actually trying to do is really provide with Viva connections the solution for a Persona that was never tackled by Viva connections or the Viva Suite as it is today. We we know that Viva as it is, is really focused on the employees. So what we're trying to do is really go beyond that, and so that's for us, the student, and so let's start with the.

I

Why real, quick and why we're tackling students, one of course, is that education is super important for us for me personally as well, and hopefully for you as well, because I will assume that when you have kids, it's that the quality of your education is is something that you care about, and so what we saw, especially in higher education, where we started to look into what are some of the problems that they're facing is one that there's a boatload of Education tools that students need to use whether that's indicated 12 space, primary secondary or even in higher education.

I

We saw on average that 143 education tools were used, whether that's data about their assignments, their courses, their grades.

I

um What the tuition fees were that they need to pay where they can loan do loans for library, books and resources and stuff like that, and it was really overwhelming overwhelming in such a way that when we look at the Dropout rates about 30 percent of first-year students never become a second year student or a sophomore student, and that's a lot and so really what we wanted to do. There is kind of start to tackle that and what is really important there is how strong Viva connections is in supporting that model.

I

So what we're doing is really looking at hey Visa connections.

I

What would an education version look like what can we do and how can we help that to really help our students to connect and you're, probably going to recognize a lot of these words from uh how Viva has been positioned for the employee, but we really did our best to translate that and in a bit, I'm also going to show you some of the unique ace cards that we've built both from a Microsoft perspective, but also from a community perspective and how that actually supports that whole model.

I

So the first thing we wanted to do is give students a digital home to start and end their their work, which is being a really good student.

I

We also wanted to focus on simplifying the experience by streamlining the tasks and access to the key resources in one centralized place, and then the connection is super important for students to feel connected with their organization with the university that they're, a part of with the schools, they're they're participating in, and that's really review her connection for us was that main Hub to really drive that engagement, and so what we've done is how can we now augment everything that the FIFA connections team is already doing with very unique education functionality?

I

And how can we actually translate that so it makes sense when a student goes to Viva connections or, however, they want to Brand it in their own organization and to make that happen. So what we've done in the top two is actually very interesting. We went live with those yesterday evening, so it's a very exciting time for us: we're actually releasing two specific cards targeted 100 to education.

I

So if you have kids that are using teams, as their learning management system are using teams to to drive the education in in your area, then this is going to make a lot of sense for you as well.

I

So what we're doing here is visualizing all the assignments and all the classes that they're enrolled in so that way, they can immediately see what is the assignments that I need to start working on, which are upcoming, which are past two in a bit I'm, going to show you that in a demo with a student as well, how that actually is visualized from an experiences perspective, but we also wanted to make sure that we're contributing to this amazing open source Community right.

I

So one of the things I absolutely want to do is thank a lot of you for participating and delivering ace cards in the samples Gallery, because a lot of our customers are using this on a daily basis, says I'm, just going to call out a few that really are making a lot of usage in our environments is like the my recent files is in there. The weather is in there. The office locations under which we then use as campus locations uh Transportation cards.

I

All these different open source, Community Driven cards, are being appreciated very heavily by the education community. So we wanted to make sure as Microsoft that we also did our work today, so we're actually looking to potentially bring in the code for assignments and courses in that as well, which we already have from a production perspective. But we also made sure that we had five.

I

um We call them code samples with specific education functionality, so the ones that we are currently submitting to the GitHub repository our tuition fees, Library loans, book, a space, internships and scholarships which I'm going to show you in a bit as well. And it's really designed to be a starting point. Both our customers, Partners yourself, so you're you're, totally fine to take the design and start working on it. We've attached sample code to it, so it makes a lot more sense when you start working with it.

I

But it's designed made by Microsoft designers to the standards of Microsoft design, with the code samples being fully vetted by Engineers as well. So you can just immediately use those and make it into your own uh really example that you want to augment it right Additionally. You also want to invite you if you have ideas for Education specific cards. Let us know if you submit some send me a ping I'm happy to send that through the marketing machine, that our team has to really put some additional visibility on the work that you guys are doing.

I

But again, I cannot stress enough how important for us it is that this community exists and the examples that you guys build like every single time when somebody is asking for a specific feature. The first thing I do is actually go to the open, open source, GitHub repository with all the samples in it and immediately start Distributing that to all my customers. So um let's not kill you guys by PowerPoint and actually go into a true example of how Viva connections for Education can be used. um So this is, for example, the two side.

I

The cards that Microsoft has launched yesterday, specifically around the assignments. So when we click here on the view, all um it's going to use the graph to really pull out all that information and kind of design it in a tap kind of system, where we have one um the algebra class with the Mind map that they need to work on what is really cool and what students heavily appreciate is the fact that it's clickable, that it immediately takes them to the right information.

I

We also have the same thing for our courses and then here are all the code, samples that are we're in pros and process of actually submitting that to the GitHub repository. So in this case we have our outstanding loans that students immediately can be informed of if they want to do an internship. This is some sample they data, so we have Accenture Cisco ansys. We have the ones that they've submitted, for we have our scholarships here right.

I

So these are all scholarships that they can take a look at what a recent applied all that good stuff same thing for uh booking a space. So this is really for us to show our customers here's some of the things that are possible for you to do, and we understand, especially in education, uh the the let's call it the ace development skill set is a growing skill set. A lot of people are starting to adopt uh the model they're looking.

I

How can we build our own experiences, but it we're fairly new to it, we're not as mature yet as the commercial space, but it's something that is very exciting. It's something that we now can actually address. Some of the student problems that we have and like I mentioned, for example, here at the holidays, one I don't know who created it, but it's an amazing one. I pretty much. All my customers are using it to show the students what they're holiday days are based on on their location and so I just want to say.

I

Thank you again for all the work that you put in there. If we can ever support you in any way shape or form, let me know as well um and and that's pretty much all I needed to show so I know I'm, probably under time. So I'll give it to the next speaker, but if you have questions, I will put my email address in the chat as well feel free to reach out feel free to share ideas, things that you've done.

I

If you have a specific question that is related, for example, to the school of your son or daughter or university, that you're working with, let us know we're always available to help.

A

In the education sector, uh so thank you for for doing this all right. Our next presenter is Daniel Turley who's, going to talk about SharePoint framework at Microsoft accelerator domain models, Daniel we're ready when you are thank.

J

You Hugo and hi. My name is Dan Turley and I'm. A full stack developer at avanade I've been working with SharePoint for over 10 years, starting with SharePoint 2010, most recently as part of the productivity Studio utilizing SharePoint framework to build business apps so today, I'll be presenting on entity domain models in our spfx solution, accelerator, but first a quick overview of the accelerator.

J

It's a set of patterns, reusable code components and tools that I created for building business apps on the SharePoint platform, it's evolved over the last six years and we've used it in the productivity Studio to build a dozen business apps over that time and the accelerator is open source we've published a complete sample app to demonstrate its features. The sample app is named, react rhythm of business calendar, so some high-level features of the accelerator. We have guidelines for the solution structure, to organize your domain models, Services components and schema.

J

We have a robust entity domain model with features like change, tracking validation and relationships, and this is what I'll be going into detail on today. There's also a services framework with provided services for SharePoint list data, time zones, users and groups and more.

J

We also have Dynamic provisioning of SharePoint lists for app setup and upgrade experiences. There are react, components for View and edit panels and dialogues. Asynchronous data live update, controls, a wizard and more. We have tooling to support development teams and environments, and, last but not least, a feature called live update which ensures users are always collaborating with the latest data entities. Are the implementation of a rich domain model for your application and it's inspired by the domain driven design approach to software development.

J

We have a base entity class that you can use for any data source and a list item entity class which adds standard fields that every SharePoint list has such as title author, editor that created and modified dates.

J

Every entity supports change tracking and we implement this by keeping all of the entities. Internal data in a separate State object and you expose the state by writing simple getter and Setter properties on the entity class and with this state object we can then create a copy of the state. Before the user begins editing fields on the screen, then we can compare the before and after state to detect. If the user has made any changes, you can store many different types of data in the state, including all the JavaScript Primitives arrays sets Maps.

J

Custom objects, also support validation and you declare rules on the entity. We have built-in rules for a minimum and maximum values maximum length for Strings and arrays. Whether a value is required and also a couple of rules for URLs and email addresses, and of course you can write your own validation rules too.

J

We also have delete and soft delete support basic text search. This is a feature for enabling uh filtering of a list of entities on the client side. So imagine a UI that displays a list or a collection of items and there's a filter box at the top of the screen.

J

When you define your entity class, you can specify which data from The Entity is searchable and there's built-in functions for filtering entities based on text input.

J

We also have a pattern for defining sorting and filtering functions, and there are helpers that allow you to easily combine multiple sorts and filters and, lastly, relationships relationships between entities are a first class construct in the accelerator. You define them as navigation properties on two related entities, and the accelerator supports one to many and many to many relationships and in code you can program against either side with a relationship, and both sides will be kept in sync and relationships can also participate in change tracking.

J

So, for instance, you could design an edit experience around a parent-child relationship and you can detect any changes to the related entities and then accept or revert all of those changes.

J

Let's uh make this discussion a little more concrete. I have here a simple illustration relating some of the entities in the rhythm of business calendar solution to the SharePoint lists we use for the back end.

J

So the business requirement here is to have events that are tied to values and we group those values into refiners, and all of this is configurable by the end user.

J

So on the left here, where it says refiner an example could be department and where we say refiner value examples could be sales, marketing or engineering, those will be departments.

J

So in this solution we have an events list see on the left side for SharePoint list. We have an events list that has a multi-valued lookup column, to the values list and from the values list, there's a lookup column to the refiners list, and so in the entities we can represent. Those relationships.

J

I just want to quickly show you how to find the documentation for all of this. So if you go to the sample page for the rhythm of business, calendar and scroll, all the way down, there's a section here and there's a link directly to the documentation on entities which is what we're talking about today.

J

Right so moving on I want to quickly revisit the user interface for the Calendar app and provide some context around where entities fit into the picture before we dive into some code. So here's the Calendar app, you can see all of the events for the month of May and on the left. We have our refiners.

J

So we have refiners for team type and Country and then the values underneath of that refiner. Now, if I click on one of these events, I have this little pop-up, you can see this event here. Candidate profile reviews is associated with this blue Human Resources, refiner value, and also this review refiner value which comes from the type refiner.

J

Now, if I uncheck this, you know you can see it filters the view all of these Human Resources events disappear so in the code we're using entity relationships between all of these entities to make this logic more robust and easier to maintain. Now, if I open this event, what I want to do is demo the edit experience.

J

If I go and edit, if I change the title.

J

Now so this text box is being the value is rendered directly from the property on the entity. So we have an event entity that is driving the data here and as I type in the Box. The changes are immediately written back to that property on The Entity, but I should mention that when I open this edit panel, it automatically took a copy of the state for the event entity, and so before I started making changes.

J

We have a copy of what the title was before then now what I could do is, let's say, I accidentally clicked the close button, because we have those the copy of the state. We can compare them and know that I've made changes and we can drive UI experiences like this little pop-up asking me. If I want to keep my changes or discard them and if I choose to discard them, then we can simply erase the current state of the entity and go back to that snapshot copy that we made before the user started.

J

Editing all right. Let's see some code, okay, we're going to look at how to define a basic entity class, for example. We're going to create a category entity that has a couple of properties, one for the numerical order, so this could indicate how the user wants to sort this category in the UI and a property for the users who will own this category.

J

So the first thing we do is define a class and derive it from one of the entity-based classes, and then we use this I State interface to define the data for The Entity, and the data is anything that we want to participate in the change tracking or something that will be loaded or saved from the backend data store that we can't calculate from existing data.

J

The next thing, you'll notice, is the Constructor.

J

Now this one's rather long, and that's because it's a list item entities, so we have a lot of SharePoint related data, but if you'll notice, all these parameters are optional. So when creating a new instance in your code, you don't need to pass anything to the Constructor and these values will be set later by Services when you save it to backend SharePoint list.

J

Also in the Constructor we set default values for each of the fields. In the state, so usually, this is just zeros for numbers and empty strings, an empty array, and finally, we have uh Getters and Setters to expose the data now notice. We use the state property that is defined in the base class.

J

These property accessors can be simple, as you see here, or they can can contain business Logic, for example, if you have properties for the start date and the end date, you could write logic in each of the Setters to ensure that the end date always comes after the start date, all right. Let's move on and add some validation to this entity, so we're still on the category entity and what you'll see is we've added a couple of static fields to the class definition.

J

We split out the validations per field, and we do this so that we can easily reference these from the UI so that we can put validation around like a specific input field. So the first rule here we have is for the order property and it says that it has to have a minimum value of zero right. It can't be negative.

J

uh The second validation rule we have is for the owners field, and we have two rules saying that the field is required and then it can have at most five users, and so you can see we can use our built-in required validation rule even on an array, and that will make sure that the array isn't null or undefined or empty all right now towards the bottom of the class definition.

J

There's this protected method, validation, rules which we're overriding from the base class and we simply concatenate the rules for each of the individual fields into one large array of rules, and so this is what's used to determine the overall overall, that the entity is valid, and so we'll see more about that in just a second okay. So now we're going to look through some example code on how to use an entity for this example we're going to assume that we've retrieved a category from somewhere and the user is about to make some edits.

J

So here in step, one before making any edits. What we need to do in code is call a snapshot function and this will take a copy of the entity's internal state. Now we're going to pretend that the user is making edits, they set the order to two and they empty out the users array.

J

Then, let's pretend in step three, that the user is trying to click the save button. So the first thing we would do in our code is check if the entity is valid and we can do that by simply calling the valid function, and this will run all of the rules that we've defined against this instance of The Entity, and in this case, because the user is set, the owner's array to empty and that's a required field, the validation should return false.

J

Now, let's imagine that the user sees the validation error and fixes it they've added some users.

J

Now, when they click the save button again, we can run our validation logic and it should return true and then the next thing we would do is use our services to save that entity back to, let's say a SharePoint list, for instance, and if that completes successfully, then what we need to do is call the immortalize function which what this does is simply delete: the snapshot, uh the copy of the internal state that we took earlier.

J

Okay. So, alternatively, if the user doesn't choose to save their changes, if they want to cancel all of their edits, we can use the revert function and what this does is set the current state to that snapshot that we took so we're reverting any changes that they made all right. Moving along.

J

uh Let's explore entity relationships for a bit. What I have here is a basic meeting entity, so this is going to be a one-to-many relationship with the category entity that we are just working with and a meeting will have one category and a category it can be associated with zero or more meetings.

J

So the first thing we'll need to do is, in the istate interface, um add a field for the category that's associated with this meeting, and if you think about the the back end SharePoint list, this will correspond with having a lookup field on the meetings list that points to the categories list now down here in the body of the entity class. We want to define a read-only field that will be the navigation property for this relationship and we use the this generic interface for the type I.

J

Many to one relationship of category, which you can think of saying there will be many meetings to one category now here in the Constructor. We are initializing the field and we have to specify the name of the corresponding field on the category entity. So, on the category entity, we will have a navigation property called meetings which we'll see in a second, which represents the other side of this relationship, and this last parameter is the name of the field in the state.

J

Now we have to specify these parameters because it is possible to have business logic where there's more than one relationship between the same two entities, and so what this allows us to do is specify which fields are being used in this relationship. Okay, just a minute left. So now what we're going to do is Define the other side of the relationship, we're going to go to the category entity, and you recognize it from before the things that we've added are the navigation property for meetings and we've initialized it.

J

uh Similarly in the Constructor, and so the last thing that I want to do is quickly show you how easy it is to use these relationships after we have them set up. So the first thing I want to do here is create a new category entity and we'll set the title to Green.

J

Then we're going to create a new meeting entity meeting one and I can use the category navigation property to set the category for this for meeting one and for meeting two I'm going to create and I can use the other side of the relationship. I can go from the category and add the meeting to it and then you'll see if we were to run these statements. uh Getting the category for meeting two I can get the title it would.

J

Output Green from the category I can ask how many meetings are associated with it at this point, that would be two. uh The next thing I could do maybe is from the category. I could remove meeting two from the relationship and you can see now. The output would change so meeting two. If I try to get the category, it would return null and if I ask the category how many meetings are associated with it, it should only return one all right.

J

That is all we have time for today, so in the next demo um I plan to cover the technical implementation for the live update feature. uh Thank you. So much back to you, Hugo.

B

Thank you, everybody. The recording will be available in 24 hours on the Microsoft 365 and Power Platform Community YouTube channels go to AK dot, Ms, slash, Community videos and subscribe smash that subscribe button, because you will get alerted for all of the videos when they drop, don't try to download it in teams. It'll just end in sadness. If you're not in Microsoft, subscribe today, it'll end in happiness, you'll power up, you can follow us on Twitter at Microsoft, 365 Dev and at m365pnp for the latest updates. They will be shared there as well.

B

The next video connections and SharePoint framework called June 1st 7 A.M two weeks from today same bat, Time same bat, Channel, M365, Power Platform next week, May 25th same time get all the invites at aka.ms. Community, slash calls add them to your calendars. As Hugo said, this is a crystal ball into the what's now, what's new? What's next for Microsoft and seeing how everyone is using the technology, we love. So please thank you for all that you've done. We appreciate you in the community so much keep it up. Love the collaboration.

B

Have a wonderful rest of your day and a wonderful weekend, foreign.