{"id":11128,"date":"2022-08-01T08:00:51","date_gmt":"2022-08-01T15:00:51","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/?p=11128"},"modified":"2022-08-01T09:58:31","modified_gmt":"2022-08-01T16:58:31","slug":"announcing-general-availability-of-azure-fluid-relay-service","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/announcing-general-availability-of-azure-fluid-relay-service\/","title":{"rendered":"Announcing general availability of Azure Fluid Relay service"},"content":{"rendered":"<p>The world has shifted to a hybrid model with a generational shift with how we work. Today, we\u2019re delivering on this mission by announcing the general availability of <a href=\"https:\/\/azure.microsoft.com\/en-us\/services\/fluid-relay\/\">Azure Fluid Relay<\/a> and <a href=\"https:\/\/fluidframework.com\/docs\/updates\/v1.0.0\/\">Fluid Framework azure-client v1.0<\/a> library for all web developers. Fluid Framework and Azure Fluid Relay service are now ready to power production-quality solutions.<\/p>\n<h2>What is it?<\/h2>\n<h3>About Fluid Framework<\/h3>\n<p>Fluid is an open-source project that offers distributed data structures with familiar programming patterns to help developers build real-time, low latency collaborative applications. Built on the trusted, scalable, and highly secure Azure platform that will continue to adapt to a rapidly evolving collaborative future.<\/p>\n<h3>About Azure Fluid Relay service<\/h3>\n<p>Azure Fluid Relay is a managed cloud service built to support Fluid Framework clients. Backed by scalability and reliability of Azure, Microsoft\u2019s Azure Relay Service is quickly gaining popularity and becoming the de facto choice. The service enables developers to build and deploy enterprise-ready collaborative applications that perform at industry-leading speed and scale. Azure Fluid Relay takes care of all details of Fluid collaboration while you as developers focus your attention on your app and end user experience.<\/p>\n<ul>\n<li>Completely\u00a0managed service\u200b\u200b with $0 upfront cost\u200b<\/li>\n<li><a href=\"https:\/\/azure.microsoft.com\/en-us\/global-infrastructure\/services\/?products=fluid-relay\">Global presence\u00a0<\/a>with regional resilience\u200b<\/li>\n<li>Meets data residency &amp;\u00a0compliance\u00a0requirements\u200b<\/li>\n<\/ul>\n<h2>How does it work?<\/h2>\n<p style=\"text-align: left;\">Check out our Build 2022 video to learn about Fluid powered experiences \ud83d\udc47<\/p>\n<p style=\"text-align: center;\"><iframe title=\"YouTube video player\" src=\"https:\/\/www.youtube.com\/embed\/j0DH9GXOVwk\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<p>&nbsp;<\/p>\n<h3>Get set up and running with Azure Fluid Relay in two simple steps<\/h3>\n<ul>\n<li>Begin with provisioning the Azure Fluid Relay service using your Azure account from the Azure portal<\/li>\n<li>Configure the azure-client SDK package to connect your application to the Azure Fluid Relay instance<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2022\/07\/Azure-Fluid-relay-blog_august-1.png\"><img decoding=\"async\" class=\"aligncenter wp-image-11129\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2022\/07\/Azure-Fluid-relay-blog_august-1.png\" alt=\"Image Azure Fluid relay blog august 1\" width=\"800\" height=\"453\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2022\/07\/Azure-Fluid-relay-blog_august-1.png 1100w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2022\/07\/Azure-Fluid-relay-blog_august-1-300x170.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2022\/07\/Azure-Fluid-relay-blog_august-1-1024x580.png 1024w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2022\/07\/Azure-Fluid-relay-blog_august-1-768x435.png 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<h3>Let&#8217;s go over the steps in detail<\/h3>\n<p>To connect your app to an Azure Fluid Relay, you must provision an Azure Fluid Relay server resource in your Azure account. If you don\u2019t have an account, <a href=\"https:\/\/azure.microsoft.com\/en-us\/free\/\">you can try Azure for free<\/a>.<\/p>\n<p>Provisioning of Azure Relay service can be completed from the Azure portal in 2 easy steps. Read more about it <a href=\"https:\/\/docs.microsoft.com\/en-us\/azure\/azure-fluid-relay\/how-tos\/provision-fluid-azure-portal\">here<\/a>.<\/p>\n<p><strong>Step 1:<\/strong>\u00a0Create a resource group which is a logical collection of Azure resources. All resources are <a href=\"https:\/\/docs.microsoft.com\/en-us\/azure\/azure-fluid-relay\/how-tos\/provision-fluid-azure-portal#create-a-resource-group\" target=\"_blank\" rel=\"noopener\">deployed and managed in a resource group<\/a>.<\/p>\n<p><strong>Step 2:<\/strong>\u00a0Create a Fluid Relay resource. Each Azure Relay server resource provides a tenant for you to use in your Fluid application. You can <a href=\"https:\/\/docs.microsoft.com\/en-us\/azure\/azure-fluid-relay\/how-tos\/provision-fluid-azure-portal#create-a-fluid-relay-resource\" target=\"_blank\" rel=\"noopener\">create many containers\/sessions<\/a> within that tenant.<\/p>\n<p>Now you should see the Fluid Relay page (see example below)<\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2022\/07\/Azure-Fluid-relay-blog_august-1-image2.png\"><img decoding=\"async\" class=\"aligncenter wp-image-11131 size-full\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2022\/07\/Azure-Fluid-relay-blog_august-1-image2.png\" alt=\"Image Azure Fluid relay blog august 1 image2\" width=\"780\" height=\"419\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2022\/07\/Azure-Fluid-relay-blog_august-1-image2.png 780w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2022\/07\/Azure-Fluid-relay-blog_august-1-image2-300x161.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2022\/07\/Azure-Fluid-relay-blog_august-1-image2-768x413.png 768w\" sizes=\"(max-width: 780px) 100vw, 780px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p>After you create the resource group and Fluid Relay resource in steps 1 and 2, start connecting the Azure Fluid Relay Service in your app.<\/p>\n<p>You can connect your Fluid application to an Azure Fluid Relay instance using the AzureClient in the <a href=\"https:\/\/fluidframework.com\/docs\/apis\/azure-client\/\">fluidframework\/azure-client package<\/a>. The azure-client package provides a simple and powerful way to consume collaborative Fluid data with the Azure Fluid Relay. AzureClient handles the logic of connecting your Fluid container to the service.<\/p>\n<p>The azure-client package has an AzureClient class that allows you to interact with Fluid.<\/p>\n<pre class=\"prettyprint\">import { AzureClient } from \"@fluidframework\/azure-client\";<\/pre>\n<p>While completing the onboarding process for the Relay service, you will be provided with a tenant Id and key used to connect to a live Azure Fluid Relay instance.<\/p>\n<p>To connect your application with the Azure Fluid Relay service, you need to update your app&#8217;s configuration to connect to your Azure service with the right configuration values.<\/p>\n<pre class=\"prettyprint\">import { AzureClient, AzureConnectionConfig } from \"@fluidframework\/azure-client\";\r\n\r\nconst clientProps = {\r\n    connection: {\r\n        type: \"remote\",\r\n        tenantId: \"YOUR-TENANT-ID-HERE\",\r\n        tokenProvider: new AzureFunctionTokenProvider(\r\n            \"AZURE-FUNCTION-URL\"+\"\/api\/GetAzureToken\",\r\n            { userId: \"test-user\",userName: \"Test User\" }\r\n        ),\r\n        endpoint: \"ENTER-SERVICE-DISCOVERY-URL-HERE\",\r\n    },\r\n};\r\nconst azureClient = new AzureClient(clientProps);\r\n<\/pre>\n<p>Now you can build and run the client to see how the magic happens.<\/p>\n<p>Congratulations! \ud83c\udf89\ud83e\udd73 You have successfully taken the first step towards unlocking the world of Fluid collaboration.<\/p>\n<p>We are excited to invite all developers to explore, learn, and build next-gen collaborative applications with Azure Fluid Relay. As we continue to embark on our journey to create breakthrough experiences, we would love your feedback.<\/p>\n<h2>Building a new class of collaborative apps<\/h2>\n<p style=\"text-align: center;\"><span style=\"font-size: 14pt;\"><strong>\u201cEvery organization requires a digital fabric that connects people, places, and processes\u201d\nSatya Nadella, Microsoft CEO<\/strong><\/span><\/p>\n<p style=\"text-align: center;\"><strong>\u00a0<\/strong><\/p>\n<p style=\"text-align: center;\"><iframe title=\"YouTube video player\" src=\"https:\/\/www.youtube.com\/embed\/NhM2NsPniHA\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<p style=\"text-align: center;\"><strong>\u00a0<\/strong><\/p>\n<h2>Resources<\/h2>\n<ul>\n<li>Review how <a href=\"https:\/\/forums.autodesk.com\/t5\/engineering-hub-blog\/autodesk-and-microsoft-collaborate-on-an-open-source-framework\/ba-p\/10958692\">Autodesk and Microsoft collaborate<\/a> on an open-Source framework for real-time collaborative experiences.<\/li>\n<li>Find out how you can leverage powerful <a href=\"https:\/\/fluidframework.com\/\">Fluid Framework<\/a> and <a href=\"https:\/\/docs.microsoft.com\/en-us\/azure\/azure-fluid-relay\/how-tos\/connect-fluid-azure-service\">Azure Fluid Relay service<\/a> capabilities to build interactive applications.<\/li>\n<li><a href=\"https:\/\/fluidframework.com\/docs\/start\/quick-start\/\">Get started<\/a>! Try our sample dice roller application <a href=\"https:\/\/docs.microsoft.com\/en-us\/azure\/azure-fluid-relay\/quickstarts\/quickstart-dice-roll\">here.<\/a><\/li>\n<li>Learn about our <a href=\"https:\/\/azure.microsoft.com\/en-us\/services\/fluid-relay\/#pricing\">flexible pricing<\/a>, <a href=\"https:\/\/azure.microsoft.com\/en-us\/global-infrastructure\/services\/?products=fluid-relay\">geo availability<\/a> and <a href=\"https:\/\/azure.microsoft.com\/en-us\/support\/legal\/sla\/fluid-relay\/v1_0\/\">SLA.<\/a><\/li>\n<li>Please share feedback and ask questions <a href=\"https:\/\/docs.microsoft.com\/en-us\/answers\/topics\/azure-fluid-relay.html\" target=\"_blank\" rel=\"noopener\">here<\/a><\/li>\n<\/ul>\n<p>Subscribe to our\u00a0<a href=\"https:\/\/devblogs.microsoft.com\/\">Microsoft 365 developer blog<\/a>.\u00a0Follow us on Twitter\u00a0<a href=\"https:\/\/twitter.com\/Microsoft365Dev\">@Microsoft365Dev<\/a>.<\/p>\n<p>Happy Coding!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Today, we\u2019re announcing the general availability of Azure Fluid Relay and Fluid Framework azure-client v1.0 library for all web developers. Fluid Framework and Azure Fluid Relay service are now ready to power production-quality solutions.<\/p>\n","protected":false},"author":72506,"featured_media":11131,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[6],"tags":[61,124],"class_list":["post-11128","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-fluid-framework","tag-azure","tag-azure-fluid-relay-service"],"acf":[],"blog_post_summary":"<p>Today, we\u2019re announcing the general availability of Azure Fluid Relay and Fluid Framework azure-client v1.0 library for all web developers. Fluid Framework and Azure Fluid Relay service are now ready to power production-quality solutions.<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/11128","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/users\/72506"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/comments?post=11128"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/11128\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media\/11131"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media?parent=11128"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/categories?post=11128"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/tags?post=11128"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}