Microsoft 365 Community Community Demos, 18 May 2022

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: Automatically generate technical documentation of your Power Apps and Power Automate Flows

Description

Meet your new documentation assistant - PowerDocu! In this 17-minute citizen developer-focused demo, Rene Modery introduces you to PowerDocu that leverages two console applications called FlowDocumenter and AppDocumenter, and a UI that guides you through technical documentation generation. FlowDocumenter generates technical documentation based on a provided exported Flow package or exported Solution package, and AppDocumenter does the same for an exported Power Apps canvas app. Navigate the robust report generated in seconds by this open-source tool. Kick-start your documentation creation program today. This PnP Community demo is taken from the Microsoft Power Apps community call – May 2022, recorded on May 18, 2022.

Demo Presenter
• Rene Modery (WPP) | @modery

Supporting materials
• Repo – PowerDocu | https://github.com/modery/PowerDocu

Stay connected
• Twitter https://twitter.com/microsoft365dev
• Call attention to your great work by using #PowerAppsCC and #PnPWeekly on Twitter.

Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community Blog - https://aka.ms/m365pnp/blog
• Microsoft 365 Platform Community - https://aka.ms/m365pnp

A

So I want to talk a bit about a tool that I developed um to generate some technical documentation of your power apps and um power automate flows, so my name is renee mottery, I'm actually in office 365 for office, apps and service mvp, since 2012, mostly working with office 35, but to a good amount over the past few years than with the power platform, and that was growing a lot more so right now, I'm actually the power platform technically the wpp, which means then that obviously, I've been working with powerapps and powered made relatively much.

A

Obviously, and one of those things that I've been looking at both from a professional point of view, but also from a personal point of view, because I developed obviously my own small, helper apps and helper flows for smaller stuff. One of those things I looked at was how can I actually document what I've been doing, because documentation is something that we've always been well. Everybody is usually struggling with it's nice to build some awesome stuff.

A

You build a nice new, app, a great flow etc, but when it comes to documenting it nobody's really excited about doing it um so a lot of times, then you build something and then maybe you document it. But then you make some updates and it might just get lazy because those changes you don't want to take care of, putting that into another document, etc.

A

And basically, when we talk about documentation, it also means then that there are a couple of different um components that should go into a documentation. I mean from a professional point of view, you would need something like what's over the project scope, what goes into that, what you're actually trying to achieve the business scenario, the use cases you're talking about and tech, from a technical point of view about the um system, architecture that you overall have including any other systems, maybe you're, connecting to some databases, maybe to some other third-party systems.

A

Maybe you require a lot of different accounts, all those kind of things that you obviously ideally want to document.

A

Lastly, you've also got the deployment process and some technical details and technical details really meaning whatever you're doing directly here, for example, in power, automate or powerapps. Then you might want to document that as well, so that maybe you can hand it over to another team like a support team, or so so when they, for example, try to figure out.

A

Why is the app not working they've got something to fall back on that they can refer to, so they get better understanding of how something is working, because once you start looking at an app for the first time, obviously you might get overwhelmed with stuff, so my idea was basically I should actually develop something that could help me with that. My idea was a lot of the things that get or should be, document need to be done manually, but documenting an app specifically canvas, apps or documenting flow should be something that should be possible automatically.

A

So by running it through a tool, I should be able to get a um in the end. The idea was to get a word document that then can be used for me to refer back to again when I want to figure out, oh, which variables did I have in that app. Where are they used, for example, or how many actions are in a flow? What was the structure of the flow?

A

um What am I doing in each step etc without having to go into the app or flow directly, but rather having that reference again and yeah? That's basically what I then did so I developed something: it's been around now for around half a year took some time to get. It basically started, but um was happy then, to get something launched, and I think I'm just gonna stop here with the slice and just gonna switch over to my demo. So, as mentioned um torch is mentioned, it is obviously open source.

A

So it's on github anybody can just come in here. Look at the code that I've been doing. Everybody is free to contribute to it as well. This is where you can also download. The latest releases um latest releases from february. I'm just preparing a newer one with some minor updates, but um basically I'm gonna use the february release to show you what it actually can do.

A

The idea is then, for example, just jumping, for example, into a flow. Let's say, you've got a flow here and uh just looking at what we have here. Let's just have a quick look at this uh flow that I have here just to show you what um how overall, how it looks like what it can do.

A

That's actually one of those default flows, that's available out of the box, basically one of the templates and all it does. Basically, it connects on a regular basis. I think uh yeah once per week, for example, connects to your calendar, gets a calendar view of events and basically does some checks and does some stuff and sends emails um so, roughly speaking relatively straightforward.

