Microsoft 365 Community Development, 10 Jun 2021

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: Microsoft 365 PnP – General Microsoft 365 Developer SIG community call – 10th of June, 2021

Description

Microsoft 365 PnP Community - General SIG call on June 10th. Demos: Remote Event Receiver Manager solution in SPFx for managing list events, List formatting demo site template, and Getting started on using Time Clock Microsoft Graph APIs or clocking in/out of shifts. Join the Viva Connections private preview! Check out the new Script samples gallery, and PnP Teams Quickstart. Recent PnP project releases for PnP Core SDK, PnP Framework, PnP PowerShell, Yo teams, component updates to Microsoft Graph Toolkit (MGT) and a new Teams Sample. Call hosted by Vesa Juvonen (Microsoft) |@vesajuvonen. Q&A takes place in chat throughout the call.

Learn more:
• See the full blog post for this call at: https://aka.ms/m365pnp/community/blog
• Download invite for bi-weekly General M365 Dev SIG call: http://aka.ms/spdev-sig-call
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

A

Welcome everybody. Welcome to this microsoft, 365 development, the bi-weekly community call where we always talk about well different kind of developer topics around microsoft 365. So this is this is the most probably versatile or uh random call because we have different demos related on different capabilities and microsoft, resist five and which is something what we actually want to do more and more so, rather than thinking microsoft uh and rather than thinking only specific services or specific apis.

A

Let's talk about the solutions and capabilities that we can build in microsoft, restful and that's what we can see also related on microsoft, viva and a lot of the other updated messaging from microsoft, which is concentrating on solutions. Now today uh we actually started with the pmp framework and core sdk update and then bmp powershell. Then your team, some microcraft 2 open, so what's happening on there, and then we will do a quick recap on the latest.

A

Microsoft, team samples a picture time so to get a mode, and then we have three cool demos coming up so from dan related on remote demos, receiver manager, solution in spf x, uh chris kent is going to do some list format in magic. I have no idea again what he's doing, but he keeps on having all of this demos ready to go and we chatted earlier this week. He actually on tuesday. He already knew what he's gonna present.

A

So I think that's gonna be awesome and then um the last demo of today is rt kumar and she's. Gonna, basically talk about the new graph apis to clock in and clock out of a shift, and I have to do with those apis. It is actually really cool. I've seen the slides and there's a group storyline related on what that means and what we can build with together with those apis so really cool stuff. Just a quick recap on the opportunities of participating in the community.

A

um We really really wanted people to do demos in this community course. um So please reach out to any of the bmp team members and if you reach out to me- and I don't have time to respond- that's not necessarily an optimal thing, but we'll try to get to you as fast as possible. uh Easiest way to really learn is by seeing somebody else to build something. You can absolutely contribute in github. There's a lot of different channels there and the most important thing is always provide feedback feedback feedback feedback.

A

Tell us what works, what doesn't work so we at the microsoft can fix things. uh So don't just deal that microsoft is. Microsoft is bad or whatever tell us why. So we can actually help you to be more successful in the future. Now a few of the assets and urls which we always have on this calls, and the reason why we have them by the way is that there's always new people in the call. So um we have two different youtube channels.

A

We have the official microsoft, 365 developer youtube channel, where we have developer videos coming from the engineering and for marketing. Then we have our community video channel where we have all of the community called recordings and community demos in one location as well.

A

We have a lot of open source assets, we have sample calories and some new sample gallery is actually going to be released I'll talk about today and then we, if you're, wondering that there's too many urls to remember just actually one of them, which is a kms m365 bmp from there you'll find all of the different assets which are available for you to take advantage now, a few of the things and updates uh as we're heading to summer time in the northern hemisphere, and we are seeing a lot of people actually being slightly tired on this remote remote conferences and remote, remote sessions and meetings and all of that stuff.

A

So we're gonna have a summer break related on at least related on microsoft, craft, microsoft, themes and sharepoint community course. Some of the other community goals were still having a discussion with them. So sharepoint community called microsoft teams.

A

Community call will be kept in tune, but in july and august we'll actually will not have them and we'll actually do a blog post on all of the details in a second as we restart this process, we also wanted to actually do some consolidation, so, as you can see from this chart and there's quite a lot of different calls on different times and they're, not even consistently at eight a.m, pacific time or whatever they're some of them are at seven. Some of them are at eight.

A

Some of them are at nine in a different days throughout the month and that's not an optimal situation. So what we're doing now is that we're going to merge some of these goals, starting then from the end of august to a model where we still keep this thursday 7 a.m.

A

Pacific time, because this has been working really really well uh for reaching out the people, so we're going to keep the m365 community called this one under spfx call on thursdays, but then we'll introduce a merged, uh an engineering call for tuesday, which is happening, 8 a.m, on tuesday every single week, and that's basically at least a representative of microsoft, craft, microsoft, themes and sharepoint, and for the rest of the course we're still negotiating most likely.

A

Identity was going to be merged on that one as well and a few others, but we cannot start using the similar kind of a community called format in those goals as well. So three demos intro under discussions in the start. So you will know that if you want to jump the intro discussions and the latest news, you'll just join quarterbacks and you'll get to the first demo and of course, we'll share the agendas and everything else early on. So you can actually jump on an exact demo because they will be 15 minute demo spots.

A

So we're really moving into this model, where it's more structural and more aligned. Now some of those calls monthly calls will keep on being independent calls uh most likely in the autumn as well. I think office add-ins as an example said that they don't want to merge. They want to keep their existing once a month, call which is completely fine, so all good.

A

