Zoho Sigma helps you to build extensions for Zoho services in two ways:
- Building apps using the command line interface (CLI). You can use this method if you want to build an extension offline with your own code editor.
- Use Zoho Sigma cloud editor and develop extensions without any pre-setup. Manage the entire process online.
To develop an extension using Sigma CLI tool you need to install Node.js and Sigma CLI commands.
Step 1: Install Node.js and ZET CLI
- Install node.js.
- Execute the following command: $ node -v to verify the node.js version ( 7.1.0 and above are supported).
The Zoho extension toolkit is a command line interface tool used to build, test, and pack your extension. Execute the command that is mapped to your OS to install the tool.
For Mac/Unix system
sudo: npm install -g zoho-extension-toolkit
For Microsoft Windows
system: npm install -g zoho-extension-toolkit
-g denotes global installation. When ZET is installed globally, you will be able to execute commands from anywhere on your machine. Otherwise, you will have to navigate to the path where ZET is installed, then execute commands.
- zet -v or zet -version shows the version of the ZET.
- zet - h or zet -help to view all the available commands in ZET.
$ zet -h
Commands:
Init, Creates a new extension template directory
run Starts a local server with current directory as context
Validate Validates the current app with validation rules
Pack Packs the project to upload into marketplace
Step 2: Build an extension
Build extensions using your preferred code editor. Navigate to the directory where you want to build the extension.
- Create source folders or files under app directory.
-
Run the following command to create a new project for the extension
zet init
- Choose a Zoho service, say Orchestly from the list.
- Type the project name and hit Enter.
- A project directory with necessary folders, dependency node packages, and files will be created. app is the folder where you create the source and resource files for your extension.
- Execute cd [extension name]. This command will set the current path to the newly created extension's directory path.
plugin-manifest.json file
A default plugin-manifest file is generated as a part of the project template directory. This is a crucial file, where the JSON parameters of your extension have to be configured before hosting. This file contains meta information about the extension such as widget details, locations, and connectors.
Learn more on how to configure the parameters in this file.
JS SDK
Develop your extension using client-side technologies like HTML, JS, and CSS. Learn more about JS SDK methods supported by different services.
- Orchestly
- Zoho Projects
Step 3: Run an extension
- Run and test the extension in your local machine.
-
Execute the following command in your terminal.
zet run
- This command starts a local server and runs the extension locally.
- Your extension will run on the port 5000. Ensure it is available before you execute this command.
- Enable developer mode while testing your extension.
- Refer to the service specific steps for testing your extension.
Step 4: Validate an extension
- Check if the guidelines specified in the plugin-manifest.json file are met.
-
Execute the following command in the terminal.
zet validate
- Repeat the command, after making necessary changes, until validation proves successful.
Step 5: Pack an extension
- This command compresses the files and folders essential for running the extension and gives a .zip file as the output.
Execute the following command in the terminal.
zet pack
-
The file will be present inside the path "/{extension's directory}/dist".
Sample file path "/myfirstextension/dist".
Step 6: Build your extension in Sigma
- Click Create Extension .
- Enter an extension name.
- Pick a Zoho service for which you’re building the extension.
- Toggle the Upload Existing File option and attach the zip file that you just created.
- Take a look at the terms and conditions and then click Save as Draft .
HTTPS support for localhost server using SSL certificates
What are SSL certificates
Websites use two types of SSL certificates:
1. Certificates signed by a Trusted Certificate Authority (CA)
2. Self-signed certificates
While a Trusted CA issues SSL certificates to verify the identity of websites we can also create self-signed certificates that offer basic encryption from the websites.
The release of Google Chrome 80 mandates all the webpages to be hosted in HTTPS. To implement this, Sigma provides a default SSL certificate to serve over HTTPS. However, if you would like to create your own SSL certificate, please follow the steps suggested in the next section and generate the self-signed certificate.
Note: You must be logged in to CLI with Developer Mode to generate the self-signed certificate.
How to create an SSL certificate
To generate a self-signed certificate, run the following command in your shell,
Once the command is complete, you will receive the following files:
- cert.perm (the certificate)
- key.perm (the private key)
Place these files in the directory where your app folders are present.
- Navigate to ‘./server/index.js’.
- Replace the values of the options variable with the path of the perm files as follows:
With this, your SSL connection is complete. To start your https server follow the below steps:
- Run the command zet run on your terminal. You will receive a https URL.
- Copy and paste this URL in your browser.
You will now be able to view the created SSL certificate in your browser.