SPFx Class Components Challenge

Photo By Lukas
Photo by Lukas: https://www.pexels.com/photo/turned-on-laptop-computer-574073/

In fact this is a topic that has been talked about often. Hooks were added to React in version 16.8.

Hooks allow function components to have access to state and other React features. Because of this, class components are generally no longer needed, yes in fact, but let’s see what we have at the time of this post. So in version 1.17 Microsoft should give you in the chain Class Components as before, I don’t see any indication otherwise at the time of this post in the SharePoint Framework

Some projects deprecated the Class Components like the Yo Teams – the Microsoft Teams app generator

[2.17.0] – <2020-12-07>

  • Changed to use React Hooks for UX instead of class based React components (#87)
  • Client side scripts are now functional components (#112)
  • This version does not support upgrading projects generated with prior generator versions


My Opinion is follow what Microsoft is giving to you but be prepared also to Train your team and find new processes, you have some content online so I’m preparing myself to this change or anticipate, it’s on my Backlog. But why I didn’t change yet?

  1. I have a Team to prepare or delegate training and processes
  2. I Work with SharePoint for so many years and leaned not to reinvent the wheel
  3. “Hipe” peaks are not good for the business
  4. I have a Governance to follow
  5. I have a full picture of the Governance, so as my team, we should decide together
  6. I can develop SPFx for SharePoint 2016 with Feature Pack 2 or 2019 with version 1.4.1

Now it’s up to you, I’m giving you some videos as a result of a brainstorm on Twitter.

The problem is you invested time, money to implement Class Components with Models, Services in the SharePoint Framework SPFx, now what to do with this? and why Microsoft don’t give us Function Components?

The second part it’s easy, Microsoft is the 1st Party for the chain development, so it will not give you maybe for several reasons

  1. They don’t want to yet
  2. Microsoft 365 is an ecosystem with several teams working together
  3. The Program Managers have a view as 1st Party witch you don’t have as 3rd Party

I have a specific opinion about this, maybe Microsoft don’t want to give you this message in a future version.

This version does not support upgrading projects generated with prior generator versions

Yes, it’s true because you have a live safer, the Microsoft 365 CLI which does all the job to upgrade your project, so there is a strict relation between projects. This can be taken as an example.

m365 spfx project upgrade [options]

The First part is more complex, it’s a decision to invest in React Hooks and each Lead Architect have to balance with the resources, budget and Go/No Go decision, because you can use Functional Components since React 16.8 was released in SPFx.

See this great Brainstorm from July Turner and Andrew Connell

See how to rebrand for Function Components


Joao Livio

João has over two decades of IT experience and holds several certifications, including Microsoft Certified Professional (MCP) and Microsoft Certified Technology Specialist (MCTS). He is also a Lean Specialist with expertise in Lean Management, Nintex, and other training programs from LinkedIn and Udemy, including exams related to Azure and the Power Platform. As a Consultant and Advisor for Modern Work, João assists clients in unlocking their digital potential and optimizing productivity and collaboration. His approach is agnostic to technology, focusing on practical solutions that align with business goals. He has consistently been recognized as a Microsoft Most Valuable Professional (MVP) for 10 consecutive years. His commitment to excellence extends beyond technical expertise; he also values consistency, mental health, creative thinking, teamwork, and fun at work. João believes that learning every day within a team context is the key to continuous improvement.

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *