Reformed SharePoint developer working in the cloud

Menu

There was a heap of awesome things announced at Microsoft Build 2017 , Scott Hanselman has a great roll up of the most important developer announcements here.

One that I have been spending some time getting up to speed on is the Azure Functions Tooling for VS 2017. Here are a few tips I have learnt.

Firstly as of April 2017 the tooling is in preview mode. That means you can’t just add it to a regular installation of Visual Studio , you can however run the preview side by side with the main version assuming you have enough disk space. The options for running Visual Studio Preview are covered well here.

The specific version of Visual Studio and a link to the preview tools for Azure functions are covered in this article as are the steps for creating your first Function.

You need to think carefully about what sort of Function you want to create as there is no wizard or property selection that allows you to easily change to another type. It is possible to do manual updates to change the properties but generally better to select the correct template initially.

The current options are:

BlogTrigger

EventHubTrigger

GenericWebHook

GitHubWebHook

HttpTrigger

HttpTriggerWithParameters

QueueTrigger

ServiceBusTopicTrigger

TimerTrigger

FaceLocator

GitHubCommenter

HttpGetCRUD

HttpPostCRUD

The first thing you need to do before you run the function is set the AzureWebJobsStorage key in the local.settings.json file. This is necessary for all functions apart from the http based ones to be able to run locally.

Selecting the correct template gives an easy way to configure the correct input trigger.
Azure functions also has output bindings , all the different options are covered here. however how to do this when using VS 2017 is a little bit different.

Essentially you just add in the the correct output item to the run function and a connection string in local.settings.json so it can run locally.

For example a function that is triggered by timer would initially look like:

This also requires adding a using statement for Microsoft.ServiceBus.Messaging for the access rights object.

Another item that I hit was an error when I added a service bus binding starting to run the function caused this error “The following 1 functions are in error: Can’t figure out which ctor to call” . After trying in vain to debug it I released that this was actually a bug in the Azure Functions SDK as noted here.

In my project I then clicked manage Nuget packages and sure enough an update was sitting there waiting for me to install. Given the alpha status of this package it is quite likely it will be frequently updated as issues are found. Hence well worth checking the open and recently resolve issues if you do hit a problem !

The final tip I have is that as Azure functions are easy to write and new and shiny I find myself very easily adding way too much into a single function. Hence I find I have to constantly re-evaluate whether I am breaking best practice. In several cases already I have ended up refactoring what I thought would be a single function into multiple and adding in a logic app to assist with orchestration to keep the functions stateless and short running these and other Azure functions best practices can be found here

There is no validation on the Url’s but given how fast things can go from dev to production it is worth making sure they are set to something decent at the start

The urls should also be https given teams is https.

As we have no tabs in our package yet , we don’t need to add anything else just zip the mainifest.json up into a zip file with any name you like.
To side load it click on teams and the … next to the team that you want to use it in. From the menu displayed click view team.

From the tabbed area displayed select bots. Way down the bottom of the screen you will see the option to sideload a bot. Select that and upload the zip.

The bot will now be shown as in the image above with (Sideloaded) next it. This same screen can be used to delete the bot as well.
You can now have a conversation in the channel by using the @ and the name of your bot. Not however a sideloaded bot does not appear in the add a bot menu of the conversation.

Add a pinned tab

A pinned tab appears next to the conversation element of the bot. The T-Bot is a good example of this , you will see it has a number of pinned tabs such as Help and FAQ.

To add some pinned tabs all we need to do is edit our manifest to point to tabs on a website. In order for it to be shown as a pinned tab , other than https and to render nicely in the area provided there are not any other specific requirements.

All we need to do is add the pinnedTabs element in the format shownbelow beneath the “mri” element.

The ID’s used just need to be unique GUIDS so any way you prefer to generate them should be fine. More information on these elements are detailed here.

The urls must be https , otherwise you will see an error stating the URL for this tab isn’t valid when you try to navigate to the tab from the bot.

Create a Configurable Tab

