in Office 365, SharePoint, SPFx

Sample React web part to kick start your development

At times we all want a sample that we can go back to, look at the code and its Readme to learn how to do that one thing you want to do or you are just curious to see what’s possible. In that spirit, I have been working on such sample and its now available at GitHub: React Todo Basic

A simple todo web part built using react to showcase some of the SharePoint Framework developer features, utilities and best practices in building react based web parts.

Todo basic web part demo

Todo basic web part demo

You can read the full documentation for the web part here. I also demoed the web part and discussed the code in the latest SharePoint PnP’s JavaScript Special Interest Group webcast.

The web part currently showcases the following features and capabilities:

  1. React pattern
  2. Status renderers
  3. Placeholders
  4. Lodash utility library
  5. Page display modes
  6. Loading SharePoint data in property pane
  7. Handling empty data in property pane fields
  8. Data providers
  9. Using SharePoint HttpClient to fetch SharePoint data

More features and capabilities like the following will be added as SharePoint Framework matures:

  • Unit testing your web part
  • Localization
  • Building accessible web parts

What about an angular web part?

React is simple, lean and something that I know, so I started this project with react. However, you are most welcome to adapt and contribute this sample into an angular web part if you know angular.

Write a Comment