--- title: "Using Catalyst Tools" url: https://docs.catalyst.zoho.com/en/catalyst-extensions/vs-code-extension/implementation/ description: "Catalyst Tools is a Catalyst extension that can be installed in your Visual Studio Code IDE. The extension will allow you to execute CLI commands and operations without using the Catalyst CLI terminal." last_updated: 2026-08-28T06:26:16Z service: All Services type: general --- # Using Catalyst Tools This help section will cover utilizing the **Catalyst Tools** extension to its fullest potential and performing various operations on your project within the VS Code environment. ### Install Catalyst Tools To install the extension: 1. Click the VS Code extension icon and search for "**Catalyst Tools**". ![catalyst_extensions_vscode_extension_search](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extensions_vscode_extension_search.webp) 2. Click **Install**. ![catalyst_extension_install section](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_install_section.webp) > **Note:** * Ensure you are currently using VS Code version `v 1.74.0` or above. * Go through the description and features listed, to get a better understanding of the extension. The Catalyst Tools extension can now be accessed by clicking the Catalyst icon in the sidebar, or at the footer of the IDE. ![catalyst_extensions_vscode_extension_catalyst_highlit](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extensions_vscode_extension_catalyst_highlit.webp) ### Log In to Catalyst To begin using the **Catalyst Tools** extension, you will first need to log in to your Catalyst account. You can refer to the [CLI Login help](https://docs.catalyst.zoho.com/en/cli/v1/login/login-from-cli/) page for details about various steps. Log in to your Catalyst account from the VS Code IDE in the following way: 1. Click the **Login** button shown in the *CATALYST CONFIGS* section in the left-panel. ![catalyst_extensions_vscode_extension_catalyst_login_button](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extensions_vscode_extension_catalyst_login_button.webp) 2. Choose the [DC to log in](https://docs.catalyst.zoho.com/en/api/introduction/multi-dc-support/#Multi-DCSupport) to. ![catalyst_extension_dc_select](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_dc_select.webp) 3. You will be redirected to a permission page in your default browser. ![catalyst_extension_perm_page](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_perm_page.webp) 4. Click **Accept**, to complete logging in to your Catalyst account and connecting the IDE to the Catalyst console. ![catalyst_extension_perm_accept](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_perm_accept.webp) 5. You will be logged in. ![catalyst_extension_perm_logged_in](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_perm_logged_in.webp) Close the window and continue using the **Catalyst Tools** extension in VS Code. ### Initialize Your Catalyst Project Before you initialize a project in this extension: * Ensure you have created a project in the Catalyst Console. You can find out how to from this [help section](https://docs.catalyst.zoho.com/en/getting-started/catalyst-projects/). * Create a local directory to initialize your Catalyst project in using **Catalyst Tools** from VS Code. You can refer to the [CLI Initialize Resources help](https://docs.catalyst.zoho.com/en/cli/v1/initialize-resources/introduction/) document for a more detailed explanation on initializing Catalyst project resources, including functions of different stacks and types, in your local environment. To initialize a project in the **Catalyst Tools** extension: 1. Click **Initialize**. ![catalyst_extensions_vscode_extension_preinit](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extensions_vscode_extension_preinit.webp) 2. All Catalyst projects from your remote account will be listed here. Choose your required project to initialize within VS Code. ![catalyst_extension_select_project](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_select_project.webp) 3. Select the components you would like to initialize, then click the **check icon**. You can initialize *Functions* and *Client*. ![catalyst_extension_client_func_init](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_func_init.webp) 4. **Function Setup** - Select the required function type. You can refer to the [Functions help page](https://docs.catalyst.zoho.com/en/serverless/help/functions/introduction/) for details about each type. ![catalyst_extension_add_func](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_add_func.webp) - Select your preferred [programming language](https://docs.catalyst.zoho.com/en/serverless/help/functions/stack/) as [Java](https://docs.catalyst.zoho.com/en/sdk/java/v1/overview/), or [Node.js](https://docs.catalyst.zoho.com/en/sdk/nodejs/v2/overview/). ![catalyst_extension_func_type](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_func_type.webp) - Enter the required details and submit them by clicking **Enter**. ![catalyst_extension_func_name](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_func_name.webp) - Enter an email address for the author or click **Enter** to use the same email address you used to create your Catalyst account. ![catalyst_extension_email](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_email.webp) - Click **Yes**, if you wish to install the required dependencies. ![catalyst_extension_func_dependencies](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_func_dependencies.webp) The function setup is complete. > **Note:** You can also simply press **Enter** and the default values will be provided. The initialized Advanced I/O function will now be available in the *HTTP FUNCTIONS* section. ![catalyst_extension_func_init_complete](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_func_init_complete.webp) You can find more information on each function stack's initialization steps in this [help page](https://docs.catalyst.zoho.com/en/cli/v1/initialize-resources/initialize-functions/). 5. **Client Setup** - Select the client to be initialized as [Basic](https://docs.catalyst.zoho.com/en/cli/v1/initialize-resources/initialize-client/#basic-client-applications), [Angular](https://docs.catalyst.zoho.com/en/cli/v1/initialize-resources/initialize-client/#angular-applications), or [React](https://docs.catalyst.zoho.com/en/cli/v1/initialize-resources/initialize-client/#react-applications) web client. ![catalyst_extension_client_type](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_type.webp) - Enter the client name, then click the **submission icon**. ![catalyst_extension_client_name](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_name.webp) The project directory will contain the client and function directory in the standard structure. You can refer to the [project directory structure help page](https://docs.catalyst.zoho.com/en/cli/v1/project-directory-structure/introduction/) for details on the configuration files and dependencies that are installed. The project and its resources are now successfully initialized in the VS Code IDE using the **Catalyst Tools** extension. ![catalyst_extension_init_complete](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_init_complete.webp) ### Manage Your Project The *CATALYST CONFIGS* section can be used to perform various operations in your project and manage it. You can perform the following operations: * **Add Functions**: Add a new HTTP or non-HTTP function to your project directory. * **Client Setup**: Set up the client component in your project directory. * **Serve**: Serve both the function and client resources of the project through a localhost using your default 3000 port. * **Deploy**: Deploy the entire local project to the console. * **Project**: View project information and alter configurations using the extension's built-in management console. > **Note:** You can find out more about the extension's management console from this help section. #### Add Functions You can add additional functions of any type or stack to your project directory through this option, or add your first function to the project if you did not initialize functions during project initialization. Refer to [Working with Functions](https://docs.catalyst.zoho.com/en/cli/v1/working-with-functions/introduction/) help page for details. To add HTTP or non-HTTP function to your project, click the **Add Functions** option to begin function setup. ![catalyst_extension_add_new_func](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_add_new_func.webp) Follow the same steps mentioned in the *Function Setup* section of this [help page](https://docs.catalyst.zoho.com/en/catalyst-extensions/vs-code-extension/implementation/#initialize-your-catalyst-project/). ![catalyst_extension_add_non_http_func](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_add_non_http_func.webp) For the purpose of this help document, we have created an [Event function](https://docs.catalyst.zoho.com/en/serverless/help/functions/event-functions/), and it will be listed in the *NON HTTP Functions* section of the IDE. The function will be created in the standard [function directory structure](https://docs.catalyst.zoho.com/en/cli/v1/project-directory-structure/functions-directory/). #### Client Setup You can set up the client component in your project directory through this option if you did not initialize client during project initialization. Refer to [Working with the Client](https://docs.catalyst.zoho.com/en/cli/v1/working-with-the-client/introduction/) help page for details. To initialize a client component, click the **Client Setup** option to begin client setup. ![catalyst_extension_add_client_new](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_add_client_new.webp) > **Note:** If you already have a client component, then you will be prompted to confirm if you wish to create a new client component by overwriting the existing one. Follow the steps listed in the *Client Setup* section present in this [help page](https://docs.catalyst.zoho.com/en/catalyst-extensions/vs-code-extension/implementation/#initialize-your-catalyst-project/). ![catalyst_extension_client_react_done](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_react_done.webp) For this help document, we have created a new client component as a **React web app** and it will be created in its [standard structure](https://docs.catalyst.zoho.com/en/cli/v1/initialize-resources/initialize-client/#react-applications). #### Serve You can serve [Basic I/O](https://docs.catalyst.zoho.com/en/serverless/help/functions/basic-io/) and [Advanced I/O](https://docs.catalyst.zoho.com/en/serverless/help/functions/advanced-io/) functions, and the client component of all types through a localhost using the default port: `3000`, to test them before deploying them to the remote project. Refer to the [Serve Resources](https://docs.catalyst.zoho.com/en/cli/v1/serve-resources/serve-all-resources/) help page for details. To [serve all the project's resources](https://docs.catalyst.zoho.com/en/cli/v1/serve-resources/serve-all-resources/) locally: 1. Click the **Serve** button. ![catalyst_extension_serve_button_highlit](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_serve_button_highlit.webp) 2. Choose your preferred option: ![catalyst_extension_serve_resources_choice](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_serve_resources_choice.webp) - Click **Yes** to serve all the function and client components. ![catalyst_extension_serve_resources_yes](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_serve_resources_yes.webp) - Click **No** to choose the specific components you wish to serve locally. ![catalyst_extension_serve_choices](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_serve_choices.webp) The selected components will be served locally. You can use the URL generated in your preferred browser to test the components' functionality. ![catalyst_extension_serving](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_serving.webp) - You can kill the serve process, by clicking the **stop icon**. ![catalyst_extension_kill_process](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_kill_process.webp) #### Deploy You can deploy all the functions and the client that you initialized in the extension to the remote console. This will make them available in the development environment of your project. Refer to the [Deploy Resources](https://docs.catalyst.zoho.com/en/cli/v1/deploy-resources/introduction/) help page for details about the deployment process of each project resource. To deploy the project to the Catalyst console: 1. Click the **Deploy** button. ![catalyst_extension_deploy](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_deploy.webp) 2. Choose your preferred option: ![catalyst_extension_deploy_choices](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_deploy_choices.webp) - Click **Yes** to deploy all the components. ![catalyst_extension_deploy_done](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_deploy_done.webp) - Click **No** to choose the specific components you wish to deploy. Click the components you wish to deploy, then click the **submission icon**. ![catalyst_extension_deploy_slect_components](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_deploy_slect_components.webp) The selected resources will be deployed and the extension will display the endpoint URLs of the functions and the client that you can access. ![catalyst_extension_deploy_slected_deployed](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_deploy_slected_deployed.webp) ### Serve & Deploy From Within catalyst.json The [`catalyst.json`](https://docs.catalyst.zoho.com/en/cli/v1/project-directory-structure/catalyst-json/) file contains the component list and configuration of the entire project. Using **Catalyst Tools** you have the option to serve and deploy your entire project or selective resources from within the `catalyst.json` file. ![catalyst_extension_catalyst_json_file_serve_deploy](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_catalyst_json_file_serve_deploy.webp) To serve or deploy your project resources, you can click the **Serve** and **Deploy** button present next to each project resource, and then follow the same [serve](https://docs.catalyst.zoho.com/en/catalyst-extensions/vs-code-extension/implementation/#serve) and [deploy](https://docs.catalyst.zoho.com/en/catalyst-extensions/vs-code-extension/implementation/#deploy) steps instructed above. ### Functions In this section we will go over all the operations that can be performed in the *HTTP FUNCTIONS* and *NON HTTP FUNCTIONS* section of the **Catalyst Tools** extension. * **Run/Debug**: Serve the function locally and test its functionality. It also syncs with the IDE's debugger, and allows you to debug your code in an easy manner. * **Deploy**: Deploy function components alone to the Catalyst console. * **Delete**: Delete a function from your local project permanently. #### Run or Debug a Function This section will cover the steps to use the run/debug feature of the extension effectively. **HTTP FUNCTIONS** HTTP functions include [Basic I/O](https://docs.catalyst.zoho.com/en/serverless/help/functions/basic-io/) and [Advanced I/O](https://docs.catalyst.zoho.com/en/serverless/help/functions/advanced-io/) functions as they can contain HTTP requests and response functionalities. All Basic I/O and Advanced I/O functions present in your project can be accessed here. Follow the steps below to test HTTP functions locally and debug them: 1. Click the function you would like to work with from the functions list present in the *HTTP FUNCTIONS* section. ![catalyst_extension_func_select_choice](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_func_select_choice.webp) 2. Click the **Run/Debug** option to serve the function locally. ![catalyst_extension_debug_select](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_debug_select.webp) The [Function URL](https://docs.catalyst.zoho.com/en/serverless/help/functions/implementation/#create-a-function) through a localhost will be generated in the *Catalyst Serve Terminal* in VS Code. You can click to begin testing its functionality. 3. You can click the function local URL and it will be opened in your default browser. The IDE will also redirect you to the Debugging section. > **Note:** Refer to the [Extension Settings](https://docs.catalyst.zoho.com/en/catalyst-extensions/vs-code-extension/extension-settings/#enable-or-disable-ides-debugging-section) help section, to find out how to run the function without opening the IDE's debugging section. 4. If required, you can simultaneously change or edit the code and view the changes live. ![catalyst_extension_debug_console](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_debug_console.webp) **NON HTTP FUNCTIONS** [Cron functions](https://docs.catalyst.zoho.com/en/serverless/help/functions/cron-functions/), [Event functions](https://docs.catalyst.zoho.com/en/serverless/help/functions/event-functions/), and [Integration functions](https://docs.catalyst.zoho.com/en/serverless/help/functions/integration-functions/) present in your project can be accessed here. To Run/Debug these function types, you will need to create a JSON file named `catalyst-inputs.json`. This file will contain your test inputs as a JSON value, and you will need to store this file in the respective function's directory. > **Note:** * The `catalyst-inputs.json` is exclusive to the **Catalyst Tools** VS Code extension for the purpose of testing non-HTTP functions. * Cliq Integration Functions is currently not available to Catalyst users accessing from the EU, AU, IN, or CA data centers. ConvoKraft Integration Functions are available to users accessing from all DCs. For this help document, we are going to Run/Debug an event function named `shipment-submit`. To **Run/Debug** this non HTTP function, we will first create a `catalyst-inputs.json` in the `shipment-submit` function directory. > **Note:** Non-HTTP functions cannot be served through this extension if a `catalyst-inputs.json` file is not present in its directory. A sample JSON code to be added in the `catalyst-inputs.json` file for the `shipment-submit` event function is given below: ```json { "cache_put": { "project_details": { "id": "1434000000473001", "project_name": "ShipmentTracking" }, "event_bus_details": { "name": "Default", "id": "1434000000473009" }, "data": { "cache_name": "3b793", "cache_value": "0b3c97a93a", "project_details": { "id": "1434000000473001", "project_name": "Tunneling" }, "segment_details": { "segment_name": "Default", "project_details": { "project_name": "Tunneling", "id": "1434000000473001", "project_type": "Live" }, "id": "1434000000473037" }, "expiry_in_hours": 48, "expires_in": "Apr 28, 2023 03:13 PM" }, "current_project": { "id": "1434000000473001", "project_name": "Tunneling" }, "action": "Put", "source_entity_id": "1434000000473037", "source": "Cache", "event_time": 1682502183500 }, "datastore_insert": { "project_details": { "id": "1434000000473001", "project_name": "Tunneling" }, "event_bus_details": { "name": "Default", "id": "1434000000473009" }, "data": [ { "ROWID": "345460658792283", "CREATORID": "979726486268217", "CREATEDTIME": "2023-04-26 15:14:06", "MODIFIEDTIME": "2023-04-26 15:14:06" } ], "current_project": { "id": "1434000000473001", "project_name": "Tunneling" }, "action": "Insert", "source_entity_id": "817140351651431", "source": "Datastore", "event_time": 1682502245961 } } ``` This input file passes sample event data from a Cache PUT and a Data Store INSERT operations occurring in the Default Signals event bus. The event data is passed to the `shipment-submit` function. > **Note:** * This sample JSON file contains two key values: `cache_put` and `datastore_insert`. You can customize the event source and modify the name of these keys accordingly. However, Catalyst follows a specific format for the event data that is passed for each entity or operation. The keys and values must stick to the standard event data format for the operation that you provide. * You can access sample event data to include in the `catalyst-inputs.json` file for any supported operation by [generating sample event payload](https://docs.catalyst.zoho.com/en/cli/v1/event-generate/introduction/) from the Catalyst CLI. The `shipment-submit` function directory will include the following files: ![catalyst_extension_sample_payload_dir](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_sample_payload_dir.webp) Now, follow the steps below to [test your function locally](https://docs.catalyst.zoho.com/en/cli/v1/working-with-functions/functions-shell/) and debug it, if necessary: 1. Click the function you would like to work with from the function list present in the *NON HTTP FUNCTIONS* section. ![catalyst_extension_non_http_select](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_non_http_select.webp) 2. Click the **Run/Debug** option to serve the function locally. ![catalyst_extension_run_debug_non_select](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_run_debug_non_select.webp) 3. Click the input key you would like to serve your function with. ![catalyst_extension_run_debug_non_input_key](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_run_debug_non_input_key.webp) 4. A Catalyst Serve Terminal will be opened in VS Code. You will be able to view that the function is served in a web socket. You can test the function. You will also be able to access the IDE's debugger. ![catalyst_extension_run_debug_non_running](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_run_debug_non_running.webp) 5. You can make changes in your function's code, if required, and they will be reflected during the serve process. ![catalyst_extension_run_debug_non_debugging](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_run_debug_non_debugging.webp) You can also kill the Catalyst Serve Terminal by clicking the **delete icon** in the IDE console below. ![catalyst_extension_run_debug_non_kill](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_run_debug_non_kill.webp) > **Note:** The Catalyst Serve Terminal will continue to be available and present in the background till you close it. For the above example, we had used an [Event Function](https://docs.catalyst.zoho.com/en/serverless/help/functions/event-functions/) as an example, the `catalyst-inputs.json` file containing an example payload for testing [Cron](https://docs.catalyst.zoho.com/en/serverless/help/functions/cron-functions/) and [Integration functions](https://docs.catalyst.zoho.com/en/serverless/help/functions/integration-functions/) is given below: **`catalyst-inputs.json` example file for a Cron function**: ```json { "cron_input": { "param": "value" } } ``` **`catalyst-inputs.json` example file for an Integration function**: ```json { "bot_welcome": { "name": "Sample", "unique_name": "sample_uniq", "handler": { "type": "welcome_handler" }, "response_url": "https://cliq.zoho.com/v2/extensions/2980/responses/17202823900615741410013820", "type": "bot", "timestamp": 1569520690703, "params": { "environment": { "data_center": "us" }, "access": { "user_id": "651652091", "user_agent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10.14; rv:69.0) Gecko/20100101 Firefox/69.0", "chat_id": "CT_2243226337559778047_661211447-B2" }, "user": { "country": "us", "timezone": "Asia/calcutta", "last_name": "Fisher", "first_name": "Scott", "language": "en", "id": "123456", "email": "scott.fisher@zylcal.com", "admin": true, "organization_id": "123456456" }, "newuser": true, "mentions": [], "options": {}, "selections": [], "arguments": "" } } } ``` #### Deploy a Function To [deploy a function](https://docs.catalyst.zoho.com/en/cli/v1/deploy-resources/deploy-functions/) to the Catalyst console, follow the steps below: 1. Click the function you would like to deploy from the function list present in the *HTTP FUNCTIONS* or *NON HTTP FUNCTIONS* section, then click **Deploy**. ![catalyst_extension_deploy_func_alone](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_deploy_func_alone.webp) 2. Click **Yes**, to confirm. ![catalyst_extension_deploy_func_alone_confirm](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_deploy_func_alone_confirm.webp) The function will be deployed to the console, and a deployment URL will be generated in the Catalyst Deploy Terminal in VS Code IDE for the function. ![catalyst_extension_deploy_func_alone_deployed](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_deploy_func_alone_deployed.webp) The function can now be accessed from the console from the [Functions](https://docs.catalyst.zoho.com/en/serverless/help/functions/implementation/#create-a-function) component present under [Catalyst Serverless](https://docs.catalyst.zoho.com/en/serverless/getting-started/introduction/). ![catalyst_extension_deploy_func_alone_in_console](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_deploy_func_alone_in_console.webp) #### Delete a Function To [delete a function](https://docs.catalyst.zoho.com/en/serverless/help/functions/implementation/#delete-a-function) from your local project using **Catalyst Tools**, follow the steps below: 1. Click the function you would like to delete from the function list present in the *HTTP FUNCTIONS* or *NON HTTP FUNCTIONS* section, then click **Delete**. ![catalyst_extension_delete_func](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_delete_func.webp) 2. Click **Yes** to proceed. ![catalyst_extension_delete_fuc_confirm](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_delete_fuc_confirm.webp) The function and all the files present in the function directory will be deleted from your local project. ![catalyst_extension_func_deleted](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_func_deleted.webp) > **Note:** For non-HTTP functions, the `catalyst-inputs.json` file will also be deleted as it is present in function directory. ### Client In the *Client* section of the **Catalyst Tools** extension, you can perform the following operations on the client components: * **Serve** your client resources alone and test their functionality. * **Deploy** your client resources alone to the Catalyst console. * **Delete** the client component from your local project. #### Serve Operation To [serve the client](https://docs.catalyst.zoho.com/en/cli/v1/serve-resources/serve-all-resources/) components alone using the **Catalyst Tools** extension through a localhost:3000, perform the following steps: 1. Navigate to the *CLIENT* section of the extension, then click **Serve**. ![catalyst_extension_client_alone_serve](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_alone_serve.webp) The client component will be served locally, and a local endpoint URL for your client component will be generated in the Catalyst Serve terminal. Clicking the URL will let you access the web client in your default web browser. ![catalyst_extension_client_alone_serve_terminal](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_alone_serve_terminal.webp) 2. You can kill the serve process by clicking the stop icon button. ![catalyst_extension_client_alone_kill_serve](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_alone_kill_serve.webp) You can also kill the Catalyst Serve Terminal by clicking the delete icon in the IDE console below. > **Note:** The Catalyst Serve Terminal will continue to be available and present in the background till you delete it. #### Deploy Operation To [deploy the client](https://docs.catalyst.zoho.com/en/cli/v1/deploy-resources/deploy-client/) component alone to the Catalyst console using the **Catalyst Tools** extension, perform the following steps: 1. Navigate to the *CLIENT* section of the extension, then click **Deploy**. ![catalyst_extension_client_alone_deploy](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_alone_deploy.webp) 2. Click **Yes** to proceed with the deploy operation. ![catalyst_extension_client_alone_deploy_confirm](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_alone_deploy_confirm.webp) The client component will be deployed, and a deployment URL for your client component will be generated in the Catalyst Deploy terminal within VS Code. Clicking the URL will let you access the client in your default web browser. ![catalyst_extension_client_alone_deployed](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_alone_deployed.webp) You can also kill the Catalyst Deploy Terminal by clicking the **delete icon** in the IDE console below. > **Note:** The Catalyst Deploy Terminal will continue to be available and present in the background until you delete it. #### Delete Operation To [delete the client](https://docs.catalyst.zoho.com/en/cli/v1/working-with-the-client/delete-client/) component from your local project using **Catalyst Tools**, follow the steps below: 1. Navigate to the *CLIENT* section, then click **Delete**. ![catalyst_extension_client_alone_delete](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_alone_delete.webp) 2. Click **Yes** to proceed. ![catalyst_extension_client_alone_delete_confirm](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_alone_delete_confirm.webp) The client component will be deleted from your local project. ![catalyst_extension_client_alone_deleted](https://catalyst-docs-development.zohostratus.in/images/catalyst-extension/catalyst_extension_client_alone_deleted.webp)