Now the whole point of here is basically that, then you know when the calls are happening and it's consistent, I'm a big fan of consistency, um because then it means that we know when it's happening rather than is it is it that week or third week or second week or fourth week or what week or when is it happening? It happens every single week on tuesday and everything is getting recorded. So if you can't make it all good, so it's it's easier. This way now a few other updates. We have an ongoing viva connections preview.

A

So, if you're interested in starting building uh extensibility for viva connections, which is really the combination of microsoft teams and sharepoint and one tribe, um you can sign up for the vivo connection private preview um in that signup form, we will ask you to sign up with the github account and the url, where you want this preview capabilities to be enabled.

A

Github account is needed for you to get access on the early version of sharepoint framework 1.13, so the next version of sharepoint framework, because we use ship and framework to build extensibility for vivo connections um and as part of this you'll get access, then on hands-on labs and early bits, and you can build stuff and then also a discussion forum together with engineering, so quite nice a way of getting insights on what's coming in the future as well. Now a few other updates uh recap on the microsoft 365 extensibility lookbook.

A

We all the time get questions on that for developers are saying that I don't know what I can build with microsoft trace s5. I don't know what is the business scenario, so, what's possible, that's what microsoft 365 extensibility lookbook is designed for. So you can go here, you can have a look on the different scenarios and business ideas, there's even business scenarios, which are demonstrated with design uh examples um which you can use for innovating your own products.

A

So there's a lot of a lot of assets available and from this location, then we'll link back onto youtube, videos and documentations and samples, and all of that so really cool.

A

uh Of course, since we are in microsoft, 365 uh community core, we also also want to promote our samples and other assets, for example, microsoft teams, development, if you're into that one have a look on akms team samples. That is a gallery dedicated for microsoft teams and we actually have a new gallery which we haven't talked about in the past.

A

So paula, bullock from the air who's, an mvp from kpa interactive, is leading this effort and and we basically started collecting scripts throughout the microsoft 365 tenant management and we base I'd also welcome contributions on this basic idea. Is, then, why do we have? Why is it so hard to find always the one script which you need for automating, something? Why wouldn't we just write? Script, samples and share them together with the community so that people can easily access them and that's what the script samples gallery is all about.

A

So please have a look on that really cool stuff. It's a really nice design by the way, as well also just a reminder for the next tuesday we have a microsoft teams. Monthly community call coming up with three different demos, uh so really cool stuff on there as well. uh We will promote that one uh tomorrow and monday, of course, as well, but we'll have stefan uh satya and xenia talk about microsoft teams development next week.

A

Now then we'll go to the sharing is carrying thing and I will throw.

B

The the microphone to david awesome. Thank you veto. Well, friends. We have a ton of resources that you've seen available to you samples and code and all kinds of things that you can utilize within the community, but it may feel a little overwhelming to take advantage of some of these resources and we'd love for you to contribute back at some point. That, too, might provide a certain hurdle to you. So sharing is caring, is an initiative and a program within pnp that provides hands-on guidance on how to accomplish some of these tasks.

B

If you would like to just start using the samples you can join one of these sessions, for example, the using pnp svfx samples within vm, all of our samples are always tested, so we know they work, but there can be some hurdles in terms of knowing how to manage the versions of node and spfx to get them to work. Conversely, you may want to contribute, but you're not quite sure how to start getting involved with github and the pull request process.

B

So all these sessions are hands-on, safe space, inclusive opportunities, they're, not recorded they're, absolutely free opportunities for you to collaborate, ask questions and get involved with others in the community they're scheduled every month. We've got more session topics coming soon. We've also got amas. We just finished a graph and mgt amade earlier this week that went fantastic and in july we've got one scheduled for teams, development with our guests, victor and bob german, so be on the lookout for that to get scheduled in july. Again, all of them are free.

B

Welcome you to join any of them aka dot. Ms forward, slash sharing, is caring. That's it back to you.

A

Excellent, thank you. Thank you david on that one and then we'll do a quick recap on the project. So, let's start with the bmp.net libraries birch, I can see you on the call.

C

Yes, thank you, versa. Yay we had a release. uh Pinterest version 1.2.0 is out key new things in this release.

C

Are the ability to call any rest or graph call yourself like the course gate is wrapped around rest and graph, but now you can, uh if it's not available in crosstalk, you can just write your own calls and just use the plumbing that we have to make it happen. Interactive calls batch calls. All these things are possible with your custom graph and rest calls. Then, and the second thing is, we have interop support with pnp framework and the microsoft graph as the k.

C

So if you want to mix and match things which is a common thing to do, then it's quite easy. Now you just use graphics decay when you want and combine it with being across the game. Example to get the pages api functionality or are you speed, behaving in combination with pm, because okay, everything is possible now good.

C

We also released pnp framework version 1.5 in this case. um What's new main new thing? Is the new provisioning schema the march 21 schema? That's the default schema in the pnp framework.

C

Now we implemented the schema, but we didn't implement the actual functionality. So that's coming, but the scheme was there, so you can have a look at what's coming and you can know if you want to also contribute and already implement part of the new schema.

C

We already talked a bit about fabric and people's care about the releases that we did there's a ton of people that helped achieving those. So thanks for those guys that helped really appreciate the work, maybe one thing to call out still is that we actually also removed old and deprecated schemas from bp framework. We had them laying around like for like we never really deleted them. We dropkicked them, but we never removed them now, they're gone so uh only 2019 or later schemas are in bp framework.

C

In the current version of 1.5 and overall usage stays around more than 90 000 tenants a month a little bit down from 95 000, but kind of it's natural to go a bit up and down, but so pretty massive usage as well. I would say.

