--- title: "Initialize the Project" url: https://docs.catalyst.zoho.com/en/tutorials/hosted-login-app/java/init-project/ description: "Create a simple Basic or React application using the features of Catalyst Hosted Authentication that provides user sign-up, application login, password reset, and implements sign-in using prevalent federated identity providers." last_updated: 2026-08-17T12:16:04Z service: All Services type: tutorial related_links: - name: "Initialize CLI Resources" url: /en/cli/v1/initialize-resources/introduction - name: "Project Directory Structure" url: /en/cli/v1/project-directory-structure/introduction --- # Initialize the Project from the CLI You can now begin working on your Catalyst project from the CLI. The first step is to initialize the project in an empty directory. This will be the home directory of your project and all of the project files will be saved in it. You can learn more about this from the [Project Directory Structure help page](https://docs.catalyst.zoho.com/en/cli/v1/project-directory-structure/introduction/). You can learn about initializing a project in detail from the [CLI help documentation](https://docs.catalyst.zoho.com/en/cli/v1/initialize-resources/introduction). For this application, we will initialize a [Basic I/O function](https://docs.catalyst.zoho.com/en/serverless/help/functions/basic-io/), which will contain the logic for [Custom User Validation](https://docs.catalyst.zoho.com/en/cloud-scale/help/authentication/whitelisting/custom-user-validation/introduction/) and a [Basic web app](https://docs.catalyst.zoho.com/en/cli/v1/initialize-resources/initialize-client/#basic-client-applications) as the client component. > **Note:** Ensure that you enter the function's package name or class name exactly as instructed, because the application's code contains the same name. 1. Create a folder for the project on your local machine and navigate to it from the terminal. 2. Initialize a project by executing the following command from that directory: ```sh catalyst init ``` 3. Navigate using the **arrow keys**, select your preferred portal, and press the **Enter** key. If you have no other organizations associated with the account, then the default one will be selected automatically. ![catalyst_authorization_portal_multiorg_choice](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authorization_portal_multiorg_choice.webp) > **Note:** You can find out more about Catalyst’s multi-org portal feature from this [help document](https://docs.catalyst.zoho.com/en/getting-started/catalyst-projects/#access-the-multi-org-portal). 4. The CLI will now ask you to associate a Catalyst project with the directory. Associate it with the project that we created earlier from the console. Select **Authorization Portal** from the list and press **Enter**. ![catalyst_authentication_hosted_project_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_project_select.webp) 5. Navigate using the arrow keys and select **Functions**, **Client** using the space bar. Press **Enter** to initialize. ![catalyst_authentication_hosted_func_client_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_func_client_select.webp) 6. The CLI will initiate the function setup. Select **Basic IO** as the function type for your *Custom User Validation* function. ![catalyst_authentication_hosted_func_type_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_func_type_select.webp) 7. Select the latest runtime of *Java* as the function stack. ![catalyst_authentication_hosted_func_java_runtime_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_func_java_runtime_select.webp) 8. Enter "`authorized_portal_app`" as the package name, "`Custom_User_Validation_Java`" as the function name, then press **Enter**. Alternatively, you can press **Enter** without entering inputs to fill in the default values. The CLI will prompt the initialization of the Java dependencies. ![catalyst_authentication_hosted_java_func_setup_complete](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_java_func_setup_complete.webp) The CLI will now initiate the client setup. **Basic web app** 9. Select **Basic web app** and press **Enter** to initialize your client as a [basic web app](https://docs.catalyst.zoho.com/en/cli/v1/initialize-resources/initialize-client/#basic-client-applications). ![catalyst_authentication_hosted_client_type_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_type_select.webp) 10. Enter a name for your client package and press **Enter**. For the purposes of this tutorial, we are naming our client package "`ZylkerTechnologies`". You can use the same of provide a name of your choice. ![catalyst_authentication_hosted_client_choice_complete](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_choice_complete.webp) The Catalyst initialization is now complete. The project directory is now set up with the client directory and the functions directory along with configuration files and dependencies. The project directory also contains the [`catalyst.json`](https://docs.catalyst.zoho.com/en/cli/v1/project-directory-structure/catalyst-json/) configuration file and a hidden `.catalystrc` file. The structure of your project directory should now appear as shown below: ![catalyst_hosted_login_java_basic_directory](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_hosted_login_java_basic_directory.webp) **React web app** 9. Select **React web app** and press **Enter** to initialize your client as a [React web app](https://docs.catalyst.zoho.com/en/cli/v1/initialize-resources/initialize-client/#react-applications). ![catalyst_authentication_hosted_client_react_type_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_react_type_select.webp) 10. Select **JavaScript** as the React app type and press **Enter** ![catalyst_authentication_hosted_client_react_type_javascript_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_react_type_javascript_select.webp) 11. Enter "`zylkertechnologies`" as the name of your client package and click **Enter**. You can also provide any name of your choice. All of the required React packages, such as “`react`,” “`react-dom`,” and “`react-scripts`” will be installed through the Catalyst React plugin ([`zcatalyst-cli-plugin-react`](https://www.npmjs.com/package/zcatalyst-cli-plugin-react)). ![catalyst_authentication_hosted_client_react_type_initing](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_react_type_initing.webp) The client is now successfully initialized as a React web application. ![catalyst_authentication_hosted_client_react_type_init_complete](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_react_type_init_complete.webp) The [client directory](https://docs.catalyst.zoho.com/en/cli/v1/project-directory-structure/client-directory) will be created in the standard structure in the project directory. This is the structure of the *Authorization Portal* project’s directory if the client is initialized as a React app. ![catalyst_hosted_login_java_react_directory](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_hosted_login_java_react_directory.webp) Catalyst initialization is now complete. **Angular web app** 9. Select **Angular web app** and press **Enter** to initialize your client as a [Angular web app](https://docs.catalyst.zoho.com/en/cli/v1/initialize-resources/initialize-client/#angular-applications). ![catalyst_authentication_hosted_client_angular_type_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_angular_type_select.webp) 10. Name your Angular app "`ZylkerTechnologies`", and press the **Enter** key. Since this application does not require Angular Routing, enter "`N`" at the prompt. Finally, choose `CSS` as your stylesheet format and press the **Enter** key. ![catalyst_authentication_hosted_client_angular_type_init](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_angular_type_init.webp) Catalyst will initialize the client using the **Catalyst Angular plugin** ([`zcatalyst-cli-plugin-angular`](https://npm.io/package/zcatalyst-cli-plugin-angular)). ![catalyst_authentication_hosted_client_angular_type_init_complete](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_angular_type_init_complete.webp) The client is now successfully initialized as an Angular web application. The project directory is now set up with the client directory and the functions directory along with configuration files and dependencies. The project directory also contains the [`catalyst.json`](https://docs.catalyst.zoho.com/en/cli/v1/project-directory-structure/catalyst-json/) configuration file and a hidden `.catalystrc` file. The structure of your project directory should now appear as shown below: ![catalyst_authentication_hosted_java_client_angular_type_first_directory](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_java_client_angular_type_first_directory.webp)