In Part 3 we pointed a pinned tab at a website. In order to be able to use functions such as deep linking we now need to create a Microsoft Teams Tab. This is still a basic website but with some additional requirements which this post will walk through.
You can speed up these steps and jump straight to a project with all the right elements generated for you using yo teams-tab: A Microsoft Teams Tabs Yeoman generator

If you have a need to convert an existing web app to a tab then the Todo sample app would be a good place to start. For a the first time you are developing a tab the Maps sample is the best place to start in my opinion. If you choose to create your own from scratch ensure you read the prerequisites carefully along with the other documentation available.

Grab the map sample and follow the steps in the Readme for the maps sample to create your own copy and host it on your own https endpoint. Make sure you include the optional steps so that you are sure that you can tell the difference between your copy and the sample. When editing the images it is important that they stay the same size.

Once your tab is hosted sideload it buy uploading the manifest package, this time it should contain the manifest.json and the image files and is uploaded via the same screens as for bots (see here for more instructions)

Add the added tab to the channel of your choice and the sample is now ready to test and modify to suit your needs !

You can build many different types of Bots , this particular post is based on a simple Q&A Bot. For more information on the different more complex types of Bots visit the Bot Framework Overview

Create and Publish your Q&A Service

For a Q&A bot we start with creating a service via navigating to QnA Maker , after signing in select the Create a Service link at the top of the page. We now need to give you service a name and decide how to load data.

As noted in the screen you can start via giving the service a Url of a FAQ to load, Upload a File containing question and answer pairs or just manually load. In this example select Create at the bottom of the page to create a blank KB.
To add some responses you can then use the Add new QnA Pair option and then select Save and Retrain to add the items you entered.

Next select the Test option on the left. This will allow you to test chatting to your Bot as well as adding alternative responses. With the default setup if you say Hi the Bot responds with Hello, but if you say Hello it will give the default no good match found. If you add some alternatives as shown below and then click save and retrain the Bot will now respond with Hello for those items as well.

This is a very basic example but it illustrates how this can be used to easily add a response for multiple alternative phrases. In some cases with more content loaded multiple responses may be matched hence the option on the left to choose the most appropriate response allows selection of the best one to use.
Finally if you want to load more content from a url or file the settings page can be used to add this. You can come back later and tweak the content , each time you do this you need to Save and retrain.
For now however just hit the publish option. After clicking through Publish you will see a a success screen and we now need to build our Bot

Build your Bot

Now we need to put the actual Bot on top of the knowledge base functionality. You can build and host your own and call the provided REST API via the url given to you on the success page of publishing your QnA service but fortunately there is a much easier way which involve writing no code yourself.

Navigate to Azure and hit the add button and search for Bot Framework.

The next screen will ask you to give your bot a unique name and pick which resource group and location to host it in. On this screen I highly recommend selecting the Pin to Dashboard option down the bottom , as this makes it far easier to find your service when you need to configure it.

This will then create your Bot Service. Now you need to configure it. Assuming you pinned it to your dashboard navigate to it from there , if you did not the easiest way I have found to get back to it is via the resource group.
It will be an app service and when you select it it will display a screen that is asking for an App ID.

To generate an App ID just hit the create button, at this point you may need to sign-in to the app registration portal. Just generate the ID and password using the options , but please pay attention when it warns you that the password will not be shown again after this screen so record it carefully !
Once that is generated that screen will close and the details will be added to the Bot screen in Azure. You also need to paste the app password in.
The next step is to select a language, I am using Node but C# is also available.

Down the bottom of the screen it also asks for you to select a template, in our case we want to use the Question and Answer template

After hitting the Create bot it will then give you an option to create to an existing knowledge base. You can also create a KB from this screen but I find training the KB can take a while so I prefer to do that first to make sure I am happy with it before I create my Bot.

You Bot will then be generated which typically takes a few minutes. The final step is to enable the Teams Channel for the Bot.

Configure Teams Channel and add to Teams

The next step is to navigate to the channels page and select add for Microsoft Teams.

