I added the Teams Toolkit Extension to Visual Studio Code

I clicked the Teams Toolkit to open the Wizard

I configured the Quick Start items

I signed in to my M365 account

I signed in to Azure

I clicked the Create New Project link

I started from a sample

I selected the Todo List with SPFx sample

I downloaded the sample code from GitHub

I noted that the sample code was a work in progress

I navigated to {tenant}.sharepoint.com

I created a blank list

I named the list "To Do List"

esp8266

I added a description column

esp8266

I added an isCompleted column

To Do List

esp8266

I updated the list settings

I configured users to see only their own list items

I opened the Visual Studio Code command palette

esp8266

I ran the Teams: Deploy to the Cloud command

SharePoint package was being built

The todo-list-sp-fx.sppkg file was created

I uploaded the todo-list-sp-fx.sppkg file to the SharePoint App Catalog

I uploaded

I added a document

I checked "Make this solution available to all sites" and clicked Deploy

I selected the app and clicked the "Sync to Teams" button in the SharePoint ribbon

The app was being added to Teams

I navigated to the Teams Admin pages

I selected "Manage apps" (using a supported browser)

The TodoList SPFx app was published.

I opened Teams and selected the Apps item from the left-hand menu

esp8266

The app was a "Personal app" (not a Tabs app)

I used the Open button to open the Personal App

I added a To Do List item

The item was added to the SharePoint list

I updated the "isCompleted" status

The isCompleted status was updated in the SharePoint list item

I reviewed TodoListWebPart.manifest.json

I added the "TeamsTab" option

I used Teams: Deploy to the Cloud to rebuild the sppkg file

I built the SharePoint Package

I deleted the SPFx App from Teams

I deleted the "TodoList" SPFx app

The SPFx app was gone

I deleted the app from the SharePoint App Catalog

After deleting the app from Teams and the SharePoint App Catalog, I uploaded the new version

I added the document again

I selected the "Make this solution available to all sites" checkbox again

I clicked the "Sync to Teams" button again

The new version of the SPFx app was published to Teams.

The new version of the SPFx app was available in the Teams client app

The new version of the SPFx app could be used as a "Personal app" or in a tab

I added it as a tab in a Teams Channel

Looks good

The app returned an error because it assumed a "To Do List" existed on the Teams SharePoint Site.

I navigated to the Team SharePoint Site and created a new list.

Create a blank list

I named the list "To Do List"

I added a "Single line of text" column

I named the column "description"

I added a "Yes/No" column

I named the column "isComplete"

I tried adding the app as a tab again

I selected the Team and Channel

Looks good

The new tab was added

Add a To Do List item

A To Do List item was added

A new SharePoint list item was created

The code in SharePointListManager.ts communicates with SharePoint using REST methods