SharePoint Framework (SPFx) Overview

SharePoint Framework (SPFx) Overview

12 January 2021

What is SharePoint Framework (SPFx)?

The Sharepoint Framework provides facility for client side development on the SharePoint platform. SharePoint Framework provides support for web technologies to build responsive apps. This framework allows easy integration with SharePoint Data.

The main purpose of using the SharePoint Framework is to be able to customize the modern sites. It is a Page and Web-Part based model.

Why to use SharePoint Framework (SPFx)?

The Existing SharePoint doesn’t do well with multiple enterprises. It can’t scale to the cloud where multiple enterprises run on the same server. So, to achieve this there are two alternatives. The first one is JavaScript Injection in SPFx in which the script editor is used in SharePoint online. It can use JavaScript and JavaScript executes while the page is rendering. As it is in the same DOM, one control can interact with other controls easily. The other option is an add-in model in SharePoint. It allows you to create an iFrame to execute. It is external and has no access to DOM and connection. The disadvantage of using add-ins is that it uses iFrames which is slower than the script editor.

Features of SharePoint Framework (SPFx):

  1. Faster Rendering
  2. Not dependent on the framework used for JavaScript.
  3. It is Safe and Secure, and needs access/permission for making changes.
  4. Provides responsive controls.
  5. Provides Open Source development tools.
  6. Provides reliable performance

SharePoint Framework (SPFx) Extensions:

SPFx Extensions extends the SharePoint user experience. While using SPFx tools and libraries for development is uses following extension types:

Application Customizers:

It adds scripts to the page, accessed HTML elements

Field Customizers:

Provides access to modified views to data for fields within a list.

Command Sets:

Adds new commands to SharePoint command commands.

SharePoint Framework (SPFx)

To have the development environment ready for SPFx following steps are required

  1. Install Latest Version of Node Js
  2. Install Code Editor (Visual Studio Code/Atom/WebStorm/Visual Studio SPFx Project Template)
  3. Install Yeoman and gulp
  4. Update NPM packages if outdated.

Blog Categories
Request a quote