# Web Client Hosting -------------------------------------------------------------------------------- title: "Introduction" description: "Catalyst enables you to easily and securely host web clients of apps built on any front-end framework, and manage web app versioning." last_updated: "2026-03-18T07:41:08.534Z" source: "https://docs.catalyst.zoho.com/en/cloud-scale/help/web-client-hosting/introduction/" service: "Cloud Scale" -------------------------------------------------------------------------------- # Web Client Hosting ## Introduction Web Client Hosting is a Catalyst Cloud Scale component that enables you to host the client part of the web-based applications you build directly from the Catalyst platform. Catalyst provides a feature-rich Web SDK that includes JavaScript classes and methods to help you integrate various Catalyst components into your web client application. The entire hosting and delivery process is powered by Catalyst, ensuring your web applications are served reliably and efficiently. You can refer to the {{%link href="/en/sdk/web/v4/overview/" %}}Web SDK documentation{{%/link%}} for more information. Catalyst provides a reliable, secure, and cost-effective cloud-based production platform, along with scalable resources, to host your applications. Our servers accommodate the fluctuating needs of your application, and they handle all backend jobs. You can host your web client application easily and manage its versioning, like updating to a newer version or rolling back to an older version, from the console. Catalyst enables you to host and manage {{%bold%}}one web application for each project{{%/bold%}}. {{%note%}}{{%bold%}}Note:{{%/bold%}} Web client hosting is suitable for basic and simple web applications. You can explore our robust frontend development service, {{%bold%}}{{%link href="/en/slate/" %}}Slate{{%/link%}}{{%/bold%}}, that lets you seamlessly deploy web applications in a variety of popular JavaScript frameworks like Next.js, Angular, React, Vue, and more. Slate also provides automated deployments from GitHub, GitLab, or Bitbucket, and offers a host of other advanced features. {{%/note%}} You can host your web application only in the {{%link href="/en/deployment-and-billing/environments/development-environment/" %}}Development environment{{%/link%}} of your Catalyst project. You will not be able to host it directly in Production. You must {{%link href="/en/deployment-and-billing/environments/production-environment" %}}deploy your Catalyst project to the Production environment{{%/link%}} to make it available there. You can then distribute the application to the end-users. Therefore, when you update the version of your application in Catalyst, it will not affect the app that is already live until you migrate the changes to production. Catalyst provides a {{%link href="/en/cloud-scale/help/web-client-hosting/key-concepts/#default-web-application-url" %}}default application URL{{%/link%}} for your web client in both the Development and Production environments, after you host it. You can access your application from that URL, or map your own domain to it using {{%link href="/en/cloud-scale/help/domain-mappings/introduction" %}}Domain Mappings{{%/link%}} and distribute that to the end-users. Catalyst also helps you easily incorporate {{%link href="/en/cloud-scale/help/push-notifications/introduction" %}}Push Notifications{{%/link%}} for your web applications, and send test notifications from the console. In general, you can deploy web clients in Catalyst in three different ways: * {{%bold%}}Deploy the web client from the Catalyst CLI:{{%/bold%}}<br /> You can deploy both the web client and function resources of a Catalyst project together as the entire application, or individually, using Catalyst CLI. Refer to the {{%link href="/en/cli/v1/deploy-resources/introduction/" %}}Deploy Resources help page{{%/link%}} for details. * {{%bold%}}Deploy the web client from a GitHub repository:{{%/bold%}}<br /> Catalyst enables you to integrate your GitHub account with your Catalyst account, and access your GitHub repositories in the Catalyst console. You can deploy a Git repo easily from the console. This will deploy the project files, such as the web client and the functions, to your Catalyst project in the console. Refer to the {{%link href="/en/devops/help/github-integration/introduction" %}}GitHub Integration help page{{%/link%}} for details. * {{%bold%}}Deploy the web client from the console:{{%/bold%}}<br /> You can deploy the web client from the _Web Client Hosting_ section in the Catalyst console. This documentation covers the concepts and procedures of this method alone. -------------------------------------------------------------------------------- title: "Key Concepts" description: "Catalyst enables you to easily and securely host web clients of apps built on any front-end framework, and manage web app versioning." last_updated: "2026-03-18T07:41:08.534Z" source: "https://docs.catalyst.zoho.com/en/cloud-scale/help/web-client-hosting/key-concepts/" service: "Cloud Scale" -------------------------------------------------------------------------------- # Key Concepts Before you host a web client application in Catalyst, make sure to upload the client resources in the right format. ### Sources File Format You must ensure that you upload the client resources of your web application in the right format to host it in Catalyst without any errors. To host a web client application in Catalyst, you need to upload the source files of the web application in the standard project directory structure. This is explained in detail in the {{%link href="/en/cli/v1/project-directory-structure/introduction/" %}}**Project Directory Structure help page**{{%/link%}}. Here's a quick look at the standard project directory structure in Catalyst: * The project directory fundamentally contains two folders: {{%badge%}}{{%bold%}}functions{{%/bold%}}{{%/badge%}} and {{%badge%}}{{%bold%}}client{{%/bold%}}{{%/badge%}}. You must upload the {{%badge%}}client{{%/badge%}} directory alone in _Web Client Hosting_. The {{%badge%}}client{{%/badge%}} directory should contain all the front-end client files of the application, such as the JavaScript, HTML, and CSS files. <br /> {{%note%}}{{%bold%}}{{%bold%}}Note:{{%/bold%}}{{%/bold%}} The {{%badge%}}{{%link href="/en/cli/v1/project-directory-structure/catalyst-json/" %}}catalyst.json{{%/link%}}{{%/badge%}} configuration file is not required when you host your web application from the Catalyst console in _Web Client Hosting_. It is only required to be present when you deploy your application files from the CLI or from a GitHub repository. {{%/note%}} * The {{%badge%}}client{{%/badge%}} directory must contain two files: an {{%badge%}}{{%bold%}}index.html{{%/bold%}}{{%/badge%}} file which is the homepage of your web app, and a {{%badge%}}{{%bold%}}client-package.json{{%/bold%}}{{%/badge%}} file that contains the configuration information of the client resources. All other front-end styling, scripting, or HTML files are optional, based on the requirements of your web app.<br /> {{%note%}}{{%bold%}}Note:{{%/bold%}} When you initialize the web client using the CLI, the CLI automatically creates the {{%badge%}}client-package.json{{%/badge%}} in its boilerplate structure. However, if you did not use the CLI to initialize your web client, and you deploy the client using the console directly, you must ensure that you create the {{%badge%}}client-package.json{{%/badge%}} file in the client directory manually and include the necessary code in it in the standard structure. You can refer to the help on {{%link href="/en/cli/v1/project-directory-structure/client-directory/" %}}client-package.json{{%/link%}} file structure.{{%/note%}} * You must provide the name of your web app in the {{%badge%}}client-package.json{{%/badge%}} file. This will be the final name of your application. Once you set a name for it and host the application, you must not change it. * In case you rename the {{%badge%}}index.html{{%/badge%}} file or you wish to use a different file as the home age of your web application, you must make the necessary changes in the {{%badge%}}client-package.json{{%/badge%}} file. Once you have followed all the guidelines mentioned above, you can host your web application from the Catalyst console. Any discrepancies from the standard directory structure could result in an error in hosting the application. ### Default Web Application URL You can obtain the default URL of your application from _Web Client Hosting_ or from the {{%link href="/en/deployment-and-billing/environments/development-environment/#function-url-and-web-app-url-in-the-development-environment" %}}Environments settings section{{%/link%}} in your console, after it is hosted. The default application URL is generated for the Development environment when you host your application. After you {{%link href="/en/deployment-and-billing/environments/production-environment" %}}deploy your application to Production{{%/link%}}, a Production URL is generated. The Development and Production URLs slightly differ in their formats. Both URLs contain the same: * {{%bold%}}Project Domain Name:{{%/bold%}} The unique domain name that is generated for your project when you host it in _Web Client Hosting_. Example: _shipmenttracking-57673975_. * {{%bold%}}Application Domain:{{%/bold%}} The domain for all the Catalyst applications you host, which is '{{%bold%}}catalystserverless.com{{%/bold%}}'. However, the Development application URL also contains the {{%bold%}}environment type{{%/bold%}}, and its value is {{%badge%}}development{{%/badge%}}. For example, '_https://shipmenttracking-57673975.{{%bold%}}development{{%/bold%}}.catalystserverless.com_'. The environment type is not specified in the Production URL. That is, the production URL will be '_https://shipmenttracking-57673975.{{%bold%}}development{{%/bold%}}.catalystserverless.com_'. As mentioned in the Introduction, you can also {{%link href="/en/cloud-scale/help/domain-mappings/introduction" %}}map your domain with Catalyst{{%/link%}} and use that URL instead. ### Application Versioning Application versioning can be handled easily in Catalyst. The {{%badge%}}{{%link href="/en/cli/v1/project-directory-structure/client-directory/" %}}client-package.json{{%/link%}}{{%/badge%}} configuration file contains the version information of your web client. The following guidelines must be followed while providing the version information in the {{%badge%}}client-package.json{{%/badge%}} file: 1. You must specify the version number of the application in the decimal format in the field {{%badge%}}version{{%/badge%}}. The {{%badge%}}version{{%/badge%}} is specified as '1.0.0' by default, when the JSON file is created. 2. With every subsequent update of your web app, you must modify the version number in the JSON file incrementally to indicate the next higher version. 3. You must not decrement the version number once the web app has been hosted. This will cause errors. 4. You must not retain the same version number, if you have modified the web app and you are deploying the changes to the Production environment. You must update the web app's version incrementally. 5. If you delete a version of your web app that is lower than the currently live version, you will not be able to replace that version, as you cannot deploy a decremental version. However, if you delete a version of your web app that is higher than the currently live version, you can deploy another instance of your web app with the same version number as the deleted version. The version information of your web app is displayed in the {{%link href="/en/cloud-scale/help/web-client-hosting/implementation/#update-a-web-application" %}}_App Version History_ section{{%/link%}} in _Web Client Hosting_. -------------------------------------------------------------------------------- title: "Benefits" description: "Catalyst enables you to easily and securely host web clients of apps built on any front-end framework, and manage web app versioning." last_updated: "2026-03-18T07:41:08.534Z" source: "https://docs.catalyst.zoho.com/en/cloud-scale/help/web-client-hosting/benefits/" service: "Cloud Scale" -------------------------------------------------------------------------------- ### Benefits 1. {{%bold%}}Fast Content Delivery{{%/bold%}}<br /> Catalyst's Content Delivery Network edge nodes span across the world. This ensures a fast delivery of content for the end-users in all geographical areas. Catalyst also ensures minimal latency, and serves both static and dynamic content with equal quality in performance. 2. {{%bold%}}Supportive of Multiple Kinds of Web Applications{{%/bold%}}<br /> Catalyst enables you to host a variety of web application types, such as both static and dynamic applications. You can structure and build your application, and use different content types ranging from HTML and CSS, to any framework or library of JavaScript, such as Angular, React, or Ember. 3. {{%bold%}}Secure Connection{{%/bold%}}<br /> Catalyst prioritizes the security of your web application, and ensures that the end-users have a safe and reliable experience using the web app. All applications hosted through Catalyst's domain contain an SSL security certificate by default. If you map your organization's own domain to your web app, Zoho will provide you a free mandatory Group SSL certificate for your domain. 4. {{%bold%}}Scalable and Accomodative{{%/bold%}}<br /> Catalyst provides efficient, scalable server resources. Based on the fluctuating needs of your application, Catalyst's servers are scaled up or down to accommodate the present load. It ensures a smooth consistency in your web app's performance and speed, irrespective of the number of active connections or API calls made to the server. 5. {{%bold%}}Easy and Quick Access{{%/bold%}}<br /> You can easily host your web app and deploy the resources of its client directory in a few simple steps from the Catalyst console. Once you deploy resources, your web app is made available on the server within seconds. You can test it thoroughly in the Development environment before deploying it to Production. <br /> -------------------------------------------------------------------------------- title: "Implementation" description: "Catalyst enables you to easily and securely host web clients of apps built on any front-end framework, and manage web app versioning." last_updated: "2026-03-18T07:41:08.534Z" source: "https://docs.catalyst.zoho.com/en/cloud-scale/help/web-client-hosting/implementation/" service: "Cloud Scale" -------------------------------------------------------------------------------- # Implementation The implementation section acts as a step-by-step procedure guide on hosting, updating, and rolling back a web application from the Catalyst console. ### Host a Web Application As mentioned {{%link href="/en/cloud-scale/help/web-client-hosting/key-concepts/#source-file-format" %}}earlier{{%/link%}}, the {{%badge%}}{{%link href="/en/cli/v1/project-directory-structure/client-directory/" %}}client-package.json{{%/link%}}{{%/badge%}} file contains all the configuration information of the web app. You must provide the name, description, version, and homepage information of your web app in it. You will not be required to provide this information again while hosting the web app from the console. To host the client files from the Catalyst console, you must upload them in _Web Client Hosting_ in a zip file format. You can name the zip file whatever you wish. This will automatically make the files available in your console. Once the client package is deployed, Catalyst will generate the web app URL for your application. {{%note%}}{{%bold%}}Note:{{%/bold%}} When Catalyst extracts the zip file, the {{%badge%}}client-package.json{{%/badge%}} file must be present in the root. Therefore, instead of compressing the client folder as a whole, you must navigate inside the client folder, select all the files in it and then compress them together. {{%/note%}} Let's host a web application in the _ShipmentTracking_ project. To host a web app from the Catalyst console: 1. Navigate to {{%bold%}}Web Client Hosting{{%/bold%}} under _Host and Manage_ in the Catalyst Cloud Scale console. 2. Click {{%bold%}}Upload{{%/bold%}} to upload the zip file of your web app.<br /> <br /> 3. Select the zip file to upload from your computer in the pop-up window, then click {{%bold%}}Upload{{%/bold%}}.<br /> Your web app will be hosted automatically and displayed in _Web Client Hosting_. When your application is successfully hosted, the default application URL will be automatically generated for it, and displayed here. You will now be able to access the application from this URL. ### Update a Web Application As discussed {{%link href="/en/cloud-scale/help/web-client-hosting/key-concepts/#application-versioning" %}}previously{{%/link%}}, you must provide your application's version information in the {{%badge%}}client-package.json{{%/badge%}} file before you update your application. You must follow all the guidelines of uploading a web application while uploading an updated version of it as well. All your version upgrades are displayed under _App Version History_, along with all the necessary details. To upload an updated version of a web app: 1. Click the ellipsis icon on the right-hand corner, then click {{%bold%}}Update{{%/bold%}}.<br /> 2. Select the zip file to upload from your computer in the pop-up window, then click {{%bold%}}Upload{{%/bold%}}.<br /> The updated version of your application will be hosted and the details will be displayed in this section. You can upload any number of updates of your application as required, but you will not be able to rename the application. ### Deploy an Older Version of a Web Application You can roll back to an older version of your application in the following way: 1. Select the required older version of the application using the checkbox, under the _App Version History_ section.<br /> 2. Click {{%bold%}}Confirm{{%/bold%}} in the pop-up window.<br /> The older version of your application will now be hosted. You can switch to any previously deployed version of the application in the same manner. ### Delete a Version of a Web Application You can delete any version of your application that is not currently hosted in the following way: 1. Click the delete icon for the version that you want to delete under _App Version History_.<br /> 2. Click {{%bold%}}Yes, Proceed{{%/bold%}} in the pop-up window.<br /> ### Download a Web Application You can download the current version of your web application that is hosted from _Web Client Hosting_ to your local system, in case you require it. This can be done by clicking the ellipsis icon on the right-hand corner, then clicking {{%bold%}}Download{{%/bold%}}. A zip file of the client package that you had uploaded while hosting the application will be downloaded to your system.