How do you customise or extend SharePoint in 2022?

As a full stack developer who enjoys developing my own apps, a slight sense of panic set in when my organisation started to shift towards Microsoft 365 and SharePoint for everything.  My internal apps and our employee website - developed, honed and supported over many years - was quickly becoming yesterday's news. 

I've never been a big fan of SharePoint - although my experience was based on some chaotic attempts I witnessed several years ago to build an internal app using the platform, which ended up looking like a dog's dinner. In particular, it was visually awful (especially on mobile). To customise SharePoint back then, you had to use something called web parts, which involved writing and compiling user controls (ascx files with a code behind component). This will be vaguely familiar to anyone who developed ASP.NET web forms applications a decade or two ago.  

This was some time ago - but the conclusion I came away with, was that it wasn't the best tool for building any form of web application that went beyond document management.  

However, in a post-COVID world, where applications like Teams had been seen pretty much as a saviour of many businesses, it seems Microsoft 365 is now the answer to every question.  

Time to update my skill set, and find out more about "modern" SharePoint?  Yes, almost certainly.

A bit of a revelation occurred when I discovered SPFX.

Microsoft have provided a client-side framework, which allows you to build components for (and to extend) SharePoint using your favourite front-end framework (React for me, but I read you can use Angular, Vue.js ... anything you like). If you're familiar with tools such as NPM, TypeScript and Gulp - you'll be fine.

The framework provides support for accessing SharePoint resources (like SharePoint lists).  Your resulting component/app runs in the context of the current user. Thus, if the user can see/access a SharePoint list, then your component can also access the data within the list.

How do you build and test your new component?  Microsoft provide something called Workbench - which sits within your SharePoint instance.  This lets you preview and test your component within the context of your actual SharePoint site, but without having to deploy anything.

I'm going to attempt to use this blog to write up some notes - as I find that helps me with the learning process.  Hopefully it will help someone else too.

Comments