Framework Migration Recommendation for Office Add-ins

Chetan Kotwal 0 Reputation points
2024-09-30T06:42:22.8866667+00:00

Hi Team,

I currently have Excel, Word, and PowerPoint add-ins built using pure JavaScript and a .NET Core API for the backend. I’m looking to migrate my add-ins to a framework, and after reading various articles, I’m confused about whether to use React or Blazor.

Could you please advise on which framework would be better for my situation? I've seen some articles suggesting that using Blazor would still require reliance on JavaScript for Office.js integration.

Given that my add-in is large and complex, with collaborative features for multiple users, I am particularly focused on scalability, fast development, and reduced code complexity.

Also suggest is that any other framework which is better than this two.

Thank you!

Blazor
Blazor
A free and open-source web framework that enables developers to create web apps using C# and HTML being developed by Microsoft.
1,575 questions
JavaScript API
JavaScript API
An Office service that supports add-ins to interact with objects in Office client applications.
985 questions
{count} votes

1 answer

Sort by: Most helpful
  1. Bruce (SqlWork.com) 64,826 Reputation points
    2024-09-30T22:05:26.1966667+00:00

    Blazor uses a js tree render engine similar to react. the js code uses a message system to communicate with the Blazor code. if the Blazor code is hosted as a WASM the messages use the browser message system, if server hosted, signal/r is used to pass messages. the Blazor code sends tree render datagrams, and the js client code sends dom events to the Blazor app. Blazor has support to call js via the jsinterop library.

    for a Blazor addin to access the office api, it will use jsinterop to call the office javascript functions. currently jsinterop does not support calling async js functions (you can call one, but not access the promise result). you will wrap the async function calls with js that calls a static method in Blazor on completion. Basically for every Blazor page, you will write an office api in js callable from blazor. review the samples:

    https://github.com/OfficeDev/Office-Add-in-samples/tree/main/Samples/blazor-add-in

    If you want to use Fluent UI for your your Blazor addin, see the FluentUI-Blazor project:

    https://github.com/microsoft/fluentui-blazor

    React is the framework used by the office team, and will have good support. The FluentUI react version will have the most components.

    https://react.fluentui.dev/?path=/docs/concepts-introduction--docs

    if you use another javascript framework, you only have the FluentUI web components:

    https://fluent2.microsoft.design/components/web/react


Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.