SharePoint Framework Extensions – Part 1 (What is SPFx Extensions)

If you want to learn about Why SPFx has been introduced

You can use SharePoint Framework (SPFx) Extensions to extend the SharePoint user experience. With SharePoint Framework Extensions, you can customize more facets of the SharePoint experience, including notification areas, toolbars, and list data views.

You can consider – SharePoint Framework Extensions are being touted as the replacement for Custom Actions, JS Link, and more – but what are they really? Whether you’ve started experimenting with the SharePoint Framework or not, come find out exactly what the Extensions are, when to use them, limitations, and advantages.

SharePoint Framework Extensions are not only powerful and flexible tools to customize SharePoint, when it comes to modern pages, they’re the only way.

What is SharePoint Framework?

SharePoint Framework Extensions enable you to extend the SharePoint user experience within modern pages and document libraries, while using the familiar SharePoint Framework tools and libraries for client-side development.

In this series of post – I will explain How you can customize and extend the SharePoint user interface and experience with the SharePoint Framework Extension.

This customization options adding to the SharePoint Framework lately year 2017 bring some of the options available to us and previous development models that supports the classic experience to the modern experience.

History:

Extensions were not included in very first releases of SharePoint Framework.

They were released in Developer Preview to developer tenants in the version 1.1.1 on June 12, 2017

Release candidate – v1.2.0 on August 29,2017

And finally they release as General Available to all tenants in SharePoint online in version 1.3.0 on September 25, 2017

Available:

Where can we use this?

  • Extensions are available in all SharePoint online tenants.
    • Generally available in Modern sites, pages, lists and libraries
    • We are using in classic sites, pages and lists – in classic experience. We can revert to old classic user experience or modern user experience.
  • That’s also not available to us in Feature Pack 2 of SharePoint 2016 for on-premises SharePoint deployments.
    • The reason for this because like I said – this needs a modern experience.
    • Microsoft has said that the modern experience will be introduce in next SharePoint on-premises major release.

What’s Possible with Extensions:

So what’s possible with extensions and what type of extensions are available in the SharePoint Framework.

There are all parts of same fashion from things that we used to be able to do in previous SharePoint – Customization and development model.

Let me explain you brief introduction on different types of Extensions before we jump into.

Application Customizers:

This will allows you to use arbitrary JavaScript’s on all pages within a SharePoint site. It also allows to write html to some well-known placeholder element on every single page. So we can add things like say header and footer.

You might familiar with delegate controls and script link attribute control

Command Sets:

This will allow you to put buttons on the toolbar or in the context menu of item in lists and libraries. When you click on this buttons they going to run code that you have specified.

You might be familiar with old functionality  called custom actions.

Field Customizers:

This will allow you to customize the rendering of the cell within a list view of a site.

For instance, a “progress” field might be a lot more interesting as a progress bar than a number. With field customizers, you can change that number to look like a progress bar.

You might be familiar with term JSLink or CSR (Client Side Rendering) framework. This is the modern experience to those.

In next post, I will explain Application Customizers in detail

2 comments

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s