A

Well, I think that's similar for me excellent. Thank you bert on that one. Then, let's jump on the pmp powershell irving, I can see you on a call yep.

D

Yep, we also have a release, one six, um basically all the changes that happened in the pmp framework and core sdk they as always automatically drill down to powershell. So that's good. um The thing about the template schema as pat mentioned yeah so also in bp, powershell they're gone everything before the version 2019 uh or that the ones that we've released in 2019 are gone. If you have all templates lying around and you want to convert them over, it's a matter of doing a read, pnp site template into a variable.

D

So you read your template into a variable and then you say: save pnp site template and you define which schema or verse version you will want to save it as and it will automatically update your template to a newer mobile from that moment, and you can just pick the latest one and um from that moment you can use them again if you want to, we added some functionality to uh said pmp tenant and I just realized.

D

Actually, there is a commander that I missed mentioning here, but we also have functionality to add, add the content types from the content type. um Sorry for my from a hub site from so that's some functionality there added actually very recently. That's.

A

Actually, really really cool feature. You can push the content types from the content, type up to all of the site collections. That's really.

E

A

Indeed, that's it cool, let's jump to victor with the updates on your teams.

F

Yes, so we also had a new release and actually we are a little bit better than the rest. We are already on version three, so the 3.2 was released. uh We most significantly, it's been back-end updates, uh but we also had the support for schema 1.10 and the new javascript sdk 1.10.

F

We improved some conflict resolution when it comes to the scaffolding over an existing project or existing files, but the most interesting things is that we have a new deployment package. That means that you, when you run ngrok server or something like that, you can append the publish parameter to that and automatically publish your manifest package directly into the team's app store and under the hood, we're actually using the m365 cli to do all of that, and that is in the new packet. You, your teams, deploy the other interesting thing.

F

If we look at statistics, is that the react component library we're using actually the increase compared to the rest is about 30 percent and that's due to the new team's toolkit released at build as well. So it's the same, uh uh react hooks being used by old teams and the team's tool kit, but yeah there's a lot of exciting things. But if you go to the next slide, I think the coolest thing is actually that we released something called the teams.

F

Quick start, the pmp team's quick start and that's a way for you uh to start with the essentially open up code spaces, which is a visual studio, hosted in your browser with a container in the back end. So you can automatically and super fast, just quickly, scaffold out the project and then with one command line, run it deploy it to your teams, tenant and test your application without having anything installed locally on your machine.

F

So I think this is really cool, and this is just the beginning of what we'll do with code spaces and expect to see more things in there right now, the we don't support automatically updating the azure 80 apps and the the bottom points, but that's something I'm working on right now, thanks.

A

And that's it: that's it cool statement on the end, which has built the teams up faster than chris canton format. The list that's fast by the way. So that's super fast. We can see that with chris's demo later today, now beth is on the call related on the updates on the microsoft craft toolkit.

E

uh Thank you versa.

E

um So the latest updates still v2.2. um If for some of you who doesn't know what microsoft graph toolkit is it's a collection of reusable and framework agnostic components and authentication providers for accessing and working with the graph. These components are fully functional right out of the box, and the authentication providers will help you connect with microsoft graph and fetch data for you um for 2.2 we had a lot of community contributors, so props to all of them for helping us make it possible.

E

Also one of the. If you look at the right side, we have something in preview that is multi-user login, that you can try out today so download the package at microsoft. Slash mgt, next dot, multi accounts to try it out for us. If you want to and give us feedback as far as the roadmap, we're planning new components and authentication providers for the next fiscal.

E

If you attended build, one of the announcements that we made at build together with fluent ui is we're going to refresh all of our components to build on top of fluent ui web components so that everything at microsoft, that's web components, will be aligned with the look and feel and functionalities.

E

um So, if you want to see something, get changed or if you have opinions on what are the new components and authentication providers that we should build for the new fiscal, let us know head over to aka.ms, mgt and file, an issue.

A

Thank you excellent. Thank you, beth. Thank you beth on that one and then let's do a quick recap on the latest samples on the team's side. Yeah awesome yeah. We.

G

Have a cool new sample this week from the amazing, marcus muller who is very prolific with his samples. This one solves an interesting problem, I'm sure you've. All a lot of you have done this in sharepoint. You have an app people enter some data to configure the app and you need to store that data somewhere. So we've all used the sharepoint property bags, we've all used, maybe a hidden list. What do you do if you're, not in sharepoint?

G

Well, it turns out that azure actually has an app configuration resource. That's designed to do exactly this thing and marcus has brilliantly connected the dots here and given us a sample that shows how to use azure's built-in configuration resource. So you can make your team's apps configurable check it out today at the url shown. He also has a great blog article and we're going to try to get him in on. One of these upcoming uh community calls to actually show it in action.

G

A

This week, thank you bob on that one, and then we are slightly behind off the schedule, but it's fine. Let's do a quick reproduce. I will start the recording for those who wants to join the crew photo enable your video- uh and I will move in this one in here and, let's see how fast we can get to 50 see it's filled in this room really really fast. It's typically happening super fast. I think we're missing one row at least still, let's wait a few more seconds, one more 20 seconds. I think that's filling up.

A

I think we're. Oh, oh still, still, I think that's the limit uh right now. Oh still, extending okay, let's do some hand waving everybody. So thanks, everybody have a great thursday and thank you for joining on the community call and we'll crap a grief animation out of this one as well. Thank you. Thank you. Thank you for being part of this cheers everybody and, let's then jump in the demos section and we're going to start with dan related on remote uh event, receivers manager, solution in spf x for managing list events.

