SharePoint Framework (SPFx) – an overview


SharePoint Framework is the new development model with a new UX. Using SharePoint Framework we can build apps and productive experiences that are responsive and mobile-friendly. The SharePoint Framework works in SharePoint Online and on-premises. In short, SharePoint Framework is a page and web part model that provides full support for client side development that is capable of easy integration with SharePoint data and also supports open source tooling. Companies interested in SharePoint development should certainly look into SharePoint Framework.

Tooling of SharePoint Framework

1) Tooling: Yeoman, Node.js, Gulp, Typescript, Visual Studio Code.

2) Choose your framework: Knockout, Angular, React etc.

Purpose of SharePoint Framework

Initially, SharePoint Online had many features which were written in C#, compiled to DLLs and deployed to the servers. This solution worked well in only one enterprise. But for multiple tenants it didn’t scale to the cloud. So Microsoft introduced two alternative methods -

  • Client Side JavaScript Injection

Script Editor web part is used for injecting JavaScript in SharePoint Online or on-premises. The end user can edit the page and modify the script. But if he writes incorrect code and there are any mistakes in the script it will affect the whole page and this will break the page. This means that Script Editor web part is not safe for scripting.

  • SharePoint Apps/Add-ins

This runs separately from SharePoint. The developer creates an iframe where the actual content is rendered in SharePoint Page. The benefit of this approach is that it has no access to the current connection or DOM. The drawback of this approach is it runs in iframe. iframes are slower than script editor web parts because it requires sending a new request to another page. Making them work with responsive designs is also difficult.

Insights

How SharePoint is Helping Enterprises Become More Efficient

SharePoint is a comprehensive collaboration tool that businesses are increasingly adopting in order to become more efficient and helping their employees become more productive.

Download

SharePoint Framework Essentials

  1. It is responsive.
  2. Controls are rendered as normal DOM.
  3. It runs in the context of current user and connection in the browser.
  4. No iframe.
  5. Use any browser framework that you like – React, Knockout, Angular etc.
  6. Open source development tools like NPM, Typescript, Yeoman, Webpack, Gulp etc.
  7. Used in Classic web parts and publishing pages as well as modern pages.

SharePoint Framework Key

SharePoint Framework and the future of SharePoint

I believe that Sandbox Solutions and Farm Base Solutions are deprecated and they don’t have a future. The future of SharePoint lies in intuitive and easy to use interfaces. The release of SPFx to general availability finally allows us a new style of coding and enhancing the end user experience.

Right now we can deploy our SP Framework client web part in the same way as we deploy the app (such as publish app file) and then upload it in Office 365. The difference is that apps/add-ins are rendered in iframe but our SP Framework client web part is rendered in the same page of our web application as an element. Modern pages have multiple layout. However, the SPFx client web part could be used in old classic page layouts. So it will be a very good replacement of add-in web parts or the use of ScriptLink to inject Javascript.

Conclusion

The SharePoint Framework is built to be an open and connected platform and many barriers to development have been removed. It is expected to reduce time for development since it will be more automated and the use of JavaScript will create more options for web parts development. This will help developers create better SharePoint experiences for users, both on-premises and in Office 365. To know more about how to implement SharePoint Framework, you can talk to us by filling out the form on this page.

Ravi Suthar is a Sr. Technical Analyst at Softweb Solutions. He specializes in SharePoint Services, Office 365 and Microsoft technologies.