Developing SharePoint Web Parts With ReactJS

Developing #SharePoint #Web Parts With #ReactJS - Part 2 by @nakkeerann cc @CsharpCorner

  • In my previous article, you have learned the basics, prerequisites, and the environment setup for developing SharePoint web parts using React offline compilers.
  • The React component file will then, be translated to JavaScript file using babel compiler.
  • Refer to the HTML and JavaScript files from the web parts, and then execute/run the page.
  • The below snapshot shows the content editor web part in edit mode which shows the HTML reference file placed on style library.
  • The translated JavaScript files are then used as references in HTML of SharePoint web part.

In this article, you will learn how to develop SharePoint web parts using React JavaScript library with the help of offline React compilers.

@CsharpCorner: Developing #SharePoint #Web Parts With #ReactJS – Part 2 by @nakkeerann cc @CsharpCorner

Open the project using IDE – in this case, Visual Studio code. If you don’t have any IDE, you can simply use notepad to create necessary files.

Drop the HTML and JavaScript files into the SharePoint site (here, style library). Create any page with content editor web part or normal custom editor web part. Refer to the HTML and JavaScript files from the web parts, and then execute/run the page.

The below snapshot shows the content editor web part in edit mode which shows the HTML reference file placed on style library. The web part also displays the React component results (username of current logged in user). Similarly, the other data can be retrieved and shown.

Developing SharePoint Web Parts With ReactJS