H

Yeah, um so actually the sample is uh not that interesting. But what I'm going to be doing is I'm going to be doing a quick demo on it and then I'm going to be talking a little bit more about the magic of remote event receivers, um absolutely, and why they're really awesome if you know when to use them so I'll just go ahead and share my screen there we go now.

A

G

A

F

H

So my name is dan: I'm a microsoft, 365 and sharepoint consultant at the evo bis, we're a small company in denmark specializing in helping businesses, implement microsoft, 365 and sharepoint.

H

Just a few quick notes on why I made this demo, there's been a change in the pnp powershell, the latest version, where we're now using app, only authentication and when you apply a remote event, receiver using app, only cons, authentication, we experienced that it doesn't actually execute the remote event receiver. It turns out that you need a app-only principle to do that, and sometimes that's just not convenient when you just need to really quickly apply a remote event receiver.

H

So I figured well if we're using user authentication, it actually works. So can we do this through rest? um I couldn't find any documentation on whether the sp rest endpoint supported it. So I figured might as well just try and I went ahead and tried and it worked um so that's the use case for this demo or sample.

H

Then I'm just going to be talking about what is a remote event receiver and when to use one and when to use power automate.

H

So if we just pull in here, the this is the demo of the web part. So it's really simple all it does. Is it lists the list you have on your site? So you can see we have this. One here called you can create items here, which is just just a list and I've added a remote event. Receiver called pnp sample block, create which really all it does is it's a synchronous, remote event, receiver. That just tells you you can't create the item here.

H

So what we will see is we get a custom error message, so it says pnp is awesome and so are remote event receivers. These these messages can actually be customized because remote event receivers, it's just a soap protocol, so you can return really any message you want um and I'll get to. Why? That's really awesome in just a minute.

H

um We can also do them asynchronous so that you can add something and then remotely there's a server doing some work and it can fill out a field. So this one just clones the title into title cloned, but you could potentially be doing other things there.

H

What the sample allows you to do is just get a quick overview of these. You can see it's there, you can delete it or you can add a new one, so it's really just to quickly manage it and so that you can get an overview of what's going on, because there's no ui way to do this, so you'd either have to connect with powershell or go through the rest api.

H

um Going back to the presentation, I'm going to be talking a little bit about what is a remote event, receiver, so essentially what it is in this case, the whole demo is focused on remote event, receivers on lists. They do exist in other parts of the platform as well.

H

There are a way to listen for events or get a trigger when something happens. So, for instance, when an item is created in a sharepoint list, you can trigger a azure function or really whatever you can. You can host it in on any web server.

H

um You can then use that to write data back to the to the list, so you could do some kind of advanced, calculated fields or you could potentially do like we just saw before you can do verification, so you can actually use, for instance, two fields and generate a unique primary key across two fields to say you can't have these two fields be identical with another list item you can also because we're in a web server and we have code- you can do really whatever you want, so you could send the data to an external service, say you're, doing your own audit log on some other system, or you could go ahead and get data from another service and write that back to the list in case you're doing integrations to perhaps a time tracking system or something.

H

So that's all really cool, but a lot of this can actually be done using power automate. So when would you want to use?

H

When would you want to use that instead, because I mean obviously power automate is always preferred and using power automate. We can easily do this thing where something changes: okay, the power automate script or power automate flow. I think they're called does something and writes that back to the list, but one of the use cases where I at least often feel that power automate really is not.

H

That awesome is say you have the six identical lists or 20, because you're using provisioning to to roll out these lists, you're, suddenly very limited in what you can do in power automate. um I've recently seen some really cool blog posts of people. Actually, writing also made scripts that can run across flows that can run across a large amount of list. But you always end up using a lot of. I don't want to say hex, but you end up customizing the power automate to a point where it's no longer a our user tool.

H

It's almost a developer tool um and in that, in that case, I generally would prefer actually using a remote event. Receiver again in this case, I'm just using an azure function. Logo, because it's something hosted in the cloud- and you can do this whole thing where, instead of having one list, you can actually have six or seven lists or 20. If you want so so you're suddenly able to you do the same thing, but across a lot of lists.

H

So so what are some of the the pros and cons of this um I mean a huge pro: is the reusability? You can actually go ahead and use it across many lists. Also, this whole synchronous an asynchronous thing, so so using power automate, we can't actually block a user from creating a list item. We could potentially delete it afterwards if it's not an allowed operation, but this whole having custom error messages um to tell the the user.

H

What you're entering currently is invalid and not allowed and just stopping them from creating that that's a really powerful tool. It's something that's been in the platform for, as far as I know, a very long time, but just you don't really see it used all that often anymore. um I didn't even know it supported modern ui until I.

I

H

It out for this demo, but also the whole aspect of them actually running, I say instantly but say you're running the asynchronous one. It happens really fast. It's not not the five-minute trigger. You have on a flow, and I believe webhooks also have a five minute trigger ish.

H

So this is this really snappy performance you can actually get. Also if we get I put in, quotes unlimited power because we're running back in code we're able to use things like see somewhere the pnp framework. So so we can really do two very powerful things. We can do third-party integrations that don't necessarily work that well with flow, um and we don't need a premium license to make an http request to some platform which might even not even support rest, and you might have to do other things.

H

So some of the downsides are it uses code, which means we're no longer in the power user suite of things where power automate, you can teach a user how to to build their own and how to maintain it, so that that's kind of a problem that you're really stuck with code. That needs to be compiled and hosted somewhere.

