Simple todo list displayed as a table. Fetches a Sharepoint list and allow for CRUD operations via Graph API.
Technologies used: pnpJS, MobX, Storybook, Jest, FluentUI.
Get your own free development tenant by subscribing to Microsoft 365 developer program
Node v10.14.2
| Solution | Author(s) |
|---|---|
| sharepoint-todolist | Khoa Pham (github.com/asianlanlord) |
| Version | Date | Comments |
|---|---|---|
| 1.0 | May 4, 2021 | Initial release |
THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.
-
Clone this repository
-
Ensure that you are at the solution folder
-
in the command-line run:
- npm install
- gulp serve
-
For testing and using other tools, follow instructions from references.
This extension illustrates the following concepts:
- CRUD operations on a Sharepoint List using Graph API
- Interaction with another MS service (in this case Calendar) from Sharepoint.
- Basic implementation of FluentUI, Jest, MobX and Storybook in a Sharepoint project.
- Getting started with SharePoint Framework
- Building for Microsoft teams
- Use Microsoft Graph in your solution
- Publish SharePoint Framework applications to the Marketplace
- Microsoft 365 Patterns and Practices - Guidance, tooling, samples and open-source controls for your Microsoft 365 development
- [Storybook documentation] (https://storybook.js.org/docs/react/get-started/introduction) - For the basics of using Storybook for UI testing.
- [Using Jest with Sharepoint guide] - (https://www.voitanos.io/blog/enable-jest-testing-of-sharepoint-framework-projects-in-one-simple-step) - For configuring Jest to work on Sharepoint.
- [MobX documentation] (https://mobx.js.org/README.html) - For the basics of using MobX to manage state.
- [Fluent UI] (https://developer.microsoft.com/en-us/fluentui#/controls/web) - Microsoft FluentUI documentation.