Convert Webparts to Functional Components (React Hooks)

%3CLINGO-SUB%20id%3D%22lingo-sub-2109072%22%20slang%3D%22en-US%22%3EConvert%20Webparts%20to%20Functional%20Components%20(React%20Hooks)%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-2109072%22%20slang%3D%22en-US%22%3E%3CP%3EI%20was%20asked%20recently%20to%20convert%20some%20modern%20webparts%20to%20use%20react%20hooks%20(refactor%20as%20functional%20components).%20%26nbsp%3BI%20struggled%20to%20find%20a%20simple%20tutorial%2C%20so%20I%20put%20one%20together%20to%20help%20anyone%20who%20has%20the%20same%20requirement%2C%20it%20uses%20v1.11%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3Etutorial%20video%20here%3A%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DBFgGFV9Rj44%26amp%3Bt%3D177s%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DBFgGFV9Rj44%26amp%3Bt%3D177s%3C%2FA%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3Esource%20code%20here%3A%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Fgithub.com%2FYorcloud%2Fspfx-react-hooks-demo%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%22%3Ehttps%3A%2F%2Fgithub.com%2FYorcloud%2Fspfx-react-hooks-demo%3C%2FA%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E
Occasional Contributor

I was asked recently to convert some modern webparts to use react hooks (refactor as functional components).  I struggled to find a simple tutorial, so I put one together to help anyone who has the same requirement, it uses v1.11

 

tutorial video here: https://www.youtube.com/watch?v=BFgGFV9Rj44&t=177s

 

source code here: https://github.com/Yorcloud/spfx-react-hooks-demo

 

 

hooks #spfx #sharepointMany React developers are moving over to hooks, but can this be done in SharePoint Framework development, yes it can.Here is a quick ...
0 Replies