H

And that's the other thing you need to host this somewhere and you can host it in asia and that works, but sometimes when you're working with a client, it can be kind of a thing where you're like. Oh, I need an azure subscription, it's not going to cost that much, but we need to host it there and the client will will be like, but I don't want to pay us an extra subscription. I already have power made. Why can't we use that?

H

So so that's sometime a big bit of a hassle, then they're harder to to see put in quotes again. So so one of the things I've had sometimes is, if you're helping a new client who already has an existing setup that some other developers worked on there. There might actually be remote event receivers there, but you don't really have an overview overview of what's going on.

H

This is also where the sample can be used, because you can actually click in you can see which remote of end results on which lists, but that also leads into the black box aspect of it. So we have some code running somewhere in the cloud, but we don't know what it does. There's no easy way to see the code. You can't actually see it because it can be hosted on any environment.

H

um So so we don't know what what does this do? We can I mean we can create a list item. We can see what happens, but does it do other things? That's really hard to tell where, as with the flow, you can open it up, you can look at it.

H

Another thing that we get is the retry logic can handle logging from power automate where we get this really nice overview of. When has this paused mid run? Did it fail? Did it go? Well, um we don't really get that with remote event, receivers, they're kind of fire and forget so if it fails it fails, you can obviously use application insights to have a look at if your job failed or not um so so.

H

Another thing you could do is using cues and you can actually, whenever the remote of energy was triggers, you can write your queue instead of just executing your code and saying, okay, I'm done so there's. Definitely some pros and cons for both um and and generally, I think you should try to prefer power automate because it is more maintainable. It is more of a.

H

I don't know what you say so supported uh features that if it feels more native to the platform- and you don't need to do custom code, which I mean well, some of us are developers we love coding, but we also need to to try and use the tools that we get from the from the microsoft team and that's pretty much it for me. Thank you.

A

Cool really really good uh summary done and they will say, questions related on deprecation plans on the remote advanced receivers and there's no explicit ones as such. It is an older technology which we introduced many many many years ago before craft even existed, but it does work. um The really the challenge there is that, like then, no is, is the re, the retry logic.

A

So if there would be a native network, disconnectivity, sharepoint, online and azure or whatever, um then there would not be a failure, handling or an exception handling on that, but really cool summary. Thank you down on that and, let's then move to chris kent. Let's see what chris has on his mind today.

A

I have no idea what he's going to present again, so I so, let's see and.

J

Please remember.

A

This is a family.

J

No, I didn't realize this. I have to change my entire demo right all right, so look I'm chris. Let's move in all right so and I'll get rid of a vessel. We don't need him all right, so you may be familiar with the list. Formatting samples, repo, it's very popular repository pnp offers right. We've got 100, plus odd samples uh you can head on over here to github and you can browse directly here right. We show the new sample browser and the list formatting samples are going to be added to that very shortly.

J

We also have this kind of site here with some different ways to look at things and some tips on how to get going and all that's great and absolutely should use those resources, but sometimes what you'd like right, instead of just coming in here and you click on a view sample- and you know you get a bulletin board format and you see screenshots and that's cool and then there's instructions on how to create this in your own environment, right.

J

Here's the view, requirements and everything here and that's cool and that works really well and for the bulk of our samples. That is absolutely the way to go something new put together here and like to get some feedback and see how we like this is the idea of a kind of a showcase site, and so this is a communication site.

J

That's got several samples kind of all, grouped together this case we're looking at several the chart, samples and this can be applied to your own tenant, using pnp, remote provisioning with pnp powershell, there's some instructions and a template for you. Those templates include files includes all the list items and all the formats, so you can just kind of spin up a site, apply that format, and then you can start playing around with these formats.

J

So I want to take a look at this site and I want to take a look at some of our amazing samples. We've got awesome contributors all over the world. um Doing some really amazing things if you haven't had a chance to look at these uh charting is something that comes up a lot now in you know, sharepoint online you've got the ability to you know, there's a chart web part right. You can do other things where you embed some.

J

You know variety of things, there's a lot of ways to solve the charting problem, but sometimes you want to do a chart directly inside your list or using just your list, data right and that's where formatting can really come in handy. So we'll start with a couple of column samples here.

J

So a real easy one here is saying: look at the generic timeline, and so this is coming from our friend tessia uh kawahara out of japan, a recent mvp, a huge contributor on this formatting samples, repo- and this is a fairly simplistic form. We've got some other very interesting timeline type formats and the idea here with this format. Again, this is just a web web page right. We've got links to the samples here um anything you want to find out about the author over here uh right.

J

If we want to just open that over on github, we can go and see it there and do the readme and everything else we need for looking for extra details, but here we can actually play with it right, because this is actually on our site. It's a timeline. You can see that it's got a nice hover card and if we wanted to change that data, for instance, we could go directly to that list and then we could come in here and we could actually change things around right.

J

So in this case the timeline works by if there is something in the column right just anything at all, it's going to then put a dot and then you're going to put that information here. That's not always super obvious from the screenshot and everything else, and so this allows you to really try that out. So this is an awesome timeline. It just creates a nice little line with dots right down uh your row. You're gonna have multiple those here very, very simple: to apply just cut and paste.

J

Now, if we head back here, let's take a look at another one. uh So a number gate, so this comes up a lot by default. You can do like a data bar and let's zoom in a little bit here uh right, but an actual gauge. That shows like a percentage field, which is what we have here uh is available to you as well all right. So you can see this progress here. There's two different versions of it: there's one where red's on the left and green's on the right and one: that's the exact opposite.

J

