SPFx checklist web part for SharePoint Online. Connects to two lists: one that provides a list of items/tasks and another that tracks user progress. Supports semantic colours providing support regardless of theme and section background colour.
Get your own free development tenant by subscribing to Microsoft 365 developer program
- Create two lists on your site to connect to:
- Source list -> A list of tasks/items to complete:
- Title: The field that will show in the checklist.
- Content: Rich text field (multi-line text) which will show when the item is expanded.
- Tracking list -> A list to track user progress:
- Task: Lookup field to the source list.
- Employee: Person field to track the user who completed the task.
- Complete: Boolean (Yes/No) field.
- Completed: Date and time field.
- Source list -> A list of tasks/items to complete:
| Solution | Author(s) |
|---|---|
| spfx-user-checklist | MRS Company Ltd |
| Version | Date | Comments |
|---|---|---|
| 1.0 | November 14, 2023 | 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 repository:
git clone https://github.com/mrscompanyltd/spfx-user-checklist- Change into directory:
cd spfx-user-checklist- Install dependencies:
npm i- Run solution:
gulp serve --nobrowser- Navigate to your workbench in your browser: https://{yourTenant}.sharepoint.com/sites/{yourSite}/_layouts/workbench.aspx
To build:
gulp build && gulp bundle --ship && gulp package-solution --ship- Upload sppkg file from /sharepoint/solution into your app catalog in SharePoint.
- 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