Building real-time collaborative apps with Microsoft 365, Azure and Power Platform

Ayca Bas

It’s no secret that collaboration is key to enhancing business operations and increasing overall productivity. Tools such as Microsoft Teams provide a great way to collaborate using chat, audio, and video. Word, Excel, and PowerPoint online make it easy to collaborate on various documents with colleagues and customers around the world.

While these tools are great, you may be wondering how to add collaboration functionality into your custom apps…

We generally think in terms of selecting, inserting, and updating data in a database; sending or receiving data to or from a RESTful service; or integrating real-time communication to connected clients using web sockets. While many applications may not require collaborative functionality, there are others that can benefit from a collaboration-first design approach.

Web sockets provide a proven way to add real-time communication to apps, but they aren’t designed to handle many of the unique challenges associated with real-time collaboration. For example, as multiple people are typing into a data grid cell or editing text in a brainstorming app, they can easily overwrite someone else’s work if data isn’t synchronized properly across clients. Effective real-time collaboration is built to intelligently handle these types of data collisions, synchronize data across clients in a collaboration session, and automatically store collaboration data.

While you can implement this type of functionality on your own with enough time and resources, a more productive solution is to leverage libraries and cloud services designed specifically for real-time collaborative scenarios. To better understand the possibilities and begin learning about services provided in the Microsoft Cloud, let’s walk through a brief scenario.

Scenario

Over the last year, most teams at Michelle’s company have shifted to remote work. Management has asked Michelle to build a custom line of business application that enables these remote team members to collaborate in real-time so they can work together to collect and review ideas. The application will support real-time user collaboration as well as user presence changes. Users need to be able to work together in the app to collect ideas; see when new ideas are added, modified, or deleted in real-time; and avoid data conflicts during the collaboration session.

To handle these requirements, Michelle will use the Fluid Framework and Azure Fluid Relay service for real-time data collaboration. Real-time user presence changes will be handled by using Microsoft Graph change notifications, Power Automate Flow, and Azure services.

Fluid Framework is a good choice for real-time collaboration since it relies on total order broadcast and eventual consistency to synchronize data across all clients in a collaboration session. It also handles persisting collaboration data, allowing users to join at any time and catch up with what everyone else has done.

B For real-time presence information (knowing when people are available to collaborate), Michelle has decided to take advantage of Microsoft Graph change notifications combined with Power Automate Flow. She’ll use Azure services such as Azure Event Hubs, Azure Functions, and Azure SignalR to access presence data changes in real-time. This requirement falls into the “real-time communication” category and technologies such as Azure SignalR fit that scenario well. As people become “available”, they can instantly be shown in the app and invited to join a collaboration session that’s in progress.

Image SignalR image To better understand how these different products and services can be integrated, we’ve put together a four-part video series that introduces the different services and shows how they can be used together to build real-time collaboration solutions.

Part 1 – Introduction to collaborative app technologies

In the first part of the series, a collaborative app scenario will be introduced with a demo. Technologies that can be used to build collaborative solutions will then be discussed.

Watch the video 👇

 

Part 2 – Using Fluid Framework and Azure Fluid Relay

The second part of the series will focus on understanding the use case for Fluid Framework and Azure Fluid Relay and show how they can be integrated to enable real-time collaboration features in the app.

Watch the video 👇

 

Part 3 – Setting up resources for real-time Microsoft Graph notifications

This part of the series will demonstrate the set-up process of Microsoft Azure and Power Platform resources to enable real-time Presence notification tracking feature.

Watch the video 👇

 

Part 4 – Integrating real-time Microsoft Graph notifications

The final part of the series will cover the integration of Microsoft Graph change notifications, Azure Event Hubs, Azure Functions and Azure SignalR services to receive real-time Presence notifications in the collaboration app.

Watch the video 👇

 

Additional Information

0 comments

Leave a comment