Where green's on the left and reds on the right- and you can apply this very easily to you know a number column. You can also do this with, like the data bars, there's a couple other visualizations, but this is a really nice one really simple: to get you going on that all right. Let's take a look over here so then we've got this brand new one, also from uh tetsuyang all right. So this is a inline gantt chart which is really really cool, so this is designed to be viewed a year at a time right.

J

So it'll just take some dates here from inside your view and apply a really nice visualization. Here, so you can imagine using this in line just trying to get an idea of what a project's going on or any number of ways, and you could certainly expand this. You know to be a little larger. For instance, this one actually works exactly that way, all right.

J

So as your column width grows, so does your gantt chart so very very cool sample from tetsuya, and then we come back here and we've got like a column chart also from tessia.

J

I said big contributor, but the idea here is it's just taking numbers, and this is an example. You probably want to customize this, for whatever your columns are, but the idea of displaying these on an inline chart is really really powerful again gives you that nice inline visualization uh without having to affect the entire view, so you can use that inside grouping or whatever else you need, because it is a column format all right. So we've got a few more column formats.

J

We're going to add here that are related to charting uh we'll get that added here before we hit the publish button, but there's also a bunch of view samples. So if you wanted to do more than just the inline, you want to take the entire view and you want to format that into a chart. There's a number of options for you.

J

So we'll take a look at the chronological format, and this is from bronc I'll just say, and this is a really neat one. So the idea is here: it provides this detail here and it's just a strict visualization of no interactivity, because it's very very clean, and if you click over here, you can actually see the list item data behind it. All of these have an all items view, so you can see the actual data behind it.

J

What goes into that format, and you can switch it over to the chart, view and see it in action and then, of course, if you wanted to just jump right into it, you can not edit current view. You can format the current view, let's just close that guy, you can always format the current view and see it in action and change whatever you need to here right.

J

So if we didn't like uh neutral coordinator right there, we could say you know neutral primary, which I don't think is going to look dramatically different there you, but the idea is here: you can quickly customize this. Try it out right here in the browser without having to understand uh all of the ins and outs of moving things around github.

J

All right. Let's see a couple more minutes, I'm going to just highlight a couple more of these. Then I just closed my site. uh Where's my uh there. We go all right so now we can take a look at like so we've got a nice project, the answer, so we looked at a gantt chart that was in line. uh We've got this one uh and I'm gonna just call you gdk max, because that's what I refer to us from github, maybe guarantee- I don't want to say it properly.

J

So awesome contributor, I've done all sorts of cool stuff but check this out. So you can take this list and make an actual inline gantt chart.

J

These are individual list items and kind of lays them all out based on a project timeline very powerful, and then, of course, we have this column graph format from our friend anub, who has put together a full-on bar chart here or column chart right, so you could see it. It's got interactivity, it's marking the top ones right, it's very, very cool, it's drawing it in line right. There, you've got another one very similar.

J

So if you wanted to go for the bar graph format, all right so again, if you want to just go sideways on that very very cool, with some extra image functionality added in here and then of course another one from tesla again is a butterfly chart. So the idea here is you've got two different numbers. um You know with text here now he's showing some really cool things and that if you change the display name of this column, for instance, it's going to show up here just like that.

J

So if we go here and we see all we're going to go to our all items just so we can see those. So if we change this cost right here, column settings and we're just going to let's see edit that so we can rename it we're going to call it cost with an exclamation point, because that's a great name all right. So we do that and then we look back at our chart. You can see that we hover this.

J

It's already taking advantage of that so again, really cool chart, but it's also showing how to take advantage of some advanced functionality, such as pulling in column metadata all right- and I think we're just about done here. One more is our timeline format. So again, we've seen a few of these again from tessia.

J

This one has two different options: it's got a vertical timeline and it has a horizontal timeline, and this timeline has a click to see all the things that have happened at those times and very, very cool. To give you the different options on seeing how those hover cards are integrated and you control the entire view and how you can see that in a web part all right. So in summary, here, uh we've got a lot coming here uh with all these samples.

J

We're gonna, try and make this a little easier to digest and use, uh which is a great way to set this up as kind of a series of learning portals, uh if you're trying to encourage your power users how to learn formatting to take advantage of some of these samples, rather than send them out to github, which you certainly can uh you can help them start here directly with data they can manipulate and adjust, and uh that's about it for me.

A

Excellent, thank you chris and also fixing our scheduling uh so because I took too long time on the intro, but really awesome stuff, absolutely pretty stuff and helps on driving driving the the understanding how this can be built and we'll certainly work on getting the template out and and more easily available, maybe in a lookbook and then outside of lookbook and all of the videos how to get the install that and all that so really really cool stuff. Thank you, chris from dan and the only only just the feedback on the demo.

A

We didn't have any horses on this one um and I still laugh for the fact that every single time we reference anything on horses, because because we saw quite a few of them in a chat think about those people who never actually seen you present and they have no idea what that reference is all about.

A

Now, like rt is first time presenter uh from microsoft. In this call and let's jump to her and probably she's wondering what was that horse is all about. But let's not focus on that. Let's focus on her and what's new on the microstarcraft apis from a clock in and out on the shift perspective.

I

Thanks visa yeah, I I was wondering what the horses were about for me. um Let me go ahead and quickly present my screen.

A

We are good to go. Take it away.

I

Awesome so hi everyone good morning, good evening to wherever you are in the world. um My name is arthi kumar, I'm a product manager at microsoft, for the teams shifts application, and today we're going to talk about the time clock apis that we recently released, and so before I kind of go into the apis themselves.

