---
title: "Introducción"
url: https://docs.catalyst.zoho.com/es/tutorials/task-manager/nodejs/introduction/
description: "Construya una aplicación React de gestión de tareas para crear y administrar tareas. Puede realizar operaciones CRUD y funcionalidad de filtrado sobre las tareas."
last_updated: 2026-08-17T12:16:04Z
service: All Services
type: tutorial
related_links:
  - name: "Estructura de directorio del proyecto"
    url: /es/cli/v1/project-directory-structure/introduction/
  - name: "Claves de tabla NoSQL"
    url: /es/cloud-scale/help/nosql/components/#table-keys
  - name: "NoSQL SDK"
    url: /es/sdk/nodejs/v2/cloud-scale/nosql/get-component-instance/
  - name: "NoSQL API"
    url: /es/api/code-reference/cloud-scale/nosql/insert-item/#InsertNewItem
---

# Task Manager App

### Introducción

Este tutorial le ayudará a construir una aplicación web React llamada **Task Manager**. La aplicación le permitirá realizar las siguientes funcionalidades:

* Crear una tarea
* Asignar estados a cada tarea que cree
* Filtrar tareas
* Actualizar las tareas creadas
* Eliminar tareas cuando ya no sean necesarias

El lado del cliente de la aplicación se verá de la siguiente manera:

![catalyst_tutorials_nosql_taskmanager_first_look](https://catalyst-docs-development.zohostratus.in/images/tutorials/task-manager/catalyst_tutorials_nosql_taskmanager_first_look.webp)

La lógica de esta aplicación está codificada empleando los siguientes servicios de Catalyst y sus respectivos componentes:

1. [Catalyst Serverless](https://docs.catalyst.zoho.com/es/serverless/):
    * [Advanced IO Function](https://docs.catalyst.zoho.com/es/serverless/help/functions/advanced-io/): Para codificar la lógica del backend de la aplicación en el entorno de Node.js.

2. [Catalyst CloudScale](https://docs.catalyst.zoho.com/es/cloud-scale/):
    * [NoSQL](https://docs.catalyst.zoho.com/es/cloud-scale/help/nosql/introduction/): Para almacenar datos no estructurados o semiestructurados donde los datos se pasan como JSON o arreglos JSON.
    * [Web Client Hosting](https://docs.catalyst.zoho.com/es/cloud-scale/help/web-client-hosting/introduction/): Para alojar el frontend de la aplicación como una aplicación web React.

Utilizará la [consola web de Catalyst](https://console.catalyst.zoho.com/) y la [Interfaz de Línea de Comandos](https://docs.catalyst.zoho.com/es/cli/v1/cli-command-reference/) (CLI) de Catalyst para construir la aplicación.

> **Nota:** Se le proporcionará el código de los archivos que deben incluirse en los componentes de función y cliente en este tutorial. Deberá copiar el código proporcionado y pegarlo en los archivos correspondientes según se indique.

### Conceptos destacados

Antes de profundizar en la aplicación, es importante que comprenda las siguientes claves de tabla NoSQL:

* **Partition Key**: Esta clave es un atributo obligatorio ya que define cómo y dónde se deben almacenar los datos en la tabla NoSQL distribuida.

* **Sort Key**: Esta clave es típicamente un atributo opcional que le ayudará a referirse a los datos requeridos que comparten la misma Partition Key.

Por ejemplo, si tiene una tabla NoSQL que contiene datos sobre frutas, entonces la *fruta* en sí será la **Partition Key**, mientras que su *variedad* específica será la **Sort Key**.

<table class="content-table">
	<thead>
		<tr>
			<th class="w30p">Fruta (Partition Key)</th>
			<th class="w30p">Variedad (Sort Key)</th>
      <th class="w30p">Color (Index)</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>Manzana</td>
			<td>Royal Gala</td>
      <td>Rojo</td>
    </tr>
    <tr>
      <td>Manzana</td>
			<td>Fuji</td>
      <td>Rojo</td>
    </tr>
    <tr>
			<td>Banana</td>
			<td>Cavendish</td>
      <td>Amarillo</td>
		</tr>
    <tr>
			<td>Banana</td>
			<td>Red Dacca</td>
      <td>Rojo</td>
		</tr>
	</tbody>
</table>

> **Info:**: [Obtenga más información sobre las claves de tabla NoSQL](https://docs.catalyst.zoho.com/es/cloud-scale/help/nosql/components/#table-keys).

### Flujo de trabajo de la aplicación

A continuación se describe el flujo de trabajo de la aplicación:

* Creará una tarea completando los campos de entrada presentes en el cliente. El `UserID` actuará como la **Partition Key**, y el `Task Name` actuará como la **Sort Key**.

* Una vez que se cree la tarea, los datos no estructurados se almacenarán en el componente de almacenamiento NoSQL.

* Puede filtrar las tareas creadas y las tareas requeridas se referirán usando su `UserID` (**Partition Key**) y `Task Name` (**Sort Key**).

* También puede realizar operaciones de **Edit** y **Delete** sobre las tareas creadas. Los cambios en los datos se reflejarán en el componente NoSQL.

* Finalmente, la aplicación React se aloja en Catalyst usando el componente Web Client Hosting.