On clicking add it will the configure the required settings so you can just click I’m done configuring Microsoft Teams.

As during the developer preview we side load bots we do not need to publish the bot hence we can just click the Test link to Add to Teams.

Tenancy Requirements

Firstly you need an Office 365 tenancy in which you can safely play with settings and develop. Currently the following plans are suitable:

Business Essentials

Business Premium

Enterprise E1, E3, and E5

Developer

If you don’t have a development tenant already sign up at dev.office.com to get a trial one.

Relevant Sample

In these blog posts we are walking through creating piece by piece and using the configuration interfaces as much as possible. Once you understand the parts and especially if you are creating a more complex example it is worth looking at the yo teams-tab: A Microsoft Teams Tabs Yeoman generator

Enabling Teams

Now that teams has reached GA it should be turned on in your tenancy by default. However if you are using a shared tenancy then it may of been turned off, hence the first step it to navigate to the Office 365 Admin center > Services & add-ins page and selecting Microsoft Teams.

Once selecting Microsoft Teams firstly we want to check that Teams is turned on at the top of the settings page. This enables it for the tenancy.
As we want to do some development that will include side loading out bots and tabs while we test them it is important to turn on side loading as it is disabled by default.
These settings enabled are show below:

None of the other settings are required for this particular example , however while you are in the settings page it is worth clicking through and learning about some of the other settings. The Giphy settings under Messaging is one of my favourite features for making chat more fun !

Licensing users for Teams

By default teams should be enabled when you license users for a normal Office 365 license such as E3. However if you do have a need to only have certain users access teams you do have an option of turning the licensing option on/off for a specific user. This can be done via the UI by navigating the the users page in the Admin center and then selecting the users licensing. Here you can see each individual license you can enable/disable.

Adding a Team

Adding a team is very simple. Once you navigate to Microsoft Teams down the bottom you will see an Add team link. However depending on your settings for creating Office 365 Groups it may not behave 100% as you may expect.
If you have disable group creation then you will get navigated to the suggested teams section and then when clicking on create a team you will get the following message:

Sorry, you can’t create a team.

Your IT department has disabled this Microsoft Teams feature for you. Please contact them for help.

To resolve this you need to ensure group creation is enabled, here is a great blog post on Configuring Office 365 Groups creation the right way , note that if you are looking at the groups creation settings in the Azure Active Directory – Preview portal at the moment these are often inaccurate , hence checking via script is highly recommended at the current time.

Also worth noting is that if you are the owner of a Office 365 Group that has less than 999 members you will have the capability to add a Microsoft Team to it. This is done by selecting the “Yes, add Microsoft Teams functionality” at the bottom of the add dialog.

All the relevant limits for Microsoft Teams such as number of owners, members and maximum number of teams in a tenancy plus a lot more are contained in the support FAQ

During my session on managing groups at Ignite Australia on deploying and managing groups I referenced this great blog post by Wictor Wilen which explains all the details of how to script changing the settings via script at the Azure AD level.

For my provisioning demonstration I also used the Office 365 PnP-Powershell commands – the installer for the current version of these are here https://github.com/sharepoint/pnp-powershell/releases/tag/2.12.1702.0 and specifically the New-PnPUnifiedGroup command. To have this command you need to be on at least the Nov 2016 release of the commands.

More information on development samples such as how to create tabs and integrate bots into Microsoft teams are explained on the teams dev center. I also found this overview of connectors to be useful although some of the UI has changed recently which means if you follow the demonstrations steps in your tenancy you will need to adapt a couple of the steps. The major change is that for basic connectors you can select the webhook connector now straight from the main connector UI as that is now GA.

During the session I also mention an earlier session in the conference which went into the roadmap for Groups, definitely worth a view to get across the new features due to arrive soon.

Also for more information on what to use where in regards to groups , teams and yammer this session is well worth the watch

Contact Details

Reach out and connect with me via the social links below. I'm always happy to chat about anything techie and welcome your constructive feedback on anything I have posted.