The SharePoint Starter Kit (starter kit) is a comprehensive solution designed for SharePoint Online which provides numerous SharePoint Framework (SPFx) web parts, extensions, and other components, as well as PnP PowerShell driven provisioning which you can use as an example and inspiration for your own customizations.
Starter Kit V3 does not support SharePoint 2019 and SharePoint Server Subscription Edition.
Starter Kit Version 1 includes a comprenshive strategy for only SharePoint Online, as well as a single SPFx solution that encapsulates all webparts and extensions into a single package. Version 1 may be accessed via the v1 branch for legacy purposes and will not be maintained beyond April 2020.
Notice: There currently is not a direct path for upgrading an existing SharePoint Online tenant with the starter kit v1 to v3. V3 may be installed into a tenant with v1 already installed, by default, this will add a tenant wide duplicate all of webparts and extensions. It is recommended that the starter kit v1 be removed from a tenant before adding v3, or creating a custom installation of v3.
Starter Kit Version 2 includes a strategy for SharePoint Online and SharePoint 2019 and includes individual SPFx solutions for each webpart and application customizer. Version 2 may be accessed via the v2 branch for legacy purposes and will not be maintained beyond February 2023. Starter Kit Version 2 is the only version that supports SharePoint 2019.
Notice: The direct path for upgrading an existing SharePoint Online tenant with the starter kit v2 to v3 is to only install / invoke the starterkit-spfx-only.pnp provisioning template found in the ./provisioning folder. This provisioning template will only upgrade the existing SPFx solutions to V3 (SPFx version 1.16.1), and will not recreate the sample sites.
Notice: the starter kit adds tenant level settings including themes, site designs, taxonomy term sets, and other adjustments. Therefore, it is recommended to test the starter kit in an isolated test tenant and not immediately execute it within your production environment.
- Objectives of this solution
- SharePoint Starter Kit v3 objectives
- Pre-requirements
- Getting started
- Learn more
- Custom Web Parts
- SharePoint Framework Extensions
- SharePoint Framework Libraries
- Support and SLA for this project
- Contributing
SharePoint Communication Sites and Team Sites have great out-of-the-box capabilities, although the out-of-the-box capabilities may not always be sufficient for your scenarios. This is exactly why SharePoint may be extended and you are able to include your own customizations. This solution addresses common scenarios and tasks you may encounter when introducing those customizations, and provides examples and guidance on how you might address and provision them including:
- Automated provisioning of simple demo content within a communication site
- Automated provisioning of multiple team sites with pre-configuration and hub site association
- Automated provisioning of the whole solution to any tenant within minutes
- Automated configuration of Site Scripts and Site Designs at the tenant level using the PnP Remote Provisioning engine (SharePoint Online only)
- Implementation of different customizations for SharePoint
- Usage of Fluent UI and reusable PnP SPFx controls within the customizations
Additional high resolution screenshots are also available: front page.
- Extend the success of v1 and v2 by providing developers a customization and provisioning strategy for SharePoint Online
- Demonstrate new SharePoint Online UX design and layout capabilities including:
- Full height vertical columns
- Compact headers
- Mega menus
- Background theming
- Support web parts, extensions, and libraries to be deployed one-by-one to tenants or farms
- Demonstrate teams tab development with SharePoint Framework for suitable web parts in SharePoint Online
- Demonstrate Microsoft Graph API and Graph Toolkit (current version mgt-react 2.9.0) usage in SharePoint Online
Here are current pre-requirements for making this solution work in your tenant.
-
You will need to be a tenant administrator to be able to deploy this solution
- Notice that you can get free developer tenant from Microsoft 365 Developer Program, if needed.
-
Automatic end-to-end provisioning only works with English tenants
- All solutions and web parts are also English in the current implementation
- For tenants that have English but have a different default language, the term set provisioning may be modified to assist with installation
-
Add the tenant administrator account used during provisioning as Term Store Administrator in the Taxonomy Term Store through the SharePoint Admin Center.
-
A tenant 'App Catalog' must have been created within the 'Apps' option of the SharePoint Admin Center.
It is recommended that you wait up to 24 hours before attempting to provision this solution if any of the following are true
- Your SharePoint tenant was just created
- You just created your SharePoint tenant app catalog
This project will install Microsoft Graph Toolkit for SPFx version 2.9.0 into the app catalog. If you have another version already installed, you will want to remove that package before installing the Starter Kit
Shortest path to success for SharePoint Online - The following steps will help you get started in any SharePoint Online tenant as fast as possible.
Starter Kit v3 no longer supports SharePoint 2019, refer to the SharePoint 2019 installation instructions for v2
-
Ensure you meet the Pre-requirements
-
Ensure that you meet the requirements for SharePoint Framework development and are using the latest version of PnP PowerShell. Latest confirmed version of PnP PowerShell: 1.12.0.
-
Prepare your tenant, by accomplishing the tasks highlighted in document Preparing your tenant for the PnP SharePoint Starter Kit
-
Open PowerShell, and use PnP PowerShell to connect to any site in your tenant with the
Connect-PnPOnline
cmdlet using your own tenant url. For more information on authenticating with PnP PowerShell, see documentationConnect-PnPOnline https://contosodemosk.sharepoint.com
-
Change to the
provisioning
folder found in this solution's root and execute the following command (using your own tenant url and the prefix of your choosing):Invoke-PnPTenantTemplate -Path .\starterkit.pnp
This will provision three site collections with urls of
/sites/demoportal
,/sites/demohr
, and/sites/demomarketing
. Your urls may vary depending on the managed path you selected for team sites in your tenant administration (this defaults to 'sites').-
Refer to the 'provisioning documentation' for advanced provisioning options and guidance
-
If you run into errors during provisioning, refer to 'Common SP Starter Kit Provisioning results' for additional suggestions and common mistakes
-
-
This solution will automatically install multiple SPFx webparts that require API permissisons to the Graph API. After installing this solution, access your API Management page in your SharePoint Admin Center and approve the pending requests.
Notice that the starter kit also adds tenant level settings including themes, site designs, taxonomy term sets, and other adjustments. Therefore, it is recommended you test the starter kit in an isolated test tenant and not immediately execute it within your production environment.
Here are the custom web parts currently included in the solution package.
Screenshot | Web Part | Description | Compatibility | Code |
---|---|---|---|---|
Banner | Creates a banner with an image and overlaid text. | SPO only | code | |
Followed Sites | Shows the list of sites which particular user is following | SPO only | code | |
Links | Link list web part which is using collection data editor and stores the links in web part properties | SPO only | code | |
LOB integration | Sample web part to surface LOB information from API hosted in Azure. | SPO only | code | |
People Directory | People directory web part uses the people search API to get list of people to show. | SPO only | code | |
Personal Calendar | Shows upcoming calendar meetings for the particular user using Microsoft Graph. | SPO only | code | |
Personal Contacts | Personal contacts for particular user using Microsoft Graph. | SPO only | code | |
Personal Email | List latest personal emails for the current user using Microsoft Graph. | SPO only | code | |
Personal Tasks | Show personal tasks for the current user using Microsoft Graph. | SPO only | code | |
Recent Contacts | Show recent contacts for the current user using Microsoft Graph. | SPO only | code | |
Recently Used Documents | Show recently used documents for the current user using Microsoft Graph. | SPO only | code | |
Recently Visited Sites | Show recently visited sites for current user using Microsoft Graph. | SPO only | code | |
Site Information | Intended to collect and present additional metadata for group associated team sites. | SPO only | code | |
Stock Information (deprecated) | Display stock information by using the live stocks service provided by Alpha Advantage. You will need to register for a custom key for this to work at the Alpha Advantage site and then include the key in the tenant properties. | SPO ony | code | |
Tiles | Renders set of tiles. Icons are from Office UI Fabric and you can configure tiles using collection editor in web part properties. | SPO only | code | |
Weather Information | Weather information web part which is using Yahoo Weather APIs to get the forecast information. | SPO only | code | |
World Time | Clock web part to show the time in specific time zone. | SPO only | code |
Screenshot | Extension | Description | Compatibility | Code |
---|---|---|---|---|
Alert Notification | Shows informational or important messages in the header section of pages based on a custom list information in the hub site. | SPO only | code | |
Collaboration Footer | Shows company wide links which are configured using Taxonomy service. Includes also personalized links which are stored in user profile property if set. By default associated to group associated team sites when a custom Site Design is selected for new sites. | SPO only | code | |
Discuss Now | Custom list view command set to add new custom dialog for document library that utilizes the Graph API. | SPO only | code | |
Portal Footer | Expanding footer for communication site. Show standard company links and also supports personalized links for the current user which are stored in User Profile. | SPO only | code | |
Not available | Redirect | Can be used to perform automatic redirections of URLs in the site based on a custom list. | SPO only | code |
Site Classification (deprecated) | Renders a header with site classification information. This has been replaced by out-of-the-box SharePoint Online header functionality | SPO only | code | |
Not available | Tab Page (deprecated) | Renders a header with links between two different pages in the site. | SPO only | code |
Extension | Description | Compatibility | Code |
---|---|---|---|
Shared library | A shared library that includes shared locatization strings, consumabled by any other SPFx webpart or extension. | SPO only | code |
The following statements apply across all of the PnP samples and solutions, including samples, core component(s) and solutions, including the SharePoint Starter Kit.
- PnP guidance and samples are created by Microsoft & by the community
- PnP guidance and samples are maintained by Microsoft & by the community
- PnP uses supported and recommended techniques
- PnP is an open-source initiative by the community – people who work on the initiative for the benefit of others, have their normal day job as well
- PnP is NOT a product and therefore it’s not supported by Premier Support or other official support channels
- PnP is supported in similar ways as other open source projects offered by Microsoft with support from the community, by the community
- There are numerous partners that utilize PnP within their solutions for customers. Support for this is provided by the Partner. When PnP material is used in deployments, we recommend being clear with your customer/deployment owner on the support model
This project welcomes contributions and suggestions. Most contributions require you to agree to a Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us the rights to use your contribution. For details, visit https://cla.microsoft.com.
When you submit a pull request, a CLA-bot will automatically determine whether you need to provide a CLA and decorate the PR appropriately (e.g., label, comment). Simply follow the instructions provided by the bot. You will only need to do this once across all repos using our CLA.
This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact opencode@microsoft.com with any additional questions or comments.