Set up your Microsoft 365 tenant

To build and deploy client-side web parts using the SharePoint Framework, you need a Microsoft 365 tenant.

If you already have a Microsoft 365 tenant, see the section Create app catalog site.

Important

The SharePoint add-in model deprecation in SharePoint Online does not impact SharePoint Framework (SPFx), which is the primary replacement technology for SharePoint add-ins. SPFx is the most widely used extensibility model in Microsoft 365 and continues to be supported also in future.

See more on the SharePoint add-in model retirement from the full add-in model retirement announcement.

If you don't have a Microsoft 365 tenant, you might qualify for one through the Microsoft 365 Developer Program; for details, see the FAQ. Alternatively, you can sign up for a 1-month free trial or purchase a Microsoft 365 plan.

You can also follow these steps by watching this video on the Microsoft 365 Platform Communtiy (PnP) YouTube Channel:

Create app catalog site

You need an app catalog to upload and deploy web parts. If you've already set up an app catalog, see Create app catalog sites.

To create an app catalog site

1. Go to the SharePoint Admin Center by entering the following URL in your browser. Replace yourtenantprefix with your Microsoft 365 tenant prefix.

   Commercial Tenant

   HTTP

   https://{your-tenant-prefix}-admin.sharepoint.com
   

   GCC High Tenant

   HTTP

   https://{your-tenant-prefix}-admin.sharepoint.us
   

2. In the left sidebar, select More features

3. Locate the section Apps and select Open.

This will start the automatic creation of the SharePoint app catalog to the tenant if it does not exist. If the app catalog already exists, you will be redirect to it. SharePoint app catalog is used to manage and deploy SharePoint Framework solutions.

Create a new site collection

You also need a site collection and a site for your testing. You can create a new site collection by using any of the available templates.

1. Navigate to SharePoint Admin Center by entering the following URL in your browser. Replace {your-tenant-prefix} with your Microsoft 365 tenant prefix:

   Commercial Tenant

   HTTP

   https://{your-tenant-prefix}-admin.sharepoint.com
   

   GCC High Tenant

   HTTP

   https://{your-tenant-prefix}-admin.sharepoint.us
   

2. In the left sidebar, select Sites > Active sites.

3. Select Create from the toolbar at the top of the page.

4. On the Create a site panel, select Team site.

5. In the new view that appears, enter required details to create the site (Site name, Group owner, and language):

6. Select Next to create the site collection.

After SharePoint creates the site, you can browse to your site collection by selecting Finish & entering the URL of the new site.

Note

In this case, we are creating a new group associated team site with modern user interface experience. You could just as well create a communication site to be used as your test site collection supporting your development.

Note

You can potentially use the same tenant for developing SharePoint Framework experiences, especially for initial development experiences. We do, however, recommend the use of isolated developer tenants for each developer, for the best isolated developer experience.

SharePoint Workbench

SharePoint Workbench is a developer design surface that enables you to quickly preview and test web parts without deploying them in SharePoint. SharePoint Framework developer toolchain contains a version of the Workbench that works locally and helps you quickly test and validate solutions that you're building.

It's also hosted in your tenant to preview and test your local web parts in development. You can access the Hosted SharePoint Workbench from any SharePoint site in your tenancy by browsing to the following URL:

HTTP

https://your-sharepoint-site/_layouts/workbench.aspx

Next steps

Now that you've configured your SharePoint tenant, set up your development environment to build client-side web parts.