I

uh You might be wondering what is time clock and what is shifts, and so I thought I'd uh give you a little contact setting over there um on what that is so shifts is a um if you're not aware it's a first party uh scheduling and time attendance, application on teams and it's mainly catered towards frontline workers, but we also do have um you know, workers uh that uh sit at uh primarily sit at a desk, uh so I.t and information workers uh tend to use it mainly for if they're you know on on-call schedules, uh but the primary use cases are for frontline workers that work on shifts shifts is catered towards.

I

The employees empowering them to manage their schedules on the goal using our self-service tools shifts, is available across all of the teams um platforms, so it's available on web desktop, but it's also available on your mobile interfaces, which is where we find most of the frontline workers where they live and then for managers. It saves them a ton of time because we're giving them a lot of autonomy um to digitize a lot of these uh workflows that they traditionally might use pen and paper or excel spreadsheets to manage their schedules.

I

A lot of times, you'd still find that in a lot of big organizations, so this just provides them an easy way to automate all of that, um the time tracking uh component, which is uh the time clock module within the shifts application. That's the api that we've uh we're going to be talking about today and that we have shipped um that provides um employees, a quick clock in and clock out capabilities. So they can talk in and out of their chefs, they can add breaks.

I

They can go back in and edit their time cards and use. All of that, and then the manager can view that um and then uh push that to their payroll system uh for payroll processing and with our apis. uh We have uh we've got a ton of uh already available uh released graph apis for most of the scheduling for all of the scheduling capabilities.

I

The time tracking component is the last one uh that we have released recently and uh usually we find this to be um mostly an integration with a third party workforce management system, so you may have your customers may be working um on existing systems of records such as chronol, so blue, yonder reflexes, sap, adp, ceridian workday. I'm just throwing out a few of the big names.

I

We do support a few connectors for some of these workforce management systems, but and all of them are powered through the graph apis themselves um that we're going to talk about. uh But you know this is uh they're they're open apis for you to be able to to use to your needs, and, lastly, shifts is used by over millions of users today. um So we're seeing a lot of positive growth in the space.

I

I wanted to kind of quickly talk through what the shifts application itself looks like and maybe walk through some of the time clock scenarios that you might want to enable when you use the basically, what does an integration look like when you use the time clock apis?

I

um I won't spend a lot of time on what the integration might look like for some of the scheduling capabilities just because the focus of uh today's demo is on the time clock component of the shifts application itself so for managers. um I have um an image over here that shows the desktop and the mobile view um they can. uh You can, you know, let's say you're using an excel spreadsheet. You can import um your schedules if you're using that um and then export it back out.

I

um We also uh have the ability for you to directly build your schedules within the ship's app, um but of course we have graph apis as well, where you can import it and sync any scheduling information. If you're you already using it in another system of record, you can as a manager you can. Let's say you need extra shifts for the day uh that you need some employees to come in and cover uh you can create open shifts. uh You can also manage all of your employee requests within the application for the frontline worker.

I

You, um the the mobile interface, is a little bit more catered towards towards the frontline worker and their experience, mostly because uh you know they're on the they're, either on the shop floor or on the um on the you know, processing lines so they're, typically on the go and they're usually on some sort of mobile interface, um you can view your own schedules. You know, what's upcoming, let's say you're working across multiple locations, uh you work for a retail store and there are multiple branches that you work across.

I

You can see all of your shifts across those different store locations. um You can see any you know. If you want to make a few extra bucks, you can pick up extra open shifts. uh You can manage your requests. You can request time off or if you want to swap your shift, you can make your shift.

I

uh You want to swap it with another employee and make sure that you know you give up your shift, but it's also being covered by someone who can take up that shift, based on whatever skills that are required for the shift or making sure that they don't go over time.

I

You can do all of that within the shift's app and then the time clock component is is the other part that facilitates an employee to be able to clock in and clock out. um So you can. uh You can start your sh you. You know you can start your shift, basically clock in and clock out. You can also start a break.

I

uh You can start multiple breaks um and stop them, um and then let's say that you forgot to you know you worked um uh today from eight to five, but you took a a couple of short coffee breaks and you forgot to punch in for one of them.

I

uh You can go back in the next day or you know, even after you clock out and go back and edit your uh time cards and then eventually, once you're happy with your timesheet, you can confirm that so that the manager will then be able to process that from hero time, clock is available on on the mobile interface, as well as on the desktop um in some.

I

In some industries they don't or even some organizations do not provide employees.

I

You know work tools on their personal devices or they don't provide them with any shared devices, and so a lot of times. Employees need to come in uh to clock into their shift, um and so there was asks on. You know. We need to support this on on desktop as well and- um and so we did recently last year um shook the time clock capabilities within the the desktop and web view.

I

So what does it look like to um integrate your payroll and time and attendance system, so your sap or ceridians of the world, with chefs being the front-end application within teams where your employees would clock in and clock out and manage their time in attendance?

I

I'm gonna walk you through a few uh scenarios, um things that we find most common commonly um used, uh but that isn't to say that you can't expand this to uh other scenarios that you see fit so um a typical scenario. You know worker comes into their shift.

I

They they pull up the teams, application um scroll to the shifts app within that, and then I've highlighted over here uh the time clock component within the shifts, application, and so, let's say, you've already integrated shifts using our now our time clock apis um to your payroll system. um When the uh when the worker clocks in um if you've registered to the web hook api um shifts, will then automatically sync that back to the payroll system by your application.

I

So um we do support um real-time synchronous, changes um on or notifications on any changes that are made within shifts.

