--- title: "Inicializar el cliente" url: https://docs.catalyst.zoho.com/es/tutorials/todo-list/java/initialize-client/ description: "Construya una aplicación web de lista de tareas básica, React o Angular con Catalyst Advanced I/O Function y Data Store para anotar y eliminar tareas." last_updated: 2026-11-04T10:10:44Z service: All Services type: tutorial related_links: - name: "Estructura de directorio del cliente" url: /es/cli/v1/project-directory-structure/client-directory - name: "Inicializar el cliente" url: /es/cli/v1/initialize-resources/initialize-client/ --- # Inicializar el cliente Ahora, inicialicemos el cliente. Puede inicializar el cliente en uno de los tres tipos compatibles con Catalyst: 1. **Basic web app**: La aplicación básica del cliente es una versión simple del cliente de Catalyst que se crea sin frameworks ni bibliotecas externas. 2. **Angular web app**: Puede elegir este tipo de cliente si prefiere crear la aplicación de lista de tareas usando el framework Angular. 3. **React web app**: Puede elegir este tipo de cliente si prefiere crear la aplicación de lista de tareas usando el framework React. > **Nota**: Catalyst proporciona soporte nativo de plugins para crear aplicaciones React y Angular. Estos plugins también gestionan varias operaciones relacionadas con la configuración, prueba y despliegue de sus aplicaciones. Dado que está inicializando el cliente después de que el proyecto ya ha sido inicializado, puede configurarlo de forma independiente ejecutando el siguiente comando desde el directorio de su proyecto: ```sh catalyst client:setup ``` Use las teclas de flecha y seleccione su preferencia presionando **Enter**. ![catalyst_todo_client_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_client_select.webp)
Según su elección, navegue a la sección correspondiente para los pasos de inicialización de la aplicación web: **Aplicación web básica** #### Inicializar el cliente como una aplicación web básica Si eligió **Basic web app** al configurar el cliente usando el comando de Catalyst `catalyst client:setup`, Catalyst inicializará el cliente de forma correspondiente. Ingrese "**ToDoApp**" como el nombre del paquete del cliente y presione **Enter**. ![catalyst_todo_basic_init_complete](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_basic_init_complete.webp) El cliente se ha inicializado correctamente como una aplicación web básica. El [directorio del cliente](https://docs.catalyst.zoho.com/es/cli/v1/project-directory-structure/client-directory) se creará en la estructura estándar en el directorio del proyecto. Esta es la estructura del directorio del proyecto ToDoList si el cliente se inicializa como una aplicación web básica. ![catalyst_todo_basic_java_directory](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_basic_java_directory.webp) **Aplicación web Angular** #### Inicializar el cliente como una aplicación web Angular Si eligió configurar el cliente como una aplicación Angular, Catalyst lo inicializará usando el **plugin Angular de Catalyst** ([`zcatalyst-cli-plugin-angular`](https://npm.io/package/zcatalyst-cli-plugin-angular)). 1. Nombre su aplicación Angular como "**app**", luego escriba "**Y**" y presione la tecla **Enter** para habilitar la función de autocompletado. Esto proporcionará autocompletado para sus comandos de terminal de Angular. ![catalyst_todo_angular_autocomplete](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_angular_autocomplete.webp) 2. Puede optar por compartir los datos de su aplicación con Angular ingresando "**Y**" o rechazarlo ingresando "**N**", luego presione **Enter**. Dado que la aplicación no requiere enrutamiento Angular, escriba "**N**" y presione **Enter**. ![catalyst_todo_angular_routing](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_angular_routing.webp) 3. Para esta aplicación usaremos la hoja de estilos CSS. Presione la tecla **Enter** después de elegir CSS. ![catalyst_todo_angular_stylesheet](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_angular_stylesheet.webp) 4. Ahora todos los archivos de la aplicación Angular requeridos, archivos de configuración y dependencias se instalarán a través del plugin Angular de Catalyst. ![catalyst_todo_angular_init](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_angular_init.webp) 5. El cliente se ha inicializado correctamente como una aplicación web Angular. ![catalyst_todo_angular_init_complete](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_angular_init_complete.webp) El [directorio del cliente](https://docs.catalyst.zoho.com/es/cli/v1/project-directory-structure/client-directory) se creará en la estructura estándar en el directorio del proyecto. Esta es la estructura del directorio del proyecto ToDoList si el cliente se inicializa como una aplicación Angular. ![catalyst_todo_angular_java_directory](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_angular_java_directory.webp) **Aplicación web React** #### Inicializar el cliente como una aplicación web React Si eligió configurar el cliente como una aplicación React, Catalyst inicializará la aplicación React usando el plugin React de Catalyst ([`zcatalyst-cli-plugin-react`](https://www.npmjs.com/package/zcatalyst-cli-plugin-react)). 1. A continuación, se le pedirá que elija el tipo de aplicación React. Elija "**JavaScript**" como el tipo para este tutorial. ![catalyst_todo_react_init_1](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_react_init_1.webp) 2. Nombre su aplicación React como "**app**" y presione **Enter**. Todos los paquetes React requeridos como `react`, `react-dom` y `react-scripts` se instalarán a través del plugin React de Catalyst. ![catalyst_todo_react_client_init](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_react_client_init.webp) El cliente se ha inicializado correctamente como una aplicación web React. ![catalyst_todo_react_init_complete](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_react_init_complete.webp) El [directorio del cliente](https://docs.catalyst.zoho.com/es/cli/v1/project-directory-structure/client-directory) se creará en la estructura estándar en el directorio del proyecto. Esta es la estructura del directorio del proyecto ToDoList si el cliente se inicializa como una aplicación React. ![catalyst_todo_react_client_java_directory](https://catalyst-docs-development.zohostratus.in/images/tutorials/todo-list/catalyst_todo_react_client_java_directory.webp)