A

What I want to do now is I'm going to take this flow here and get it documented. So what I would have to do is simply say: I want to export my flow create a package, a zip file, and this is the one that I can then run through powerdocu.

A

Now, switching over to powerdocus, so that's the thing that you can download then from github. Let me just actually just remember something. um What I usually do is. I also can download the corresponding connector icon, so not just having the information around always using the outlook, connector and weather connector, but also using the icons there's a small script that I can use in here to download the latest set of icons.

A

So um let's just finish that in the background- and let me just open here- power, doku gui, so that's a small um windows application that I can use um to basically select an app a flow or a whole solution that I want to document optionally. I can also select a verton template if I have something so um from a corporate point of view, you usually want to maybe use them something yeah branded according to whatever your corporate branding guidelines are.

A

But if it's not selected, it will just create a blank document which we'll just use here right now. So all I need to do is then I select my apple floor solution here. All the things that I exported before so the full weather is basically the flow, the email meal with list of upcoming calendar events that I actually exported previously.

A

So I'm just going to take this one going to select open and what power dooku does. Basically, it opens the file it checks what's inside it finds in this case, oh there's, actually a flow and basically creates the corresponding documentation. So this is the documentation that gets generated gets put into its own folder. So I've got here. One flow dock, email with lists of upcoming calendar events, and in here then I've got a couple of files. So yes, I also add icons here, but more important. That's what we actually all want to see is.

A

First of all, I've got here some again the flowcharts of the flow. So if I take, for example, detailed flow open the svg, we can see it and then oh, that's actually just exactly that flow that we just looked at here so really again, some something graphical that gets exported so often when you want to, for example, take your flow you might edit it. You want to take a screenshot, oh yeah, I'm going to zoom out a lot, for example, to see it all, because it's quite big when I extend it, etc.

A

I'm simply set doing something very similar here and we can see also, then the corresponding icons, if available, are also shown here, for example, so I can see here's the weather, the calendar, etc.

A

So that's one thing so I've got scalable svg file and a png file, but I've also got here my word document and that's the thing we want to have a quick look at so the word document then contains a documentation about the flow, including, for example, the overview of again, for example, what I just generated here, but also some information. Let me just zoom out a bit about the connectors that are getting used.

A

So in that case, we've got three connectors the variables that are getting used, for example, so you can see from desktop body to send variables current events, variable, etc how they are initialized. So I can see body to send this empty calendar events. Okay, there's an object, there's a structure here, but also empty and more important, and also I can see where those variables are used. So if I want to figure out a specific variable in the flow, where is it getting used, I could run it through powerdocu and then basically get that information.

A

Oh in these actions, that's where I'm setting basically or updating or initializing this particular variable. So that's a very neat thing that can help you, especially when you've got a very large flow and want to figure out a specific variable, where's it in use, that's where I can figure it out.

A

Lastly, and obviously I'm also documenting the trigger, when does the flow starts, all the technical details. We saw that's a recurrence kind of trigger in that case, and it's uh running once a week plus all the actions, so the actions are sorted alphabetically so again, basically, a document, a name, the type, what kind of um type of action is it and then further details depending on obviously um what's available as part of the action so append to a ray variable? So you can see here there's some details here.

A

So if I look at it, I can figure out: okay, that's probably the variable and I'm appending, for example. This part here something like that. Let's check actually, for example, create html table. We can then see some other information here provided plus also then, for example, if there's anything added here, I'm sorry anything added here. um It also provides me information about which action actually comes next as well. So just some general information and yeah you can see basically tries to document it as much as possible.

A

Often, you also then get some very obviously very uh yeah technical details in here. So if I go into the app and uh into the flow sorry and look directly in the floor, for example, what kind of calendar id is it querying here, I would say, probably in a nicer way, but at least basically I get all the details done in here um as needed.

A

Now that's for flows now for apps. I can do exactly the same thing. So ideas same things. You take an app doesn't matter which one you export the package and then you've got again something that you can run through powerdocu.

A

So I'm just going to take, for example, the ponymath app an app that I developed for my kids, and that was one of the reasons why I thought I should start documenting stuff again, um because sometimes I need to update it and after months of not doing anything with it, I obviously forgot most of what I did before so taking this exported app here. I can then do the same thing in that case it discovers. It's actually contains uh um an app in here.

A

It creates the documentation as well again, and let me just jump back into this folder. We see again another generated folder in this case. There are no flowcharts right now, but we've got two word documents, so one that contains uh you could say overview plus one that is more detailed and I'm just going to open the more detailed one, even though it's larger it contains basically a lot more information so again documenting it and what I can get about that app. So, for example, some channel app properties, so I can see, for example, yeah.

