APRIL DUNNAM: Hi, everyone.
Welcome to building teams
apps that bring value quickly through low-code.
My name is April Dunnam and I'm
a senior Cloud advocate here at Microsoft.
Today, we're going to be talking
about how we can leverage
low-code tools to accelerate
our Teams' application development.
Teams has over 145 million active users,
which makes it a great place to host our apps.
We're going to be showing some of
the low-code technologies available to us to
build apps with in Teams as
well as some of the code first integrations.
Specifically how we can integrate with
back-end APIs through Azure API management.
Before we dive in to some of the demos,
let's take a look at the Teams landscape.
Teams is a platform that
facilitates collaboration and communication.
There are multiple things that we can do when
it comes to building apps on top of Teams.
When we build these apps, we can
take a code first approach,
a low-code approach, or even a hybrid of both.
For example, if you have
a single page web application that you've already built,
you can easily integrate that within
Microsoft Teams through a tap
using a code first approach.
The same goes for bots as well.
We can create messaging extensions to
look up information from your app in
a conversation or even post
adaptive cards to gather inputs from users.
We can also have in-meaning app experiences and
incorporate outgoing web hooks to receive commands.
Of course, we can integrate with some
of the Microsoft Cloud,
including pulling information and
writing information to Microsoft Graph,
using all of the Microsoft Office Suite
and incorporating with
the power platform to build
low-code applications within Teams.
As this integration with the power platform,
that really allows us to amplify
our developer velocity through
building Teams apps with low-code.
In addition to being
a full code application platform, Teams is
also a complete low-code application platform as well.
Teams gives us a centralized place where
we can discover and use our applications,
bots, data and automation,
and through Dataverse for Teams,
which gives us the power of
platform low-code suite of tools
to build applications within Teams,
we have a complete low-code suite to build apps.
This includes power apps for building
our front-end experiences,
Power Virtual agents for building bots,
Power BI for dashboard reporting and analytics,
and power automate for
those workflow automation scenarios.
Through Dataverse for Teams,
we get access to Microsoft Dataverse for Teams' tables.
This gives us a relational and
secure database to store our data.
Now that we have a good understanding
of what tools are available
to us for building low-code solutions on top of Teams,
let's take a look at a demo.
We're going to show using Dataverse for Teams how we can
build an asset refresh request system from scratch.
For this scenario, let's assume that you already have
a restful asset management service built,
but users are requesting a way that they can have
a self-service or requesting refreshes for their assets.
This is a great fit for Dataverse for Teams.
Let's start by showing how we can create
the front-end for the asset refresh request.
We're going to do that using Power Apps.
Let's jump over to the demo.
To build this asset refresh request application,
we're going to use Power Apps.
If we go into Teams and click
on the "Apps" tab in the left rail,
we can do a search here for Power Apps.
We can click on the "Power Apps" application
for Teams and you'll click "Add" if you
haven't already added this application
before or "Open" if you've already installed it.
Here on the home screen, we can explore
all the applications that we
built in Dataverse for Teams.
If we scroll down, you can
see we can even take advantage of
some pre-built templates that we can use to get started.
These templates are plug and play
and ready to use with the click of a button.
You can use these for issue reporting, inspection,
bulletins in a variety of different use cases,
but for our asset refresh app,
we want to create a new application from scratch.
So we'll go and select the "New App" button
here and we'll select
the team that we want to add this in.
This is an asset refresh for our devices.
We're going to add that to the IT team.
We're going to click "Create",
we'll give our application a name, and click "Save".
We'll see. There are two ways that we
can get started building an application.
We can start with our data or with a layout.
Now for this app, I actually need to
build a table or somewhere where
we can store these requests for asset refreshes.
I'm actually going to do these start with data option,
and I'm going to use this option here
to create a new table.
This will allow me to create
a Dataverse for Teams table
to store these refresh requests.
Now all I have to do is name my table,
and click "Create".
Now, using the modern table builder experience,
I can build out my columns.
I get a default column for name,
which I might use for my asset name.
I can add new columns by clicking on a plus button,
giving the column a name.
I might have a requested by column,
I'll leave that as a text option, and maybe I'll have
requested by email, and for the data type for that,
If I click on the dropdown, I'll
choose "Email" as the option.
We might also have the requested date which you can use
the date column type, and then maybe device requested,
which would be the device that they want
to replace their current device with.
We'll leave it at that for now and click
"Close" and you'll see that this is
actually going to build
an application for us based off of this data.
On the left hand side, we have a list of all of
the different asset refresh requests.
On the right hand side, we have a form
to view the data and to add a new request.
I can actually click on
the "Save" button here, and then the
built-in "Publish to Teams" option, and click "Next".
This will go out and add this in to
Teams for me so that people can start using it.
For this case, maybe I want to add this as a tab
into a Teams' channel so I can click on the plus button,
maybe to add it to the "General" tab,
and "Save and Close".
Now if I go to the "General" tab in our IT team,
I see a new tab for asset refresh,
which is our brand new dataverse
for Teams application
that we built in Power Apps.
I can add a new record, fill in some information,
click on the check mark, and
that will add that to our database.
Now, on the left hand side, I see the new record.
Now we saw how quickly we can
use Dataverse for Teams and
the Power Apps application to
build an asset refresh request.
But what if we want to take that
a step further and integrate with
a back-end API and
a restful service that we already have,
maybe to look up an individual employee's assets?
Well, we can do that through our connector model.
One of the most powerful things about
the Power Platform is its connector model.
These connectors are wrappers around APIs which allow
the Power Platform to read and write
data to different first and third party services.
There are over 600 different connectors
in the power platform right now,
but we also have the ability to
create what's called a custom connector.
These custom connectors give us a way to
integrate with our internal APIs.
These connectors work for any restful API that you have.
The beauty of this is,
you build the connector once and you
can use that within Power Automate,
Power Apps, and Power Virtual Agents.
Now, when we're talking about
building apps within Teams though,
one of the best ways that we can
integrate with our APIs is if we're
hosting those APIs in Azure API Management.
Now, Azure API Management has many benefits,
giving you a centralized place to manage your APIs.
In addition to that,
when working with the power platform,
it gives us an easy way to build and deploy
those connectors to integrate
with an Azure API management.
This allows the code verse developer to build the API,
publish API in,
and it gives the rest of the organization the power to
consume that information in their app,
bots, and flows.
These Azure API management connectors are automatically
available in the Dataverse for Teams
Power Apps experience,
and no additional licensing is required to use it.
Let's see how this integration works.
We're going to open up the Azure portal
and go to API management.
We'll see here in API management,
we have our asset management API.
If we click on that API,
you'll see built in integration for Power Platform.
We can click on the "Power Platform" tab on
the left hand side and
select the "Create a connector option".
We simply select the API
that we want to create a connector to,
select the power platform environment
that we want to create this connector in.
You see, when we click on that drop-down,
we have the Dataverse for Teams environment.
We created our asset management application
in our IT team.
That's where we want to deploy this connector.
Now all we have to do is click "Create",
and this will go do all of the hard work for
us of creating that power platform connector.
Then all the end user has to do is consume
that in their application or their bot or their flow.
Now, to use our API
in our Power App that we were building,
all you have to do is click on
the cylinder icon for
our Data Sources tab in the left hand side,
select "Add data",
and do a search for asset management API,
which was the API that we
exported from Azure API management.
Now if we select that, we can
paste in our subscription key and click "Connect".
We see that API as a data source in the tab,
so now we can start using it.
To integrate our API
with the app that we've already built,
let's see how we can take
this name field which is just a single line text field,
and make it dynamic to pull in
the associated assets with
the individual making the refresh request.
Now to do that, we're going to go into
this item or this card inside of Power Apps,
and we're going to unlock it.
Now that the card is unlocked,
we can select within it and go to insert.
It will add another vertical gallery.
We'll position the gallery and shrink it
down a bit to fit within this card.
Now, we're going to call our API from
this gallery to return the list of
assets assigned to the current logged in user.
To do that, we're going to select the gallery,
and then we go to its "Items Property".
Here we can make a direct call to
our API by typing in the name of our API.
In my API, I have a method called getassetassignment,
and I can pass in an email address.
You'll see that Power Apps
has built in Intellisense,
so I can select the email and I can type in my formula.
I can actually use power effects here,
the formula language for Power Apps,
and use its built in user function, and do
user.email to pass in
the current log in user's email into my property here.
Now I'll do a dot asset to get
the details about the current assets,
and I'll make some tweaks to my gallery.
I'll go into this label here and I'm going to change
that to pull information from my API.
I point this to asset dot,
and I want to get the manufacturer.
You see as I change this information
starts to be filled out,
and then for this second property I'm going to
change that to asset.model.
Now, I don't have any pictures in my API,
so I'm going to delete this picture control.
Now, instead of relying on
the user to hard code in the name of the device,
it's dynamically looking up from
our API and putting that into here.
I can do the same thing for our device request fields.
I can add in a separate gallery here,
and will point this to a separate method on
my API called getasset.
This method just returns a list of all available assets.
We'll change our mappings again in
the gallery to pull the manufacturer and the model.
Now when the user is filling out the
asset refresh request, we'll be sure that they're
pulling from the list of assets
available in our back-end API.
Now it's going to hide these single
line of text-text boxes by changing
the visibility property to false on each of those.
This will make sure that the user is using
the drop-down selection of items instead.
We've integrated with our API in
API management, and we're going to save,
and republish, and give us a test.
If we go back to our IT Team and
open up our asset refresh application again,
we should see some of the changes.
If we select "Add a new record",
we'll see on the name field we have the list
of filtered assets for the current logged in user.
I can select my Microsoft Surface Laptop
2 that I want to upgrade,
fill in the "Requested by" information
and the "Requested by email" and the "Date".
Then in the device request,
this is getting the other method from our API.
We're showing all of
the different devices that we can upgrade to.
I want to take my Surface Laptop 2 and
upgrade it to a Surface Laptop Studio.
This is all integrating with
our API through Azure API management,
and dynamically pulling in our assets.
By clicking check mark,
this will go and add that into our Dataverse database.
So far we've leveraged Power Apps to
create the front-end to and take
our asset refresh request
and integrated that with our back-end API.
Now let's take a look at how we
can complete the cycle here
and allow for approvals of these asset refresh request.
To do that, we can leverage power automate,
the workflow engine of the power platform.
To create this workflow,
we're going to open up the power automate
application on Microsoft 365 by clicking on the "App
launcher" and selecting "Power Automate".
From here we can go to "My flows" in the left hand side,
select "New flow" and "Automated Cloud flow".
Earlier we set up a Microsoft Dataverse for Teams table
to store our asset refresh request.
What we want to have happen is when
a new item is added to that Dataverse for Teams table,
we want this flow to kick off and ask for approval.
The thing that kicks off a flow is called a trigger.
Here, we want to search for Dataverse,
and you see we have a trigger for when a row is added,
modified, or deleted in Dataverse.
We'll give our flow a name,
Asset Refresh Approval,
select that trigger, and click "Create".
For this trigger we need to choose
what change type we're trying to key off up,
so for us it's Create.
Then we'll choose the table name we're looking at,
which is our Asset Refresh Request,
and finally the scope.
Now, I want to be able to send
an adaptive card to Microsoft Teams
to collect a yes or no response of
whether this Asset Refresh is approved.
There are a couple of steps we need to do to get that.
We're going to select "Add New
Step" and first search for approval.
Power Automate has a built-in approval engine in it.
We can select the "Create an approval" action to
initiate the creation of our approval.
We have different approval types so we
can have whether "Everyone must
approve", if you have multiple approvers,
or "First to respond",
as well as the ability to add custom responses.
I'm going to select the "First to respond" option.
Now, that will give us some
additional information we have to fill out.
We'll give our approval a title
and we can choose who to assign it to.
This can be dynamic from
our data source or we can hardcode it.
For testing purposes, I'll hardcode it to myself.
We can pass in item links,
descriptions, and additional details.
I can say, please approve this request,
and we can pull in information
about the request from our Dataverse table.
I could put in who requested it
and the name of the item that they want to refresh,
and the email of who requested it.
Now that our approval is created, we
need to be able to send that to Microsoft Teams.
I add a new step, I must select this Teams connector.
One of the options that you'll see here is post
adaptive card and wait for response.
We can select that and we can
choose where to post this adaptive card.
I want to post it to an individual user as the flow bot.
The flow bot is a mechanism for
interacting with users through power automating Teams.
Now in the message field,
this is where we can pass in the adaptive card
which this approval action above produced for us.
You see, we have this Teams' adaptive card property
so we can pass them to our message.
Now we just define the recipient again and this will be
sent in Teams as an adaptive card to that user.
Now, one more step here is we need to be able
to wait for the response.
Add a new step, search for approval again,
and do the
"Wait for an approval".
We need to pass in the ID
of the approval that we're waiting for,
which will map to the ID
of our "Create an approval" action.
Now, the last piece of this workflow is we want to
notify the requester of the outcome of the request.
We're going to add one more new step, and we'll select
Microsoft Teams again, and we'll
post a message in a chat or channel.
We'll use the flow bot again and we'll
post in a chat with the flow bot.
For the recipient this time, we'll use
our dynamic content and we'll search for
the "Requested By", and send it to
the "Requested By Email" from our Dataverse table.
Now, for the message we'll just
hardcode in a message here.
We'll say your asset refresh request was,
and we can dynamically pull in the outcome.
One of the field to know this here is Outcome.
We'll paste that in, and that will put
in either the approve or reject
status, and then we can put in any details below.
Now you just click ''Save'' and
this flow is ready to test.
We'll go back into Teams,
we'll go into our Asset Refresh application
and create a new asset refresh request.
Isolate my laptop again, fill out my information.
This time I'll try to upgrade to
the Surface Studio and we'll submit.
This will add the new record into Dataverse and
I should see an alert here in a second pop up in Teams.
Now, I can see I have an alert in my activity in Teams.
If I click that, I can see
the adaptive card request coming
through for the approval's engine in Power Automate,
I can see all the details that were included,
like who requested it, their email,
and what device they want to refresh.
I'm able to leave comments like refresh
approved, and select the "Approve" button
to keep the process going.
Now, this should kick off the rest of our process,
which will then notify the user who
requested it of the outcome of their approval.
Now notice when I approved that it took me to the built
in Approvals app inside of Microsoft Teams.
Microsoft Teams is really a one stop shop
where we can approve or reject items through
adaptive cards and manage all of
the approvals that we've sent and received.
In here in the activity we have the final notification,
final status approved, letting the end-user
know that their request for
an asset refresh was approved.
Now, if we stop and take a look at what we've
created and bring it all
full circle here, in a matter of minutes,
we were able to build a back-end table and
Microsoft Dataverse for Teams
to store our asset refresh requests,
we built a front-end in
the Power Apps application for
Teams to submit those request,
we even integrated with our back-end service through
Azure API management to
pull in the database of our assets,
and we completed the process by
adding in a Power Automate flow to help
facilitate the approval of these asset request,
and notify the users of the outcome.
All of this done using a fusion
development approach in a matter of minutes with
the local tools that
Microsoft Teams offers with Dataverse for Teams.
Now, before I let you go,
there are a few things that I want
to share with you to help you get started
with building low-code applications on Teams.
The first is to explore
the Dataverse for Teams learn path we have.
This learn path walks you through
all the basics of getting
started with Dataverse for Teams.
Next, is to try out our Microsoft Dataverse for Teams
in a day training exercises.
This in a day training has great exercises to walk you
through the ins and outs of building
low-code solutions in Teams.
If you want to learn more about
the code first integrations with
the power platform and how you can work with
infusion teams to build hybrid solutions,
check out our fusion development approach
to building Power Apps e-book.
Of course, the best way to learn is to get hands on.
Go install those Power Platform applications
for Teams and try it out.
I really hope you enjoyed this session.
Thank you so much for attending
and enjoy the rest of Built.