CRUD-spfx-react-hooks

CRUD operation Demo using React hooks, context and PnP-JS-Core to add edit and delete a custom sharepoint list

1. Build file using npm run build

2. React files are bundled into one single js file called "react-pnp.js"

3. Upload react-pnp.js file to sharepoint Site Assets folder

4. Create a new page on Site Pages ( you can name it anything )

5. edit the page and add this html tag <div id="root"></div>

6. Insert Script Editor to the page

   • Insert > WebPart > Media and Content > Script Editor

7. on Script Editor, Edit Web Part > Edit Snippet

   • add this script tag to refer to your site assets <script type="text/javascript" src="your_sharepoint_url/SiteAssets/react-pnp.js"></script>

8. next, create a custom list with columns below and use its ID on your code