Office 365 Addin development guide

发表于 更新于 分类于 阅读次数：

This is a guide for how to develop Office 365 cross platform addin.

Front end UI framework

Microsoft has provided offical Office UI framework: Office Fabric UI. The office site is at https://developer.microsoft.com/en-us/fabric. The are three directions of the UI project future roadmap. All the three projects are implementation of UI components, demos are available at https://developer.microsoft.com/en-us/fabric#/components.

  1. Fabric React (Official support)
  2. AngularJS (Community version, no updates)
  3. Fabric iOS
  4. Fabric JS (Stop support from MSFT)

New UI design sytem is called fluent, the website is at https://www.microsoft.com/design/fluent/. It can help let developer know how to design an Windows style application UI and the guide of UWP web app design.

Fabric.js is an open source js framework using canvas as the basic style of UI components, the official site is at http://fabricjs.com/.

Directly reuse existing Microsoft designed and implemented components is very convinient as long as your application can work well with these codes.

Except Windows style UI frameworks, there are other frameworks using morden components:

Front end Office.js framework

Office.js is the JavaScript based Office model provided by Microsoft, there are also Excel-15.js or Outlook-15.js for application respectively.

Office JavaScript API object model

This doc https://docs.microsoft.com/en-us/office/dev/add-ins/develop/office-javascript-api-object-model explains the API model for new O365 addin JS model.

The object is still under active development, there are more and more new features added, reading the documents can get the updated information. As for now, there are below bullet points:

JSAddinFeatures

This is also guide for how to develop Addin with Angular front end. https://docs.microsoft.com/en-us/office/dev/add-ins/develop/add-ins-with-angular2

Office appication has its own object model, so developers can read the related documents for detailed guide.

Outlook Backend service

Except the general Office JS API model, Outlook has its own API. The development guide is at https://docs.microsoft.com/en-us/outlook/add-ins/.

Manifest version and corresponding clients support

ClientSupport

Troubleshooting manifest file here

Outlook Web Addin Catalogs

Outlook Addin has its own concepts and there are many aspects:

OutlookCatalog

Sample Addins for Outlook

https://developer.microsoft.com/zh-cn/outlook/gallery/?filterBy=Outlook,Samples,Add-ins

Other Office Web Addin Demos