Using Teams Toolkit CLI For Creating Teams Tab

Introduction

There are multiple ways to create a Teams Tab project such as using the Teams Toolkit extension for Visual Studio code, Yeoman generator for Teams, etc. Among these options, one such option is to use Teams Toolkit CLI before creating a Teams Tab project using Team Toolkit CLI let’s understand what Teams Toolkit CLI is.

What is Teams Toolkit CLI?

Teams Toolkit CLI is a command line interface that helps in Teams application development. It is available as a part of the node package manager because it is straightforward to use Teams Toolkit CLI in CI/CD pipelines to build and deploy our Teams application. The best part of Teams Toolkit CLI is it is an open-source project. So you can check out the source code using the below link.

TeamsFx/packages/cli at dev · OfficeDev/TeamsFx (github.com)

How to Install Teams Toolkit CLI?

To install Teams Toolkit CLI pre-requisite is to have NodeJS installed and use the LTS version of NodeJS if not already installed. Once your environment has NodeJS use the below command to install Teams Toolkit.

npm install -g @microsoft/teamsfx-cli

JavaScriptCopy

Install Teams Toolkit CLI

To List, all the commands available as part of Teams Toolkit CLI use the below command

teamsfx -h

JavaScriptCopy

Install Teams Toolkit CLI

How to scaffold a new Teams Tab project?

To create a new project using Teams Toolkit CLI there are two different ways 

  1. Using an Interactive way
  2. Using a non Interactive way

We will look into both ways

1) Using an Interactive way

To leverage the interactive way of creating a Teams Tab project run the below command and then follow the below-specified steps

Enjoying your read so far? Explore more Microsoft Teams content.

teamsfx new

JavaScriptCopy

1. Select Create a new Teams app

How to scaffold a new Teams Tab project

2. Select Capabilities as Tab by using the arrow keys

ESPC call for speakers 2024
3. Select the programming language as Typescript

4. Select the Workspace folder  ./

Note: you can provide your path to the folder where you want the scaffolded project to be present

How to scaffold a new Teams Tab project

5. Provide the application name as TeamsTabUsingCLI

How to scaffold a new Teams Tab project
How to scaffold a new Teams Tab project

Once we complete the above steps a new Teams Tab project will be created with the required files as displayed in the image below 

How to scaffold a new Teams Tab project

2) Using non Interactive way

To use a non-interactive form run the below command

teamsfx new --interactive false --capabilities "tab" --programming-language "typescript" --folder "./" --app-name TeamsTabUsingCLI

JavaScriptCopy

How to scaffold a new Teams Tab project

So by using just one command we can create a Teams Tab project with the required files

Conclusion

Teams Toolkit CLI also known as TeamsFx CLI is a beneficial CLI tool for creating, building, and deploying Teams applications. It even helps create projects from samples provided by Microsoft

About the Author

I am SharePoint Developer with experience in Front End Technologies like reactjs , jquery , typescript ; backend technologies like javacript with nodejs, C# ; scripting experience with PowerShell scripting

Reference

Sangani, K., 2022, Using Teams Toolkit CLI For Creating Teams Tab, Available at: https://www.c-sharpcorner.com/article/using-teams-toolkit-cli-for-creating-teams-tab/ [Accessed on 13 March 2023]

Share this on...

Rate this Post:

Share: