Skip to content

Modern SharePoint Starter Kit - End-to-end showcase solution to get started with modern experiences.

License

Notifications You must be signed in to change notification settings

pnp/sp-starter-kit

Repository files navigation

SharePoint Starter Kit v3

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.

PnP Starter Pack Front Page

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.

Table of contents

Objectives of this solution

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.

SharePoint Starter Kit v3 has following objectives

  • 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

Pre-requirements

Here are current pre-requirements for making this solution work in your tenant.

  1. You will need to be a tenant administrator to be able to deploy this solution

  2. Automatic end-to-end provisioning only works with English tenants

  3. Add the tenant administrator account used during provisioning as Term Store Administrator in the Taxonomy Term Store through the SharePoint Admin Center.

  4. 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

Getting started

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 documentation

    Connect-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').

  • 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.

Learn more

Custom Web Parts

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

SharePoint Framework Extensions

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

SharePoint Framework Libraries

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

Support and SLA for this project

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

Contributing

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.