 Even though Microsoft retired the MS600 exam and the associated MS600 developer certification in March, 2023, you can still use the free self-paced resources that Microsoft provided to learn things like office add-in development. In this video, I'm giving you my entire guide that walks you through these free resources, including lectures, hands-on labs, and videos. Hi, I'm Andrew Coll, and if you're new here, be sure to hit that subscribe button to stay up to date on all my videos for web and cloud developers on Microsoft 365 and related topics. And while you're at it, make sure you subscribe to my newsletter to get insights and the latest news in the world of Microsoft 365 for web and cloud developers. I've got a link to it here and the one in the description below. Before we get started with this, I wanna set some context on what this video is going to cover. And while this only takes a moment if you're familiar with the history of my MS600 exam prep course, feel free to use the chapter links in the description below to jump ahead to the start of this guide for self-paced learning on office add-in development. I've got chapters for everything. I created an exam prep course for the MS600 exam, building applications and solutions with Microsoft 365 core services that hundreds of developers had used to prepare for and pass the exam. Microsoft used the exam to measure a developer's knowledge around a few Microsoft 365 workloads, things like SharePoint, Microsoft Teams, Azure AD, Microsoft Graph and Office add-ins. But when Microsoft retired the exam in March 2023, I was left with this course that served as a guide for all those free self-paced study resources that developers could use to prepare for the exam. I can't sell that. No one could buy it would buy that course or more importantly, I can in good conscience sell it because the exam doesn't exist anymore. But here's the thing, the course content is all still valid. It's a self-paced guide on how to learn various things like what you need to know to be a qualified developer building office add-ins. So I've decided to release the chapters for each of the different workloads here on my channel. That's what you're about to watch. Note that there are parts of the video where I refer to the exam. Just know that the exam, I'm referring to the MS600 exam. That's retired at this point and it's no longer available to take. Also throughout this video, I'm gonna reference a lot of online resources like documentation, training modules, videos, hands-on labs, the links are all in the video. But I've also compiled them in a single downloadable PDF and you can get this from the link in the description below the video. It's all on my site. Okay, enough with the explanation out of the way, let's dive into learning about the free self-paced resources for learning office add-in development. Now the MS600 exam calls this workload extending office, but it really encompasses just two different topics. The two topics it covers, the first one is office add-ins. And now while you can build multiple types of add-ins for various office apps, the exam really is only gonna test and focus on three of these different apps. It's gonna be Word, Excel, and Outlook. Now there's an honorable mention of PowerPoint, but you really just need to know what's possible and you don't really need to know much of the detail around it in terms of how to do certain things because there's not gonna be many questions about PowerPoint on the exam. It's gonna focus primarily on Word, Excel, and Outlook. Now the other topic that is grouped into this workload is called adaptive cards. And what adaptive cards are, you need to understand what they are and what they're used for and you're gonna see how they're used in Outlook as something called actionable messages. Now I'm gonna go into adaptive cards. They're gonna be used in a different chapter when we talk about Microsoft Teams and I'll talk a little bit about that in this chapter, but not a lot. I'm gonna focus primarily on how they're used in Outlook and just what adaptive cards are and what the technology is all about. Now this workload, remember this workload is only gonna account for about 15 to 20% of all of the questions in the pool of questions for the exam. So this is not one of the more heavily emphasized sections of the exam, like say Azure AD or Microsoft Graph for Teams is, this is probably, I'd have to say out of all five of them, this is probably the weakest or the least important one, but still it's gonna make up 15 to 20% of the questions on the exam. So that covers the topics, but at what level do you need to know these different things that we're gonna talk about in this chapter here? What kind of depth do you need to have on each of these different topic areas that we're gonna run through? Now recall Bloom's taxonomy from the overview chapter in this course and let's use that to provide a little bit of context around what you need to know because if you understand how deep you need to know something, it's gonna help how you're gonna be tested. If you need to really know it, then you're gonna spend more time making sure you understand all the nuts and bolts of it, but maybe you don't need to go that deep. Now when you look at the skills worksheet that Microsoft provides with the MS-600 exam, you're gonna notice that most skills are going to use the phrase or start with the phrase of describe or select. So what that means for extending office, that means that we're really focused primarily on the lower order thinking skills on Bloom's taxonomy. The lowest one is remember. That's about recalling facts and basic concepts and it uses phrases like define and duplicate and list and memorize and repeat and state. Then the other one right above that is called understand and that's about understanding or explaining ideas and concepts and it uses phrases like classify, select, describe, discuss, stuff like that. So these are really the level that you're gonna need to know stuff and it kind of shows you that you're at the lower order thinking and not higher order thinking, so you don't really have to get too too deep in the extending office section. Now let's take a second and let's look at all the different lessons that I'm gonna cover in this chapter so you can know what to expect. Now aside from this intro lesson, I'm gonna also, in just a minute, I'm gonna talk a little bit about the additional learning resources that I've included and reference in this chapter that you can use to go learn more things about extending office, okay? We're then gonna have a lesson on working on add-ins, specifically around office add-ins. We got a bunch of lessons on office add-ins. The first one's gonna be about working with the fundamental concepts or components and the different types of add-ins that are available to us. And some of those will be specific to some office clients and some of them will be shared across all office clients. The next thing we'll look at is the OfficeJS API or the OfficeJavaScript API and we'll look at some of the common things you need to understand about that. Then we're gonna look at the different capabilities that we can do with add-ins. So what can we do inside of Word or Excel or Outlook? And I'm gonna look at each one of those different apps in that lesson to kind of explain to you what things we can do in there. And then we're gonna look at what the customizations options are for us. What other things can we actually do with these different add-ins and talk about like UX customizations or authentication, stuff like that that we maybe would apply to all the different add-ins across all the different office clients. And then finally, when we are kind of finished with the office add-ins stuff, the last thing I wanna cover with office add-ins is the questions and how you're gonna get asked or what you're gonna get measured on as it's related to testing your add-ins and debugging your add-ins and deploying your add-ins for use by your customers. You need to understand that because there will be some questions on there that talk about how you would actually go about building these things and how would you go about deploying them and testing them if you ran into problems. And then finally, as I said a minute ago, we're gonna have another lesson that's gonna deal with something called Outlook Actionable Messages and understand a little bit about what adaptive cards are. And I'll explain what those are and we're gonna focus on those, what the adaptive cards technology is and then specifically using them inside of Outlook for actionable messages. And as I said a minute ago in a different chapter, we'll focus on how we can use adaptive cards in Microsoft Teams. Now, like a lot of the other chapters that you're gonna find in this course, I'm keeping the depth at the level of explaining what topics you need to know. I'm trying not to go too deep in the course because there's a lot of resources that are out there and this is an exam prep course. It's not trying to teach you everything. Now, when I cover something, you may look at it and say, okay, yeah, I'm pretty good here. I don't need to, I understand what that is in a lot of depth. But if you think to yourself, what? I don't get it. Or if you're not familiar with an API or how to do something that I'm talking about in one of these lessons, you probably should go read up on the docs or study one of the recommended resources and references that I'm gonna provide to make sure that you are adequately prepared for the exam. Now I'm gonna reference some specific areas in one place or I'll reference these different resources in different areas of the course. I just wanna go over like one master list right here to explain everything that I'm giving you and that I'm pulling together for you and that you may wanna reference in just one spot. Now, in the notes that accompany this lesson as with all the other lessons in this chapter and the other chapters, I've included links to each of these things. So they're not in the video but if you look in the lesson notes, I'll put them in the lesson notes and that's to make sure too. If links change, I can easily update that stuff for you. Now, the first group of links is gonna be around Microsoft Learning and what Microsoft Learning has is they've got two different things. They've got learning paths and modules and what a learning path is, is a collection of multiple modules strung together of that you would say need to learn all of this stuff to be able to do something. So if you wanted to learn how to say do all the stuff with the extending office workload or if you wanted to learn how to go build something for Azure, they'll have a learning path with a bunch of modules in it. Now, the module that we have or the learning path that we have for extending office is called extend office clients with office add-ins dash associate. Now, this includes a handful of modules that are just gonna walk you through creating add-ins for each of the three primary products, Microsoft Word, Microsoft Excel and Microsoft Outlook. Now, there's a bunch of modules that are also provided here. These are a few of the modules that don't fit really necessarily within this learning path. There's a couple that I have in here in this list as well. The three that you see called build office add-ins with Word, Excel and Outlook, those are the three that are in that learning path at the top of the slide. The other ones that you see there about an introduction to the office client customization with add-ins, that's kind of like an intro to things that you could do with office add-ins. That goes into a little more depth of the stuff that I'm gonna cover in this chapter, but I've covered everything that you don't really need to use that one. I'm just letting you know that it's there. I'm gonna make sure that all that's kind of covered in this chapter. So the other ones that you see there are those three build ones. Those are good to go do like deep dives if you need to learn additional stuff for those specific areas. Then there's two that are about adaptive cards and actionable messages. There's one on creating and one about understanding. The understanding one is a little more overview and kind of more basic. And it focuses primarily on actionable messages, not so much adaptive cards. And you'll see in the last lesson kind of what the relationship is between these. But just know that that's kind of like the intro module. And then the one that's a little bit deeper is the one that's called create engaging messages with adaptive cards. That's the one that is gonna go a little bit more in depth and includes hands-on labs for creating adaptive cards and then using them in Outlook and then also using them in Microsoft Teams. Now I'm also including a bunch of documentation links here for around specific topics. If you wanna go further with your education, some things you're gonna need to know for the exam, some things you don't need to know. But there's some stuff like extending each of the Office products with different add-ins. I've got the documentation for where you can go find those docs, not just the MS Learn stuff, but the reference stuff for Microsoft Docs. You've also got things like common add-in topics like testing, debugging, deploying. I'm gonna go through some of that stuff in the course. But as a, again, it's an exam prep. So if you haven't done that before and you need to go learn it, those are the docs and where you need to go learn that stuff. And then also like things like, how are you gonna handle different authentication scenarios is another one that you need to do. And then finally I've included a few links in the Microsoft Docs on adaptive cards and outlook actionable messages as well. So in the next lesson, we're going to go dive into what the different Office add-ins are and some fundamental concepts and different types of add-ins that are available to us. So I'll see you in the next lecture. In this lesson, we're gonna talk about the fundamental components and different types of Office add-ins that you need to be aware of because you're gonna get tested on these on the MS600 exam. Now, Office add-ins are implemented as web applications and some types, such as task panes and content panes, they're full-blown web apps. While other types of customizations like custom functions and commands, these are single script files that are hosted and loaded from an external web app. The exam's gonna test you on your knowledge on the different types of add-ins and their capabilities. So let's take a moment in this lesson and let's look at the different types of add-ins that are available to us to create as a developer. So let's look at some of the most common types of add-ins and this is the task pane add-in. So this is gonna enable user interaction via a panel that's displayed within an Office client application and it's enabling users to modify documents or emails or view data from other data sources while you're inside of the Office client. Now, the different supported types that we have or supported apps that we have to be able to create task pane add-ins include Word, Excel, PowerPoint, and Outlook. Now these add-ins can use the OfficeJS API which I'm gonna cover in a later lesson to interact with the document, workbook, spreadsheet, presentation, message, appointment, you name it, whatever's open inside the Office client application. Because our add-in can't talk directly to a document, we have to go through the OfficeJS API and we're gonna look at that in another lesson. From a developer point of view, you're gonna implement this by creating a web app that's hosted in a location that you control. A manifest file is something I'm gonna cover in another lesson but what that does is it describes the add-in to the hosting client application and includes the URL of the web app in the add-in. And when the Office application activates the task pane add-in, the URL of the web app is loaded within the panel in the margin of the document or whatever current item is open in the context of the hosting app. And you can see that from the screenshot that I have there on the slide. You can see I've got a document open in Word and on the right hand side, I have a task pane that is just gonna allow me to click different buttons to add content to my Word document. Now the way you define your add-in is in the manifest and here you set the Office app element, XML element. You set his type attribute equal to something like the task pane app or mail app depending on the Office client where you wanna make this available. Now another type of add-in is the content add-in. The content add-in is used to insert an object into a spreadsheet or a presentation. And this object is gonna be a web-based data or a web-based structure that is going to be shown inside of this frame and it can be like a data visualization or some media or some other content like maybe you're gonna show a map from Bing Maps or Google Maps. This is supported in both Excel and in PowerPoint for your applications. Now from a developer point of view, it works the same way really as a task pane add-in. You're gonna implement this by creating a web app that's hosted in a location that you own. And a manifest file, which again I'll cover later, is what's going to include the URL and tell Office where what the URL is of the web app to go load inside of that content pane that you're gonna be adding to your spreadsheet or your presentation. When it loads the add-in, when Office loads the add-in, the URL of the web app is gonna be loaded within a panel in the current item in the spreadsheet or the presentation of the client application. And you can see there that you indicate what this is by saying it's a content app inside the type attribute of the Office app in the manifest and it's supported for both Excel and PowerPoint. Now let's look at some fundamental extensibility components that these are things that are either used in all your add-ins or you can use an optionally in just some add-ins. So these are not specific to any Office application or any specific extensibility type. So the Office add-ins XML manifest is gonna define the settings and capabilities in the add-in. This manifest file, every single add-in has to have one of these. You can configure it to control how your add-in is rendered and behaves in the target Office applications. So what kinds of things does it contain? It contains metadata, so some details about the application, like its name, description, version, ID, how it's gonna integrate with Office, what's the target hosting app? Does it have add-in commands like buttons on the ribbon and some other functionality things? What are its permissions? What's the location of the images that we're gonna use for the add-ins branding? In the case of Outlook, what is the height of the add-in? What rules should activate it? If it's a content add-in, what are the default dimensions that it should be shown in the document? And the way that this is used is that the Office client is gonna use it to understand what your add-in does. So like is it a task pane, a content pane, et cetera. And when you publish, the other way it's used is that when you publish your app to AppSource, that's Microsoft's enterprise store, the details are gonna be used to create an entry that's displayed to your customers inside of AppSource. It's validating the manifest and it validates that it runs on all the different expected platforms as well. Now let's talk about dialogue. So a dialogue is used to display or collect information about your users. So some common scenarios are prompting a user to log in, either to a Microsoft service or to a third-party service like Salesforce, maybe to confirm a user action or to run a task that may require some sort of a configuration. Like you may need to put some settings in before you actually can go do something. This screenshot you see here is showing a dialogue that's popping up that contains the Microsoft sign-in process. Now one thing to keep in note is that dialogues are not modal, which means a user can interact with the hosting office app in the document itself or whatever thing you have open while the dialogue is active. So don't assume that you have to get through the dialogue. This is available in Word, Excel, PowerPoint, and in Outlook. The other thing that we have is another type of extensibility we can create is something called a custom function. And what a custom function is, is a JavaScript or a TypeScript file that can be used as a function inside of Microsoft Excel. Like we have some of the built-in ones called SUM. This is available in Windows and Mac OS Excel and the Web Excel, provided that you are logged in to your Microsoft 365 subscription, both in the desktop clients and in the web client. So it's only gonna be available to you if you're logged in. Now I'm gonna take a look at these more in a later lesson. So we can see a little bit more detail about these, but here's what one looks like, just as a little bit of a teaser here. What this is, you can see it's a JavaScript function that's got some special comments in the header for it. So that's the, those comments that you see there, that's called JS doc. And one of them there that says custom function, you need that, that's gonna be required. You can see that once it's been registered and deployed inside of Excel and that animation that you see to the right, I'm able to then use that function inside of a formula, inside of a Microsoft Excel spreadsheet or a workbook. Now the last thing I wanna touch on really here is about commands and an add-in command. This is a UI element that's gonna extend the Office UI and it's gonna give us like a start action for our add-in. And you can use this add-in command to add a button to the ribbon or an item to the context menu or any of those kinds of things. And when a user selects an add-in command, they're gonna initiate actions such as running JavaScript code or showing a page of the add-in in a task pane. And that add-in commands are gonna help users find and use your add-in, which that can really help increase your add-ins adoption and reuse and really improve customer retention. You're gonna use them in the ribbon or in the command overflow section for Word, Excel PowerPoint, OneNote and Outlook. So here you can see we've got a couple buttons that are showing up in the ribbon at the top and whatever I click on it's gonna be able to interact or control what's going on in my task pane. Here you can see in the manifest what that looks like. You got a bunch of XML for different extension points and the different types is where I'm defining where this can show up. So the primary command surface, that's the general ribbon that you're gonna see in Word, Excel, PowerPoint and OneNote. When you see it says context menu, that's gonna be showing up in the context menu of an item. And then in Outlook, we have two different modes and then each mode has two different settings or two different sub modes. You've got, when you're working with a message or an email, you're either in read mode or you're in compose mode. And then when you're looking at an appointment, you're either in read mode, which is I'm an attendee, or you're in compose mode, which is I'm the organizer of the meeting. So that's where you can define where these different things will appear. There is a lab associate, I'm not gonna go through too much depth and on commands in this chapter. If you haven't worked with these and you need some experience doing this, I would recommend that you take a look at the hands-on lab associated with the Outlook module that I'm gonna refer to, that I refer to both in the first lesson of this chapter, but I'm also gonna add as a note that accompanies this lesson. So look in the lesson notes for that. When it comes to building add-ins, task paint add-ins, content add-ins, and the other type that we talked about in this lesson called custom functions, as well as dialogues, all of those things are also in various different hands-on labs that I will reference in the notes that accompany this lesson as well, all the same ones that are referred to as the Microsoft Learning Details modules that I talked about in the first lesson as well in this chapter. So in the next lesson, we're gonna leave add-ins and we're gonna talk about the Office JavaScript API, what's also known as OfficeJS. So I will see you in the next lesson. In this lesson, we are going to focus on the OfficeJS API or OfficeJS API. And I'm also gonna talk about some of the development tools here. So this is more about like, how am I gonna get in and actually work with my creating an add-in and extending Microsoft Office. So the OfficeJS API, which is commonly just referred to as OfficeJS, this is used to interact with objects and client apps in Office. And it really consists of two primary object models. You've got a common API. This was introduced in Office 2013. And what this does is it allows you or enables you to access features such as dialogues, UI, client settings common that are common across multiple types of Office apps, a couple of those different things. But really, the big piece here is that giving you like dialogues and stuff like that, the things that you're gonna use across all the different Office clients. Then you have some host specific APIs. We have host specific APIs for Excel and Word. And what these do is they provide strongly typed objects that you can use to access specific elements in the host application. So like for example, the Excel API contains objects that represent worksheets and ranges and tables and charts and a whole lot more stuff as well. You can refer to the notes associated with this lesson for links on each of the different APIs including the common API, the Word API, the Excel API, the Outlook API and the PowerPoint API. Now let's talk about what the programming model looks like here. Well, how are we gonna need, what are we gonna need to know about this for the MS-600 exam? Well, the first step is that you're gonna have to add the Office.js library to your web app that implements the add-in. And when you do that, that's gonna be done by inserting a reference to a JavaScript file in the head of your web app. As you can see here in the code, then just this JavaScript example here is I've got two different script references. One is for the V1 endpoint or the V1 library and one is for the beta library. So the V1, it's always updated to always have access to the latest. You can specify a specific version if you want to do that, but it's not recommended, it's always recommended you use latest. But then you've also got an option where you can use the beta endpoint as well. You're gonna add this to your web app that's implementing your Office add-in. Now, once you've gone through and you created your HTML page, it's gonna contain the add-in implementation and you've got that script reference in, the next thing is you're gonna have to do, your add-in has to do is it has to respond to the hosting Office client app within five seconds to say, I'm ready, I've been initialized. If you don't do this, Outlook or Word or Excel or whatever Office app it is, it's going to display an error. And so if it's a task pane, it's gonna show the ASP.yellow screen of death. It's gonna present something to the user to let them know that Outlook isn't the thing that's having a problem, it's this extensibility piece that is. So you have to respond within five seconds of this being called. Now the way that you're gonna do that is you're gonna implement a method called Office.onReady and you're going to, just make sure that you implement that method and then it completes within five seconds. Like I said, failure to do this, it's gonna display an error. So in the code that you see here, this is a quick little example that I've got the Office.Ready function running. This is saying that Office is now initialized and now my add-in is being initialized and when that happens, I then can get access to whatever I need to get access to. Like for example, this is saying that, hey, your web app that's implementing your task pane has been loaded and now I would have access to using something like, say, jQuery and his ready function if I wanted to use jQuery in mind. Now let's talk about the requirements of the hosting application. There's a couple of things you need to do. The add-in itself can't control specifics about the Office client that it's hosted in. I mean you can say that this is for Word or this is for Excel but I can't say that Word has to be able to do these three things. I also can't do it for defining the platform. Is it, are my own Windows? Am I on Mac? Am I on, in my web? You also need to think about what version of Office.js does it support because different Office client apps support different Office.js APIs or versions. The APIs and features that are supported that can vary between the version of Office that you have installed. And so one of the things that you want to be able to do is that you wanna have a way to be able to check and essentially ask the Office client, do you support this? And the way that Office does this is it implements something called a requirement set. And so what you're gonna do in the requirement set is you can check to see, if Office.context.requirements, you can ask it, is this support, is this the set that I'm giving you, is it supported? And I can pass in either the required set name, or not either, but I pass in the required set name and optionally the minimum version that would be supported. And then if it is supported, then my code would run. So I could have that if else statement to provide certain functionality to someone who say has the latest version of Word installed and has the latest features. But then I can have a graceful fallback if the user has an older version of Word installed and doesn't have access to those same features because they weren't in the older version. Now, let's talk about how your code runs inside of an Office add-in. You need to know how add-ins are executed and how you're gonna interact with the Office app when you're using something like Office.js. Now, your code is gonna run in a sandbox JavaScript environment and that environment can't directly access the Office app, the document, spreadsheet, presentation, email, counter event, whatever other Office type that we're in, you can't access that thing directly. So instead, what's gonna happen is that Office.js gives us these proxy objects that represent documents and these are called request contexts. It's usually just referenced as just context that you'll see in the code. Now, use the data inside of a context. Just because you're given a context doesn't mean you have access to all the properties on the current document that's loaded in the page on the N-word. Instead of what you have to do is that you have to go ask Office.js to say, I need the values of these properties on this context object or on the document. And so what you do is you use this load method to kind of queue up a list of all the properties that you're gonna need and then once you have those, you're gonna call this method sync and what that's gonna do is that's gonna tell Office.js to go to Word and to go grab all those properties and then hydrate them inside the Office API. Inside, here's an example of using this inside of Excel. So Excel uses this concept of Excel.run and you can see that the run that's being passed in is giving me a callback but it's giving me a reference to the context. That's the request context. Now, when it comes to Excel, the context is gonna give me access to the current workbook that I'm in and maybe getting the selected range. So if I've got a bunch of cells that are selected inside of the spreadsheet, that's gonna give me that selected range. Well, I need to know where that range is and that property is the address property. Well, that address property is not hydrated on that object and so what I'm gonna have to tell it to do is say, I need you to go load the address property or you'll hydrate it. Then when I call return, or sorry, when I call context.sync that's gonna return a promise that I can then once it resolves and once it finishes hydrating that property to where I can then go access the address property on the selected range as you see here on this slide. Okay, now let's take a look at some of the development tooling and the debugging options that you have when creating a custom office add-in. And the exam's not gonna test you on actually creating stuff. It's not gonna ask you to say, go create an add-in that does these three things. But you are gonna be tested on what tools are available to you and what options you would have and what scenarios they'd make the most sense. Just like in the last one, you need to understand how the API works because you may be given a code snippet and have to explain what it does or which one of the code snippets is valid for saying that you need something that does this, whatever it defines. Those kinds of things will be on the exam. So developers can choose from multiple different development options when you wanna go build an add-in. First option that you have here is Visual Studio. So what Visual Studio is, this option is gonna be used to create add-ins for developers on Windows if you also want to have a C-sharp or Visual Basic based back-in, like a .NET based back-in. What I mean by that if you wanna run server-side code. Now it's running in your environment, remember, not running inside of office. This is used to create add-ins for Word, Excel, PowerPoint, and Outlook. The other option that you have is something called the Yeoman Generator for Office add-ins. And what's nice about this one is this is cross-platforms. You can use this if you're developing on Windows machine or on Mac OS or on Linux. It doesn't really matter, it works everywhere. The Yeoman Generator, when you do this, it's also going to assume you're using a Node.js based back-in. So a Node.js based web server to run your server-side code. If you wanted to use a different technology, then you can totally do that. Just remove the Node piece to it. You can add in, like say using .NET or .NET Core or ASP.NET Core. All that stuff is still an option for you. But Node.js is what the out-of-the-box one is based on. You won't be asked on the exam to use Yeoman and .NET at the same time. It doesn't walk you through that kind of a request. This is going to be useful to create add-ins for a lot more types than what we can do in Visual Studio, including OneNote and Project as well. Now there are some complementary tools, not just Visual Studio and the Yeoman Generator. And oh yeah, I forgot to mention on the last slide that when we talk about the Yeoman Generator, you just need a text editor. And that generally is going to be VS Code. You generally are going to use VS Code for that. The other thing too that you'll see is that there are some things that are getting installed when you use the Yeoman Generator as well. And that's some of these complementary tools. One tool that is going to be, is very useful. This is good for like prototyping what you want to do with OfficeJS. It's called ScriptLab. And what this is, is a task pane that will install in WordXL or PowerPoint. It's like a custom add-in. It really gives you like a little code environment where you can try out your OfficeJS code to go work with the current document. So it's a great way to test out your stuff that you're gonna write for your add-in without having to go through all of the extra overhead of creating the manifest and creating the web app and adding the OfficeJS reference. You don't have to do any of that stuff. All that stuff is done for you. Now this is, again, this is just good for like prototyping because you're gonna have to take that code out of ScriptLab and you're gonna shove it into your add-in that you have done all that stuff for. The other thing that we have is a thing called a manifest validator. And what this is, it's going to examine your manifest to make sure that everything is complete that needs to be there and that it's all correct. This is included with projects that are created with the Yeoman Generator that I just talked about a minute ago. But if you don't, if you chose to use Visual Studio, then it's just a Node.js-based tool. So you just have to have Node installed and then you install the Office add-in manifest validator and then you run the validator and pass in the path to the manifest file and it will go through and validate that for you. Okay, so that's a lot of like the common stuff with add-ins and the development tooling and some of the common tools that we can have access to. Now that we've understood all of those things, the next thing we wanna start to get into is the specific capabilities of each one of the Office clients like Word, Excel and Outlook, the things that the exam's gonna test you on. So I will see you in the next lesson. Now, in this lesson, I'm going to take a look at what you need to know about each of the different Office client apps that you're going to be tested on, specifically the capabilities around Word, Excel and Outlook. Let's start with Microsoft Excel. This is probably the most robust one and also the most complicated one, Outlook coming in a close second. So again, Microsoft Excel, the API that we have for Excel.js is probably the most robust API of the entire part of the Office.js API. It's gonna allow us to create managed charts and graphs inside of worksheets. Now, we can create task panes with an Excel and we can also create content paying add-ins inside of Excel. And the kinds of things that we can do with this are things like managing content and formatting and structure of a workbook or spreadsheet. We can also add update and set values inside of cells and create tables and ranges. Now, if you're not familiar with the Office Excel API, I'm gonna refer you to the notes that accompany this lesson for a link to the Microsoft documentation on it. I'd also strongly recommend that you go through the hands-on lab and that I've provided in the associated Microsoft Learning Excel module that contains some stuff that you're gonna end up doing with Excel. You end up creating a, you create a task pane that creates actually what you see there on the screen on the picture on the screen there on the slide. What you create is you create a table of data and then you fill it with data and you're gonna go fetch like stock quotes and stuff to go update that data inside of that spreadsheet. But you're doing all of your work from the task panes. You get to see a really good way of how to implement one of these. Now, another thing that we can do with Excel is a custom function. These only apply to Excel. The way that these work, these are custom JavaScript or TypeScript functions that are used as an Excel function that's available to us. So the way it works is that this is gonna be loaded inside of an HTML page and it's gonna contain another script reference to the custom function runtime. This is, you need this runtime because it's gonna give you access to Excel, not just OfficeJS, but it's gonna give you access to Excel. Unlike other types of add-ins though, it only runs JavaScript. You have no access to things like the browser DOM or the page DOM, so you can't do things with like with jQuery. Nor can you OfficeJS to interact with the document itself. You can share information with a task pane in the app, but you can't talk directly to each, they can't talk directly to each other. They have to go through this runtime to do that. One way that you can do this though, to be able to, so they can talk to each other, is that you can use this storage API that's available to us from the custom function runtime and from OfficeJS to be able to share information back and forth. Why would you need to do that? Well, a common scenario for this is that if the task pane had the user login and when they logged in, the task pane obtained an access token to some other endpoint, it could store that access token in as a setting and then your custom function could use that access token to go call some third party service and show the data in that way. Now let's look at Microsoft Outlook, which is one of the three primary Office apps exams gonna test you on. You don't know all the details about the API, but you do need to know how it works and the capabilities that it has. So what kind of capabilities do we have with OfficeJS? Well, we can work with task panes. Now, these are gonna apply to both the reading compose version of messages or email and events. And when you think about it, read is for an email is like the email's been sent to you. So I'm looking at an email, I'm not writing an email. And when it comes to a meeting, when I'm looking at it, I'm an attendee. If I'm in the write mode, like compose mode for an email, I'm actually drafting an email. But if I'm in the compose mode for a meeting, well, I'm the organizer. I'm the one that's actually able to make edits to it and make changes to it. Now, there is something that's very specific to Outlook, a type of add-in that is not available anywhere else. And that's called a contextual add-in. And what this is is, this is gonna activate based on text that is found in the message or in the appointment. So think like if you had like a shipping tracking number or a mailing address that was found inside of an email. What this does is you're allowed, it enables you to automatically load your add-in between the header part of the email and the body of the email where maybe you show an address or details on the shipment of where it currently is. These can be activated also via regular expressions. And these can be activated via regular expressions as well, or a known type. These known types are things like phone numbers, email addresses, contacts, an address, or a meeting suggestion. Those are things that are native to Outlook and the Outlook JS, but you can also use a regular expression to find stuff as well. The other type of add-in, here's an example of it too, where you can see it found a address inside of our email, so one Microsoft way. And it's popping up that Bing map inside of the email where I can see the details of it popping up and being activated. Okay, another type of add-in that is only available to us in Outlook is a module. And what a module is, think about this, well, easiest to just show you. So think about this as like mail is a module inside of Outlook, calendar is a module, tasks is a module, contacts or people is a module. In this case here, you can see that I've created one called billable hours. And it's taking over the entire screen I've got a couple of commands in the ribbon that you can see up there for the billing rates. But you can see here that I have a bunch of more information showing up inside of Outlook inside this module here. Now, let's talk a little bit about authentication because when it comes to Outlook add-ins, you're really, you're frequently working with user information or needing to get user information inside of one of these Outlook item types. So Outlook is a tool where you're working with the current user's information. The information is gonna probably reside in Microsoft services that are frequently accessible via the Microsoft Graph. But in many cases, the data may reside in other services like Salesforce or Google or many others. So regarding or regardless of where it is to get to that data, you're in need to, you're at end to have some sort of an authentication request, an authenticated request to one of these different endpoints. So let me show you, let me talk about some of the different options that are available to you. If you're not familiar with these, I would encourage you to use the documentation links that I'm including in the notes that accompany this lesson and this chapter to learn more because you need to know these different scenarios and for the exam, you need to know the different scenarios and when you would use each one of these in those different scenarios. So make sure you read up on this stuff. There are multiple options that are available to us, depending on the different scenarios. So the first one is using what's called the Exchange User Identity Token. And this is a way for us to add in to establish the identity of the user. When you use this option, you authenticate the user once and accept their identity token as the authorization for all future requests. Now you do this by calling a method called get user identity token async and that's gonna give you the Exchange User Identity token and this is gonna be useful when you are, or it's primarily useful when you're working with Exchange on-prem or when you need access to a non-Microsoft service that you have control over. So not really the best option when you wanna do something like with, like Microsoft Graph. Now another option you can do is getting an access token. You're gonna get that from an OAuth2 flow. This is not really specific to Outlook. This actually applies to all add-ins. But the add-in is gonna prompt the user to sign in to a service using what the method called display dialog async method to initialize the OAuth2 flow. This is gonna be really useful or it's gonna be ideal when you need access to third-party services that support OAuth2 for authentication. You're gonna wanna use this when you are calling a service that's outside of your control. That's a big use case of when you're gonna wanna use this. Another option is something called the callback token. Now this is gonna give you your add-in access to the user's mailbox from your server either via the Exchange web services or the REST API. You're gonna get the token by calling the get callback token async method from the mailbox object. The access level that's controlled by the permit that your token can do, like what access it has, is controlled by the permissions that are specified in the add-in manifest. Now one thing I do wanna mention is there is another option here called the SSO token, the single sign-on token. This is possible and if you're interested, you can definitely go read up on the docs on it and I've added it as a reference to the notes for this lesson and the entire chapter, but you're not gonna be tested on it. It was not covered in the exam because it wasn't added to Office.js until 2020 when the exam was created in 2019 and it was also not part of the November 2020 exam refresh. So if you wanna see how to do this with the SSO token, that's great option for you, but you're not gonna be tested on it because it didn't exist when the test was created. Okay, now let's look at Microsoft Word, which is the last of the three primary Office apps that the MS600 exam is gonna test you on. You don't need to know all the details about the API, but you do need to know how it works and the capabilities of the API. All right, so the Word.js API, what kinds of things can we do with this? Well, it supports two different kinds of Office add-ins, the task pane add-in and the content pane add-in. It's used to manage content and formatting of a structure of a document. Those are the big things we're gonna end up using this for. Some of the scenarios are, say, working with document text and searching for content within the actual document. Now, one of the things you need to understand is, is how the API is structured. So the way the API is structured is that the Word.js API is gonna give you access to two things, a body and a section. The body contains things like one or more paragraphs, one or more tables, one or more lists, texts, objects like images, stuff like that. A section is gonna give you access to the section's body or the section's headers or footers. So, you know, you can change like the header and footer for a section of the document. That's where you get access to the section. If you're not familiar with the Word API, you need to refer to the notes that accompany this lesson for a link to the Microsoft documentation on it and you might wanna just go scroll through it and make sure you have a good understanding of what's there in terms of the pieces that I just talked about a moment ago. There's also a good hands-on lab associated with a couple of hands-on labs actually that are associated with the Word.js API in the Microsoft learning module on building office add-ins for Word. So make sure you take a look at the notes that accompany this lesson for a link to that learning path or that module. And I also referenced it in the overall one in the first lesson as well. Okay, so let's conclude this lesson by a look at what you need to know about PowerPoint. And you may get some questions on the exam about PowerPoint, but this is by far the least important of all the office products that are covered on the exam. And in fact, you may not even get a question about PowerPoint, it may just be there's just a few in the pool. So what can we do at the PowerPoint JavaScript API? Well, it really supports two different types of add-ins, task pains and content add-ins, very much like Excel. Now, the API is gonna give us the ability to get details about the current presentation and all the slides inside the presentation. And it's also gonna allow us to both add and delete slides from the presentation as well. If you're not familiar with the PowerPoint API, again, just like the other ones, I've got a link to it inside the notes that accompany this lesson to the documentation that accompanies it. We don't have any, there's no Microsoft learning module about PowerPoint. So from that, you can kind of get a feel of how important this really is to the exam. I would at least just scroll through it just to kind of have a basic knowledge of what you can do with this thing. Now, let's take a moment and explore how single sign-on authentication works with Office add-ins. Office add-ins support for SSO late in 2020. Now, in the add-in, you're gonna make a JavaScript call using the OfficeJS API to a method and this is gonna tell the OfficeClient app to obtain an access token or really an ID token for the add-in that's gonna be coming from Azure AD. Now, if the user isn't already signed in, the OfficeClient application's gonna open a pop-up window for the user to sign in. And if this is the first time that the user has used your add-in, they're gonna have to be prompted for consent. And furthermore, they may have to go through step-up authentication such as multi-factor auth if that's required by your tenant. The OfficeClient application is gonna then request the ID token for the current user from the Azure AD endpoint and Azure AD is gonna send that ID token back to the OfficeClient application. The OfficeClient app is then gonna send the ID token to the add-in as part of the resulting object returned by the get access token call. JavaScript in the add-in can then parse the token and extract the information it needs such as the user's email address or their object ID. Now, it's worth noting that none of the Office applications can request an access token that can be used to call other endpoints such as Microsoft Graph. It can only request the ID token with a profile permission. If the add-in needs to call another API, it needs to exchange the ID token with Azure AD using the OAuth2 on behalf of Flow to obtain an access token. And once the tab has this token, it can include it in the request to Microsoft Graph. Now, in the next lesson, we are going to talk about Office add-in customization. So how can I do things with like getting settings or saving my settings? How can I do UI customizations? And then another really popular one too is working with some of Microsoft Graph to integrate that into my application. So there's some little, we're not gonna dive into Graph, but little nuances there. So I'll see you in the next lesson where we talk about that stuff. In this lesson, let's look at some of the customization options that are available to developers for building Office add-ins. And this includes things like customizing the user experience, how to persist state and settings for your add-in, and what options are available to you there, and then how do you work with data via the Microsoft Graph? Not gonna dive into Microsoft Graph and all the stuff you can do with it, just how we can use it in the context of an Office add-in. There's a whole another chapter about Microsoft Graph that you need to know as one of the primary workloads in the exam. So we're not gonna go that deep in it in this lesson. Let's go ahead and get started. Okay, so let's first talk about persisting state and settings in Office add-ins. Office.js is gonna include multiple options for persisting the state and settings, but it's really gonna depend on the Office application that we're using, that we're targeting and the type of add-in on what options are going to be available to us. The Office add-ins platform provides several ways for your add-in to persist state and settings, and again, they're gonna depend on a couple of different scenarios, the client that you're in and the type of add-in you're creating. The Office.js API is gonna provide you your, provide objects for your add-in to save state across different scenarios. So here's some of the options that are available to us, depending on the add-in types. So all add-ins can use the HTML web storage or other techniques available to us via the add-in for underlying the browser control. This is things like the browser local storage, cookies, and et cetera, because they're all running inside of a browser. It's just inside of the Office client. The mail apps for, like, say, Outlook, these, you can have access to things called custom properties, which are stored on a message or an appointment inside the add-in, or you have access to roaming settings. And the roaming settings, these are gonna be stored in the user's exchange mailbox and associated with an add-in as well. So they'll persist between devices. A content app, which is available in Word and Excel and PowerPoint, you have an option for storing settings with the document or the workbook or the presentation itself. And when it comes to a task pane app, you've got the same options you have and the content add-in, so same settings option, but you also have these things called custom XML parts. And this is data that's gonna be stored in a custom XML portion of the document or workbook. And, like, for example, in Excel or Word, you're gonna use the Excel and Word Office JS APIs, the specific APIs, to work with these different settings. Again, refer to a specific hands-on lab for saving settings for one of the Microsoft learning modules that I'm gonna reference here in the notes that accompany this module or this lesson. Now, Microsoft's Office UI Fabric Library, which was recently renamed to Fluent UI, gives elements or provides elements that are gonna adhere to the Office branding so that your add-in looks like the hosting add-in so it looks very familiar to your end users. It doesn't look like a third-party thing. Now, it consists of two primary components. It consists of Fabric Core and Fabric React. Fabric Core, think of that as just like CSS. You can have access to the font, colors, and icons that are used inside of the Office app. So it adheres to the same, you can make sure that you're working with things that look like the same theme of the hosting app. Fabric React, these are core elements that add input and navigation and notification components and a lot more things as well. Now, these are only available when you're using the React Web Framework when creating your Office add-in. There are multiple labs that are, I'm gonna reference in the notes that accompany this lesson, that you can run through to see what kinds of things you should know and how much detail that you're gonna get into with the Office UI Fabric. There's not a lot of questions about the Office UI Fabric on the exam. There's some questions, but there's not a ton of questions. It's more or less just like, what are the different objects that are available to us with Fabric React and then what kinds of things does Fabric Core contain? And again, font, icons, and color. We don't need to go too deep in there and know exactly how to use it and stuff like that, okay? Now, how do we use Microsoft Graph when working with add-ins? There's a couple of different things you need to know about this. Microsoft Graph is gonna enable us to have access to users' data in Microsoft 365 services. It's the easiest way to do it because it's essentially a proxy to all the other endpoints that are available to us in Microsoft 365. So it enables us to do a lot of different things. It enables us to interact with files in OneDrive, receive email attachments, get user profile information and interact with other Microsoft 365 services as well, such as Microsoft Teams and SharePoint. Now, the one requirement is that every time you make a request to Microsoft Graph, the request has to be authorized. And the way you do that is to include a access token in the request of your, or in the header of your request. So a couple of things you need to think about when you do this is that, how am I gonna authorize the current user to get that token? Because the user's got to be authorized or the request that's being made, the add-in has to be authorized to act on that user's behalf. So in order to do this, you're gonna have to obtain an access token by signing in to Azure AD. And I talked a little bit about that, how you can, the different authentication options inside of when we talked about the Outlook capabilities in our previous lesson, but refer to the notes that I have and that accompany this lesson about how to go obtain an access token to go talk to Microsoft Graph, because there's a lot of good documentation in the Microsoft Developer Docs that talk about you, how to obtain an access token to call Microsoft Graph from your, from your add-ins. One of the challenges you're gonna run into at this, though, that you need, and you will be tested on this, you need to understand this concept, Azure AD doesn't allow it sign-in page to be open from within an iframe. Well, that's actually how all add-ins are implemented. They are just iframes inside of an office client application. So what that means is that when my add-in launches a dialogue for you to log in, it's gonna be, or when it has you go log in, I can't redirect you to the login because you're gonna be inside of an iframe. So what I'm gonna have to do is leverage the OfficeJS dialogue API to display the login form, get you to log in, get the access token, and then save that in my, in one of the settings options that I have for use later in my task pane or content pane or whatever, all right. And I've covered all the different options that are available to us to do that. Now you can use any of the existing methods to authenticate and obtain the access token from Azure AD, both the ones that I've already covered, but there's a lot of libraries that make your life a lot easier. If your add-in has got a server-side component to it and you wanna make your calls from a server-side, if it's .NET based, you're gonna use msal.net, Microsoft authentication library.net. If it's node-based, you wanna go look at the documentation that they have for this because you wanna use what's called Passport Azure AD. Passport's a very common and very popular authentication middleware for node JS-based applications. If you're doing something that is completely client-side, you're gonna want to use msal.js, the JavaScript version of Microsoft authentication library. Now, you wanna pay attention to what's covered in the Microsoft Identity Workload chapter of this course, specifically around the implicit flow and the auth code flow. I'm gonna just talk about it very briefly here, but I want you to make sure that you pay attention to it inside the Microsoft Identity chapter. When the exam was written, it was in late 2019. It was refreshed again in November of 2020. When it was first written, the only client-side way of authenticating with msal.js, which was msal.js v1, was using the implicit flow, right? That's the implicit flow, it's an OAuth2 flow of how you can go obtain an access token. However, in the middle of 2020, Microsoft updated msal.js in Azure AD, so that now msal.js v2 now supports for a fully client-side solution, no server-side component to it, the auth code flow, which was usually only used in a server-side-based implementation. It's more secure and it's the approach that Microsoft wants to recommend people use. However, with that being said, while that's true in, let's just say the real world, in the exam itself, that didn't exist when the exam was written, nor was the exam updated to include the auth code flow for client-side-based applications. So just keep that in mind that there may be, there's, when it's gonna ask you about some stuff, it's gonna ask about the implicit flow, you wanna remember, ah, like I talked about in the overview chapter of this course, that's right. This was back from late 2019, when the implicit flow was the way that we're recommending everybody do this with MSALV1, MSALJSV1. I do have a lab that I'm gonna reference inside the notes that accompany this lesson that is going to walk you through how to work with Microsoft Graph from an Office add-in that you can create. So if you haven't done that work with Microsoft Graph with an Office add-in, I have a lab that's gonna walk you through it, that's gonna give you a good amount of experience to be ready for the exam. Okay, now we've covered all the different capabilities from the different OfficeJS API and from each of the different workloads and the different add-in types that we can create and some fundamental components. The next thing that we need to learn is how do I test, debug, and deploy my Office add-ins? And that is in the next lesson. Now let's change our discussion from what types of Office add-ins we can build, their capabilities and how you can build them to switch and focus more on the process of actually building these things. Now in this lesson, I'm gonna cover the aspects of testing and debugging and deploying your custom add-ins that the exam is gonna measure you on. I'm gonna start with deployment because sounds kind of weird, but you really need to know how to get your add-in running in order to test and debug it because unlike traditional console or web apps, you need to be able to test your add-in running within an Office client as that's really the only way that the Office JS API is going to work. So let's dive in. Now, there are multiple options for deploying Office add-ins. Some are more applicable to testing environments. Others are more applicable only to production deployments. So you should be available or should be aware and understand all of the different scenarios under which they apply and when you would choose one over another one. You will be tested on this. So you need to know what options are available and when you would use them, all right? There are a couple of different things you need to look at here. We've got the side load, the centralized deployment, the SharePoint catalog, app source exchange server and a network share. Let me explain each one of these. What is side loading? Side loading is when I'm gonna install my add-in locally and it's great for debugging. It's like the best option for you for debugging. So this is really when you're doing your development. This is when you're going to create your add-in. You're gonna go into Outlook or Word or Excel or whatever and you're actually gonna have it install an add-in and you're gonna actually find the manifest file and select it and then you're gonna spin up your web server on the side that contains your add-in and then your add-in is just going to go ahead and load. There are options for even doing side load installs with Word and Excel on an iPad. Now the second option is centralized deployment. Now this is where you're gonna deploy your add-in to your entire organization through the Microsoft 365 Admin Center. But this is only really intended to be used and really only works within an organization in Microsoft 365 or in a hybrid environment. This is not really designed to be used as like a public distribution model. There is another option using the SharePoint catalog. It's a little limiting in the sense that it only works for Excel, Word, PowerPoint and it only works on Windows environments. It will not work for macOS or web environments. So the way this works is you distribute it via the SharePoint Tenants app catalog and you can, it's good for when you want a distribute a task pane or a content add-in that's ready for use within an organization in an on-prem environment. So if you're not in Microsoft 365, this would be a good option for you if you're say on-prem and Windows only and you have an add-in that's a Word or Excel one or PowerPoint. The next option, the fourth option is App Source. So what App Source is, this is like Microsoft's public store. This is when you wanna distribute your add-in for the public to be able to download and install inside of their office clients. There are some requirements around this. I'll talk a little bit about that later on in this lesson. The second to last option is an Exchange Server. So what an Exchange Server option is, this is when you wanna distribute your application to your users via Exchange. This is good when you have an Outlook Ready add-in for use in an org where the environment does not have the Azure AD identity service. So just a minute ago, I talked about the SharePoint Catalog option. This is a good option for when you wanna deploy an Outlook add-in but you do it through Exchange whereas Word, Excel, and PowerPoint ones can be done through the SharePoint Catalog option. Your last option is the Network Share. And what this has done, the way this works is that you make your add-in available via a Network Share that everyone in your organization can get to, but it only is applicable to a Windows environment. And it really is only intended for an on-prem environment as well. So these are all of your different options that you have available to you. You just need to keep in mind the different scenarios of when each one makes the most sense. Now let's talk about testing your add-in. Well, to be able to test it, you first have to get it loaded and run within an office client. And I think that the best way to do this is gonna be with the SideLoad option. That's the one that Microsoft is gonna push you towards when you're doing any of your testing. Now, SideLoad is the most common option because it's available in all the platforms, Windows, Mac OS, web clients, and it's also applicable to Word and Excel on an iPad. So you can get full coverage with this. Now, after you install the add-in via SideLoading, you're gonna start the web server manually that hosts your add-in project. So the web app that contains all the web stuff that's kind of loaded inside the task pane of the content pane, that's gonna get loaded in separately. Now, once you've installed it via the SideLoad, you then need to start up the web server for your add-in project, which is what I just said. And what you're gonna do with that, that depends on how you've built it. Like, if it's done with .NET, you're gonna be spinning up a local IIS server. If you've done it using the Yeoman Generator, it's probably gonna be no JS-based web server as well. Now, if your add-in is intended for private use, you wanna make sure that you test it in all the platforms that you are gonna support, right? So if you support it just on Windows or Windows and Mac, make sure you test it for those. Also, consider testing it for all the different versions of the Office client that where it could be supported. Maybe it's an add-in that works in both user capabilities in Word 2019 and Word 2016. Make sure you test both of those and make sure you know how it works. You should refer to the references that I'm gonna include in the notes here that are coming this lesson for more details on when you want to use it for public use. And that's when you would be distributing it to AppSource. You're not gonna get tested on this, but you just need to make sure you're familiar with the different things that are, the different options that are available to you and the different requirements that are there. The big thing you need to know about with AppSource is that there are two types of validation. There's gonna be a validation that's gonna happen with your manifest and then there's gonna be a validation that's gonna happen with the code where Microsoft is gonna have to review your add-in before they approve it for public use or for public consumption. Now, let's talk about debugging your add-in. You got a lot of options that are available to you here. Now of course, of all the different options that are available to you, you're gonna have access to all the typical logging options, so like for a server-side part of the app, you can use all the existing tools like logging to the console, writing log files, stuff like that. For client-side-based applications, you're gonna have access to the console.log method to write to the browser's JavaScript console. The web browser, you can also use the web browser's built-in tools, development tools that are available to us as well. If you're using Visual Studio, if you create the add-in using Visual Studio for Windows, or on Windows, the F5 experience can launch and side load an add-in and for some of the office clients like Word and Excel. So this experience is also gonna support breakpoints and it is a good experience because it's nice F5 development experience. But for those cases where you built an add-in using VS Code, you can use it to debug, you can also use that to debug custom functions in Excel in addition to debugging Word and Excel and Outlook-based add-ins. While you're free to attach to the server-side component for debugging, you can also install something called the Microsoft Office Add-In Debugger Extension to debug your Office Add-In against when you're using Edge as your runtime. But that only works if you're on Windows. It doesn't work if you're on Mac or web. Now, different platforms are also gonna have different options for debugging across your apps. Take a look at the notes that accompany this lesson because I'm gonna point you to a Microsoft document in the Microsoft Developer Docs that details each of the different options because there's a pretty big matrix there and they do change every once in a while. So you should be aware of what the latest things are that are available to you. You can also enable runtime logging and to find debug details that are not picked up when validating the manifest. So this is really useful for Excel custom functions and add-ins as well. And then there's a line that you end up running, refer to the notes that I have for this lesson that I've got a line there that'll show you how to go through and turn that on. And then the other option you have for debugging is to validate the manifest. And I've already covered that in another lesson within this chapter. Okay, so at this point, I've covered everything I want to cover with office add-ins. The next topic we're gonna focus on in this lesson is the last one and that is adaptive cards and actionable messages. So I will see you in the next lesson to talk about those topics. So far in this chapter, all I focused on are office add-ins, but the extend office workload or section of the exam is more than just office add-ins. The other technology in the exam that's gonna be covered is the workload in this workload or this pool of questions for this workload is adaptive cards and actionable messages. So let's look at what these are. Now, adaptive cards is an open exchange format that enables developers to exchange in a common and consistent manner. And effectively what it is is a JSON structure that defines what the UI is supposed to look like and then any of the different apps that support adaptive cards can render it how they see fit. This can be done inside of Teams, inside of Outlook, it can be done Skype does it as well, Windows does it as part of the timeline feature. There's a lot of ways you can do it and then there's APIs and SDKs that you can use to implement it in your own applications like a web app if you wanted to. This is an open format that anybody can end up leveraging here. It's also supported on multiple, multiple platforms. Now, while this can be used on a lot of different platforms and a lot of different hosts, like I said, like Skype and Windows, with respect to the Microsoft or the MS-600 exam, you only care about it for Microsoft Teams and Outlook. Those are the only two places that you're gonna be tested on in this context. Now, the JSON structure for this thing is gonna define all the components of a card. You've got four main sections. You've got elements, which are like text blocks and media or media sources. You've got containers, so you'd have like say a bunch of actions inside of a set or you have another container that contains a container. You can have a column set. So if you have a bunch of columns, you have a set of columns. You can have a fact set. So it's kind of like a name value pairs kind of going on back and forth. And then you can also have a set of images or multiple images inside of a container. You then have actions that you can do. And the different actions that we can do on a card are things like opening up a URL, submitting a form, showing another card. So you may have an action where you click a button that actually triggers another card to be displayed, toggling the visibility of a card or an element or and also the target element is part of that as well. The fourth option or the fourth type that we have are things called inputs. And what an input is, is that's like collecting text or numbers or dates, times, toggles. There's a bunch of different options there. The hosting app is gonna decide how the card's gonna get rendered and what and how they support it. So like in Teams, it's used in messages either by people or by bots. And it's used as task modules as well. And we can refresh or update cards after they've been submitted. In Outlook, we can also use it as the definition of how an actual message is defined. And this can be like refreshed or updated as well. Now, one of the things you should be aware of here about these adaptive cards is that there's a thing called the adaptive card designer. And this is a screenshot of what you're gonna see. So in the top left of this panel that you see here or the screenshot, you can see a preview of the card that is, that's being authored. You can see the structure of the card and a panel in the middle. And at the bottom, you can see the payload editor. This tool gets updated frequently. And so it may not look like this when you go look at it today. But they're always adding new capabilities and features to the adaptive card designer. You can see there are a little bit of what an adaptive card looks like at the bottom. But let me show you another one. Here's a reference of what an adaptive card looks like. So you see here, there's really two or three properties at the very top where there's a schema, a type, a version, and a body. The body is the main part of the card. So in the body, we have a container. And in that container, it's gonna contain items inside or the body is a container and it's gonna contain items. In this case here, I just have one thing which is a text block. And it's got bolded text that's gonna be medium-sized and the text that's gonna be displayed is the word Mars. Then you can see I have another element, another container in the body. And that is going to be another collection of things. So here I've got like, the idea of it is the planet summary, the type is a text block, and then there's some text that I'm writing out about describing what Mars is. And then I've created an action section as well for the body. And down at the bottom here, you can see that I've created an action. So when someone clicks on my action button, it's gonna open a URL to point to the Wikipedia link for Mars the planet. And the title that's gonna be on that button is Learn Mars on Wikipedia. So that's an example of what you would see what an adaptive card would look like. So that's what adaptive cards are. Now let me talk about actionable messages. Actionable messages is an outlook technology and what this does is it replaces or enhances an HTML email body with an adaptive card. It supports the ability to refresh a card as well using an existing card in a message. So like for example, if I get an email message and the card has an approval request, it may show me some information about the item and allow me to approve or reject it straight from the card itself. And when I do that, when I approve or reject it, it'll submit that back to some backend service who can then send a message back to say, go update the card with this new card to show that it's been approved or rejected. I'll talk about that in just a minute, a little bit more. Now these cards, these actual messages, they have to be registered in something called the actionable email developer dashboard. And this is gonna specify one or more static email addresses that are used as the sender of the email and it's gonna specify one or more endpoints that will be used to invoke actions in the message. It's also gonna include the scope of the submission as well and it's gonna dictate the set of recipients that can retrieve the actual messages from the solution. So a couple of different options we have there. I've got my mailbox is one option, that's good for testing. And whenever I use that or specify that one, those are automatically approved. I also have test users. So that's good again for testing and again that's also automatically approved. But if I choose organization, that is where I can send one of these messages to anybody in my org within the same Microsoft 365 org. And that's common in like a line of business app. These only have to be approved by the exchange admin in my tenant. The other option is a global scope and that can be sent to anybody. But these have to be submitted to Microsoft for testing, validation and approval because the receiver is gonna be trusting the stuff that's coming from Microsoft in the message. Now there are some requirements of the sender of these. The email address must originate from an email server that implements things called DKEM and SPF industry standards. So DKEM stands for domain keys identified mail and SPF is the sender policy framework. These are two very common industry standards that are used to make sure that people aren't spoofing email addresses and to do an extra bit of validation. So Microsoft requires that the email server implement these. Actual messages, the JSON that's being sent as the adaptive card that's being sent as an actual message, it must be signed using the JSON Web Signature, JWS. And it must be signed with the private key that corresponds with the public key that was included in the actionable message registration on the email developer dashboard that I talked about earlier. So here's an example of an adaptive card that's included in an email message. And so this is considered an actionable message. Outlook is rendering the message as an adaptive card in the actual email. So you can see there it's a thing to kind of prompt the user to say, thank you for attending the webinar and it's asking them for some feedback. Now wouldn't it be cool if we can actually refresh this and you can? So let's talk about what that is. We'll talk about that in just a minute. Instead, let's look at what this looks like. So the body of the email that was sent to this user, it contains all the normal stuff you would see in an HTML based email except notice that script tag that I've highlighted. The type is application slash adaptive card plus JSON. And then I would stick where that curly bracket zero placeholder is, I would stick the adaptive card in right there. And that's what's gonna tell Outlook to render this adaptive card. Now what if someone submitted that adaptive card? What do I do with that? Well, I'm gonna have a server that's gonna receive the request. And one of the cool things about this is is that a developer can host the service that can respond to the card submit action and respond optionally with an adaptive card. Could just respond with a message or status code, but you can also respond with an adaptive card. What Outlook will do is it will replace the existing card in the actionable message with the new card and the rendered new card. And it's not just doing that real time. It's also gonna do that for all future views of the email that contains the card. Couple scenarios where this would be useful and you'll be tested on some of these just like when would be a good option for this. Sending a survey to a group and allow them to quickly respond to the email message itself without having to browse or log into a website. Maybe quickly approve a code check-in or a pull request or an expense report or a vacation request. Maybe adding actions to an automated email that a service desk ticketing system is used to send to email to employees responsible for handling service requests. These actions could allow for employees to assign, redirect or add notes to the ticket. Now you wanna make sure you protect this service that receives in response to these actions from actionable messages. And there's a couple things that Microsoft has done to make this easier and you need to know these for the exam. All posts that come from Microsoft are gonna include an authorization header and a JWT, a job token that's been signed by Microsoft that also includes claims that the service should validate. If they're validated, you can assume that it's a valid message that originated from Microsoft. So you know that it came from an adaptive card or an actual message that was registered and approved by Microsoft or by an exchange admin. The token is also gonna include the identity of the recipient who initiated the action. So the person that was looking at the email. And when the service responds, it must respond via a post with, if it's gonna respond with a card, it must respond with a post that includes the new card. And your service is gonna respond to Microsoft 365 with using HB status codes and headers to indicate the submission was successful or if it failed and optionally with a status message as well. Furthermore, you can also include in the body of the message, you can include a new adaptive card that will be used to replace the existing one. The header value called card action status, that is gonna be used to provide a friendly message to the user which can contain details on the error or a success message. The header is the other header value called card update and body. This is a Boolean value that's gonna be used to tell Outlook if it should update the existing card that's in the message with the card that's included in this response as payload. So you would include that in the body of the response. So what does that look like? So here's what it would look like if I had responded with that card with a new card back to the request from someone who's filled out that last bit of feedback here. You can see the last bit of feedback I'm showing the last four results at the average rating of the last five people responded and it shows me the most recent response which was typed in by Megan Bowen. All right, so that is everything that you're gonna need to know about to be prepared for the Office 365 or the extending office workload section of the MS600 exam. Again, couple of bit of tips here when you're preparing for this exam or for this section of the exam. If I went through things in this lesson or in this chapter that were familiar to you and you felt like you knew them fairly well then you probably don't need to study those things but I gave you some additional resources to go refresh or to make sure that you are confirmed that you actually do know those things. However, if I went through something during this lesson during this chapter and you weren't terribly familiar with it or it was something new, the only things I covered here are things that are gonna be on the exam. Nothing more, nothing less. So if it wasn't familiar to you I'd recommend you use the resources that I've provided to either just go read the docs or probably I would prefer you to do this to give you a better chance at being a little more experienced with it is taking some time and doing some of the hands-on labs that cover the things that may not be as familiar. And like I said, throughout every lesson in this chapter I have included notes that accompany each lesson and referencing the hands-on labs and referencing the things that the hands-on labs also cover so that you can know is it worth my while to go take the time to go do this lab. All right, so with that, I hope you do well on this section of the exam and we've got other chapters in this course that cover all the other sections and workloads of the exam. So I wish you the best of luck and taking the exam. If you have any questions about what I've conveyed here please drop a comment below or let me know if you wanna see more videos about Office Add-in Development or something else by dropping a comment below. If you liked this video, please give me a thumbs up and subscribe by smashing that big red subscribe button below the video so you'll see when I publish more videos for web and cloud developers on Microsoft 365 and Microsoft Azure topics. I'm Andrew Connell again. Thanks for watching. I hope to see you next time.