• Log in or sign up into developer.zoho.com.

• Go to Sigma and access your workspace.

• Once you enter your workspace in Sigma, you will be taken to the Extensions section in Sigma.

• You may either build a new extension entirely from scratch, or use one of Sigma's current templates to begin your extension development process.
  

• To begin creating an extension using a template, simply select the Extensions Gallery option in your workspace.
  

• Choose an extension from the options available in Zoho Projects to begin creating one with a template. When you select an extension, you will be taken to the Sigma cloud editor, where you will find a template for that extension.

• Alternatively, you can also start building an extension entirely on your own. To do this, click the New Extension button to start creating and building an extension.

• Enter a Name and Description for the extension. Choose the service as Zoho Projects.
  

• There are two ways you can create an extension for Zoho Projects:

➤ Using the cloud editor

➤ Using the command line interface (CLI)

• Toggle Upload Existing File to YES to build your extension using CLI, and NO to develop it using the cloud editor.

• In this post, we'll look at how to create an extension with the cloud editor. So toggle to NO, accept the terms and conditions, then click Create.
  

Note: We'll be exploring building extensions using CLI in our next post.

• You'll be redirected to the cloud editor for the extension you've created, where an app folder and a plugin-manifest.json file will be available by default.

• The app folder will have a defined directory structure populated automatically for the sample Zoho Projects extension. This app folder can be used to manage all of the important resources that are required for your extension.

• The plugin-manifest.json will help with the configuration of your extension. It contains a set of keys and values that determine your extension's settings.
  

Note: We'll go over most of these keys in detail when we get into the related feature and functionality in upcoming posts.

• When you examine the default plugin-manifest json file populated in the cloud editor, you'll find the widgets key being configured with these details for a default sample widget:

➤ A name key mapped with the sample widget name as "Projects Extension."

➤ A location key mapped with the default location as "task_tab." This key determines the location to load thewidget. Zoho Projects supports multiple locations where you can load widgets. You can select the location based on your requirements; however, the default location is the task details tab.

➤ An URL key that holds the path or location of the HTML file that will be loaded as the widget UI. By default, the path is defined as: /app/index.html.

• The cloud editor also includes a pre-populated index.html file in the app folder that will be loaded as the widget UI in the task details tab.
  

• The Sigma cloud editor allows you to test your extension functionalities in a testing environment before publishing the extensions and installing them in a Zoho Projects portal.

• To test the extension, click Run in the cloud editor.
  

• You'll be taken directly to a specific portal in your Zoho Projects account. If you only have one portal, you'll be landing directly in that portal. If you have multiple portals, you'll be prompted to select the portal where you wish to test your extension.

Note: The extension's components (for example, widgets) can be tested in the portal by selecting the Run option; however, no instance of the component will be reflected on the portal until the extension is published and installed in that portal.

• Once you've entered the testing environment, click on a task to enter the task details page, because the extension you've created has a sample widget named Projects Extension in the task details tab.
  

• On the task details page, you can view the widget named Projects Extensions as an individual task tab. Click on the Projects Extensions tab.
  

• The widget will be loaded with the UI as available in the index.html file.

• Once you are done with testing your extension functionalities, switch to the cloud editor tab and click Stop.

• In what situations can we use the Run option?
  

➤ To run the extension for the first time in the testing environment.

➤ Whenever the plugin-manifest.json file is modified, you have to use the Run option again.

Note: If you make modifications to any other files, simply refresh the extension to see the changes; there's no need to use Stop and Run again.

➤ When you use the Stop option to end a test and then want to retest the extension, the Run option has to be used.

• Whenever you want to make changes to your extension code, choose the Extensions section in the left panel of your Sigma workspace.

• Hover over the extension to which you want to make changes. Click on Edit Builder icon.
  

• You'll be taken to the cloud editor of that particular extension, then you can go ahead and make your edits.

• Alternatively, you can also click on the Extension Details icon.
  

• Then, click Edit Extension.
  

• This method will also take you to the cloud editor of the extension where you can make necessary changes.

Sign up for a Zoho Developer account ans start developing extensions for Zoho products using Sigma.