Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.

# Cómo empezar a usar AWS App Studio
<a name="getting-started"></a>

Los siguientes tutoriales de introducción te muestran cómo crear tu primera aplicación en App Studio.
+ **Recomendado**: Para usar la IA generativa para describir la aplicación que quieres crear y crearla automáticamente junto con sus recursos, consulta[Tutorial: Generar una aplicación mediante IA](getting-started-tutorial-ai.md).
+ Para empezar a crear desde una aplicación vacía, consulte[Tutorial: Comience a crear desde una aplicación vacía](getting-started-tutorial-empty.md).

# Tutorial: Generar una aplicación mediante IA
<a name="getting-started-tutorial-ai"></a>

AWS App Studio incluye funciones generativas de IA en todo el servicio para acelerar la creación de aplicaciones. En este tutorial, aprenderás a generar una aplicación mediante IA describiéndola en lenguaje natural. 

Utilizar la IA para generar una aplicación es una forma estupenda de empezar a crear, ya que muchos de los recursos de la aplicación se han creado para ti. Suele ser mucho más fácil empezar a crear a partir de una aplicación generada con los recursos existentes que empezar a partir de una aplicación vacía.

**nota**  
Puedes ver la entrada del blog [Crea aplicaciones de nivel empresarial con lenguaje natural mediante AWS App Studio (versión preliminar)](https://aws.amazon.com/blogs/aws/build-custom-business-applications-without-cloud-expertise-using-aws-app-studio-preview) para ver un tutorial similar que incluye imágenes. La entrada del blog también contiene información sobre la instalación y configuración de los recursos relacionados con el administrador, pero si lo desea, puede pasar a la parte sobre la creación de aplicaciones.

Cuando App Studio genera una aplicación con IA, la crea con los siguientes recursos que se adaptan a la aplicación que has descrito:
+ **Páginas y componentes**: *los componentes* son los componentes básicos de la interfaz de usuario de la aplicación. Representan elementos visuales como tablas, formularios y botones. Cada componente tiene su propio conjunto de propiedades y puede personalizar un componente para que se adapte a sus requisitos específicos. Las *páginas* son los contenedores de los componentes.
+ **Automatizaciones**: se utilizan *las automatizaciones* para definir la lógica y los flujos de trabajo que rigen el comportamiento de la aplicación. Por ejemplo, puede utilizar las automatizaciones para crear, actualizar, leer o eliminar filas de una tabla de datos o para interactuar con los objetos de un bucket de Amazon S3. También puede utilizarlas para gestionar tareas como la validación de datos, las notificaciones o las integraciones con otros sistemas.
+ **Entidades**: los datos son la información que impulsa su aplicación. La aplicación generada crea *entidades*, que son similares a las tablas. Las entidades representan los distintos tipos de datos que necesitas almacenar y con los que trabajar, como clientes, productos o pedidos. Puede conectar estos modelos de datos a una variedad de fuentes de datos, incluidas las de AWS servicios y las externas APIs, mediante los conectores de App Studio.

**Contents**
+ [Requisitos previos](#getting-started-tutorial-ai-prerequisites)
+ [Paso 1: Crear una aplicación de](#getting-started-tutorial-ai-steps-create-application)
+ [Paso 2: Explora tu nueva aplicación](#getting-started-tutorial-ai-steps-explore)
  + [Explore las páginas y los componentes](#getting-started-tutorial-ai-steps-explore-pages)
  + [Explore las automatizaciones y las acciones](#getting-started-tutorial-ai-steps-explore-automations)
  + [Explore los datos con entidades](#getting-started-tutorial-ai-steps-explore-data-entities)
+ [Paso 3: Obtenga una vista previa de la aplicación](#getting-started-tutorial-ai-steps-preview)
+ [Siguientes pasos](#getting-started-tutorial-ai-next-steps)

## Requisitos previos
<a name="getting-started-tutorial-ai-prerequisites"></a>

Antes de empezar, revisa y completa los siguientes requisitos previos:
+ Acceso a AWS App Studio. Para obtener más información, consulte [Configuración e inicio de sesión en AWS App Studio](setting-up.md).
+ Opcional: [AWS Conceptos de App Studio](concepts.md) revísalo para familiarizarte con los conceptos importantes de App Studio.

## Paso 1: Crear una aplicación de
<a name="getting-started-tutorial-ai-steps-create-application"></a>

El primer paso para generar una aplicación es describir la aplicación que quieres crear al asistente de IA de App Studio. Puedes revisar la aplicación que se generará e iterarla como desees antes de generarla.

**Para generar tu aplicación mediante IA**

1. Inicia sesión en App Studio.

1. En la barra de navegación de la izquierda, selecciona **Builder Hub** y selecciona **\$1 Crear aplicación**.

1. Elige **Generar una aplicación con IA**.

1. En el campo **Nombre de la aplicación**, proporciona un nombre para la aplicación.

1. En el cuadro de diálogo **Seleccionar fuentes de datos**, selecciona **Omitir**.

1. Puede empezar a definir la aplicación que desea generar describiéndola en el cuadro de texto o seleccionando **Personalizar** en un mensaje de ejemplo. Tras describir la aplicación, App Studio genera los requisitos y los detalles de la aplicación para que los revises. Esto incluye casos de uso, flujos de usuarios y modelos de datos.

1. Usa el cuadro de texto para repetir la aplicación según sea necesario hasta que estés satisfecho con los requisitos y los detalles.

1. Cuando estés listo para generar tu aplicación y empezar a crearla, selecciona **Generar aplicación**.

1. Si lo desea, puede ver un vídeo corto que detalla cómo navegar por la nueva aplicación.

1. Selecciona **Editar aplicación** para acceder al entorno de desarrollo de tu aplicación.

## Paso 2: Explora tu nueva aplicación
<a name="getting-started-tutorial-ai-steps-explore"></a>

En el entorno de desarrollo, encontrará los siguientes recursos:
+ Un lienzo que se utiliza para ver o editar la aplicación. El lienzo cambia en función del recurso que se seleccione.
+ Pestañas de navegación en la parte superior del lienzo. Las pestañas se describen en la siguiente lista:
  + **Páginas**: donde se utilizan páginas y componentes para diseñar la interfaz de usuario de la aplicación.
  + **Automatizaciones**: en las que se utilizan acciones en las automatizaciones para definir la lógica empresarial de la aplicación.
  + **Datos**: donde se definen las entidades, sus campos, los datos de muestra y las acciones de datos para definir los modelos de datos de la aplicación.
  + **Configuración de la aplicación**: donde se definen los ajustes de la aplicación, incluidos los roles de la aplicación, que se utilizan para definir la visibilidad de las páginas basada en los roles para los usuarios finales.
+ Un menú de navegación en el lado izquierdo, que contiene recursos en función de la pestaña que estés viendo.
+ Un menú del lado derecho que muestra los recursos y las propiedades de los recursos seleccionados en las pestañas **Páginas** y **Automatizaciones**.
+ Una consola de depuración que muestra advertencias y errores en la parte inferior del generador. Es posible que haya errores en la aplicación que generaste. Es probable que esto se deba a las automatizaciones que requieren un conector configurado para realizar acciones, como enviar un correo electrónico con Amazon Simple Email Service.
+ Una ventana de chat de **Ask AI** para obtener ayuda contextual del asistente de creación de IA.

Echemos un vistazo más de cerca a las pestañas **Páginas**, **Automatizaciones** y **Datos**.

### Explore las páginas y los componentes
<a name="getting-started-tutorial-ai-steps-explore-pages"></a>

La pestaña **Páginas** muestra las páginas y sus componentes que se generaron para usted.

Cada página representa una pantalla de la interfaz de usuario (UI) de la aplicación con la que los usuarios interactuarán. En estas páginas, puede encontrar varios componentes (como tablas, formularios y botones) para crear el diseño y la funcionalidad deseados.

Tómese un tiempo para ver las páginas y sus componentes mediante el menú de navegación de la izquierda. Al seleccionar una página o un componente, puede elegir **Propiedades** en el menú de la derecha.

### Explore las automatizaciones y las acciones
<a name="getting-started-tutorial-ai-steps-explore-automations"></a>

La pestaña **Automatizaciones** muestra las automatizaciones y sus acciones que se generaron para ti.

Las automatizaciones definen la lógica empresarial de la aplicación, como la creación, la visualización, la actualización o la eliminación de entradas de datos, el envío de correos electrónicos o incluso la invocación de funciones APIs Lambda.

Tómate un tiempo para ver las automatizaciones mediante el menú de navegación de la izquierda. **Al elegir una automatización, puede ver sus propiedades en el menú Propiedades del lado derecho.** Una automatización contiene los siguientes recursos:
+ Las automatizaciones se componen de acciones individuales, que son los componentes básicos de la lógica empresarial de tu aplicación. Puedes ver las acciones de una automatización en el menú de navegación de la izquierda o en el lienzo de una automatización seleccionada. **Al seleccionar una acción, puede ver sus propiedades en el menú Propiedades del lado derecho.**
+ Los parámetros de automatización son la forma en que se transfieren los datos a una automatización. Los parámetros actúan como marcadores de posición que se sustituyen por valores reales cuando se ejecuta la automatización. Esto le permite usar la misma automatización con diferentes entradas cada vez.
+ La salida de automatización es aquella en la que se configura el resultado de una automatización. De forma predeterminada, una automatización no tiene salida, por lo que para utilizar el resultado de una automatización en componentes u otras automatizaciones, debe definirlos aquí.

Para obtener más información, consulte [Conceptos de automatización](automations-concepts.md).

### Explore los datos con entidades
<a name="getting-started-tutorial-ai-steps-explore-data-entities"></a>

La pestaña **Datos** muestra las entidades que se generaron para usted.

Las entidades representan tablas que contienen los datos de la aplicación, de forma similar a las tablas de una base de datos. En lugar de conectar la interfaz de usuario (UI) y las automatizaciones de la aplicación directamente a las fuentes de datos, primero se conectan a las entidades. Las entidades actúan como intermediarias entre tu fuente de datos real y tu aplicación de App Studio. Esto proporciona un lugar único para administrar tus datos y acceder a ellos.

Tómate un tiempo para ver las entidades que se generaron seleccionándolas en el menú de navegación de la izquierda. Puede revisar los siguientes detalles:
+ La pestaña **Configuración** muestra el nombre de la entidad y sus campos, que representan las columnas de la entidad.
+ La pestaña **Acciones de datos** muestra las acciones de datos que se generaron con su entidad. Los componentes y las automatizaciones pueden usar acciones de datos para obtener datos de su entidad.
+ La pestaña de **datos** de muestra muestra datos de muestra, que puedes usar para probar tu aplicación en el entorno de desarrollo (que no se comunica con servicios externos). Para obtener más información sobre los entornos, consulte [Entornos de aplicaciones](applications-publish.md#application-environments).
+ La pestaña **Conexión** muestra información sobre las fuentes de datos externas a las que está conectada la entidad. App Studio proporciona una solución de almacenamiento de datos gestionado que utiliza una tabla de DynamoDB. Para obtener más información, consulte [Entidades de datos gestionadas en AWS App Studio](managed-data-entities.md).

## Paso 3: Obtenga una vista previa de la aplicación
<a name="getting-started-tutorial-ai-steps-preview"></a>

Puedes previsualizar una aplicación en App Studio para ver cómo la ven los usuarios. También puedes probar su funcionalidad usándola y comprobando los registros en un panel de depuración.

El entorno de vista previa de la aplicación no admite la visualización de datos en tiempo real ni la conexión con recursos externos mediante conectores, como las fuentes de datos. En su lugar, puede utilizar datos de muestra y resultados simulados para probar la funcionalidad.

**Para obtener una vista previa de la aplicación para probarla**

1. En la esquina superior derecha del creador de aplicaciones, selecciona **Vista previa**.

1. Interactúa con las páginas de tu aplicación.

## Siguientes pasos
<a name="getting-started-tutorial-ai-next-steps"></a>

Ahora que has creado tu primera aplicación, estos son algunos de los siguientes pasos:
+ Para ver otro tutorial de introducción que incluye imágenes, consulta la entrada del blog [Crea aplicaciones de nivel empresarial con lenguaje natural mediante AWS App Studio (](https://aws.amazon.com/blogs/aws/build-custom-business-applications-without-cloud-expertise-using-aws-app-studio-preview)versión preliminar).
+ Las aplicaciones utilizan conectores para enviar y recibir datos o para comunicarse con servicios externos (tanto servicios como AWS servicios de terceros). Es necesario obtener más información sobre los conectores y cómo configurarlos para crear aplicaciones. Tenga en cuenta que debe tener el rol **de administrador** para administrar los conectores. Para obtener más información, consulte [Conecta App Studio a otros servicios con conectores](connectors.md).
+ Para obtener más información sobre cómo previsualizar, publicar y, en última instancia, compartir tu aplicación con los usuarios finales, consulta[Vista previa, publicación y uso compartido de aplicaciones](applications-preview-publish-share.md).
+ Sigue explorando y actualizando la aplicación que generaste para obtener una experiencia práctica.
+ Para obtener más información sobre cómo crear aplicaciones, consulta la[Documentación del constructor](builder-documentation.md). En concreto, puede resultar útil explorar los siguientes temas:
  + [Referencia de acciones de Automation](automations-actions-reference.md)
  + [Referencia de componentes](components-reference.md)
  + [Interacción con Amazon Simple Storage Service con componentes y automatizaciones](automations-s3.md)
  + [Consideraciones y mitigaciones de seguridad](security-considerations-and-mitigations.md)

# Tutorial: Comience a crear desde una aplicación vacía
<a name="getting-started-tutorial-empty"></a>

En este tutorial, crearás una aplicación interna de convocatoria de reunión para clientes con AWS App Studio. Aprenderás a crear aplicaciones en App Studio y, al mismo tiempo, te centrarás en casos de uso reales y en ejemplos prácticos. Además, aprenderás a definir las estructuras de datos, el diseño de la interfaz de usuario y la implementación de aplicaciones.

**nota**  
En este tutorial se detalla cómo crear una aplicación desde cero, empezando por una aplicación vacía. Por lo general, es mucho más rápido y fácil usar la IA para ayudar a generar una aplicación y sus recursos al proporcionar una descripción de la aplicación que deseas crear. Para obtener más información, consulte [Tutorial: Generar una aplicación mediante IA](getting-started-tutorial-ai.md).

La clave para entender cómo crear aplicaciones con App Studio es entender los siguientes cuatro conceptos básicos y cómo funcionan juntos: **componentes**, **automatizaciones**, **datos** y **conectores**.
+ **Componentes**: los componentes son los componentes básicos de la interfaz de usuario de la aplicación. Representan elementos visuales como tablas, formularios y botones. Cada componente tiene su propio conjunto de propiedades, que puede personalizar para adaptarlo a sus necesidades específicas.
+ **Automatizaciones**: con las automatizaciones, puede definir la lógica y los flujos de trabajo que rigen el comportamiento de su aplicación. Puede utilizar las automatizaciones para crear, actualizar, leer o eliminar filas de una tabla de datos o para interactuar con los objetos de un bucket de Amazon S3. También puede utilizarlas para gestionar tareas como la validación de datos, las notificaciones o las integraciones con otros sistemas.
+ **Datos**: los datos son la información que impulsa su aplicación. En App Studio, puedes definir modelos de datos, denominados *entidades*. Las entidades representan los distintos tipos de datos que necesitas almacenar y con los que trabajar, como las convocatorias de reuniones de los clientes, las agendas o los asistentes. Puede conectar estos modelos de datos a una variedad de fuentes de datos, incluidas las de AWS servicios y las externas APIs, mediante los conectores de App Studio.
+ **Conectores**: App Studio proporciona conexiones con una amplia gama de fuentes de datos, que incluyen AWS servicios como Aurora, DynamoDB y Amazon Redshift. Las fuentes de datos también incluyen servicios de terceros, como Salesforce, o muchos otros que utilizan OpenAPI o conectores API genéricos. Puede usar los conectores de App Studio para incorporar fácilmente a sus aplicaciones los datos y las funciones de estos servicios de nivel empresarial y aplicaciones externas.

A medida que avance en el tutorial, explorará cómo se combinan los conceptos clave de los componentes, los datos y la automatización para crear su aplicación interna de convocatoria de reuniones con los clientes. 

Los siguientes son pasos generales que describen lo que harás en este tutorial:

1. **Comience con los datos**: muchas aplicaciones comienzan con un modelo de datos, por lo que este tutorial también comienza con los datos. Para crear la aplicación Customer Meeting Request, empezará por crear una `MeetingRequests` entidad. Esta entidad representa la estructura de datos para almacenar toda la información relevante de la convocatoria de reunión, como el nombre del cliente, la fecha de la reunión, la agenda y los asistentes. Este modelo de datos es la base de su aplicación y potencia los diversos componentes y automatizaciones que creará.

1. **Cree su interfaz de usuario (UI)**: Una vez establecido el modelo de datos, el tutorial le guiará a través de la creación de la interfaz de usuario (UI). En App Studio, la interfaz de usuario se crea añadiendo *páginas* y *componentes* a las mismas. Añadirá componentes como *tablas*, *vistas detalladas* y *calendarios* a una página del panel de convocatorias de reunión. Estos componentes se diseñarán para mostrar los datos almacenados en la `MeetingRequests` entidad e interactuar con ellos. Esto permite a los usuarios ver, gestionar y programar las reuniones con los clientes. También creará una página de creación de convocatorias de reunión. Esta página incluye un componente de *formulario* para recopilar datos y un componente de *botón* para enviarlos.

1. **Añada lógica empresarial con automatizaciones**: para mejorar la funcionalidad de su aplicación, configurará algunos de los componentes para permitir las interacciones de los usuarios. Algunos ejemplos son navegar a una página o crear un nuevo registro de convocatoria de reunión en la `MeetingRequests` entidad.

1. **Mejore con la validación y las expresiones**: para garantizar la integridad y precisión de sus datos, agregará reglas de validación al componente del *formulario*. Esto ayudará a garantizar que los usuarios proporcionen información completa y válida al crear nuevos registros de convocatorias de reunión. Además, utilizará expresiones para hacer referencia a los datos de la aplicación y manipularlos, de modo que pueda mostrar información dinámica y contextual en toda la interfaz de usuario.

1. **Vista previa y pruebas**: antes de implementar la aplicación, tendrá la oportunidad de obtener una vista previa y probarla exhaustivamente. Esto le permitirá comprobar que los componentes, los datos y las automatizaciones funcionan todos juntos sin problemas. Esto proporciona a sus usuarios una experiencia fluida e intuitiva.

1. **Publique la aplicación**: por último, implementará su solicitud interna de solicitud de reunión con el cliente completa y la pondrá a disposición de sus usuarios. Con la potencia del enfoque de bajo código de App Studio, habrás creado una aplicación personalizada que satisfaga las necesidades específicas de tu organización, sin necesidad de contar con amplios conocimientos de programación.

**Contents**
+ [Requisitos previos](#getting-started-tutorial-prerequisites)
+ [Paso 1: Crear una aplicación de](#getting-started-tutorial-steps-create-application)
+ [Paso 2: Crea una entidad para definir los datos de tu aplicación](#getting-started-tutorial-steps-create-entity)
  + [Crea una entidad gestionada](#getting-started-tutorial-steps-create-managed-entity)
  + [Agregue campos a su entidad](#getting-started-tutorial-steps-add-fields)
+ [Paso 3: Diseñe la interfaz de usuario (UI) y la lógica](#getting-started-tutorial-steps-user-interface)
  + [Agregue una página de panel de solicitud de reunión](#getting-started-tutorial-steps-user-interface-create-page)
  + [Agregue una página de creación de convocatorias de reunión](#getting-started-tutorial-steps-user-interface-add-create-customer-page)
+ [Paso 4: Obtenga una vista previa de la aplicación](#getting-started-tutorial-steps-preview)
+ [Paso 5: Publicar la aplicación en el entorno **de pruebas**](#getting-started-tutorial-steps-publish)
+ [Siguientes pasos](#getting-started-tutorial-next-steps)

## Requisitos previos
<a name="getting-started-tutorial-prerequisites"></a>

Antes de empezar, revisa y completa los siguientes requisitos previos:
+ Acceso a AWS App Studio. Para obtener más información, consulte [Configuración e inicio de sesión en AWS App Studio](setting-up.md).
+ Opcional: [AWS Conceptos de App Studio](concepts.md) revísalo para familiarizarte con los conceptos importantes de App Studio.
+ Opcional: comprender los conceptos básicos de desarrollo web, como la JavaScript sintaxis.
+ Opcional: familiaridad con AWS los servicios.

## Paso 1: Crear una aplicación de
<a name="getting-started-tutorial-steps-create-application"></a>

1. Inicia sesión en App Studio.

1. En la barra de navegación de la izquierda, selecciona **Builder Hub** y selecciona **\$1 Crear aplicación**.

1. Elija **Empezar desde cero**.

1. En el campo **Nombre de la aplicación**, proporciona un nombre para la aplicación, por ejemplo. **Customer Meeting Requests**

1. Si se te pide que selecciones fuentes de datos o un conector, selecciona **Omitir** para los fines de este tutorial.

1. Elija **Paso siguiente** para continuar.

1. (Opcional): mira el tutorial en vídeo para obtener una descripción general rápida de la creación de aplicaciones en App Studio.

1. Selecciona **Editar aplicación para** acceder al creador de aplicaciones de App Studio.

## Paso 2: Crea una entidad para definir los datos de tu aplicación
<a name="getting-started-tutorial-steps-create-entity"></a>

Las entidades representan tablas que contienen los datos de tu aplicación, de forma similar a las tablas de una base de datos. En lugar de que la interfaz de usuario (UI) y las automatizaciones de la aplicación se conecten directamente a las fuentes de datos, primero se conectan a las entidades. Las entidades actúan como intermediarias entre tu fuente de datos real y tu aplicación de App Studio, y proporcionan un único lugar para administrar tus datos y acceder a ellos.

Hay cuatro formas de crear una entidad. Para este tutorial, utilizarás la entidad gestionada por App Studio.

### Crea una entidad gestionada
<a name="getting-started-tutorial-steps-create-managed-entity"></a>

Al crear una entidad gestionada, también se crea la tabla de DynamoDB correspondiente que administra App Studio. Cuando se realizan cambios en la entidad en la aplicación App Studio, la tabla de DynamoDB se actualiza automáticamente. Con esta opción, no es necesario crear, administrar o conectarse manualmente a una fuente de datos de terceros, ni designar el mapeo de los campos de la entidad a las columnas de la tabla.

Al crear una entidad, debe definir un campo de **clave principal**. Una clave principal sirve como identificador único para cada registro o fila de la entidad. Esto garantiza que cada registro se pueda identificar y recuperar fácilmente sin ambigüedad. La clave principal consta de las siguientes propiedades:
+ Nombre de clave principal: nombre para el campo de clave principal de la entidad.
+ Tipo de datos de clave principal: el tipo del campo de clave principal. En App Studio, los tipos de clave principal compatibles son **String** para texto y **Float** para números. Una clave principal de texto (como*meetingName*) tendría un tipo de **cadena** y una clave principal numérica (como*meetingId*) tendría un tipo de **flotación**.

La clave principal es un componente crucial de una entidad porque refuerza la integridad de los datos, evita la duplicación de datos y permite una recuperación y consulta de datos eficientes.

**Para crear una entidad gestionada**

1. Seleccione **Datos** en el menú de la barra superior.

1. Selecciona **\$1 Crear entidad**.

1. Elija **Crear entidad gestionada por App Studio**.

1. En el campo **Nombre de la entidad**, proporciona un nombre para la entidad. En este tutorial, escriba **MeetingRequests**.

1. En el campo **Clave principal**, introduce la etiqueta del nombre de la clave principal para asignarla a la columna de clave principal de tu entidad. En este tutorial, escriba **requestID**.

1. En **Tipo de datos de clave principal**, selecciona **Float**.

1. Seleccione **Create entity (Crear entidad)**.

### Agregue campos a su entidad
<a name="getting-started-tutorial-steps-add-fields"></a>

Para cada campo, especificará el **nombre para mostrar**, que es la etiqueta que pueden ver los usuarios de la aplicación. El nombre para mostrar puede contener espacios y caracteres especiales, pero debe ser único dentro de la entidad. El nombre para mostrar sirve como una etiqueta fácil de usar para el campo y ayuda a los usuarios a identificar y comprender fácilmente su propósito.

A continuación, proporcionará el **nombre del sistema**, un identificador único que la aplicación utiliza internamente para hacer referencia al campo. El nombre del sistema debe ser conciso, sin espacios ni caracteres especiales. El nombre del sistema permite a la aplicación realizar cambios en los datos del campo. Actúa como un punto de referencia único para el campo dentro de la aplicación.

Por último, seleccionará el **tipo de datos** que mejor represente el tipo de datos que desea almacenar en el campo, como cadena (texto), booleano (verdadero/falso), fecha, decimal, flotante, entero o. DateTime La definición del tipo de datos adecuado garantiza la integridad de los datos y permite gestionar y procesar correctamente los valores del campo. Por ejemplo, si almacena los nombres de los clientes en su convocatoria de reunión, debe seleccionar el tipo de `String` datos para incluir los valores de texto.

**Para agregar campos a su `MeetingRequests` entidad**
+ Seleccione **\$1 Añadir campo** para añadir los cuatro campos siguientes:

  1. Agregue un campo que represente el nombre de un cliente con la siguiente información:
     + **Nombre para mostrar**: **Customer name**
     + **Nombre del sistema**: **customerName**
     + **Tipo de datos**: **String**

  1. Agregue un campo que represente la fecha de la reunión con la siguiente información:
     + **Nombre para mostrar**: **Meeting date**
     + **Nombre del sistema**: **meetingDate**
     + **Tipo de datos**: **DateTime**

  1. Agregue un campo que represente la agenda de la reunión con la siguiente información:
     + **Nombre para mostrar**: **Agenda**
     + **Nombre del sistema**: **agenda**
     + **Tipo de datos**: **String**

  1. Agregue un campo para representar a los asistentes a la reunión con la siguiente información:
     + **Nombre para mostrar**: **Attendees**
     + **Nombre del sistema**: **attendees**
     + **Tipo de datos**: **String**

Puede agregar datos de muestra a su entidad que puede usar para probar y obtener una vista previa de la aplicación antes de publicarla. Al agregar hasta 500 filas de datos simulados, puede simular escenarios del mundo real y examinar cómo su aplicación maneja y muestra varios tipos de datos, sin depender de los datos reales ni conectarse a servicios externos. Esto le ayuda a identificar y resolver cualquier problema o incoherencia al principio del proceso de desarrollo. Esto garantiza que la aplicación funcione según lo previsto cuando se trata de datos reales.

**Para añadir datos de muestra a su entidad**

1. Elija la pestaña **Datos de muestra** en el banner.

1. Selecciona **Generar más datos de muestra**.

1. Seleccione **Save**.

Si lo desea, seleccione **Conexión** en el encabezado para revisar los detalles sobre el conector y la tabla de DynamoDB creada para usted.

## Paso 3: Diseñe la interfaz de usuario (UI) y la lógica
<a name="getting-started-tutorial-steps-user-interface"></a>

### Agregue una página de panel de solicitud de reunión
<a name="getting-started-tutorial-steps-user-interface-create-page"></a>

En App Studio, cada página representa una pantalla de la interfaz de usuario (UI) de la aplicación con la que los usuarios interactuarán. Dentro de estas páginas, puedes añadir varios componentes, como tablas, formularios y botones, para crear el diseño y la funcionalidad deseados. 

Las aplicaciones recién creadas vienen con una página predeterminada, por lo que tendrá que cambiarle el nombre en lugar de añadir una nueva para utilizarla como una simple página de panel de convocatorias de reunión.

**Para cambiar el nombre de la página predeterminada**

1. En el menú de navegación de la barra superior, selecciona **Páginas**.

1. **En el panel de la izquierda, haga doble clic en **Página1, cámbiele** el nombre a y pulse **MeetingRequestsDashboard** Entrar.**

Ahora, añada un componente de tabla a la página que se utilizará para mostrar las convocatorias de reunión.

**Para añadir un componente de tabla a la página del panel de convocatorias de reunión**

1. En el panel de **componentes** de la derecha, localice el componente de **tabla** y arrástrelo al lienzo.

1. Elija la tabla en el lienzo para seleccionarla.

1. En el panel de **propiedades** del lado derecho, actualice los siguientes ajustes:

   1. Selecciona el icono del lápiz para cambiarle el nombre a la tabla. **meetingRequestsTable**

   1. **En el menú desplegable **Fuente**, selecciona Entidad.**

   1. En el menú desplegable **Acciones de datos**, elige la entidad que has creado (**MeetingRequests**) y selecciona **\$1 Añadir acciones de datos**. 

1. Si se te solicita, selecciona **GetAll**.
**nota**  
La acción **Obtener todos los** datos es un tipo específico de acción de datos que recupera todos los registros (filas) de una entidad específica. Al asociar la acción Obtener todos los datos a un componente de una tabla, por ejemplo, la tabla se rellena automáticamente con todos los datos de la entidad conectada y muestra cada registro como una fila de la tabla.

### Agregue una página de creación de convocatorias de reunión
<a name="getting-started-tutorial-steps-user-interface-add-create-customer-page"></a>

A continuación, cree una página que contenga un formulario que los usuarios finales utilizarán para crear las convocatorias de reunión. También agregará un botón de envío que crea el registro en la `MeetingRequests` entidad y, a continuación, hace que el usuario final regrese a la `MeetingRequestsDashboard` página.

**Para añadir una página de creación de convocatorias de reunión**

1. En el banner superior, selecciona **Páginas**.

1. En el panel de la izquierda, selecciona **\$1 Añadir**.

1. En el panel de propiedades del lado derecho, selecciona el icono del lápiz y cambia el nombre de la página a. **CreateMeetingRequest**

Una vez agregada la página, añadirá un formulario a la página que los usuarios finales utilizarán para introducir la información necesaria para crear una convocatoria de reunión en la `MeetingRequests` entidad. App Studio ofrece un método para generar un formulario a partir de una entidad existente, que rellena automáticamente los campos del formulario en función de los campos de la entidad y también genera un botón de envío para crear un registro en la entidad con las entradas del formulario.

**Para generar automáticamente un formulario a partir de una entidad en la página de creación de la convocatoria de reunión**

1. En el menú de **componentes** del lado derecho, busque el componente **Formulario** y arrástrelo al lienzo.

1. Selecciona **Generar formulario.**

1. En el menú desplegable, selecciona la `MeetingRequests` entidad.

1. Seleccione **Generar**.

1. Pulse el botón **Enviar** en el lienzo para seleccionarla.

1. En el panel de propiedades del lado derecho, en la sección **Activadores**, selecciona **\$1 Añadir**.

1. Selecciona **Navegar**.

1. En el panel de propiedades del lado derecho, cambia el **nombre de la acción** por un nombre descriptivo, como**Navigate to MeetingRequestsDashboard**.

1. Cambia el **tipo de navegación** a página. En el menú desplegable **Navegar a**, selecciona**MeetingRequestsDashboard**.

Ahora que tenemos una página y un formulario de creación de convocatorias de reunión, queremos facilitar la navegación a esta página desde la `MeetingRequestsDashboard` página, de modo que los usuarios finales que revisen el panel puedan crear fácilmente las convocatorias de reunión. Utilice el siguiente procedimiento para crear un botón en la `MeetingRequestsDashboard` página que conduzca a la `CreateMeetingRequest` página.

**Para agregar un botón para navegar de a `MeetingRequestsDashboard` `CreateMeetingRequest`**

1. En el banner superior, selecciona **Páginas**.

1. Elige la `MeetingRequestsDashboard` página. 

1. En el panel de **componentes** del lado derecho, busque el componente **Botón**, arrástrelo al lienzo y colóquelo encima de la tabla.

1. Elija el botón recién agregado para seleccionarlo.

1. En el panel de **propiedades** del lado derecho, actualiza los siguientes ajustes:

   1. Selecciona el icono del lápiz para cambiarle el nombre al botón. **createMeetingRequestButton**

   1. **Etiqueta del botón**:**Create Meeting Request**. Este es el nombre que verán los usuarios finales.

   1. En el menú desplegable de **iconos**, selecciona **\$1 Plus**.

   1. Crea un disparador que lleve al usuario final a la `MeetingRequestsDashboard` página:

      1. En la sección **Activadores**, selecciona **\$1 Añadir**.

      1. En **Tipo de acción**, selecciona **Navegar**.

      1. Elija el disparador que acaba de crear para configurarlo.

      1. En **Nombre de la acción**, proporcione un nombre descriptivo como**NavigateToCreateMeetingRequest**.

      1. En el menú desplegable **Tipo de navegación**, selecciona **Página.**

      1. En el menú desplegable **Navegar a**, selecciona la `CreateMeetingRequest` página. 

## Paso 4: Obtenga una vista previa de la aplicación
<a name="getting-started-tutorial-steps-preview"></a>

Puedes previsualizar una aplicación en App Studio para ver cómo la verán los usuarios. Además, puedes probar su funcionalidad utilizándola y comprobando los registros en un panel de depuración.

El entorno de vista previa de la aplicación no admite la visualización de datos en tiempo real. Tampoco admite la conexión con recursos externos mediante conectores, como fuentes de datos. En su lugar, puede usar datos de muestra y resultados simulados para probar la funcionalidad.

**Para obtener una vista previa de la aplicación para probarla**

1. En la esquina superior derecha del creador de aplicaciones, selecciona **Vista previa**.

1. Interactúa con la `MeetingRequestsDashboard` página y prueba la tabla, el formulario y los botones. 

## Paso 5: Publicar la aplicación en el entorno **de pruebas**
<a name="getting-started-tutorial-steps-publish"></a>

Ahora que ha terminado de crear, configurar y probar su aplicación, es el momento de publicarla en el entorno de **pruebas** para realizar las pruebas finales y luego compartirla con los usuarios.

**Para publicar tu aplicación en el entorno de pruebas**

1. En la esquina superior derecha del creador de aplicaciones, selecciona **Publicar**.

1. Agrega una descripción de la versión para el entorno de pruebas.

1. Revise y seleccione la casilla de verificación relativa al SLA. 

1. Elija **Iniciar**. La publicación puede tardar hasta 15 minutos.

1. (Opcional) Cuando estés listo, puedes dar acceso a otras personas seleccionando **Compartir** y siguiendo las instrucciones.
**nota**  
Para compartir aplicaciones, el administrador debe haber creado grupos de usuarios finales. 

Tras realizar las pruebas, vuelva a seleccionar **Publicar** para promocionar la aplicación en el entorno de producción. Para obtener más información sobre los distintos entornos de aplicaciones, consulte[Entornos de aplicaciones](applications-publish.md#application-environments).

## Siguientes pasos
<a name="getting-started-tutorial-next-steps"></a>

Ahora que ha creado su primera aplicación, estos son algunos de los siguientes pasos:

1. Sigue creando la aplicación tutorial. Ahora que ha configurado los datos, algunas páginas y una automatización, puede añadir páginas adicionales y componentes para obtener más información sobre la creación de aplicaciones.

1. Para obtener más información sobre la creación de aplicaciones, consulta la[Documentación del constructor](builder-documentation.md). En concreto, puede resultar útil explorar los siguientes temas:
   + [Referencia de acciones de Automation](automations-actions-reference.md)
   + [Referencia de componentes](components-reference.md)
   + [Interacción con Amazon Simple Storage Service con componentes y automatizaciones](automations-s3.md)
   + [Consideraciones y mitigaciones de seguridad](security-considerations-and-mitigations.md)

   Además, los siguientes temas contienen más información sobre los conceptos que se analizan en el tutorial:
   + [Vista previa, publicación y uso compartido de aplicaciones](applications-preview-publish-share.md)
   + [Crear una entidad en una aplicación de App Studio](data-entities-create.md)