Microsoft’s Teams collaboration tool is an important component of its business applications strategy, hosting not only your conversations and conference calls, but also the tiny snippets of work that would otherwise interrupt your actual tasks. If that was all there was to Teams, it would be a useful component of your day-to-day productivity suite.
But a key element of Teams is its extensibility, using it to host other applications and services and building conversations around them. Adding apps from an online gallery isn’t anything new — it’s been part of SharePoint for a long time, and Teams has been designed to work with SharePoint components. But Teams gives you different ways to link applications to the platform — from bots in a channel to tabs that link directly to online content or services.
Disclosure: TechRepublic may earn a commission from some of the products featured on this page. TechRepublic and the author were not compensated for this independent review.
It’s the tabs that are perhaps most interesting, as they make it easy to add collaboration around existing services that might not have collaboration features. So a conversation about a product design could wrap a Photoshop image hosted in Adobe’s Creative Cloud, or a discussion about scheduling could be linked directly to the appropriate plan in Project Online. Apps can be given more than one option for interaction, as the same app could offer both a tab view of content as well as pushing notifications into a channel.
The combination of tab and channel makes a lot of sense, especially when you consider the asynchronous nature of Teams-based work in a modern distributed organisation. Colleagues on the other side of the world could be making changes to a file while you’re asleep. When you log in next morning you can see the current state of the work, along with a batched set of notifications showing who has done what as well as curated actions from the ongoing conversation.
Integrating applications with Teams is relatively easy, and you can find a host of preconfigured apps in the global Teams Store. Some are free, some require subscriptions, others are links to other web applications you might be using. Teams itself is a large-scale web application, so the same canvas is used to render its UI and any app content, whether you’re using the web UI or the Electron-based desktop client.
Building your own tabs
Apps in Teams are web apps. That makes them easy to build, using your existing toolchains and services. The only real need is a web endpoint for your app that can be reached over the internet. If you’re building apps on development PCs behind your firewalls, your developers will need a way of tunneling app web pages, using a tool like the free ngrok. This will act as a proxy via the ngrok.io website to your local PCs, allowing Teams to embed content.
Deploying an app is easy enough — all you need is a URL for the app and a set of icons that can be used inside Teams. These are used to make a simple app manifest that can be created in a text editor or using Microsoft’s free App Studio app packaging tool, which can be found in the Teams store. This supports both Visual Studio and node.js for app development, using tools like gulp to generate the initial manifest.
Once installed and running you can think of a tab as a web app running in an iframe. This can affect the features available to an app, as many identity services can’t be hosted in one. There are ways around this, though, and you may need to use pop-windows to handle authentication.
Once you’ve got a basic manifest you can import the local package into App Studio for further editing. Here your app gets a name, a GUID so it has a unique identifier, a package name and a version number.
Much of the Teams tooling is similar to that used for building SharePoint apps, and the Yeoman scripts used by the development tools give you the option of hosting your own applications on SharePoint Online where they can be used as web parts as well as in Teams.
Personal or Channel?
One of the more useful Teams features is the ability to build personal and channel tabs. Personal tabs are for one person only, while you can add users to channel tabs. So, a personal tab might be a OneNote page, while a channel tab might wrap a SharePoint list or a Project Online plan. If you add a personal app to a channel only you will be able to see it.
You can define a Channel tab using the same manifest you use to build a full Teams app, adding a configuration URL that’s used to configure the tab when it’s added to a Teams instance. Configurations can be set to be fixed at first run or can be allowed to be changed at any time after installation. You’ll need to build code in your web app to handle configuration, with settings saved inside Teams. Only Channel tabs allow you to configure the app; personal apps get their configuration from the user’s details.
SEE: Comparison chart: Enterprise collaboration tools (TechRepublic Premium)
Personal tabs need to be, well, personal. If you’re writing an app to run as one, it should only display information relevant to the user. Authentication for all tabs uses OAuth 2.0, and apps should support it and offer a log-in pop-up. As a user may have a different ID for an app from inside Teams, it’s important not to rely on their Teams ID (although you can use it as a hint if necessary).
Like many of Microsoft’s tools, Teams is a platform. You only have to look at the selection of applications in its Store to get a feel for what can be done with it, and how tabs can be used as part of collaborative work. It’s a flexible way of delivering collaborative code, and one that can go beyond your Office 365 tenants and into a whole new revenue stream. You can keep your Teams apps private, using your existing Office 365 tenant as a host, or if you think there’s demand that code can be sold through the Teams Store.
Subscribe to the Developer Insider Newsletter
From the hottest programming languages to commentary on the Linux OS, get the developer and open source news and tips you need to know. Delivered Tuesdays and Thursdays