A

Oh phone type is um sorry. App type is for the phone: um it's in landscape mode, those kind of things. um I can also see some so called preview flex. So, for example, some of those um preview functionalities, um for example, delay load screens- is set to true. So I know, for example, this was um yeah loading screens, basically um as required more important and also moving on to variables and collections similar to what we've seen just now with the flows.

A

I also document and the variables that I can discover and the collections and I'm also trying to document and where they are used as much as possible.

A

That's a more of a tricky thing, so um there may be sorry. There may be instances where it's not getting discovered, but most of the time I can figure out where a specific variable is getting used. So you also have that easy overview. That's now also directly in the app maker studio directly. Luckily, where I can see your variables and where they are used. But previously I tried to figure that out myself, then here documenting also the data sources, so you can see, then what kind of data sources are new?

A

So you see there are two samples and two normal collections basically and the resources that are in the app. So if there are any resources either as urls images, pdf videos, some documenting them in here as well- also adding the images as possible- if you can see so then, basically providing just some information about it. So we can yeah just have some additional information here, as required moving on uh more important than obviously want to see a list of the controls, so that's basically again imitating what we have in the maker studio.

A

So I've got a list of the different screens plus and the different controls located in that screen. So so I can see in that coin screen I've got some buttons. We've got galleries, some images etc, and I've got some other screens here as well.

A

Then now the detail part is for each control that is in the app so every single control. I also document them, basically, all the properties and that's opposite in very detailed, so every single property that I know about that we can discover here is also documented in here as well. Sometimes that may be something that's potentially set to the default value right now but other times, then it might be something that we are, for example, um sending manually or basically where we can define a specific value.

A

That's also getting all in here plus I'm also, for example, showing the colors here, making a bit easier. Then, for example, to have an overview. If I want to figure out, oh, which is zoom out a bit. um Where do I use colors and what kind of colors I can see here? There are some instances of some pink and blue, etc. So that's all in there plus.

A

Let me zoom back in again. Basically, then, that's all then in here, so really the idea is that every single thing gets documented, including them. So just looking for something like this here, for example, any function course, that's obviously the important part. Sometimes you want to see. Where do I use a certain function? So if I want to figure out where do I do a maybe a navigate? I could try to find it directly in here, and I can then see okay um folks, I'm on the on select for image.

A

Four, I'm doing a navigate, plus everything else that I'm doing um yeah and that's basically what um pow docu does separately. I could also run it against the whole solution. For example, here we can see the power up center of excellence. I can now also run it against this whole thing here, which contains a couple of apps, a couple of flows and your document each and every single one of them accordingly, then as well, just as we've seen so far yeah and that's the idea.

A

So if you want to test it out, um just go to powerdocu on github, try it out if you've got any feedback, questions. Recommendations, just add your comments over there as well. Happy to always then um yeah make sure that things get better over time as well yeah and that's the end of my demo. Basically, that's.

B

Fantastic for over a decade, I've seen you do awesome things, one time after another, on your blog and and uh it's cool to see, you're still doing cool things with tech. Well done, you're gonna save all of us a ton of time. That's for sure. I've got a couple quick questions. A lot of people are asking if it works with the solution, as you mentioned, that does work. If you do have a solution, did you mention that you're showing so many things? Did you mention if it has environment variables? It documents as well.

A

No not yet it's one of the things I'm uh I'm thinking of adding in a future release, but so far I didn't get to that point yet so, obviously, for.

B

A

I'm only documenting apps or canvas apps and flows, nothing else yet, but um yeah definitely room point uh improvement there and um variables. Environment variables are one of those things that are probably very high on my list to get added. Soonest.

B

Is action notes also one of the things on that list too yeah.

A

Oh, I think about yeah. That list probably gets longer.

B

What's your best practice, if you, if you rev a version of a uh a solution, do you just go regenerate the whole thing and throw away the old stuff it generated and use the new docks.

A

Yeah depends, I mean that's, obviously, I'm not describing to anyone how to use it from a personal point of view, whenever you create a new version of, for example, a new solution, I just regenerated again and maybe keep the old artifacts just to make sure then that um yeah we've got it all together. But um the idea is that you always got one working latest version with whatever is currently the latest version of your solution or wrap or flow.

B

That makes sense fantastic. Well, thanks again for sharing that that wrapped up all the open questions I saw as I was, I was looking through them. There might be some more in chat for you. There yeah here.

A

And I'm still going to be around thanks again great.

B

Job for that, and I can't wait to go, try it out myself tonight. That's awesome, come back and join us again, sometime renee! That was really nice.