I

Similarly, let's say that a worker goes back in and needs to edit their time card, um so they go back into the time. Clock module uh they'll, find the time card that they uh want to edit they'll go ahead and make all the edits, and then um all of that, so we we support for every action within the but then just really, but but specifically within time clock.

I

In this specific scenario, um we support um we, we support the crowd operations, but we also support those web hooks so that so that any changes that are made by the user in real time you'll get notified um and gets auto synced, and this is in fact we've had customers who uh waited uh for that webhook component uh to be released before they could. They could start integrating the timeclock um capabilities with their payroll system.

I

Simply because you know what we've heard is that you know it's a lot of manual work for an employee to have to clock in and clock out uh in one system and then the manager needs to keep track of what they uh clocked and clocked out um and kind of have that communication with the with the user offline and ensure all of their timesheets are accurate and then go in and manually punch it versus having this automated right. So there's no confusion.

I

um There's no room for human error.

I

I mean there's room for, I guess technical errors, but um it so. You know that that just automates it and makes everyone's life a lot easier.

I

So, like I like I mentioned, we already have a full suite of graph apis, supported for all of your shifts, scheduling, capabilities and I have a snapshot over here. I actually couldn't get the full snapshot because I had to scroll. um But basically, if you go to the the graph document, um the docs page um and you look at the v1 uh version, when you scroll down to teams under teams, there will be shifts um and that's basically, your repertoire of all of the shifts.

I

Apis that we support- um and you can see all the different entities that we support and if you, if you expand on each of those you'll, see all of the different uh apis that we support for each of those entities and for the time clock component of it. um So just like you see, on the left hand, side shift schedule, scheduling, group so on and so forth.

I

If you scroll down past time off you'll see what I show on the right hand, side, which is the time card um entity and then that that's the expanded view where you're you're seeing the time time card resource um and then all the different apis and operations that we support on that entity. So we do support. um You know your basic uh crud operations, read, writes, deletes list views, but we also support specific actions that you can. You can perform on behalf of that user. So um you can clock in.

I

You, can pop out start and stop a break uh and you can confirm um the timesheet.

I

So I wanted to give a quick view of uh what the time card resource would look like. So you know I'm not going to read through all of the properties, but you can kind of see um that we do support all of the all of the fields that you would see and it's basically a represent representation of what you would of what a user would see on the user interface. So it's fully supported that way. We also on all of our apis, but I wanted to specifically call this out.

I

We do support both user delegated permissions as well as app permissions um and- and so this is also on the uh documentation page, uh which, if you scroll you'll, see um and for the for for the application permissions, we do require uh you to pass in a header, um and I have it at the bottom over here. um It's the ms app acts as header and uh what you would pass over.

I

There is the user id uh on behalf of whom the application is uh making this request, without which you will you will get thrown an error, um and so I just wanted to make that call up. So so that's uh something that you don't miss and, lastly, like I mentioned the webhook capabilities, um there's a so it's it's a webhook api that you can register uh against um and it's specific to the shift application. So this is only within the shift's capabilities that you would uh get notified of any changes that a user makes.

I

um It's the it's called the workforce integration api, it's a bit of a confusing name, if you're not fully in, uh if you're, not aware of what a workforce um workforce system is, uh but the name, the reason we gave. That is basically because you can register your application as an integration between two workforce systems um chefs being one and um what we would imagine that you're integrating with as another workforce management system, and that's why it's called the workforce integration api um and so that this api is exclusively a web hook api.

I

Where you can register your integration, you'll get back like a a integration id for for that specific instance of the integration. But let's say that you have you know two um instances of kronos one in europe where your customers, um you know the customer- has one region in europe. One region in the us- and they have two different instances of chronos they're running against um and they have different configurations.

I

You know the europeans, maybe don't really care about, swap requests um and the us do, and so you can have two sets of integrations that uh are configured slightly differently, and so you would use the workforce integration api to register your integration um twice as two separate instances, even though they're running basically on the same code, and you would just configure it a little differently and um the the supports property on the workforce integration uh api um there is so there's a there's, a lot of different values that we support.

I

um Basically, all the different entities that you can listen for, changes on um and the most recent one that we have added is the time card that I've highlighted over there. That is specifically the uh the value that you would use when you want to listen for any changes that are made within the shifts app on the time clock module, and then I have a screenshot of you know the uh of an example of what the call would look like from shifts when you've when you've registered with the workforce integration um four-time card.

I

So any clock and clock-out changes that a user makes. um There's there's request uh examples of what that would look like from shifts. So you know um how you need to uh receive that uh that request and handle it appropriately, and I think that's all I had um I don't. I don't know where, if we're at time or if we have something for.

A

Catholics we are on time, but if there's any questions, people can ask them in a chat, and you can. We can follow up on that. But let me then thank you, artie really good coverage, and I like the fact that we showed some business scenarios what we can build using this and because that always helps on people understanding not just the technical api, but rather okay. What can I do with the api, which is a really really big part of that? Thank you for that one. Thank you and dan. Thank you, chris, as well.

A

Really cool demos today, we'll have to record it coming out in 24 hours in microsoft, 365 community youtube channel, where we have all of the community core demos and community call recordings uh from in the future um and follow us on twitter. The next microsoft release is what general common recall is in two weeks from now sharepoint framework community called in 17th uh as a week from now, and as we talked about we're looking into merging some of these community calls, we will get new blog post details on the summer break pretty soon as well.

A

But all of this is happening in upcoming days, but thank you. Everybody have a great rest of the week and let's stay in touch. Thank you. Bye-Bye.