Fluent UI
Many components are already available, as open source libraries, to build nice UX/UI.
JavaScript frameworks
Using a JavaScript framework is not mandatory but it can help having simple code.
Options are:
Angular
React (recommended)
Component libraries
Office UI Fabric React (soon to be replaced by Fluent UI)
→ developer.microsoft.com/fluentui
Installation
npm install office-ui-fabric-react
Catalog: fluentui/controls/web
Source code: microsoft/fluentui
Examples: DocumentCard, Persona, SearchBox
Microsoft Graph Toolkit components
Library to use Microsoft Graph Toolkit in SharePoint Framework solutions.
→ SharePoint Framework library for Microsoft Graph Toolkit
Installation
npm install @microsoft/mgt-spfx
# for React
npm install @microsoft/mgt-react
Getting started: Build a SharePoint web part with the Microsoft Graph Toolkit
Examples: Persona card
PnP (Microsoft 365 Patterns and Practices) components
npm install @pnp/spfx-property-controls --save --save-exact
npm install @pnp/spfx-controls-react --save --save-exact
Last updated
Was this helpful?