

Le traduzioni sono generate tramite traduzione automatica. In caso di conflitto tra il contenuto di una traduzione e la versione originale in Inglese, quest'ultima prevarrà.

# Documentazione Builder
<a name="builder-documentation"></a>

I seguenti argomenti contengono informazioni per aiutare gli utenti di App Studio a creare, modificare e pubblicare applicazioni.

**Topics**
+ [Esercitazioni](tutorials.md)
+ [Crea la tua app App Studio con l'intelligenza artificiale generativa](generative-ai.md)
+ [Creazione, modifica ed eliminazione di applicazioni](applications-create-edit-delete.md)
+ [Visualizzazione in anteprima, pubblicazione e condivisione delle applicazioni](applications-preview-publish-share.md)
+ [Pagine e componenti: crea l'interfaccia utente della tua app](pages-components-ux.md)
+ [Automazioni e azioni: definisci la logica di business della tua app](automations.md)
+ [Entità e azioni sui dati: configura il modello di dati della tua app](data.md)
+ [Parametri di pagina e automazione](paramters.md)
+ [Utilizzo JavaScript per scrivere espressioni in App Studio](expressions.md)
+ [Dipendenze dei dati e considerazioni sulla tempistica](data-dependencies-timing-considerations.md)
+ [Creazione di un'app con più utenti](builder-collaboration.md)
+ [Visualizzazione o aggiornamento delle impostazioni di sicurezza dei contenuti dell'app](app-content-security-settings-csp.md)

# Esercitazioni
<a name="tutorials"></a>

**Topics**
+ [Crea un'app di riepilogo di testo basata sull'intelligenza artificiale con Amazon Bedrock](tutorial-conversational-bedrock.md)
+ [Interazione con Amazon Simple Storage Service con componenti e automazioni](automations-s3.md)
+ [Richiamo delle funzioni Lambda in un'app App Studio](tutorial-lambda.md)

# Crea un'app di riepilogo di testo basata sull'intelligenza artificiale con Amazon Bedrock
<a name="tutorial-conversational-bedrock"></a>

In questo tutorial, creerai un'applicazione in App Studio che utilizza Amazon Bedrock per fornire riepiloghi concisi degli input di testo da parte degli utenti finali. L'applicazione contiene una semplice interfaccia utente in cui gli utenti possono inserire qualsiasi testo che desiderano riepilogare. Potrebbe trattarsi di appunti di riunioni, contenuti di articoli, risultati di ricerche o qualsiasi altra informazione testuale. Dopo aver inserito il testo, gli utenti possono premere un pulsante per inviarlo ad Amazon Bedrock, che lo elaborerà utilizzando il modello Claude 3 Sonnet e restituirà una versione riepilogativa.

**Contents**
+ [Prerequisiti](#tutorial-conversational-bedrock-prerequisites)
+ [Passaggio 1: creare e configurare un ruolo IAM e un connettore App Studio](#tutorial-conversational-bedrock-steps-create-role-connector)
+ [Fase 2: Creare un'applicazione](#tutorial-conversational-bedrock-steps-create-application)
+ [Passaggio 3: creare e configurare un'automazione](#tutorial-conversational-bedrock-steps-create-automation)
+ [Fase 4: Creare pagine e componenti](#tutorial-conversational-bedrock-steps-user-interface)
  + [Rinomina la pagina predefinita](#tutorial-conversational-bedrock-steps-user-interface-create-page)
  + [Aggiungi componenti alla pagina](#tutorial-conversational-bedrock-steps-user-interface-add-components)
  + [Configura i componenti della pagina](#tutorial-conversational-bedrock-steps-user-interface-configure-components)
+ [Fase 5: Pubblicare l'applicazione nell'ambiente **di test**](#tutorial-conversational-bedrock-steps-publish)
+ [(Facoltativo) Pulizia](#tutorial-conversational-bedrock-steps-cleanup)

## Prerequisiti
<a name="tutorial-conversational-bedrock-prerequisites"></a>

Prima di iniziare, esamina e completa i seguenti prerequisiti:
+ Accesso ad AWS App Studio. Tieni presente che devi avere il ruolo di amministratore per creare un connettore in questo tutorial.
+ Facoltativo: [AWS Concetti di App Studio](concepts.md) consulta [Tutorial: inizia a creare da un'app vuota](getting-started-tutorial-empty.md) e acquisisci familiarità con importanti concetti di App Studio.

## Passaggio 1: creare e configurare un ruolo IAM e un connettore App Studio
<a name="tutorial-conversational-bedrock-steps-create-role-connector"></a>

Per fornire ad App Studio l'accesso ai modelli Amazon Bedrock, devi:

1. Abilita i modelli Amazon Bedrock che desideri utilizzare nella tua app. Per questo tutorial, utilizzerai **Claude 3 Sonnet**, quindi assicurati di abilitare quel modello.

1. Crea un ruolo IAM con autorizzazioni appropriate per Amazon Bedrock.

1. Crea un connettore App Studio con il ruolo IAM che verrà utilizzato nella tua app.

Consulta [Connect ad Amazon Bedrock](connectors-bedrock.md) le istruzioni dettagliate e torna a questo tutorial dopo aver seguito i passaggi e creato il connettore.

## Fase 2: Creare un'applicazione
<a name="tutorial-conversational-bedrock-steps-create-application"></a>

Utilizza la seguente procedura per creare un'app vuota in App Studio da inserire nell'app di riepilogo del testo.

1. Accedi ad App Studio.

1. Vai al Builder Hub e scegli **\$1 Crea app**.

1. Scegli **Inizia da zero.**

1. Nel campo **Nome app**, fornisci un nome per la tua app, ad esempio**Text Summarizer**.

1. Se ti viene chiesto di selezionare fonti di dati o un connettore, scegli **Ignora** ai fini di questo tutorial.

1. Scegli **Successivo** per continuare.

1. (Facoltativo): guarda il video tutorial per una rapida panoramica sulla creazione di app in App Studio.

1. Scegli **Modifica app**, che ti porterà allo studio dell'applicazione.

## Passaggio 3: creare e configurare un'automazione
<a name="tutorial-conversational-bedrock-steps-create-automation"></a>

Sei tu a definire la logica e il comportamento di un'app App Studio nelle *automazioni*. Le automazioni consistono in singoli passaggi noti come *azioni*, *parametri* utilizzati per trasferire dati all'azione da altre risorse e un *output* che può essere utilizzato da altre automazioni o componenti. In questa fase, creerai un'automazione che gestisce l'interazione con Amazon Bedrock con quanto segue:
+ Input: un parametro per passare il testo immesso dall'utente all'automazione.
+ Azioni: un'azione **GenAI Prompt** che invia l'input di testo ad Amazon Bedrock e restituisce il riepilogo del testo in uscita.
+ Output: un output di automazione costituito dal riepilogo elaborato da Amazon Bedrock, che può essere utilizzato nella tua app.

**Per creare e configurare un'automazione che invii un prompt ad Amazon Bedrock ed elabori e restituisca un riepilogo**

1. Scegli la scheda **Automazioni** nella parte superiore dell'area di disegno.

1. Scegli **\$1 Aggiungi automazione**.

1. Nel pannello di destra, scegli **Proprietà**.

1. Aggiorna il nome dell'automazione scegliendo l'icona a forma di matita. Inserisci **InvokeBedrock** e premi **Invio**.

1. Aggiungi un parametro all'automazione che verrà utilizzato per passare l'input del prompt di testo dall'utente all'automazione da utilizzare nella richiesta ad Amazon Bedrock eseguendo i seguenti passaggi:

   1. Nell'area di disegno, nella casella dei parametri, scegli **\$1** Aggiungi.

   1. In **Nome**, inserisci **input**.

   1. In **Descrizione**, inserisci una descrizione, ad esempio**Text to be sent to Amazon Bedrock**.

   1. In **Tipo**, selezionate **Stringa**.

   1. **Scegliete Aggiungi** per creare il parametro.

1. Aggiungi un'azione **GenAI Prompt** eseguendo i seguenti passaggi:

   1. **Nel pannello di destra, scegli Azioni.**

   1. Scegli **GenAI Prompt** per aggiungere un'azione.

1. Configura l'azione eseguendo i seguenti passaggi:

   1. Scegli l'azione dall'area di disegno per aprire il menu **Proprietà** a destra.

   1. Rinomina l'azione **PromptBedrock** scegliendo l'icona a forma di matita, inserendo il nome e premendo invio.

   1. In **Connettore**, seleziona il connettore che è stato creato in[Passaggio 1: creare e configurare un ruolo IAM e un connettore App Studio](#tutorial-conversational-bedrock-steps-create-role-connector).

   1. In **Modello**, scegli il modello Amazon Bedrock che desideri utilizzare per elaborare la richiesta. In questo tutorial, sceglierai **Claude** 3.5 Sonnet.

   1. Nel **prompt dell'utente**, inserisci. `{{params.input}}` Rappresenta il `input` parametro creato in precedenza e conterrà il testo inserito dagli utenti dell'app. 

   1. In **Prompt di sistema**, inserisci le istruzioni del prompt di sistema che desideri inviare ad Amazon Bedrock. Per questo tutorial, inserisci quanto segue:

      ```
      You are a highly efficient text summarizer. Provide a concise summary of the prompted text, capturing the key points and main ideas.
      ```

   1. Scegli **Impostazioni di richiesta** per espanderla e aggiorna i seguenti campi:
      + In **Temperatura**, inserisci`0`. La temperatura determina la casualità o la creatività dell'output su una scala da 0 a 10. Più alto è il numero, più creativa è la risposta.
      + In **Max Tokens**, inserisci `4096` per limitare la lunghezza della risposta.

1. L'output di questa automazione sarà il testo riepilogato, tuttavia, per impostazione predefinita le automazioni non creano output. Configura l'automazione per creare un output di automazione eseguendo i seguenti passaggi:

   1. Nella barra di navigazione a sinistra, scegli l'**InvokeBedrock**automazione.

   1. **Nel menu **Proprietà** a destra, in **Output**, scegli \$1 Aggiungi.**

   1. In **Output**, immettete**\$1\$1results.PromptBedrock.text\$1\$1**. Questa espressione restituisce il contenuto dell'`processResults`azione.

## Fase 4: Creare pagine e componenti
<a name="tutorial-conversational-bedrock-steps-user-interface"></a>

In App Studio, ogni pagina rappresenta una schermata dell'interfaccia utente (UI) dell'applicazione con cui gli utenti interagiranno. All'interno di queste pagine, puoi aggiungere vari componenti come tabelle, moduli, pulsanti e altro per creare il layout e la funzionalità desiderati. 

### Rinomina la pagina predefinita
<a name="tutorial-conversational-bedrock-steps-user-interface-create-page"></a>

L'app di riepilogo del testo in questo tutorial conterrà solo una pagina. Le applicazioni appena create hanno una pagina predefinita, quindi rinominerai quella invece di aggiungerne una.

**Per rinominare la pagina predefinita**

1. Nel menu di navigazione della barra superiore, scegli **Pagine**.

1. Nel pannello a sinistra, scegli **Pagina1** e scegli il pannello **Proprietà** nel pannello a destra.

1. **Scegliete l'icona a forma di matita, immettete e premete Invio**TextSummarizationTool**.**

1. Nell'**etichetta di navigazione** inserisci**TextSummarizationTool**.

### Aggiungi componenti alla pagina
<a name="tutorial-conversational-bedrock-steps-user-interface-add-components"></a>

Per questo tutorial, l'app di riepilogo del testo ha una pagina che contiene i seguenti componenti:
+ Un componente **di immissione di testo** che gli utenti finali utilizzano per inserire un prompt da riepilogare.
+ Un componente **Button** utilizzato per inviare il prompt ad Amazon Bedrock.
+ Un componente **dell'area di testo** che visualizza il riepilogo di Amazon Bedrock.

Aggiungi un componente **di immissione di testo** alla pagina che gli utenti utilizzeranno per inserire un prompt di testo da riepilogare.

**Per aggiungere un componente di immissione di testo**

1. Nel pannello **Componenti** a destra, individuate il componente di **immissione del testo** e trascinatelo sull'area di disegno.

1. Scegliete l'input di testo nell'area di disegno per selezionarlo.

1. Nel pannello **Proprietà** a destra, aggiorna le seguenti impostazioni:

   1. Scegliete l'icona a forma di matita per rinominare il testo inserito. **inputPrompt**

   1. In **Etichetta**, inserisci**Prompt**.

   1. In **Placeholder**, immettete. **Enter text to be summarized**

Ora aggiungi un componente **Button** a cui gli utenti sceglieranno di inviare il prompt ad Amazon Bedrock.

**Per aggiungere un componente pulsante**

1. Nel pannello **Componenti** a destra, individuate il componente **Button** e trascinatelo sull'area di disegno.

1. Scegliete il pulsante nell'area di disegno per selezionarlo.

1. Nel pannello **Proprietà** a destra, aggiorna le seguenti impostazioni:

   1. Scegliete l'icona a forma di matita per rinominare il pulsante. **sendButton**

   1. In **Etichetta del pulsante**, inserisci**Send**.

Ora aggiungi un componente **Text area** che mostrerà il riepilogo restituito da Amazon Bedrock.

**Per aggiungere un componente dell'area di testo**

1. Nel pannello **Componenti** a destra, individuate il componente **Area di testo** e trascinatelo sull'area di disegno.

1. Scegliete l'area di testo nell'area di disegno per selezionarla.

1. Nel pannello **Proprietà** a destra, aggiorna le seguenti impostazioni:

   1. Scegliete l'icona a forma di matita per rinominare il pulsante. **textSummary**

   1. In **Etichetta**, inserisci**Summary**.

### Configura i componenti della pagina
<a name="tutorial-conversational-bedrock-steps-user-interface-configure-components"></a>

Ora che l'app contiene una pagina con i componenti, il passaggio successivo consiste nel configurare i componenti per eseguire il comportamento appropriato. Per configurare un componente, ad esempio un pulsante, in modo che agisca quando interagisce con esso, è necessario aggiungervi un *trigger*. Per l'app di questo tutorial, aggiungerai due trigger al `sendButton` pulsante per effettuare le seguenti operazioni:
+ Il primo trigger invia il testo nel `textPrompt` componente ad Amazon Bedrock per essere analizzato.
+ Il secondo trigger mostra il riepilogo restituito da Amazon Bedrock nel `textSummary` componente.

**Per aggiungere un trigger che invii il prompt ad Amazon Bedrock**

1. Scegli il pulsante nell'area di disegno per selezionarlo.

1. Nel pannello **Proprietà** a destra, nella sezione **Trigger**, scegli **\$1** Aggiungi.

1. Scegli **Invoke Automation**.

1. Scegli il **InvokeAutomation1** trigger che è stato creato per configurarlo.

1. In **Nome azione**, inserisci**invokeBedrockAutomation**.

1. In **Invoke Automation**, seleziona l'**InvokeBedrock**automazione creata in precedenza.

1. Nella casella dei parametri, nel parametro **di input** creato in precedenza, immettete**\$1\$1ui.inputPrompt.value\$1\$1**, che passa il contenuto del componente di immissione del `inputPrompt` testo.

1. Fate clic sulla freccia sinistra nella parte superiore del pannello per tornare al menu delle proprietà del componente.

Ora, hai configurato un trigger che richiama l'automazione per inviare una richiesta ad Amazon Bedrock quando si fa clic sul pulsante, il passaggio successivo consiste nel configurare un secondo trigger che mostri i risultati nel componente. `textSummary`

**Per aggiungere un trigger che mostri i risultati di Amazon Bedrock nel componente dell'area di testo**

1. **Nel pannello **Proprietà** a destra del pulsante, nella sezione **Trigger**, scegli \$1 Aggiungi.**

1. Scegli **Esegui azione del componente**.

1. Scegli il trigger **Runcomponentaction1** che è stato creato per configurarlo.

1. In Nome **azione, immettere.** **setTextSummary**

1. In **Componente**, selezionate il componente **TextSummary**.

1. In **Azione**, seleziona **Imposta valore**.

1. In **Imposta valore su**, inserisci**\$1\$1results.invokeBedrockAutomation\$1\$1**.

## Fase 5: Pubblicare l'applicazione nell'ambiente **di test**
<a name="tutorial-conversational-bedrock-steps-publish"></a>

In genere, durante la creazione di un'app, è buona norma visualizzarne l'anteprima per vederne l'aspetto ed eseguire i test iniziali sulla sua funzionalità. Tuttavia, poiché le applicazioni non interagiscono con i servizi esterni nell'ambiente di anteprima, pubblicherai l'app nell'ambiente di test per poter testare l'invio di richieste e la ricezione di risposte da Amazon Bedrock.

**Per pubblicare la tua app nell'ambiente di test**

1. **Nell'angolo in alto a destra dell'app builder, scegli Pubblica.**

1. Aggiungi una descrizione della versione per l'ambiente di test.

1. Controlla e seleziona la casella di controllo relativa allo SLA. 

1. Scegli **Avvia**. La pubblicazione può richiedere fino a 15 minuti.

1. (Facoltativo) Quando sei pronto, puoi concedere l'accesso ad altri utenti scegliendo **Condividi** e seguendo le istruzioni. Per ulteriori informazioni sulla condivisione delle app App Studio, consulta. [Condivisione di applicazioni pubblicate](application-share.md)

Dopo aver testato l'applicazione, scegli nuovamente **Pubblica** per promuovere l'applicazione nell'ambiente di produzione. Tieni presente che le app nell'ambiente di produzione non sono disponibili per gli utenti finali finché non vengono condivise. Per ulteriori informazioni sui diversi ambienti applicativi, consulta[Ambienti applicativi](applications-publish.md#application-environments). 

## (Facoltativo) Pulizia
<a name="tutorial-conversational-bedrock-steps-cleanup"></a>

Ora hai completato con successo il tutorial e creato un'app per il riepilogo del testo in App Studio con Amazon Bedrock. Puoi continuare a utilizzare la tua app oppure puoi ripulire le risorse create in questo tutorial. L'elenco seguente contiene un elenco di risorse da pulire:
+ Il connettore Amazon Bedrock creato in App Studio. Per ulteriori informazioni, consulta [Visualizzazione, modifica ed eliminazione dei connettori](viewing-deleting-connectors.md).
+ L'app di riepilogo del testo in App Studio. Per ulteriori informazioni, consulta [Eliminazione di un’applicazione](applications-delete.md).
+ Il ruolo IAM creato nella console IAM. Per ulteriori informazioni, consulta [Eliminare ruoli o profili di istanza](https://docs.aws.amazon.com/IAM/latest/UserGuide/id_roles_manage_delete.html) nella *Guida AWS Identity and Access Management per l'utente*.
+ *Se hai richiesto l'accesso al modello per usare Claude 3 Sonnet e desideri ripristinare l'accesso, consulta [Gestire l'accesso ai modelli Amazon Bedrock Foundation nella Amazon Bedrock](https://docs.aws.amazon.com/bedrock/latest/userguide/model-access.html) User Guide.*

# Interazione con Amazon Simple Storage Service con componenti e automazioni
<a name="automations-s3"></a>

Puoi richiamare diverse operazioni Amazon S3 da un'app App Studio. Ad esempio, puoi creare un semplice pannello di amministrazione per gestire gli utenti e gli ordini e visualizzare i contenuti multimediali da Amazon S3. Sebbene sia possibile richiamare qualsiasi operazione Amazon S3 utilizzando **l'**azione AWS Invoke, ci sono quattro azioni Amazon S3 dedicate che puoi aggiungere alle automazioni della tua app per eseguire operazioni comuni su bucket e oggetti Amazon S3. Le quattro azioni e le relative operazioni sono le seguenti:
+ **Put Object**: utilizza l'`Amazon S3 PutObject`operazione per aggiungere un oggetto a un bucket Amazon S3.
+ **Ottieni oggetto**: utilizza l'`Amazon S3 GetObject`operazione per recuperare un oggetto da un bucket Amazon S3.
+ **Elenca oggetti**: utilizza l'`Amazon S3 ListObjects`operazione per elencare gli oggetti in un bucket Amazon S3.
+ **Elimina oggetto**: utilizza l'`Amazon S3 DeleteObject`operazione per eliminare un oggetto da un bucket Amazon S3.

Oltre alle azioni, è disponibile un componente di **caricamento S3** che puoi aggiungere alle pagine delle applicazioni. Gli utenti possono utilizzare questo componente per scegliere un file da caricare e il componente chiama `Amazon S3 PutObject` per caricare il file nel bucket e nella cartella configurati. Questo tutorial utilizzerà questo componente al posto dell'azione di automazione autonoma **Put Object**. (L'azione autonoma dovrebbe essere utilizzata in scenari più complessi che implicano logica o azioni aggiuntive da intraprendere prima o dopo il caricamento.)

## Prerequisiti
<a name="automations-s3-prerequisites"></a>

Questa guida presuppone che tu abbia soddisfatto i seguenti prerequisiti:

1. Ha creato e configurato un bucket Amazon S3, un ruolo e una policy IAM e un connettore Amazon S3 per integrare correttamente Amazon S3 con App Studio. Per creare un connettore, devi avere il ruolo di amministratore. Per ulteriori informazioni, consulta [Connect ad Amazon Simple Storage Service (Amazon S3) Simple Storage Service S3](connectors-s3.md).

## Creare un'applicazione vuota
<a name="automations-s3-create-app"></a>

Crea un'applicazione vuota da utilizzare in questa guida eseguendo i seguenti passaggi.

**Per creare un'applicazione vuota**

1. Nel riquadro di navigazione, scegli **Le mie applicazioni**.

1. Scegli **\$1 Crea app**.

1. Nella finestra di dialogo **Crea app**, assegna un nome all'applicazione, scegli **Inizia da zero** e scegli **Avanti**.

1. Nella finestra di dialogo **Connetti a dati esistenti**, scegliete **Ignora** per creare l'applicazione.

1. Scegliete **Modifica app** per accedere all'area di disegno della nuova app, dove potete utilizzare componenti, automazioni e dati per configurare l'aspetto e la funzione dell'applicazione.

## Crea pagine
<a name="automations-s3-create-pages"></a>

Crea tre pagine nell'applicazione per raccogliere o mostrare informazioni.

**Per creare pagine**

1. Se necessario, scegli la scheda **Pagine** nella parte superiore dell'area di disegno.

1. Nella barra di navigazione a sinistra, c'è una singola pagina creata con la tua app. Scegli **\$1 Aggiungi** due volte per creare altre due pagine. Il riquadro di navigazione dovrebbe mostrare tre pagine totali.

1. Aggiorna il nome della pagina **Page1** effettuando le seguenti operazioni:

   1. **Scegliete l'icona con i puntini di sospensione e scegliete Proprietà della pagina.**

   1. Nel menu **Proprietà** a destra, scegli l'icona a forma di matita per modificare il nome.

   1. Entra **FileList** e premi **Invio**.

1. Ripeti i passaggi precedenti per aggiornare la seconda e la terza pagina come segue:
   + Rinomina **Page2** in. **UploadFile**
   + **Rinomina Page3 in.** **FailUpload**

**Ora, l'app dovrebbe avere tre pagine denominate, e **FileList**UploadFile**FailUpload******, che sono mostrate nel pannello Pagine a sinistra.**

Successivamente, creerai e configurerai le automazioni che interagiscono con Amazon S3.

## Crea e configura automazioni
<a name="automations-s3-automations"></a>

Crea le automazioni della tua applicazione che interagiscono con Amazon S3. Utilizza le seguenti procedure per creare le seguenti automazioni:
+ Un'automazione **GetFiles** che elenca gli oggetti nel tuo bucket Amazon S3, che verranno utilizzati per riempire un componente della tabella.
+ Un'automazione **DeleteFile** che elimina un oggetto dal bucket Amazon S3, che verrà utilizzato per aggiungere un pulsante di eliminazione a un componente della tabella.
+ Un'automazione **ViewFile** che ottiene un oggetto dal tuo bucket Amazon S3 e lo visualizza, che verrà utilizzata per mostrare maggiori dettagli su un singolo oggetto selezionato da un componente della tabella.

### Crea un'automazione `getFiles`
<a name="automations-s3-get-files"></a>

Crea un'automazione che elencherà i file in un bucket Amazon S3 specificato.

1. Scegli la scheda **Automazioni** nella parte superiore dell'area di disegno.

1. Scegli **\$1 Aggiungi automazione**.

1. Nel pannello di destra, scegli **Proprietà**.

1. Aggiorna il nome dell'automazione scegliendo l'icona a forma di matita. Inserisci **getFiles** e premi **Invio**.

1. Aggiungere un'azione **Elenco oggetti** eseguendo le seguenti operazioni:

   1. Nel pannello di destra, scegli **Azioni**.

   1. Scegli **Elenca oggetti** per aggiungere un'azione. L'azione deve avere un nome`ListObjects1`.

1. Configura l'azione eseguendo i seguenti passaggi:

   1. Scegli l'azione dall'area di disegno per aprire il menu **Proprietà** a destra.

   1. Per **Connector**, scegli il connettore Amazon S3 che hai creato tra i prerequisiti.

   1. Per **Configurazione**, inserisci il seguente testo, sostituendolo *bucket\$1name* con il bucket che hai creato nei prerequisiti:

      ```
      {
        "Bucket": "bucket_name",
        "Prefix": ""
      }
      ```
**Nota**  
È possibile utilizzare il `Prefix` campo per limitare la risposta agli oggetti che iniziano con la stringa specificata.

1. L'output di questa automazione verrà utilizzato per popolare un componente di tabella con oggetti del tuo bucket Amazon S3. Tuttavia, per impostazione predefinita, le automazioni non creano output. Configura l'automazione per creare un output di automazione eseguendo i seguenti passaggi:

   1. Nella barra di navigazione a sinistra, scegli l'automazione **GetFiles**.

   1. **Nel menu **Proprietà** a destra, in **Automation output, scegli \$1 Aggiungi output**.**

   1. Per **Output**, immettete**\$1\$1results.ListObjects1.Contents\$1\$1**. Questa espressione restituisce il contenuto dell'azione e ora può essere utilizzata per popolare un componente della tabella.

### Crea un'automazione `deleteFile`
<a name="automations-s3-delete-file"></a>

Crea un'automazione che elimini un oggetto da un bucket Amazon S3 specificato.

1. **Nel pannello **Automazioni** a sinistra, scegli \$1 Aggiungi.**

1. Scegli **\$1 Aggiungi automazione**.

1. Nel pannello di destra, scegli **Proprietà**.

1. Aggiorna il nome dell'automazione scegliendo l'icona a forma di matita. Inserisci **deleteFile** e premi **Invio**.

1. Aggiungi un parametro di automazione, utilizzato per passare dati a un'automazione, eseguendo i seguenti passaggi:

   1. Nel menu **Proprietà** a destra, in **Parametri di automazione**, scegli **\$1 Aggiungi**.

   1. Scegli l'icona a forma di matita per modificare il parametro di automazione. Aggiorna il nome del parametro **fileName** e premi **Invio**.

1. Aggiungere un'azione **Elimina oggetto** effettuando le seguenti operazioni:

   1. Nel pannello di destra, scegli **Azioni**.

   1. Scegli **Elimina oggetto** per aggiungere un'azione. L'azione deve avere un nome`DeleteObject1`.

1. Configura l'azione eseguendo i seguenti passaggi:

   1. Scegli l'azione dall'area di disegno per aprire il menu **Proprietà** a destra.

   1. Per **Connector**, scegli il connettore Amazon S3 che hai creato tra i prerequisiti.

   1. Per **Configurazione**, inserisci il seguente testo, sostituendolo *bucket\$1name* con il bucket che hai creato nei prerequisiti:

      ```
      {
        "Bucket": "bucket_name",
        "Key": params.fileName
      }
      ```

### Crea un'automazione `viewFile`
<a name="automations-s3-view-file"></a>

Crea un'automazione che recuperi un singolo oggetto da un bucket Amazon S3 specificato. Successivamente, configurerai questa automazione con un componente di visualizzazione di file per visualizzare l'oggetto.

1. **Nel pannello **Automazioni** a sinistra, scegli \$1 Aggiungi.**

1. Scegli **\$1 Aggiungi automazione**.

1. Nel pannello di destra, scegli **Proprietà**.

1. Aggiorna il nome dell'automazione scegliendo l'icona a forma di matita. Inserisci **viewFile** e premi **Invio**.

1. Aggiungi un parametro di automazione, utilizzato per passare dati a un'automazione, eseguendo i seguenti passaggi:

   1. Nel menu **Proprietà** a destra, in **Parametri di automazione**, scegli **\$1 Aggiungi**.

   1. Scegli l'icona a forma di matita per modificare il parametro di automazione. Aggiorna il nome del parametro **fileName** e premi **Invio**.

1. Aggiungete un'azione **Ottieni oggetto** effettuando le seguenti operazioni:

   1. Nel pannello di destra, scegli **Azioni**.

   1. Scegli **Ottieni oggetto** per aggiungere un'azione. L'azione deve avere un nome`GetObject1`.

1. Configura l'azione eseguendo i seguenti passaggi:

   1. Scegli l'azione dall'area di disegno per aprire il menu **Proprietà** a destra.

   1. Per **Connector**, scegli il connettore Amazon S3 che hai creato tra i prerequisiti.

   1. Per **Configurazione**, inserisci il seguente testo, sostituendolo *bucket\$1name* con il bucket che hai creato nei prerequisiti:

      ```
      {
        "Bucket": "bucket_name",
        "Key": params.fileName
      }
      ```

1. Per impostazione predefinita, le automazioni non creano output. Configura l'automazione per creare un output di automazione eseguendo i seguenti passaggi:

   1. Nella navigazione a sinistra, scegli l'automazione **ViewFile**.

   1. **Nel menu **Proprietà** a destra, in Output di **automazione, scegli \$1 Aggiungi output**.**

   1. Per **Output**, immettete**\$1\$1results.GetObject1.Body.transformToWebStream()\$1\$1**. Questa espressione restituisce il contenuto dell'azione.
**Nota**  
È possibile leggere la risposta di `S3 GetObject` nei seguenti modi:  
`transformToWebStream`: restituisce uno stream, che deve essere consumato per recuperare i dati. Se utilizzato come output di automazione, l'automazione lo gestisce e l'output può essere utilizzato come fonte di dati di un componente di visualizzazione di immagini o PDF. Può anche essere usato come input per un'altra operazione, ad esempio`S3 PutObject`.
`transformToString`: restituisce i dati grezzi dell'automazione e deve essere utilizzato in un' JavaScript azione se i file contengono contenuto di testo, ad esempio dati JSON. Deve essere atteso, ad esempio: `await results.GetObject1.Body.transformToString();`
`transformToByteArray`: restituisce un array di numeri interi senza segno a 8 bit. Questa risposta serve allo scopo di un array di byte, che consente l'archiviazione e la manipolazione di dati binari. Deve essere atteso, ad esempio: `await results.GetObject1.Body.transformToByteArray();`

Successivamente, aggiungerai componenti alle pagine che hai creato in precedenza e li configurerai con le tue automazioni in modo che gli utenti possano utilizzare la tua app per visualizzare ed eliminare file.

## Aggiungi e configura i componenti della pagina
<a name="automations-s3-components"></a>

Ora che hai creato le automazioni che definiscono la logica di business e la funzionalità della tua app, potrai creare componenti e connetterli entrambi.

### Aggiungi componenti alla pagina **FileList**
<a name="automations-s3-components-filelist-page"></a>

La **FileList**pagina creata in precedenza verrà utilizzata per visualizzare un elenco di file nel bucket Amazon S3 configurato e ulteriori dettagli su qualsiasi file scelto dall'elenco. Per farlo, dovrai fare quanto segue:

1. Create un componente di tabella per visualizzare l'elenco dei file. Configurerai le righe della tabella da riempire con l'output dell'automazione **GetFiles** che hai creato in precedenza.

1. Crea un componente di visualizzazione PDF per visualizzare un singolo PDF. Configurerai il componente per visualizzare un file selezionato dalla tabella, utilizzando l'automazione **ViewFile** che hai creato in precedenza per recuperare il file dal tuo bucket.

**Per aggiungere componenti alla pagina **FileList****

1. Scegli la scheda **Pagine** nella parte superiore dell'area di disegno.

1. Nel pannello **Pagine** a sinistra, scegli la **FileList**pagina.

1. Nella pagina **Componenti** a destra, trova il componente **Tabella** e trascinalo al centro dell'area di disegno.

1. Scegli il componente della tabella che hai appena aggiunto alla pagina.

1. **Nel menu **Proprietà** a destra, scegli il menu a discesa **Sorgente** e seleziona Automazione.**

1. **Scegli il menu a discesa **Automazione** e seleziona l'automazione GetFiles.** La tabella utilizzerà l'output dell'automazione **GetFiles** come contenuto.

1. Aggiungi una colonna da riempire con il nome del file.

   1. Nel menu **Proprietà** a destra, accanto a **Colonne**, scegli **\$1 Aggiungi**.

   1. Scegli l'icona a forma di freccia a destra della **colonna Colonna1** che è stata appena aggiunta.

   1. Per l'**etichetta Column**, rinomina la colonna in. **Filename**

   1. In **Valore**, specifica **\$1\$1currentRow.Key\$1\$1**.

   1. Scegliete l'icona a forma di freccia nella parte superiore del pannello per tornare al pannello **Proprietà** principale.

1. Aggiungete un'azione di tabella per eliminare il file in una riga.

   1. Nel menu **Proprietà** a destra, accanto ad **Azioni**, scegli **\$1 Aggiungi**.

   1. In **Azioni**, rinomina **Button** in. **Delete**

   1. Scegli l'icona a forma di freccia a destra dell'azione **Elimina** che è stata appena rinominata.

   1. In **Un clic**, scegli **\$1 Aggiungi azione** e scegli **Invoke automation**.

   1. Scegli l'azione che è stata aggiunta per configurarla.

   1. Per **Nome azione** immetti **DeleteRecord**.

   1. In **Invoke automation**, seleziona**deleteFile**.

   1. Nella casella di testo del parametro, immettete**\$1\$1currentRow.Key\$1\$1**.

   1. In **Valore**, specifica **\$1\$1currentRow.Key\$1\$1**.

1. Nel pannello di destra, scegliete **Componenti** per visualizzare il menu dei componenti. Sono disponibili due opzioni per visualizzare i file:
   + Un **visualizzatore di immagini** per visualizzare file con `.jpg` estensione `.png``.jpeg`, o.
   + Un componente di **visualizzazione PDF** per visualizzare i file PDF.

   In questo tutorial, aggiungerai e configurerai il componente di **visualizzazione PDF**.

1. Aggiungi il componente **visualizzatore PDF**.

   1. Nella pagina **Componenti** a destra, trova il componente del **visualizzatore PDF** e trascinalo nell'area di disegno, sotto il componente della tabella.

   1. Scegli il componente di **visualizzazione PDF** che è stato appena aggiunto.

   1. **Nel menu **Proprietà** a destra, scegli il menu a discesa **Sorgente** e seleziona Automazione.**

   1. **Scegli il menu a discesa **Automazione** e seleziona l'automazione ViewFile.** La tabella utilizzerà l'output dell'automazione **ViewFile** come contenuto.

   1. Nella casella di testo del parametro, immettete**\$1\$1ui.table1.selectedRow["Filename"]\$1\$1**.

   1. Nel pannello di destra, c'è anche un campo **Nome file**. Il valore di questo campo viene utilizzato come intestazione per il componente di visualizzazione PDF. Inserisci lo stesso testo del passaggio precedente:**\$1\$1ui.table1.selectedRow["Filename"]\$1\$1**.

### Aggiungi componenti alla **UploadFile**pagina
<a name="automations-s3-components-uploadfile-page"></a>

La **UploadFile**pagina conterrà un selettore di file che può essere utilizzato per selezionare e caricare un file nel bucket Amazon S3 configurato. Aggiungerai il componente di **caricamento S3** alla pagina, che gli utenti possono utilizzare per selezionare e caricare un file.

1. Nel pannello **Pagine** a sinistra, scegli la pagina. **UploadFile**

1. Nella pagina **Componenti** a destra, trova il componente di **caricamento S3** e trascinalo al centro dell'area di disegno.

1. Scegli il componente di caricamento S3 che hai appena aggiunto alla pagina.

1. Nel menu **Proprietà** a destra, configura il componente:

   1. Nel menu a discesa **Connettore**, seleziona il connettore Amazon S3 creato nei prerequisiti.

   1. Per **Bucket**, inserisci il nome del tuo bucket Amazon S3.

   1. Per **Nome file**, inserisci. **\$1\$1ui.s3Upload1.files[0]?.nameWithExtension\$1\$1**

   1. Per **Dimensione massima del file**, inseriscilo **5** nella casella di testo e assicurati che **MB** sia selezionato nel menu a discesa.

   1. Nella sezione **Trigger**, aggiungi le azioni che vengono eseguite dopo caricamenti riusciti o non riusciti eseguendo i seguenti passaggi:

      Per aggiungere un'azione che viene eseguita dopo un caricamento riuscito:

      1. **In caso di successo**, scegli **\$1 Aggiungi azione** e seleziona **Naviga**.

      1. Scegli l'azione che è stata aggiunta per configurarla.

      1. Per **Tipo di navigazione**, scegli **Pagina**.

      1. Per **Naviga verso**, scegli**FileList**.

      1. Scegliete l'icona a forma di freccia nella parte superiore del pannello per tornare al pannello principale **Proprietà**.

      Per aggiungere un'azione che viene eseguita dopo caricamenti non riusciti:

      1. **In **caso di errore**, scegli **\$1 Aggiungi azione** e seleziona Naviga.**

      1. Scegli l'azione che è stata aggiunta per configurarla.

      1. Per **Tipo di navigazione**, scegli **Pagina**.

      1. Per **Naviga verso**, scegli**FailUpload**.

      1. Scegliete l'icona a forma di freccia nella parte superiore del pannello per tornare al pannello principale **Proprietà**.

### Aggiungi componenti alla **FailUpload**pagina
<a name="automations-s3-components-failupload-page"></a>

La **FailUpload**pagina è una pagina semplice contenente una casella di testo che informa gli utenti che il caricamento non è riuscito.

1. Nel pannello **Pagine** a sinistra, scegli la pagina. **FailUpload**

1. Nella pagina **Componenti** a destra, trova il componente **Testo** e trascinalo al centro dell'area di disegno.

1. Scegli il componente di testo che hai appena aggiunto alla pagina.

1. Nel menu **Proprietà** a destra, in **Valore**, immettete**Failed to upload, try again**.

## Aggiorna le impostazioni di sicurezza dell'app
<a name="automations-s3-components-app-security-settings"></a>

Ogni applicazione in App Studio dispone di impostazioni di sicurezza dei contenuti che puoi utilizzare per limitare contenuti o risorse esterne o su quali domini di Amazon S3 puoi caricare oggetti. L'impostazione predefinita prevede il blocco di tutti i domini. Per caricare oggetti su Amazon S3 dalla tua applicazione, devi aggiornare l'impostazione per consentire ai domini su cui desideri caricare oggetti.

**Per consentire ai domini di caricare oggetti su Amazon S3**

1. Scegli la scheda Impostazioni dell'**app**.

1. Scegli la scheda **Impostazioni di sicurezza dei contenuti**.

1. Per **Connect source**, scegli **Consenti tutte le connessioni**.

1. Scegli **Save** (Salva).

## Passaggi successivi: visualizza in anteprima e pubblica l'applicazione per il test
<a name="automations-s3-preview-publish-test"></a>

L'applicazione è ora pronta per il test. Per ulteriori informazioni sull'anteprima e la pubblicazione delle applicazioni, consulta[Visualizzazione in anteprima, pubblicazione e condivisione delle applicazioni](applications-preview-publish-share.md).

# Richiamo delle funzioni Lambda in un'app App Studio
<a name="tutorial-lambda"></a>

Questo tutorial mostra come connettere App Studio a Lambda e richiamare le funzioni Lambda dalle tue app.

## Prerequisiti
<a name="tutorial-lambda-prerequisites"></a>

Questa guida presuppone che tu abbia soddisfatto i seguenti prerequisiti:

1. Hai creato un'app App Studio. Se non ne hai una, puoi creare un'app vuota da utilizzare nel tutorial. Per ulteriori informazioni, consulta [Creazione di un’applicazione](applications-create.md).

**Nota**  
Sebbene non sia necessaria una funzione Lambda per seguire questo tutorial e imparare a configurarla, può essere utile averne una per assicurarsi di aver configurato correttamente l'app. [Questo tutorial non contiene informazioni sulla creazione di funzioni Lambda. Per ulteriori informazioni, consulta la Guida per gli AWS Lambda sviluppatori.](https://docs.aws.amazon.com/lambda/latest/dg/)

## Creare un connettore Lambda
<a name="tutorial-lambda-create-connector"></a>

Per utilizzare le funzioni Lambda nella tua app App Studio, devi utilizzare un connettore per connettere App Studio a Lambda e fornire l'accesso alle tue funzioni. Devi essere un amministratore per creare connettori in App Studio. Per ulteriori informazioni sulla creazione di connettori Lambda, inclusi i passaggi per crearne uno, vedere. [Connect a AWS Lambda](connectors-lambda.md)

## Creare e configurare un'automazione
<a name="tutorial-lambda-automation"></a>

Le automazioni vengono utilizzate per definire la logica dell'applicazione e sono costituite da azioni. Per richiamare una funzione Lambda nella tua app, devi prima aggiungere e configurare un'azione *Invoke Lambda* a un'automazione. Utilizza i passaggi seguenti per creare un'automazione e aggiungervi l'azione *Invoke Lambda*.

1. Durante la modifica dell'app, scegli la scheda **Automazioni**.

1. Scegli **\$1 Aggiungi automazione**.

1. Nel menu **Azioni** a destra, scegli **Invoke Lambda** per aggiungere il passaggio all'automazione.

1. Scegli il nuovo passaggio Lambda nell'area di disegno per visualizzarne e configurarne le proprietà.

1. Nel menu **Proprietà** a destra, configura il passaggio eseguendo i seguenti passaggi:

   1. In **Connector**, seleziona il connettore creato per connettere App Studio alle tue funzioni Lambda.

   1. In **Nome funzione**, inserisci il nome della tua funzione Lambda.

   1. In **Evento funzione**, inserisci l'evento da passare alla funzione Lambda. Nell'elenco seguente sono riportati alcuni esempi di casi d'uso comuni:
      + Passare il valore di un parametro di automazione, ad esempio un nome di file o un'altra stringa: `varName: params.paramName`
      + Trasmissione del risultato di un'azione precedente: `varName: results.actionName1.data[0].fieldName`
      + *Se aggiungi un'azione *Invoke Lambda* all'interno di un'azione Loop, puoi inviare campi da ogni elemento iterato simili ai parametri:* `varName: currentItem.fieldName`

   1. Il campo **Mocked output** può essere utilizzato per fornire un output fittizio per testare l'app durante l'anteprima, dove i connettori non sono attivi.

## Configura un elemento dell'interfaccia utente per eseguire l'automazione
<a name="tutorial-lambda-create-pages"></a>

Ora che hai un'automazione configurata con un'azione per richiamare la funzione Lambda, puoi configurare un elemento dell'interfaccia utente per eseguire l'automazione. In questo tutorial, creerai un pulsante che esegue l'automazione quando viene premuto. 

**Suggerimento**  
Puoi anche eseguire automazioni da altre automazioni con l'azione *Invoke* automation.

**Per eseguire l'automazione da un pulsante**

1. Durante la modifica dell'app, scegli la scheda **Pagine**.

1. Nel menu a destra, scegli il componente **Button** per aggiungere un pulsante alla pagina.

1. Scegli il nuovo pulsante per configurarlo.

1. Nel menu **Proprietà** a destra, in **Trigger**, scegli **\$1 Aggiungi** e scegli **Invoke** automation.

1. Scegli il nuovo trigger di richiamo dell'automazione per configurarlo.

1. In **Invoke automation**, seleziona l'automazione che richiama la tua funzione Lambda e configura tutti i parametri che desideri inviare all'automazione.

Ora, qualsiasi utente che sceglie questo pulsante nell'app provocherà l'esecuzione dell'automazione configurata.

## Passaggi successivi: visualizza in anteprima e pubblica l'applicazione per il test
<a name="tutorial-lambda-preview-publish-test"></a>

L'applicazione è ora pronta per il test. Quando si visualizza l'anteprima dell'app nell'ambiente di sviluppo, i connettori non sono attivi, quindi non è possibile testare l'automazione durante l'anteprima poiché utilizza un connettore a cui connettersi. AWS Lambda Per testare la funzionalità dell'app che dipende dai connettori, devi pubblicare l'app nell'ambiente di test. Per ulteriori informazioni sull'anteprima e la pubblicazione delle applicazioni, consulta[Visualizzazione in anteprima, pubblicazione e condivisione delle applicazioni](applications-preview-publish-share.md).

# Crea la tua app App Studio con l'intelligenza artificiale generativa
<a name="generative-ai"></a>

AWS App Studio offre funzionalità di intelligenza artificiale generativa integrate per accelerare lo sviluppo e semplificare le attività comuni. Puoi sfruttare l'intelligenza artificiale generativa per generare e modificare app, modelli di dati, dati di esempio e persino ottenere assistenza contestuale durante la creazione di app.

## Generazione della tua app
<a name="generative-ai-generate-app"></a>

Per un avvio accelerato, puoi generare intere applicazioni utilizzando istruzioni in linguaggio naturale basate sull'intelligenza artificiale. Questa funzionalità consente di descrivere la funzionalità desiderata dell'app e l'intelligenza artificiale creerà automaticamente i modelli di dati, le interfacce utente, i flussi di lavoro e i connettori. Per ulteriori informazioni sulla generazione di un'app con l'intelligenza artificiale, consulta. [Creazione di un’applicazione](applications-create.md)

## Creazione o modifica della tua app
<a name="generative-ai-build-app"></a>

Durante la modifica dell'applicazione, puoi utilizzare la chat per descrivere le modifiche che desideri apportare e l'app viene aggiornata automaticamente. Puoi scegliere tra i prompt di esempio esistenti o inserire il tuo prompt. La chat può essere utilizzata per aggiungere, modificare e rimuovere componenti supportati e anche per creare e configurare automazioni e azioni. Utilizza la seguente procedura per utilizzare l'intelligenza artificiale per modificare o creare la tua applicazione.

**Per modificare la tua app con l'intelligenza artificiale**

1. Se necessario, modifica l'app per accedere allo studio dell'applicazione.

1. (Facoltativo) Seleziona la pagina o il componente che desideri modificare con AI.

1. Scegli **Costruisci con AI** nell'angolo in basso a sinistra per aprire la chat.

1. Inserisci le modifiche che desideri apportare o scegli tra le istruzioni di esempio.

1. Rivedi le modifiche da apportare. Se desideri che le modifiche vengano apportate, scegli **Conferma**. Altrimenti, inserisci un altro prompt.

1. Rivedi il riepilogo delle modifiche.

## Generazione dei modelli di dati
<a name="generative-ai-data-model"></a>

Puoi generare automaticamente un'entità con campi, tipi di dati e azioni sui dati in base al nome dell'entità fornito. Per ulteriori informazioni sulla creazione di entità, inclusa la creazione di entità utilizzando GenAi, vedere[Creazione di un'entità in un'app App Studio](data-entities-create.md).

È inoltre possibile aggiornare un'entità esistente nei seguenti modi:
+ Aggiungere altri campi a un'entità. Per ulteriori informazioni, consulta [Aggiungere, modificare o eliminare i campi dell'entità](data-entities-edit-fields.md).
+ Aggiungi azioni relative ai dati a un'entità. Per ulteriori informazioni, consulta [Creazione di azioni relative ai dati](data-entities-edit-data-actions.md#data-entities-data-action-add).

## Generazione di dati di esempio
<a name="generative-ai-generate-sample-data"></a>

Puoi generare dati di esempio per le tue entità in base ai campi dell'entità. Ciò è utile per testare l'applicazione prima di connettere fonti di dati esterne o per testare l'applicazione nell'ambiente di sviluppo, che non comunica con fonti di dati esterne. Per ulteriori informazioni, consulta [Aggiungere o eliminare dati di esempio](data-entities-edit-sample-data.md).

Una volta pubblicata l'app su Testing or Production, le sorgenti di dati e i connettori in tempo reale vengono utilizzati in tali ambienti.

## Configurazione delle azioni per i servizi AWS
<a name="generative-ai-aws-actions-configuration"></a>

Durante l'integrazione con AWS servizi come Amazon Simple Email Service, puoi utilizzare l'intelligenza artificiale per generare una configurazione di esempio con campi precompilati in base al servizio selezionato. Per provarlo, nel menu **Proprietà** di un'azione di automazione **Invoke AWS**, espandi il campo **Configurazione** scegliendo la freccia a doppia faccia. Quindi, scegli **Genera** una configurazione di esempio.

## Risposte beffarde
<a name="generative-ai-mock-responses"></a>

È possibile generare risposte fittizie per le azioni di servizio. AWS Ciò è utile per testare l'applicazione nell'ambiente di sviluppo, che non comunica con fonti di dati esterne.

## Chiedere aiuto all'IA durante la creazione
<a name="generative-ai-ask-ai"></a>

All'interno dello studio applicativo, troverai il pulsante **Chiedi aiuto all'IA** sulle risorse o sulle proprietà supportate. Utilizzatelo per ottenere suggerimenti contestuali, documentazione e indicazioni relative alla vista corrente o al componente selezionato. Poni domande generali su App Studio, sulle best practice per la creazione di app o sul caso d'uso specifico dell'applicazione per ricevere informazioni e consigli personalizzati.

# Creazione, modifica ed eliminazione di applicazioni
<a name="applications-create-edit-delete"></a>

**Contents**
+ [Creazione di un’applicazione](applications-create.md)
+ [Importazione di applicazioni](applications-import.md)
  + [App importabili fornite da App Studio](applications-import.md#app-catalog)
+ [Duplicazione delle applicazioni](applications-duplicate.md)
+ [Modificare o creare un'applicazione](applications-edit.md)
+ [Modificare una versione dell'app pubblicata in precedenza](applications-edit-previously-published-version.md)
+ [Ridenominazione di un'applicazione](applications-rename.md)
+ [Eliminazione di un’applicazione](applications-delete.md)

# Creazione di un’applicazione
<a name="applications-create"></a>

Utilizza la seguente procedura per creare un'applicazione in App Studio.

**Come creare un’applicazione**

1. Nel riquadro di navigazione, scegli **Le mie applicazioni** nella sezione **Crea** per accedere a un elenco delle tue applicazioni.

1. Scegli **\$1 Crea app**.

1. Nella finestra di dialogo **Crea app**, assegna un nome all'applicazione e scegli uno dei seguenti metodi di creazione dell'app:
   + **Genera un'app con l'intelligenza artificiale**: scegli questa opzione per descrivere la tua app con un linguaggio naturale e consenti all'IA di generare l'app e le relative risorse per te.
   + **Inizia da zero**: scegli questa opzione per iniziare a creare da un'app vuota.

1. Scegli **Next (Successivo)**.

1. Se hai scelto **Genera un'app con AI**:

   1. Nella finestra di dialogo **Connetti a dati esistenti**, aggiungi eventuali fonti di dati esistenti alla tua app selezionando il **Connettore** che fornisce ad App Studio l'accesso alle origini dati, quindi seleziona **Tabelle** e scegli **Avanti**. L'aggiunta di fonti di dati qui aiuta l'IA a generare un'app ottimizzata per te. Puoi saltare questo passaggio e aggiungere fonti di dati in un secondo momento scegliendo **Ignora**.

   1. Dopo un breve ritardo (pochi minuti), verrai indirizzato alla pagina **Genera la tua app usando l'IA**, dove puoi descrivere l'app che desideri creare.

   1. Puoi iniziare a descrivere la tua app nella chat oppure puoi scegliere e personalizzare un prompt di esempio fornito.

   1. Dopo aver analizzato la richiesta, consulta i requisiti e la panoramica dell'app. Usa la chat per richiedere eventuali modifiche oppure scegli Ricomincia per **ricominciare** da capo da una richiesta vuota.

   1. Quando sei pronto, scegli **Genera app**.

   1. Una volta generata, visualizza l'anteprima dell'app in un'altra scheda scegliendo **Anteprima app**. Quando sei pronto per iniziare a modificare, puoi scegliere **Modifica app**. Sfoglia le pagine, le automazioni e i dati della tua applicazione per familiarizzarti con essa. Controlla eventuali errori o avvisi nel pannello di debug inferiore. Per ulteriori informazioni sulla generazione di un'app utilizzando l'intelligenza artificiale, consulta. [Tutorial: generare un'app utilizzando l'intelligenza artificiale](getting-started-tutorial-ai.md) Per informazioni generali su come funziona la creazione in App Studio, consulta[Come funziona AWS App Studio](how-it-works.md).

1. Se hai scelto **Inizia da zero**:

   1. Nella finestra di dialogo **Connetti a dati esistenti**, aggiungi eventuali fonti di dati esistenti alla tua app selezionando il **Connettore** che fornisce ad App Studio l'accesso alle origini dati, quindi seleziona **Tabelle** e scegli **Avanti**. **Puoi saltare questo passaggio e aggiungere fonti di dati in un secondo momento scegliendo Ignora.**

   1. Una volta creata l'app, scegli **Modifica app** per iniziare a modificare l'app. Per maggiori informazioni sulla creazione da un'app vuota, consulta[Tutorial: inizia a creare da un'app vuota](getting-started-tutorial-empty.md). Per informazioni generali su come funziona la creazione in App Studio, consulta[Come funziona AWS App Studio](how-it-works.md).

# Importazione di applicazioni
<a name="applications-import"></a>

Puoi importare una copia di un'applicazione esportata nella tua istanza di App Studio. Puoi importare app che sono state esportate da altre istanze di App Studio o app da un catalogo fornito da App Studio. L'importazione di un'app dal catalogo di app di App Studio può aiutarti a iniziare a usare un'app con funzionalità simili o aiutarti a scoprire come creare app in App Studio esplorando l'app importata.

Quando importi un'app nell'istanza, viene creata una copia dell'app originale nell'istanza. Dopo aver creato la nuova app, accedi all'ambiente di sviluppo dell'app, dove puoi visualizzarla in anteprima e sfogliare le funzionalità dell'app.

**avvertimento**  
Quando importate un'app, state importando tutta la logica dall'applicazione, il che potrebbe causare comportamenti indesiderati o imprevisti. Ad esempio, potrebbero esserci interrogazioni distruttive che eliminano i dati dai database collegati all'applicazione. Si consiglia di esaminare attentamente l'applicazione e la relativa configurazione e di testarla su risorse non di produzione prima di collegare i dati di produzione.

**Per importare un'applicazione**

1. Nel riquadro di navigazione, scegli **Le mie applicazioni** nella sezione **Crea** per accedere a un elenco delle tue applicazioni.

1. Scegli la freccia del menu a discesa accanto a **\$1 Crea app**.

1. Scegli **Importa app**.

1. Nella finestra di dialogo **Importa app**, in **Importa codice**, inserisci il codice di importazione dell'applicazione che desideri importare. Per un elenco delle app fornite da App Studio che possono essere importate, incluse le descrizioni delle app e i codici di importazione, consulta[App importabili fornite da App Studio](#app-catalog).

1. Scegli **Importa** per importare l'app e vai all'Ambiente di sviluppo dell'app importata per visualizzarla o modificarla. Per informazioni sulla creazione di app in App Studio, consulta [Come funziona AWS App Studio](how-it-works.md)

## App importabili fornite da App Studio
<a name="app-catalog"></a>

App Studio fornisce app che possono essere importate nella tua istanza per aiutarti a imparare a creare app. Per vedere come vengono implementate le funzionalità specifiche delle app in App Studio, puoi visualizzare in anteprima le applicazioni e quindi sfogliare la loro configurazione nell'ambiente di sviluppo.

La tabella seguente contiene l'elenco delle applicazioni, i relativi codici di importazione e una breve descrizione delle app. Ogni app include una `README` pagina che contiene informazioni sull'app che è possibile visualizzare dopo l'importazione.


| Nome dell'app | Description | Codice di importazione | 
| --- | --- | --- | 
|  **Swag Request Sondaggio**  |  Un'applicazione interna per la richiesta di denaro progettata per consentire ai dipendenti di ordinare prodotti aziendali a marchio. I dipendenti possono selezionare gli articoli e specificare le dimensioni e inviare la richiesta tramite un semplice modulo. Questa applicazione gestisce tutti i dati tramite l'archiviazione integrata, eliminando la necessità di connessioni esterne.  |  Sondaggio Swag Request/EC4F5FAF-E2F8-42EE-AB8D-6723D8CA21B2  | 
|  **Monitoraggio Sprint**  |  Un'applicazione di gestione degli sprint che i team possono utilizzare per organizzare e tenere traccia del lavoro di sviluppo del software. Gli utenti possono creare sprint, aggiungere attività, assegnare lavoro e monitorare i progressi tramite visualizzazioni dedicate per sprint, track e task. Questa applicazione gestisce tutti i dati tramite l'archiviazione integrata, eliminando la necessità di connessioni esterne.  |  Sprint Tracking/8F31E160-771F-48D7-87B0-374E285E2FBC  | 
|  **Amazon Review Sentiment Tracker**  |  Questa applicazione è uno strumento di analisi del feedback dei clienti che genera punteggi di sentiment dalle recensioni dei prodotti per aiutare le aziende a comprendere la soddisfazione dei clienti. L'applicazione include utilità di generazione di dati di esempio per test rapidi e richiede un connettore Amazon Bedrock per approfondimenti basati sull'intelligenza artificiale, mantenendo tutti gli altri dati all'interno del sistema di storage integrato.  |  Amazon Review Sentiment Tracker/60F0DAE4-F8E2-4C20-9583-FA456F5EBFAB  | 
|  **Elaborazione di fatture e ricevute**  |  Questa applicazione per l'elaborazione delle ricevute consente di risparmiare tempo e riduce gli errori automatizzando l'immissione manuale dei dati e semplificando i flussi di lavoro di approvazione dei documenti. La soluzione richiede connettori Amazon Textract, Amazon S3 e Amazon SES. Utilizza un Amazon Textract per analizzare ed estrarre i dati dalle ricevute archiviate in Amazon S3, quindi elabora e invia tramite e-mail le informazioni estratte agli approvatori utilizzando Amazon SES.  |  Elaborazione di fatture e ricevute/98BDE3AE-E454-4B18-A1E6-6F23E8B2A4F1  | 
|  **Ispezione e verifica dell'inventario**  |  Un'applicazione per la gestione delle ispezioni di magazzino e il monitoraggio delle apparecchiature. Gli utenti possono effettuare valutazioni delle pass/fail apparecchiature in base all'ubicazione della stanza, monitorare i livelli di inventario e visualizzare la cronologia delle ispezioni. L'applicazione fornisce un sistema centralizzato per tracciare sia le ispezioni degli impianti che lo stato delle apparecchiature. Questa applicazione gestisce tutti i dati tramite l'archiviazione integrata, eliminando la necessità di connessioni esterne.  |  Ispezione e verifica dell'inventario/CF570A06-1C5E-4DD7-9EA8-5C04723D687F  | 
|  **Monitoraggio dell'adozione del prodotto**  |  Un'applicazione completa per la gestione dello sviluppo del prodotto che centralizza il feedback dei clienti, le richieste di funzionalità e gli appunti delle riunioni con i clienti. I team possono tenere traccia delle interazioni con i clienti, organizzare i requisiti e generare report basati sull'intelligenza artificiale per la pianificazione trimestrale della roadmap. L'applicazione include utilità di dati di esempio e sfrutta Amazon Bedrock per approfondimenti sull'intelligenza artificiale e Amazon Aurora PostgreSQL per la gestione dei dati.  |  Monitoraggio dell'adozione del prodotto/9B3A4437-BB50-467F-AE9E-D108776B7CA1  | 
|  **Incorporamento rapido**  |  Un'applicazione demo che consente agli utenti di visualizzare le analisi mentre lavorano con i dati sottostanti. L'app contiene due metodi per incorporare le dashboard di Amazon Quick in App Studio: un approccio basato su API per utenti registrati e anonimi (che richiede Quick connector) e un'integrazione iFrame per dashboard pubbliche.  |  Incorporamento Quicksight /0CDC15FC-CA8B-41B7-869E-ED13C9072BC8  | 
|  **Lavello da cucina**  |  Un'applicazione di riferimento che mostra suggerimenti e best practice avanzati per lo sviluppo di App Studio. Include esempi pratici di gestione dello stato, gestione dei dati CSV, integrazione delle API del browser e modelli di interfaccia utente che i builder possono studiare e implementare nelle proprie applicazioni. Nessuno degli esempi richiede connessioni esterne.  |  Lavello da cucina App Studio/1CFE6B2F-544C-4611-B82C-80EADC76A0C8  | 

# Duplicazione delle applicazioni
<a name="applications-duplicate"></a>

I proprietari e i comproprietari delle applicazioni possono duplicare le proprie app per crearne una copia esatta. La duplicazione delle app è utile se desideri conservare lo stato corrente a scopo di test o utilizzare l'app duplicata come punto di partenza per creare una nuova app.

**Per duplicare un'applicazione**

1. Nel riquadro di navigazione, scegli **Le mie applicazioni** nella sezione **Crea**. Verrai indirizzato a una pagina che mostra un elenco di applicazioni a cui hai accesso.

1. Scegli il menu a discesa nella colonna **Azioni** dell'applicazione che desideri duplicare.

1. Scegliere **Duplicate** (Duplica). Se l'opzione **Duplica** non è disponibile, probabilmente non sei il proprietario o il comproprietario dell'applicazione.

1. Facoltativamente, fornisci un nome dell'app duplicata. Il nome predefinito è *Current\$1App\$1Name COPY*.

1. Scegliere **Duplicate** (Duplica).

# Modificare o creare un'applicazione
<a name="applications-edit"></a>

Utilizza la seguente procedura per modificare un'applicazione in App Studio.

**Per modificare (creare) un'applicazione**

1. Nel riquadro di navigazione, scegli **Le mie applicazioni** nella sezione **Crea**. Verrai indirizzato a una pagina che mostra un elenco di applicazioni a cui hai accesso.

1. Nella colonna **Azioni** dell'applicazione che desideri modificare, scegli **Modifica**. Verrai indirizzato all'ambiente di sviluppo, dove potrai utilizzare componenti, automazioni e dati per configurare l'aspetto e la funzione dell'applicazione. Per informazioni sulla creazione di applicazioni, consulta[Guida introduttiva ad AWS App Studio](getting-started.md).

# Modificare una versione dell'app pubblicata in precedenza
<a name="applications-edit-previously-published-version"></a>

Utilizza la seguente procedura per modificare una versione pubblicata in precedenza dell'applicazione App Studio. Dopo aver scelto di modificare la versione pubblicata in precedenza, puoi modificare l'app nell'ambiente di sviluppo o pubblicarla in Testing e poi in Production.

**avvertimento**  
La versione pubblicata in precedenza sostituisce la versione in corso dell'app nell'ambiente di sviluppo. Tutte le modifiche non pubblicate all'app andranno perse.

La modifica di una versione pubblicata in precedenza è utile nel caso in cui pubblichi accidentalmente modifiche indesiderate o che danneggiano l'applicazione per gli utenti e desideri creare o modificare ulteriormente la versione precedente dell'app.

**Nota**  
Se rilevi problemi con un'app pubblicata e devi pubblicare immediatamente una versione funzionante in precedenza o desideri pubblicare una versione precedente ma conservare gli ultimi aggiornamenti dell'app nell'ambiente di sviluppo, dovresti invece ripristinare l'app. Per ulteriori informazioni, consulta [Tornare a una versione pubblicata in precedenza](application-rollback-version.md).

**Per modificare una versione dell'app pubblicata in precedenza**

1. Se necessario, accedi allo studio applicativo dell'applicazione.

1. **Scegliete la freccia a discesa accanto al pulsante **Pubblica**, quindi scegliete Centro pubblicazione.**

1. Scegli **Cronologia delle versioni** per visualizzare l'elenco delle versioni dell'applicazione pubblicate in precedenza.

1. Trova la versione che desideri modificare e scegli **Modifica**.

1. Controlla le informazioni e scegli **Ripristina.**

1. La versione che hai scelto di modificare è ora la versione corrente nell'ambiente di sviluppo. Puoi modificarla o pubblicarla nell'ambiente di test così com'è scegliendo **Pubblica**. Una volta pubblicato su Testing, puoi pubblicarlo nuovamente nell'ambiente di produzione, se lo desideri.

# Ridenominazione di un'applicazione
<a name="applications-rename"></a>

Usa la seguente procedura per rinominare un'applicazione in App Studio. È possibile rinominare un'applicazione dall'elenco delle applicazioni o dall'ambiente di sviluppo durante la creazione dell'app.

**Per rinominare un'applicazione**

1. Nel riquadro di navigazione, scegli **Le mie applicazioni** nella sezione **Crea**. Verrai indirizzato a una pagina che mostra un elenco di applicazioni a cui hai accesso.

1. È possibile rinominare un'applicazione da questo elenco o dall'ambiente di sviluppo durante la modifica.
   + Per rinominare da questo elenco:

     1. **Scegli il menu a discesa nella colonna **Azioni** dell'applicazione che desideri rinominare, quindi scegli Rinomina.**

     1. **Assegna un nuovo nome all'applicazione e scegli Rinomina.**
   + Per rinominare dall'ambiente di sviluppo:

     1. Nella colonna **Azioni** dell'applicazione che desideri modificare, scegli **Modifica**.

     1. Nell'ambiente di sviluppo, scegli il nome dell'applicazione e aggiornalo, quindi premi Invio o esci dal campo di testo per salvare le modifiche.

# Eliminazione di un’applicazione
<a name="applications-delete"></a>

Usa la seguente procedura per eliminare un'applicazione in App Studio.

**Come eliminare un’applicazione**

1. Nel riquadro di navigazione, scegli **Le mie applicazioni** nella sezione **Build**. Verrai indirizzato a una pagina che mostra un elenco di applicazioni a cui hai accesso.

1. Scegli il menu a discesa nella colonna **Azioni** dell'applicazione che desideri eliminare.

1. Scegli **Elimina**.

1. Nella finestra di dialogo **Elimina applicazione**, esamina attentamente le informazioni sull'eliminazione delle applicazioni. Se desiderate eliminare l'applicazione, scegliete **Elimina**.

# Visualizzazione in anteprima, pubblicazione e condivisione delle applicazioni
<a name="applications-preview-publish-share"></a>

**Topics**
+ [Visualizzazione in anteprima delle applicazioni](applications-preview.md)
+ [Applicazioni di pubblicazione](applications-publish.md)
+ [Condivisione di applicazioni pubblicate](application-share.md)
+ [Tornare a una versione pubblicata in precedenza](application-rollback-version.md)
+ [Esportazione di applicazioni](applications-export.md)

# Visualizzazione in anteprima delle applicazioni
<a name="applications-preview"></a>

Puoi vedere in anteprima le applicazioni in App Studio per vedere come appariranno agli utenti e testarne le funzionalità utilizzandole e controllando i log in un pannello di debug.

L'ambiente di anteprima dell'applicazione non supporta la visualizzazione di dati in tempo reale o la connessione a risorse esterne con connettori, come le fonti di dati. Per testare la funzionalità nell'ambiente di anteprima, potete utilizzare output simulati nelle automazioni e dati di esempio nelle entità. Per visualizzare l'applicazione con dati in tempo reale, è necessario pubblicarla. Per ulteriori informazioni, consulta [Applicazioni di pubblicazione](applications-publish.md).

L'ambiente di anteprima o di sviluppo non aggiorna l'applicazione pubblicata negli altri ambienti. Se un'applicazione non è stata pubblicata, gli utenti non potranno accedervi finché non sarà pubblicata e condivisa. Se un'applicazione è già stata pubblicata e condivisa, gli utenti continueranno ad accedere alla versione pubblicata e non alla versione utilizzata in un ambiente di anteprima.

**Per visualizzare l'anteprima dell'applicazione**

1. Se necessario, accedete allo studio applicativo dell'applicazione che desiderate visualizzare in anteprima:

   1. Nel riquadro di navigazione, scegli **Le mie applicazioni** nella sezione **Crea**.

   1. Scegli **Modifica** per l'applicazione.

1. Scegliete **Anteprima** per aprire l'ambiente di anteprima dell'applicazione.

1. (Facoltativo) Espandete il pannello di debug selezionandone l'intestazione nella parte inferiore dello schermo. Puoi filtrare il pannello per tipo di messaggio scegliendo il tipo di messaggio nella sezione **Filtra i registri**. Puoi cancellare i log del pannello scegliendo **Cancella** console.

1. Nell'ambiente di anteprima, potete testare l'applicazione navigando tra le sue pagine, usando i suoi componenti e scegliendo i pulsanti per avviare le automazioni che trasferiscono i dati. Poiché l'ambiente di anteprima non supporta dati in tempo reale o connessioni a fonti esterne, potete visualizzare esempi dei dati trasferiti nel pannello di debug.

# Applicazioni di pubblicazione
<a name="applications-publish"></a>

Al termine della creazione e della configurazione dell'applicazione, il passaggio successivo consiste nel pubblicarla per testare i trasferimenti di dati o condividerla con gli utenti finali. Per comprendere le applicazioni di pubblicazione in App Studio, è importante comprendere gli ambienti disponibili. App Studio offre tre ambienti separati, descritti nell'elenco seguente:

1. **Sviluppo**: dove puoi creare e visualizzare in anteprima l'applicazione. Non è necessario eseguire la pubblicazione nell'ambiente di sviluppo, poiché la versione più recente dell'applicazione viene ospitata automaticamente in tale ambiente. In questo ambiente non sono disponibili dati in tempo reale o servizi o risorse di terze parti.

1. **Test**: dove è possibile eseguire test completi della propria applicazione. Nell'ambiente di test, è possibile connettersi, inviare e ricevere dati da altri servizi.

1. **Produzione**: l'ambiente operativo in tempo reale per il consumo da parte dell'utente finale.

Tutta la creazione dell'app avviene nell'ambiente di **sviluppo**. Quindi, pubblica nell'ambiente di **test** per testare il trasferimento dei dati tra altri servizi e il test di accettazione degli utenti (UAT) fornendo un URL di accesso agli utenti finali. Successivamente, pubblica l'app nell'ambiente di **produzione** per eseguire i test finali prima di condividerla con gli utenti. Per ulteriori informazioni sugli ambienti applicativi, consulta[Ambienti applicativi](#application-environments).

Quando si pubblica un'applicazione, questa non è disponibile per gli utenti finché non viene condivisa. Ciò offre l'opportunità di utilizzare e testare l'applicazione negli ambienti di test e produzione prima che gli utenti possano accedervi. Quando pubblicate su Production un'applicazione che è stata precedentemente pubblicata e condivisa, la versione disponibile per gli utenti viene aggiornata.

## Applicazioni di pubblicazione
<a name="application-publish-procedure"></a>

Utilizza la seguente procedura per pubblicare un'applicazione App Studio nell'ambiente di test o di produzione.

**Per pubblicare un'applicazione nell'ambiente di test o di produzione**

1. Nel riquadro di navigazione, scegli **Le mie applicazioni** nella sezione **Compila**. Verrai indirizzato a una pagina che mostra un elenco di applicazioni a cui hai accesso.

1. Scegli **Modifica** per l'applicazione che desideri pubblicare.

1. Scegli **Pubblica** nell'angolo in alto a destra.

1. Nella finestra di dialogo **Pubblica gli aggiornamenti**:

   1. Rivedi le informazioni sulla pubblicazione di un'applicazione.

   1. (Facoltativo) Nella **descrizione della versione**, includi una descrizione di questa versione dell'applicazione.

   1. Scegliete la casella per confermare le informazioni sull'ambiente.

   1. Scegli **Avvia**. L'aggiornamento dell'applicazione nell'ambiente live può richiedere fino a 15 minuti.

1. Per informazioni sulla visualizzazione delle applicazioni negli ambienti di test o di produzione, vedere[Visualizzazione delle applicazioni pubblicate](#application-viewing-published).
**Nota**  
L'utilizzo dell'applicazione nell'ambiente di test o di produzione comporterà il trasferimento dei dati in tempo reale, ad esempio la creazione di record in tabelle di fonti di dati collegate tramite connettori.

Le applicazioni pubblicate che non sono mai state condivise non saranno disponibili per gli utenti o altri builder. Per rendere un'applicazione disponibile agli utenti, è necessario condividerla dopo la pubblicazione. Per ulteriori informazioni, consulta [Condivisione di applicazioni pubblicate](application-share.md).

## Visualizzazione delle applicazioni pubblicate
<a name="application-viewing-published"></a>

È possibile visualizzare le applicazioni pubblicate negli ambienti di test e produzione per testare l'applicazione prima di condividerla con gli utenti finali o altri builder.

**Per visualizzare le applicazioni pubblicate nell'ambiente di test o produzione**

1. Se necessario, accedete allo studio applicativo dell'applicazione che desiderate visualizzare in anteprima:

   1. Nel riquadro di navigazione, scegli **Le mie applicazioni** nella sezione **Crea**.

   1. Scegli **Modifica** per l'applicazione.

1. Scegli la freccia del menu a discesa accanto a **Pubblica** nell'angolo in alto a destra e scegli Centro **pubblicazione**.

1. Dal centro di pubblicazione, puoi visualizzare gli ambienti in cui è pubblicata la tua applicazione. Se l'applicazione è pubblicata negli ambienti di test o produzione, è possibile visualizzare l'app utilizzando il collegamento **URL** di ciascun ambiente.
**Nota**  
L'utilizzo dell'applicazione nell'ambiente di test o produzione comporterà il trasferimento dei dati in tempo reale, ad esempio la creazione di record in tabelle di fonti di dati collegate tramite connettori.

## Ambienti applicativi
<a name="application-environments"></a>

AWS App Studio offre funzionalità di gestione del ciclo di vita delle applicazioni (ALM) con tre ambienti separati: sviluppo, test e produzione. Questo ti aiuta a semplificare le migliori pratiche, come la manutenzione di ambienti separati, il controllo delle versioni, la condivisione e il monitoraggio durante l'intero ciclo di vita delle app.

### Ambiente di sviluppo
<a name="applications-development-environment"></a>

L'ambiente di **sviluppo** è una sandbox isolata in cui è possibile creare app senza connettersi a fonti di dati o servizi in tempo reale utilizzando lo studio dell'applicazione e i dati di esempio. Nell'ambiente di sviluppo, puoi visualizzare in anteprima l'app per visualizzarla e testarla senza compromettere i dati di produzione.

Sebbene la tua app non si connetta ad altri servizi nell'ambiente di sviluppo, puoi configurare diverse risorse nell'app per simulare connettori dati e automazioni in tempo reale.

C'è un pannello di debug pieghevole che include errori e avvisi nella parte inferiore dello studio dell'applicazione nell'ambiente di sviluppo per aiutarti a ispezionare ed eseguire il debug dell'app durante la compilazione. Per ulteriori informazioni sulla risoluzione dei problemi e sul debug delle app, consulta. [Risoluzione dei problemi e debug di App Studio](troubleshooting-and-debugging.md)

### Ambiente di test
<a name="applications-testing-environment"></a>

Una volta completato lo sviluppo iniziale dell'app, il passaggio successivo consiste nella pubblicazione nell'ambiente **di test**. Nell'ambiente di test, l'app può connettersi, inviare dati e ricevere dati da altri servizi. Pertanto, puoi utilizzare questo ambiente per eseguire test completi, inclusi i test di accettazione degli utenti (UAT) fornendo un URL di accesso agli utenti finali.

**Nota**  
La pubblicazione iniziale nell'ambiente di test può richiedere fino a 15 minuti.

La versione dell'app pubblicata nell'ambiente di test verrà rimossa dopo 3 ore di inattività dell'utente finale. **Tuttavia, tutte le versioni persistono e possono essere ripristinate dalla scheda Cronologia delle versioni.**

Le caratteristiche principali dell'ambiente di test sono le seguenti:
+ Test di integrazione con fonti di dati in tempo reale e APIs
+ Test di accettazione degli utenti (UAT) facilitati dall'accesso controllato
+ Ambiente per la raccolta di feedback e la risoluzione dei problemi
+ Capacità di ispezionare ed eseguire il debug delle attività lato client e lato server utilizzando console browser e strumenti per sviluppatori.

Per ulteriori informazioni sulla risoluzione dei problemi e sul debug delle app, consulta. [Risoluzione dei problemi e debug di App Studio](troubleshooting-and-debugging.md)

### Ambiente di produzione
<a name="applications-production-environment"></a>

Dopo aver testato e risolto eventuali problemi, puoi promuovere la versione dell'applicazione dall'ambiente di test all'ambiente di produzione per un utilizzo operativo reale. Sebbene l'ambiente di produzione sia l'ambiente operativo in tempo reale per il consumo da parte degli utenti finali, potete testare la versione pubblicata prima di condividerla con gli utenti.

La versione pubblicata nell'ambiente di produzione verrà rimossa dopo 14 giorni di inattività dell'utente finale. **Tuttavia, tutte le versioni persistono e possono essere ripristinate dalla scheda Cronologia delle versioni.**

Le caratteristiche principali dell'ambiente di produzione sono le seguenti:
+ Ambiente operativo in tempo reale per il consumo da parte dell'utente finale
+ Controllo granulare degli accessi basato sui ruoli
+ Funzionalità di controllo della versione e rollback
+ Capacità di ispezionare ed eseguire il debug solo delle attività lato client
+ Utilizza connettori live, dati, automazioni e APIs

## Gestione delle versioni e dei rilasci
<a name="applications-versioning-release-management"></a>

App Studio offre funzionalità di controllo delle versioni e gestione dei rilasci tramite il suo sistema di controllo delle versioni nel centro di **pubblicazione**.

Funzionalità chiave di controllo delle versioni:
+ La pubblicazione nell'ambiente di test genera nuovi numeri di versione (1.0, 2.0, 3.0...).
+ Il numero di versione non cambia quando si passa dall'ambiente di test a quello di produzione.
+ È possibile ripristinare qualsiasi versione precedente dalla **Cronologia delle versioni**.
+ Le applicazioni pubblicate nell'ambiente di test vengono messe in pausa dopo 3 ore di inattività. **Le versioni sono persistenti e possono essere ripristinate dalla Cronologia delle versioni.**
+ Le applicazioni pubblicate nell'ambiente di produzione vengono rimosse dopo 14 giorni di inattività. Le versioni sono persistenti e possono essere ripristinate dalla Cronologia delle **versioni**.

Questo modello di controllo delle versioni consente un'iterazione rapida mantenendo la tracciabilità, le funzionalità di rollback e le prestazioni ottimali durante tutto il ciclo di sviluppo e test dell'app.

## Manutenzione e operazioni
<a name="applications-versioning-maintenance-operations"></a>

App Studio potrebbe dover ripubblicare automaticamente l'applicazione per eseguire determinate attività di manutenzione e attività operative e per incorporare nuove librerie software. Non è necessaria alcuna azione da parte dell'utente, il costruttore, ma gli utenti finali potrebbero dover accedere nuovamente all'applicazione. In alcune situazioni, potrebbe essere necessario che tu ripubblichi l'applicazione per incorporare nuove funzionalità e librerie che non possiamo aggiungere automaticamente. Dovrai correggere eventuali errori e rivedere gli avvisi prima di ripubblicarli. 

# Condivisione di applicazioni pubblicate
<a name="application-share"></a>

Quando si pubblica un'applicazione che non è ancora stata pubblicata, questa non è disponibile per gli utenti finché non viene condivisa. Una volta condivisa, un'applicazione pubblicata sarà disponibile per gli utenti e non sarà necessario condividerla nuovamente se viene pubblicata un'altra versione.

**Nota**  
Questa sezione riguarda la condivisione delle applicazioni pubblicate con utenti finali o tester. Per informazioni su come invitare altri utenti a creare un'app, consulta. [Creazione di un'app con più utenti](builder-collaboration.md)

**Per condividere un'applicazione pubblicata**

1. **Accedete alla finestra di dialogo Condividi** dall'elenco delle applicazioni o dallo studio applicativo dell'app utilizzando le seguenti istruzioni:
   + Per accedere alla finestra di dialogo **Condividi** dall'elenco delle applicazioni: nel pannello di navigazione, scegli **Le mie applicazioni** nella sezione **Crea**. Scegli il menu a discesa nella colonna **Azioni** dell'applicazione che desideri condividere e scegli **Condividi**.
   + Per accedere alla finestra di dialogo **Condividi** dallo studio dell'applicazione: dallo studio applicativo della tua app, scegli **Condividi** nell'intestazione superiore.

1. Nella finestra di dialogo **Condividi**, scegliete la scheda relativa all'ambiente che desiderate condividere. Se non vedi le schede **Test** o **Produzione**, l'app potrebbe non essere pubblicata nell'ambiente corrispondente. Per ulteriori informazioni sulla pubblicazione, consulta[Applicazioni di pubblicazione](applications-publish.md).

1. Nella scheda appropriata, seleziona i gruppi dal menu a discesa per condividere l'ambiente con loro.

1. (Facoltativo) Assegna un ruolo a livello di app al gruppo per testare o configurare la visibilità condizionale della pagina. Per ulteriori informazioni, consulta [Configurazione della visibilità delle pagine basata sui ruoli](app-level-roles.md).

1. Scegli **Condividi**.

1. (Facoltativo) Copia e condividi il link con gli utenti. Solo gli utenti con cui l'applicazione e l'ambiente sono stati condivisi possono accedere all'applicazione nell'ambiente corrispondente.

# Tornare a una versione pubblicata in precedenza
<a name="application-rollback-version"></a>

Utilizza la seguente procedura per ripristinare l'ambiente di produzione dell'app App Studio a una versione pubblicata in precedenza. Gli utenti finali dell'applicazione ne risentiranno e vedranno la versione ripristinata dell'app dopo la distribuzione. Quando ripristini un'applicazione, questo ripristina anche il codice del componente alla versione precedente alla pubblicazione e influisce sull'intero stack di distribuzione dell'app (codice utente, stato di configurazione del componente). Ciò significa che tutti gli aggiornamenti apportati da App Studio al codice del componente, come le modifiche ai campi o ad altre configurazioni, verranno ripristinati per garantire che la versione ripristinata dell'applicazione funzioni come quando è stata originariamente pubblicata.

La versione in corso dell'applicazione nell'ambiente di sviluppo non viene influenzata dal ripristino della versione pubblicata.

Il ripristino della versione pubblicata di un'applicazione è utile se rilevi problemi con un'app pubblicata e devi pubblicare immediatamente una versione funzionante in precedenza oppure desideri pubblicare una versione precedente e conservare gli ultimi aggiornamenti dell'app nell'ambiente di sviluppo.

**Nota**  
Se desideri ripristinare l'ambiente di sviluppo di un'app a una versione pubblicata in precedenza, devi ripristinare l'applicazione. Per ulteriori informazioni, consulta [Modificare una versione dell'app pubblicata in precedenza](applications-edit-previously-published-version.md).

**Per ripristinare la versione dell'ambiente di produzione a una versione dell'app pubblicata in precedenza**

1. Se necessario, accedi all'ambiente di sviluppo dell'applicazione modificandola. Per ulteriori informazioni, consulta [Modificare o creare un'applicazione](applications-edit.md).

1. Scegli la freccia del menu a discesa della versione nella parte superiore del riquadro Ambiente di **produzione** per visualizzare le versioni disponibili per il rollback. Il menu a discesa contiene le versioni pubblicate negli ultimi 30 giorni. Se questo menu a discesa è disabilitato, è possibile che la pubblicazione di un'app sia già in corso e possa avvenire una sola pubblicazione alla volta.

1. Scegli la versione a cui desideri eseguire il rollback.

1. Inserisci un motivo per cui eseguire il rollback e scegli **Ripristina**. La pubblicazione del rollback inizierà e, una volta completata, l'ambiente di produzione dell'applicazione verrà aggiornato alla versione scelta.
**Nota**  
Puoi anche passare a una versione dell'app pubblicata in precedenza dopo aver eseguito il rollback.

# Esportazione di applicazioni
<a name="applications-export"></a>

Puoi esportare un'istantanea dell'applicazione per condividerla con altre istanze di App Studio. Quando esporti un'app, viene creata un'istantanea dall'ambiente di sviluppo dell'app e viene generato un codice di importazione. Il codice di importazione può quindi essere utilizzato per importare l'applicazione in altre istanze di App Studio, dove può essere visualizzata e creata.

Le app esportate possono essere importate in istanze in qualsiasi istanza Regione AWS supportata da App Studio.

**Per esportare un'applicazione**

1. Nel riquadro di navigazione, scegli **Le mie applicazioni** nella sezione **Crea** per accedere a un elenco delle tue applicazioni.

1. Scegli il menu a discesa nella colonna **Azioni** dell'applicazione che desideri esportare.

1. Scegli **Export** (Esporta).

1. La procedura per generare e condividere un codice di importazione varia a seconda che sia già stato creato o meno un codice di importazione per l'app.
   + Se non è stato creato un codice di importazione:

     1. In **Autorizzazioni di importazione dell'applicazione**, specifica quali istanze possono importare l'app esportata. Puoi concedere le autorizzazioni di importazione a tutte le istanze o aggiungere istanze di App Studio specifiche inserendo la relativa istanza. IDs Separa più istanze IDs con una virgola.

        Per trovare l'ID dell'istanza, accedi alle impostazioni dell'account dell'istanza selezionando **Impostazioni account** nella console App Studio.

     1. Scegli **Genera codice di importazione**.

     1. Copia e condividi il codice di importazione generato.
   + Se è già stato creato un codice di importazione:

     1. Per condividere l'app attualmente esportata, copia e condividi il codice di importazione esistente. Per creare una nuova app esportata con le ultime modifiche apportate alla tua app, scegli **Genera nuovo codice**. Se necessario, puoi anche aggiornare le autorizzazioni di importazione.

# Pagine e componenti: crea l'interfaccia utente della tua app
<a name="pages-components-ux"></a>

**Topics**
+ [Gestione delle pagine](pages.md)
+ [Gestione dei componenti](adding-editing-deleting-components.md)
+ [Configurazione della visibilità delle pagine basata sui ruoli](app-level-roles.md)
+ [Ordinamento e organizzazione delle pagine nella navigazione dell'app](pages-order.md)
+ [Cambia i colori della tua app con i temi dell'app](app-theme.md)
+ [Riferimento ai componenti](components-reference.md)

# Gestione delle pagine
<a name="pages"></a>

Utilizza le seguenti procedure per creare, modificare o eliminare pagine dall'applicazione AWS App Studio.

Le **pagine** sono contenitori di [componenti](concepts.md#concepts-component), che costituiscono l'interfaccia utente di un'applicazione in App Studio. Ogni pagina rappresenta una schermata dell'interfaccia utente (UI) dell'applicazione con cui gli utenti interagiranno. Le pagine vengono create e modificate nella scheda **Pagine** dello studio applicativo.

# Creazione di una pagina
<a name="pages-create"></a>

Utilizza la seguente procedura per creare una pagina in un'applicazione in App Studio. Per informazioni sulla duplicazione di una pagina esistente, consulta[Duplicazione di una pagina](pages-duplicate.md).

**Per creare una pagina**

1. Se necessario, accedi all'ambiente di sviluppo dell'applicazione modificandola.

1. Vai alla scheda **Pagine**.

1. Nel menu **Pagine** a sinistra, scegli **\$1** Aggiungi.

# Duplicazione di una pagina
<a name="pages-duplicate"></a>

Utilizza la seguente procedura per duplicare una pagina in un'applicazione in App Studio.

**Per duplicare una pagina**

1. Se necessario, accedi all'ambiente di sviluppo dell'applicazione modificandola.

1. Vai alla scheda **Pagine**.

1. **Nel menu **Pagine** a sinistra, scegli il menu con i puntini di sospensione accanto al nome della pagina che desideri duplicare e scegli Duplica.** La pagina duplicata viene aggiunta direttamente dopo la pagina originale.

# Visualizzazione e modifica delle proprietà della pagina
<a name="pages-edit"></a>

Utilizza la seguente procedura per modificare una pagina in un'applicazione in App Studio. È possibile modificare proprietà come il nome della pagina, i suoi parametri e il suo layout.

**Per visualizzare o modificare le proprietà della pagina**

1. Se necessario, accedi all'ambiente di sviluppo dell'applicazione modificandola.

1. Vai alla scheda **Pagine**.

1. **Nel menu **Pagine** a sinistra, scegli il menu con i puntini di sospensione accanto al nome della pagina che desideri modificare e scegli Proprietà della pagina.** **Si apre il menu Proprietà sul lato destro.**

1. Per modificare il nome della pagina:
**Nota**  
****Caratteri validi per i nomi di pagina: **A-Z**, **a-z**, **0-9, \$1**, \$1****

   1. **Scegli l'icona a forma di matita accanto al nome nella parte superiore del menu Proprietà.**

   1. Inserisci il nuovo nome per la pagina e premi Invio.

1. Per creare, modificare o eliminare i parametri della pagina:

   1. Per creare un parametro di pagina, scegli **\$1 Aggiungi nuovo** nella sezione **Parametri di pagina**.

   1. Per modificare il valore **Chiave** o **Description** di un parametro di pagina, scegli il campo di input della proprietà che desideri modificare e inserisci un nuovo valore. Le modifiche vengono salvate durante la modifica.

   1. Per eliminare un parametro di pagina, scegli l'icona del cestino del parametro di pagina che desideri eliminare.

1. Per aggiungere, modificare o rimuovere il logo o il banner di una pagina:

   1. Per aggiungere un logo o un banner alla pagina, abilita la rispettiva opzione nella sezione **Stile**. Configura la fonte dell'immagine e, facoltativamente, fornisci il testo alternativo.

   1. Per modificare il logo o il banner di una pagina, aggiorna i campi nella sezione **Stile**.

   1. Per rimuovere il logo o il banner di una pagina, disattivate la rispettiva opzione nella sezione **Stile**.

1. Per modificare il layout di una pagina:

   1. Aggiorna i campi nella sezione **Layout**.

# Eliminazione di una pagina
<a name="pages-delete"></a>

Utilizza la seguente procedura per eliminare una pagina da un'applicazione in App Studio.

**Per eliminare una pagina**

1. Se necessario, accedi all'ambiente di sviluppo dell'applicazione modificandola.

1. Vai alla scheda **Pagine**.

1. **Nel menu **Pagine** a sinistra, scegli il menu con i puntini di sospensione accanto al nome della pagina che desideri eliminare e scegli Elimina.**

# Gestione dei componenti
<a name="adding-editing-deleting-components"></a>

Utilizza le seguenti procedure per aggiungere, modificare ed eliminare componenti in o da pagine dello studio applicativo App Studio per creare l'interfaccia utente desiderata per la tua applicazione.

# Aggiungere componenti a una pagina
<a name="adding-components"></a>

Utilizza la seguente procedura per aggiungere un componente a una pagina in App Studio. Per informazioni sulla duplicazione di un componente esistente, consulta[Duplicazione dei componenti](duplicating-components.md).

1. Se necessario, accedete all'ambiente di sviluppo dell'applicazione modificandola.

1. Vai alla scheda **Pagine**.

1. Il pannello dei componenti si trova nel menu a destra, che contiene i componenti disponibili.

1. Trascina e rilascia il componente desiderato dal pannello all'area di disegno. In alternativa, potete fare doppio clic sul componente nel pannello per aggiungerlo automaticamente al centro della pagina corrente.

1. Ora che avete aggiunto un componente, utilizzate il pannello **Proprietà** sul lato destro per modificarne le impostazioni, come l'origine dei dati, il layout e il comportamento. Per informazioni dettagliate sulla configurazione di ciascun tipo di componente, consulta. [Riferimento ai componenti](components-reference.md)

# Duplicazione dei componenti
<a name="duplicating-components"></a>

Utilizza la seguente procedura per duplicare un componente in un'app App Studio. I componenti duplicati contengono tutte le automazioni o le entità collegate dal componente originale.

1. Se necessario, accedi all'ambiente di sviluppo dell'applicazione modificandola.

1. Vai alla scheda **Pagine**.

1. Esistono due modi per duplicare un componente:
   + Nel menu **Pagine** a sinistra, espandi la pagina che contiene il componente che desideri duplicare. **Scegli il menu con le ellissi accanto al nome del componente che desideri duplicare e scegli Duplica.**
   + Scegliete il componente che desiderate duplicare e scegliete l'icona di duplicazione.

   Il componente duplicato viene aggiunto direttamente dopo il componente originale.
**Suggerimento**  
È possibile annullare la duplicazione di un componente, insieme a molte altre azioni nell'ambiente di sviluppo, utilizzando le scorciatoie da tastiera CTRL\$1Z o CMD\$1Z.

# Visualizzazione e modifica delle proprietà dei componenti
<a name="editing-component-properties"></a>

1. Se necessario, accedete all'ambiente di sviluppo dell'applicazione modificandola.

1. Vai alla scheda **Pagine**.

1. Nel menu **Pagine** a sinistra, espandi la pagina che contiene il componente e scegli il componente da visualizzare o modificare. In alternativa, puoi scegliere la pagina e quindi scegliere il componente dall'area di disegno.

1. Il pannello **Proprietà a** destra mostra le impostazioni configurabili per il componente selezionato.

1. Esplora le varie proprietà e opzioni disponibili e aggiornale se necessario per configurare l'aspetto e il comportamento del componente. Ad esempio, potresti voler modificare l'origine dei dati, configurare il layout o abilitare funzionalità aggiuntive.

   Per informazioni dettagliate sulla configurazione di ogni tipo di componente, vedere[Riferimento ai componenti](components-reference.md).

# Eliminazione dei componenti
<a name="deleting-components"></a>

1. Se necessario, accedi all'ambiente di sviluppo dell'applicazione modificandola.

1. Vai alla scheda **Pagine**.

1. Nel menu **Pagine** a sinistra, scegli il componente da eliminare per selezionarlo.

1. Nel menu **Proprietà** a destra, scegli l'icona del cestino.

1. Nella finestra di dialogo di conferma, seleziona **Elimina**.

# Configurazione della visibilità delle pagine basata sui ruoli
<a name="app-level-roles"></a>

Puoi creare ruoli all'interno di un'app App Studio e configurare la visibilità delle pagine in base a tali ruoli. Ad esempio, puoi creare ruoli in base alle esigenze degli utenti o ai livelli di accesso, come amministratore, manager o utente per le app che forniscono funzionalità come l'approvazione dei progetti o l'elaborazione dei reclami e rendono visibili determinate pagine a ruoli specifici. In questo esempio, gli amministratori possono avere accesso completo, i manager possono avere accesso alla visualizzazione dei dashboard di reporting e gli utenti possono avere accesso alle pagine delle attività con moduli di input.

Utilizza la seguente procedura per configurare la visibilità delle pagine basata sui ruoli nell'app App Studio.

1. Se necessario, accedi allo studio applicativo dell'applicazione. **Dal menu di navigazione a sinistra, scegli **Le mie applicazioni**, trova l'applicazione e scegli Modifica.**

1. Crea ruoli a livello di app nello studio applicativo.

   1. Scegli la scheda **Impostazioni dell'app** nella parte superiore dello studio dell'applicazione.

   1. Scegli **\$1 Aggiungi ruolo**

   1. In **Nome ruolo**, fornisci un nome per identificare il tuo ruolo. Ti consigliamo di utilizzare un nome che descriva il livello di accesso o i compiti del gruppo, poiché utilizzerai il nome per impostare la visibilità della pagina.

   1. Facoltativamente, in **Descrizione**, aggiungi una descrizione per il ruolo.

   1. Ripeti questi passaggi per creare tutti i ruoli necessari.

1. Configura la visibilità delle tue pagine

   1. Scegli la scheda **Pagine** nella parte superiore dello studio dell'applicazione.

   1. Dal menu **Pagine** a sinistra, scegli la pagina per la quale desideri configurare la visibilità basata sui ruoli.

   1. **Nel menu a destra, scegli la scheda Proprietà.**

   1. In **Visibilità**, disattiva **Apri a tutti gli utenti finali**.

   1. Mantieni selezionato il **ruolo** per scegliere da un elenco dei ruoli creati nel passaggio precedente. Scegli **Personalizzato** per scrivere un' JavaScript espressione per configurazioni di visibilità più complesse.

      1. Con **Ruolo** selezionato, seleziona le caselle dei ruoli dell'app per i quali la pagina sarà visibile.

      1. Con l'opzione **Personalizzato** selezionata, immettete un' JavaScript espressione che risulti vera o falsa. Usa l'esempio seguente per verificare se l'utente corrente ha il ruolo di *manager*:. `{{currentUser.roles.includes('manager')}}`

1. Ora che la tua visibilità è configurata, puoi testare la visibilità della pagina visualizzando l'anteprima della tua app.

   1. Scegli **Anteprima** per aprire un'anteprima della tua app.

   1. In alto a destra dell'anteprima, scegli il menu Anteprima **come** e seleziona le caselle dei ruoli che desideri testare. Le pagine visibili dovrebbero riflettere i ruoli selezionati.

1. Ora, assegna i gruppi ai ruoli dell'app per un'app pubblicata. Le assegnazioni di gruppi e ruoli devono essere configurate separatamente per ogni ambiente. Per ulteriori informazioni sugli ambienti delle app, consulta[Ambienti applicativi](applications-publish.md#application-environments).
**Nota**  
La tua app deve essere pubblicata negli ambienti di test o di produzione per assegnare i gruppi di App Studio ai ruoli che hai creato e configurato. Se necessario, pubblica l'app per assegnare i gruppi ai ruoli. Per ulteriori informazioni sulla pubblicazione, consulta[Applicazioni di pubblicazione](applications-publish.md).

   1. In alto a destra dello studio applicativo, scegli **Condividi**.

   1. Scegli la scheda per l'ambiente in cui desideri configurare la visibilità della pagina.

   1. Scegli la casella di input **Cerca gruppi** e scegli il gruppo con cui condividere la versione dell'app. Puoi inserire del testo per cercare gruppi.

   1. Nel menu a discesa, scegli i ruoli da assegnare al gruppo. Puoi scegliere **Nessun ruolo** per condividere la versione dell'app e non assegnare un ruolo al gruppo. Solo le pagine visibili a tutti gli utenti saranno visibili ai gruppi senza ruolo.

   1. Scegli **Condividi**. Ripeti questi passaggi per aggiungere tutti i gruppi necessari.

# Ordinamento e organizzazione delle pagine nella navigazione dell'app
<a name="pages-order"></a>

Questo argomento include informazioni sul riordino e l'organizzazione delle pagine nelle applicazioni App Studio. Le pagine dell'app vengono visualizzate in due aree del prodotto: nel menu **Pages** a sinistra durante la modifica dell'app nello studio dell'applicazione e nella navigazione a sinistra di un'anteprima dell'app pubblicata.

## **Ordinamento delle pagine nel menu Pages a sinistra durante la modifica di un'app**
<a name="pages-order-editing-app"></a>

**Durante la modifica di un'app nello studio dell'applicazione, le pagine vengono ordinate in base all'ora di creazione nel menu Pages a sinistra.** Non è possibile riordinare le pagine in questo menu.

## Ordinare, mostrare o nascondere le pagine nella navigazione di un'anteprima o di un'app pubblicata
<a name="pages-order-editing-app"></a>

Puoi modificare le seguenti impostazioni della navigazione a sinistra di un'anteprima o di un'app pubblicata:
+ La visibilità dell'intera navigazione
+ La visibilità di pagine specifiche nella navigazione
+ L'ordine delle pagine nella navigazione

**Per modificare la navigazione a sinistra di un'anteprima o di un'app pubblicata**

1. Se necessario, accedete allo studio applicativo dell'applicazione per modificarla.

1. Nel menu **Pagine** a sinistra, scegli **Intestazione** e navigazione.

1. Nel menu **Intestazione e navigazione** a destra, visualizza o modifica quanto segue:

   1. Per nascondere o mostrare la navigazione nell'app, usa l'interruttore di **navigazione dell'app**.

   1. Per nascondere le pagine dalla navigazione dell'app, trascina le pagine nella sezione Pagine **non collegate**. ****

   1. Per riordinare le pagine nella navigazione dell'app, trascinale nell'ordine desiderato nella sezione **Pagine collegate**.

# Cambia i colori della tua app con i temi dell'app
<a name="app-theme"></a>

Usa la seguente procedura per aggiornare i colori dell'applicazione configurando un tema dell'app.

1. Se necessario, accedete allo studio applicativo dell'app per modificarla.

1. Nello studio dell'applicazione, vai alla scheda **Pagine**.

1. Nella barra di navigazione a sinistra, scegli **Tema dell'app per aprire le impostazioni del tema** dell'app a destra.

1. **Nel **tema Base**, scegli la **modalità Chiaro o la modalità Scuro**.**

1. Per aggiungere colori personalizzati all'applicazione, attiva l'interruttore **Personalizza** e aggiorna le seguenti impostazioni:

   1. In **Colore primario**, scegli il colore da applicare a determinati componenti e alla navigazione dell'app. Puoi scegliere un colore con il selettore di colori, il codice RGB, HSL o HEX.
**Nota**  
App Studio garantirà automaticamente l'accessibilità dei colori. Ad esempio, se scegli un colore chiaro in modalità luce, questo verrà aggiornato per renderlo più accessibile.

   1. In **Colore dell'intestazione**, scegli il colore da applicare all'intestazione dell'app. Puoi scegliere un colore con il selettore di colori, il codice RGB, HSL o HEX.

   1. Scegliete **Temi predefiniti** per visualizzare e scegliere tra temi predefiniti oppure scegliete **Randomizza** per generare un colore primario e di intestazione casuali.

1. Scegli **Salva modifiche** per aggiornare il tema dell'app.

# Riferimento ai componenti
<a name="components-reference"></a>

Questo argomento descrive in dettaglio ciascuno dei componenti di App Studio, le relative proprietà e include esempi di configurazione.

## Proprietà comuni dei componenti
<a name="common-properties"></a>

Questa sezione descrive le proprietà e le funzionalità generali condivise tra più componenti nell'Application Studio. I dettagli di implementazione e i casi d'uso specifici per ogni tipo di proprietà possono variare a seconda del componente, ma il concetto generale di queste proprietà rimane coerente in App Studio.

### Nome
<a name="common-properties-component-name"></a>

Viene generato un nome predefinito per ogni componente; tuttavia, è possibile modificare per passare a un nome univoco per ogni componente. Utilizzerai questo nome per fare riferimento al componente e ai relativi dati da altri componenti o espressioni all'interno della stessa pagina. Limitazione: non includete spazi nel nome del componente; può contenere solo lettere, numeri, caratteri di sottolineatura e simboli del dollaro. Esempi: `userNameInput`, `ordersTable`, `metricCard1`.

### Valore primario, valore secondario e valore
<a name="common-properties-component-values"></a>

Molti componenti dello studio applicativo forniscono campi per specificare valori o espressioni che determinano il contenuto o i dati visualizzati all'interno del componente. Questi campi sono spesso etichettati come`Primary value`, o semplicemente `Secondary value``Value`, in base al tipo e allo scopo del componente.

Il `Primary value` campo viene in genere utilizzato per definire il valore principale, il punto dati o il contenuto che deve essere visualizzato in primo piano all'interno del componente.

Il `Secondary value` campo, se disponibile, viene utilizzato per visualizzare un valore o un'informazione aggiuntivi o di supporto accanto al valore principale.

Il `Value` campo consente di specificare il valore o l'espressione da visualizzare nel componente.

Questi campi supportano sia l'immissione di testo statica che le espressioni dinamiche. Utilizzando le espressioni, è possibile fare riferimento a dati provenienti da altri componenti, fonti di dati o variabili all'interno dell'applicazione, abilitando la visualizzazione dinamica e basata sui dati.

#### Sintassi per le espressioni
<a name="common-properties-component-values-expression-syntax"></a>

La sintassi per l'immissione di espressioni in questi campi segue uno schema coerente:

```
{{expression}}
```

Dove *expression* è un'espressione valida che restituisce il valore o i dati desiderati da visualizzare.

##### Esempio: testo statico
<a name="common-properties-component-values-static-text-examples"></a>
+ Valore principale: puoi inserire direttamente un numero o un valore statico, ad esempio `"123"` o`"$1,999.99"`.
+ Valore secondario: puoi inserire un'etichetta di testo statica, ad esempio `"Goal"` o`"Projected Revenue"`.
+ Valore: è possibile inserire una stringa statica, ad esempio `"since last month"` o`"Total Quantity"`.

##### Esempi: espressioni
<a name="common-properties-component-values-expression-examples"></a>
+ `Hello, {{currentUser.firstName}}`: visualizza un messaggio di saluto con il nome dell'utente attualmente connesso.
+ `{{currentUser.role === 'Admin' ? 'Admin Dashboard' : 'User Dashboard'}}`: visualizza in modo condizionale un titolo di dashboard diverso in base al ruolo dell'utente.
+ `{{ui.componentName.data?.[0]?.fieldName}}`: recupera il valore del `fieldName` campo dal primo elemento nei dati del componente con l'ID. `componentName`
+ `{{ui.componentName.value * 100}}`: esegue un calcolo sul valore del componente con l'ID. `componentName`
+ `{{ui.componentName.value + ' items'}}`: concatena il valore del componente con l'ID `componentName` e la stringa. `' items'`
+ `{{ui.ordersTable.data?.[0]?.orderNumber}}`: recupera il numero dell'ordine dalla prima riga di dati del componente. `ordersTable`
+ `{{ui.salesMetrics.data?.[0]?.totalRevenue * 1.15}}`: calcola i ricavi previsti aumentando del 15% i ricavi totali derivanti dalla prima riga di dati del `salesMetrics` componente.
+ `{{ui.customerProfile.data?.[0]?.firstName + ' ' + ui.customerProfile.data?.lastName}}`: concatena il nome e il cognome dai dati del componente. `customerProfile`
+ `{{new Date(ui.orderDetails.data?.orderDate).toLocaleDateString()}}`: formatta la data dell'ordine dal `orderDetails` componente in una stringa di data più leggibile.
+ `{{ui.productList.data?.length}}`: Visualizza il numero totale di prodotti nei dati collegati al `productList` componente.
+ `{{ui.discountPercentage.value * ui.orderTotal.value}}`: calcola l'importo dello sconto in base alla percentuale di sconto e al totale dell'ordine.
+ `{{ui.cartItemCount.value + ' items in cart'}}`: mostra il numero di articoli nel carrello, insieme all'etichetta`items in cart`.

Utilizzando questi campi di espressione, è possibile creare contenuti dinamici e basati sui dati all'interno dell'applicazione, che consentono di visualizzare informazioni personalizzate in base al contesto dell'utente o allo stato dell'applicazione. Ciò consente esperienze utente più personalizzate e interattive.

### Etichetta
<a name="common-properties-label"></a>

La proprietà **Label** consente di specificare una didascalia o un titolo per il componente. Questa etichetta viene in genere visualizzata accanto o sopra il componente, per aiutare gli utenti a comprenderne lo scopo.

È possibile utilizzare sia testo statico che espressioni per definire l'etichetta.

#### Esempio: testo statico
<a name="label-static-example"></a>

Se inserisci il testo «Nome» nel campo Etichetta, il componente mostrerà «Nome» come etichetta.

#### Esempio: espressioni
<a name="label-expression-examples"></a>

##### Esempio: negozio al dettaglio
<a name="label-expression-examples-retail-store-label"></a>

L'esempio seguente personalizza l'etichetta per ogni utente, rendendo l'interfaccia più personalizzata per l'individuo:

```
{{currentUser.firstName}} {{currentUser.lastName}}'s Account
```

##### Esempio: gestione di progetti SaaS
<a name="label-expression-examples-project-management-label"></a>

L'esempio seguente estrae i dati dal progetto selezionato per fornire etichette specifiche per il contesto, aiutando gli utenti a orientarsi all'interno dell'applicazione:

```
Project {{ui.projectsTable.selectedRow.id}} - {{ui.projectsTable.selectedRow.name}}
```

##### Esempio: clinica sanitaria
<a name="label-expression-examples-healthcare-clinic-label"></a>

L'esempio seguente fa riferimento al profilo dell'utente corrente e alle informazioni del medico, fornendo un'esperienza più personalizzata per i pazienti. 

```
Dr. {{ui.doctorProfileTable.data.firstName}}
       {{ui.doctorProfileTable.data.lastName}}
```

### Placeholder
<a name="common-properties-placeholder"></a>

La proprietà Placeholder consente di specificare il testo di suggerimento o guida che viene visualizzato all'interno del componente quando è vuoto. Ciò può aiutare gli utenti a comprendere il formato di input previsto o fornire un contesto aggiuntivo.

È possibile utilizzare sia testo statico che espressioni per definire il segnaposto.

#### Esempio: testo statico
<a name="placeholder-static-example"></a>

Se inserisci il testo `Enter your name` nel campo **Segnaposto**, il componente verrà visualizzato `Enter your name` come testo segnaposto.

#### Esempio: espressioni
<a name="placeholder-expression-examples"></a>

##### Esempio: servizi finanziari
<a name="placeholder-expression-examples-financial-services-placeholder"></a>

 `Enter the amount you'd like to deposit into your {{ui.accountsTable.selectedRow.balance}} account`Questi esempi estraggono i dati dal conto selezionato per visualizzare le istruzioni pertinenti, rendendo l'interfaccia intuitiva per i clienti bancari. 

##### Esempio: e-commerce
<a name="placeholder-expression-examples-ecommerce-placeholder"></a>

 `Enter the coupon code for {{ui.cartTable.data.currency}} total`Il segnaposto qui si aggiorna dinamicamente in base al contenuto del carrello dell'utente, offrendo un'esperienza di pagamento senza interruzioni. 

##### Esempio: clinica sanitaria
<a name="placeholder-expression-examples-healthcare-clinic-placeholder"></a>

 `Enter your {{ui.patientProfile.data.age}}-year-old patient's symptoms`Utilizzando un'espressione che fa riferimento all'età del paziente, l'applicazione può creare un segnaposto più personalizzato e utile. 

### Origine
<a name="common-properties-source"></a>

La proprietà **Source** consente di selezionare l'origine dati per un componente. Dopo la selezione, è possibile scegliere tra i seguenti tipi di origini dati: `entity``expression`, o`automation`.

#### Entità
<a name="common-properties-source-entity"></a>

La selezione di **Entità** come origine dati consente di connettere il componente a un'entità o modello di dati esistente nell'applicazione. Ciò è utile quando si dispone di una struttura o uno schema di dati ben definiti che si desidera sfruttare in tutta l'applicazione.

Quando utilizzare l'origine dati dell'entità:
+ Quando hai un modello di dati o un'entità che contiene le informazioni che desideri visualizzare nel componente (ad esempio, un'entità «Prodotti» con campi come «Nome», «Descrizione», «Prezzo»).
+ Quando è necessario recuperare dinamicamente i dati da un database, un'API o un'altra fonte di dati esterna e presentarli nel componente.
+ Quando si desidera sfruttare le relazioni e le associazioni definite nel modello di dati dell'applicazione.

##### Selezione di un'interrogazione su un'entità
<a name="common-properties-source-selecting-entity-query"></a>

A volte, potresti voler connettere un componente a una query specifica che recupera i dati da un'entità, anziché dall'intera entità. Nell'origine dati dell'entità, hai la possibilità di scegliere tra le query esistenti o crearne una nuova.

Selezionando una query, puoi:
+ Filtrare i dati visualizzati nel componente in base a criteri specifici.
+ Passa i parametri alla query per filtrare o ordinare dinamicamente i dati.
+ Sfrutta join complessi, aggregazioni o altre tecniche di manipolazione dei dati definite nella query.

Ad esempio, se nell'applicazione è presente un'`Customers`entità con campi come`Name`, e. `Email` `PhoneNumber` Puoi connettere un componente della tabella a questa entità e scegliere un'azione di `ActiveCustomers` dati predefinita che filtri i clienti in base al loro stato. Ciò consente di visualizzare solo i clienti attivi nella tabella, anziché l'intero database dei clienti.

##### Aggiungere parametri a un'origine dati dell'entità
<a name="common-properties-source-adding-entity-parameters"></a>

Quando si utilizza un'entità come fonte di dati, è anche possibile aggiungere parametri al componente. Questi parametri possono essere utilizzati per filtrare, ordinare o trasformare i dati visualizzati nel componente.

Ad esempio, se hai un'`Products`entità con campi come `Name``Description`,`Price`, e`Category`. È possibile aggiungere un parametro denominato `category` a un componente della tabella che visualizza l'elenco dei prodotti. Quando gli utenti selezionano una categoria da un menu a discesa, la tabella si aggiornerà automaticamente per mostrare solo i prodotti appartenenti alla categoria selezionata, utilizzando l'`{{params.category}}`espressione nell'azione relativa ai dati.

#### Expression
<a name="common-properties-source-expression"></a>

Seleziona **Expression** come fonte di dati per inserire espressioni o calcoli personalizzati per generare dinamicamente i dati per il componente. Ciò è utile quando è necessario eseguire trasformazioni, combinare dati provenienti da più fonti o generare dati in base a una logica aziendale specifica.

Quando utilizzare l'origine dati **Expression**:
+ Quando è necessario calcolare o derivare dati che non sono direttamente disponibili nel modello di dati (ad esempio, il calcolo del valore totale dell'ordine in base alla quantità e al prezzo).
+ Quando desideri combinare dati provenienti da più entità o fonti di dati per creare una visualizzazione composita (ad esempio, visualizzando la cronologia degli ordini di un cliente insieme alle sue informazioni di contatto).
+ Quando è necessario generare dati in base a regole o condizioni specifiche (ad esempio, visualizzazione di un elenco di «Prodotti consigliati» basato sulla cronologia di navigazione dell'utente).

Ad esempio, se disponi di un *Metrics* componente che deve visualizzare le entrate totali per il mese corrente, puoi utilizzare un'espressione come la seguente per calcolare e visualizzare le entrate mensili:

```
{{ui.table1.orders.concat(ui.table1.orderDetails).filter(o => o.orderDate.getMonth() === new Date().getMonth()).reduce((a, b) => a + (b.quantity * b.unitPrice), 0)}}
```

##### Automazione
<a name="common-properties-source-automation"></a>

Seleziona **Automazione** come fonte di dati per connettere il componente a un'automazione o a un flusso di lavoro esistente nell'applicazione. Ciò è utile quando i dati o le funzionalità del componente vengono generati o aggiornati come parte di un processo o di un flusso di lavoro specifico.

Quando utilizzare l'origine dati di **automazione**:
+ Quando i dati visualizzati nel componente sono il risultato di un'automazione o di un flusso di lavoro specifici (ad esempio, una tabella «Approvazioni in sospeso» che viene aggiornata come parte di un processo di approvazione).
+ Quando desideri attivare azioni o aggiornamenti al componente in base a eventi o condizioni all'interno di un'automazione (ad esempio, aggiornare una metrica con gli ultimi dati di vendita per uno SKU).
+ Quando è necessario integrare il componente con altri servizi o sistemi dell'applicazione tramite un'automazione (ad esempio, recuperando dati da un'API di terze parti e visualizzandoli in una tabella).

Ad esempio, se disponi di un componente stepflow che guida gli utenti attraverso un processo di candidatura. Il componente stepflow può essere collegato a un'automazione che gestisce l'invio della domanda di lavoro, i controlli dei precedenti e la generazione delle offerte. Man mano che l'automazione procede attraverso questi passaggi, il componente stepflow può aggiornarsi dinamicamente per riflettere lo stato corrente dell'applicazione.

Selezionando con cura la fonte di dati appropriata per ogni componente, potete assicurarvi che l'interfaccia utente dell'applicazione sia alimentata dai dati e dalla logica giusti, offrendo un'esperienza fluida e coinvolgente agli utenti.

### Visibile se
<a name="visible-if"></a>

Utilizzate la proprietà **Visible if** per mostrare o nascondere componenti o elementi in base a condizioni o valori di dati specifici. Ciò è utile quando si desidera controllare dinamicamente la visibilità di alcune parti dell'interfaccia utente dell'applicazione.

La proprietà **Visible if** utilizza la seguente sintassi:

```
{{expression ? true : false}}
```

or

```
{{expression}}
```

Dove *expression* è un'espressione booleana che restituisce o. `true` `false`

Se l'espressione restituisce a`true`, il componente sarà visibile. Se l'espressione restituisce a`false`, il componente verrà nascosto. L'espressione può fare riferimento a valori di altri componenti, fonti di dati o variabili all'interno dell'applicazione.

#### Esempi di espressioni visibili
<a name="visible-if-examples"></a>

##### Esempio: mostrare o nascondere un campo di immissione della password in base a un input di posta elettronica
<a name="visible-if-example-password-email"></a>

Immagina di avere un modulo di accesso con un campo di immissione e-mail e un campo di immissione della password. Vuoi mostrare il campo di immissione della password solo se l'utente ha inserito un indirizzo email. È possibile utilizzare la seguente espressione Visible if:

```
{{ui.emailInput.value !== ""}}
```

Questa espressione controlla se il valore del `emailInput` componente non è una stringa vuota. Se l'utente ha inserito un indirizzo e-mail, l'espressione restituisce come risultato e il campo di immissione della password sarà visibile. `true` Se il campo e-mail è vuoto, l'espressione restituisce e il campo di immissione della password verrà nascosto. `false`

##### Esempio: visualizzazione di campi modulo aggiuntivi in base a una selezione a discesa
<a name="visible-if-example-form-fields-dropdown"></a>

Supponiamo che tu abbia un modulo in cui gli utenti possono selezionare una categoria da un elenco a discesa. A seconda della categoria selezionata, desideri mostrare o nascondere campi del modulo aggiuntivi per raccogliere informazioni più specifiche.

Ad esempio, se l'utente seleziona la *Products* categoria, è possibile utilizzare la seguente espressione per mostrare un *Product Details* campo aggiuntivo:

```
{{ui.categoryDropdown.value === "Products"}}
```

Se l'utente seleziona le *Consulting* categorie *Services* o, puoi usare questa espressione per mostrare un set diverso di campi aggiuntivi:

```
{{ui.categoryDropdown.value === "Services" || ui.categoryDropdown.value === "Consulting"}}
```

##### Esempi: Altro
<a name="visible-if-example-other"></a>

Per rendere visibile il componente se il valore del `textInput1` componente non è una stringa vuota:

```
{{ui.textInput1.value === "" ? false : true}}
```

Per rendere il componente sempre visibile:

```
{{true}}
```

Per rendere visibile il componente se il valore del `emailInput` componente non è una stringa vuota:

```
{{ui.emailInput.value !== ""}}
```

### Disabilitato se
<a name="disabled-if"></a>

La funzione **Se disabilitato** consente di abilitare o disabilitare in modo condizionale un componente in base a condizioni o valori di dati specifici. Ciò si ottiene utilizzando la proprietà **Disabled if**, che accetta un'espressione booleana che determina se il componente deve essere abilitato o disabilitato.

La proprietà **Disabled if** utilizza la seguente sintassi:

```
{{expression ? true : false}}
```

or

```
{{expression}}
```

#### Esempi di espressioni if disattivate
<a name="disabled-if-examples"></a>

##### Esempio: disabilitazione di un pulsante di invio in base alla convalida del modulo
<a name="disabled-if-example-disable-submit-button"></a>

Se disponi di un modulo con più campi di immissione e desideri disabilitare il pulsante di invio fino a quando tutti i campi obbligatori non vengono compilati correttamente, puoi utilizzare la seguente espressione **Disabled If**:

```
{{ui.nameInput.value === "" || ui.emailInput.value === "" || ui.passwordInput.value === ""}}
```

Questa espressione controlla se uno dei campi di input obbligatori (`nameInput`,`emailInput`,`passwordInput`) è vuoto. Se uno qualsiasi dei campi è vuoto, l'espressione restituisce un valore e il pulsante di invio verrà disabilitato. `true` Una volta compilati tutti i campi obbligatori, l'espressione restituisce e il pulsante di invio verrà abilitato. `false`

Utilizzando questi tipi di espressioni condizionali nelle proprietà **Visible if** e **Disabled ff**, è possibile creare interfacce utente dinamiche e reattive che si adattano all'input dell'utente, offrendo un'esperienza più semplificata e pertinente per gli utenti dell'applicazione.

Dove *expression* è un'espressione booleana che restituisce vero o falso.

Esempio:

```
{{ui.textInput1.value === "" ? true : false}}: The component will be Disabled if the textInput1 component's value is an empty string.
{{!ui.nameInput.isValid || !ui.emailInput.isValid || !ui.passwordInput.isValid}}: The component will be Disabled if any of the named input fields are invalid.
```

#### Layout dei contenitori
<a name="container-layouts"></a>

Le proprietà di layout determinano come il contenuto o gli elementi all'interno di un componente sono disposti e posizionati. Sono disponibili diverse opzioni di layout, ognuna rappresentata da un'icona:
+ **Layout a colonne**: questo layout dispone il contenuto o gli elementi verticalmente, in un'unica colonna.
+ **Layout a due colonne**: questo layout divide il componente in due colonne di uguale larghezza, permettendo di posizionare il contenuto o gli elementi uno accanto all'altro.
+ **Layout a righe**: questo layout dispone il contenuto o gli elementi orizzontalmente, in un'unica riga.

##### Orientation (Orientamento)
<a name="container-layouts-orientation"></a>
+ **Orizzontale**: questo layout dispone il contenuto o gli elementi orizzontalmente, in un'unica riga.
+ **Verticale**: questo layout dispone il contenuto o gli elementi verticalmente, in un'unica colonna.
+ Disposto **in linea:** questo layout dispone il contenuto o gli elementi orizzontalmente, ma passa alla riga successiva se gli elementi superano la larghezza disponibile.

##### Allineamento
<a name="container-layouts-alignment"></a>
+ **A sinistra**: allinea il contenuto o gli elementi sul lato sinistro del componente.
+ **Centro**: centra il contenuto o gli elementi orizzontalmente all'interno del componente.
+ **A destra**: allinea il contenuto o gli elementi sul lato destro del componente.

##### Larghezza
<a name="container-layouts-width"></a>

La proprietà **Width** specifica la dimensione orizzontale del componente. È possibile inserire un valore percentuale compreso tra 0% e 100%, che rappresenti la larghezza del componente rispetto al contenitore principale o allo spazio disponibile.

##### Altezza
<a name="container-layouts-height"></a>

La proprietà **Height** specifica la dimensione verticale del componente. Il valore «auto» regola automaticamente l'altezza del componente in base al suo contenuto o allo spazio disponibile.

##### Spazio tra
<a name="container-layouts-space-between"></a>

La proprietà **Space between** determina la spaziatura o lo spazio tra il contenuto o gli elementi all'interno del componente. È possibile selezionare un valore da 0 px (senza spaziatura) a 64 px, con incrementi di 4 px (ad esempio, 4 px, 8 px, 12 px, ecc.).

##### Padding
<a name="container-layouts-padding"></a>

La proprietà **Padding** controlla lo spazio tra il contenuto o gli elementi e i bordi del componente. È possibile selezionare un valore da 0 px (senza imbottitura) a 64 px, con incrementi di 4 px (ad esempio, 4 px, 8 px, 12 px, ecc.).

##### Contesto
<a name="container-layouts-background"></a>

Lo **sfondo** abilita o disabilita un colore o uno stile di sfondo per il componente.

Queste proprietà di layout offrono flessibilità nella disposizione e nel posizionamento del contenuto all'interno di un componente, oltre a controllare le dimensioni, la spaziatura e l'aspetto visivo del componente stesso.

## Componenti dati
<a name="data-components"></a>

Questa sezione copre i vari componenti di dati disponibili nell'Application Studio, inclusi i componenti **Table**, **Detail**, **Metric**, **Form** e **Repeater**. Questi componenti vengono utilizzati per visualizzare, raccogliere e manipolare i dati all'interno dell'applicazione.

### Tabella
<a name="table-component"></a>

Il componente **Tabella** visualizza i dati in formato tabulare, con righe e colonne. Viene utilizzato per presentare dati strutturati, come elenchi di elementi o record da un database, in easy-to-read modo organizzato.

#### Proprietà tabella
<a name="table-component-properties"></a>

Il componente **Tabella** condivide diverse proprietà comuni con altri componenti, ad esempio `Name``Source`, e`Actions`. Per ulteriori informazioni su queste proprietà, vedere[Proprietà comuni dei componenti](#common-properties).

Oltre alle proprietà comuni, il componente **Tabella** presenta proprietà e opzioni di configurazione specifiche, tra cui `Columns``Search and export`, e`Expressions`.

##### Colonne
<a name="table-component-properties-columns"></a>

In questa sezione, è possibile definire le colonne da visualizzare nella tabella. Ogni colonna può essere configurata con le seguenti proprietà:
+ **Formato**: il tipo di dati del campo, ad esempio: testo, numero, data.
+ **Etichetta della colonna**: il testo dell'intestazione della colonna.
+ **Valore**: il campo della fonte di dati che deve essere visualizzato in questa colonna.

  Questo campo consente di specificare il valore o l'espressione da visualizzare nelle celle della colonna. È possibile utilizzare le espressioni per fare riferimento ai dati della fonte connessa o di altri componenti.

  Esempio: `{{currentRow.title}}` - Questa espressione mostrerà il valore del *title* campo dalla riga corrente nelle celle della colonna.
+ **Abilita l'ordinamento**: questo interruttore consente di abilitare o disabilitare la funzionalità di ordinamento per la colonna specifica. Se abilitato, gli utenti possono ordinare i dati della tabella in base ai valori in questa colonna.

##### Cerca ed esporta
<a name="table-component-properties-search-and-export"></a>

Il componente **Tabella** fornisce i seguenti interruttori per abilitare o disabilitare la funzionalità di ricerca ed esportazione:
+ **Mostra ricerca** Se abilitato, questo interruttore aggiunge un campo di immissione della ricerca alla tabella, che consente agli utenti di cercare e filtrare i dati visualizzati.
+ **Mostra esportazione** Se abilitato, questo interruttore aggiunge un'opzione di esportazione alla tabella, che consente agli utenti di scaricare i dati della tabella in vari formati, ad esempio: CSV.

**Nota**  
Per impostazione predefinita, la funzionalità di ricerca è limitata ai dati che sono stati caricati nella tabella. Per utilizzare la ricerca in modo esaustivo, è necessario caricare tutte le pagine di dati.

##### Righe per pagina
<a name="table-component-properties-rows-per-page"></a>

È possibile specificare il numero di righe da visualizzare per pagina nella tabella. Gli utenti possono quindi navigare tra le pagine per visualizzare il set di dati completo.

##### Limite di pre-recupero
<a name="table-component-properties-pre-fetch-limit"></a>

Specificare il numero massimo di record da precaricare in ogni richiesta di interrogazione. Il massimo è 3000.

##### Azioni
<a name="table-component-properties-actions"></a>

Nella sezione **Azioni**, configura le seguenti proprietà:
+ **Luogo dell'azione**: quando **l'opzione Aggiungi a destra** è abilitata, tutte le azioni aggiunte verranno sempre visualizzate a destra della tabella, indipendentemente dallo scorrimento dell'utente.
+ **Azioni**: aggiungi pulsanti di azione alla tabella. È possibile configurare questi pulsanti per eseguire azioni specifiche quando vengono cliccati da un utente, ad esempio:
  + Esegui un'azione relativa a un componente
  + Passa a una pagina diversa
  + Richiama un'azione sui dati
  + Esegui personalizzato JavaScript
  + Invoca un'automazione

##### Espressioni
<a name="table-component-properties-expressions"></a>

Il componente **Table** offre diverse aree in cui utilizzare espressioni e funzionalità di azione a livello di riga che consentono di personalizzare e migliorare la funzionalità e l'interattività della tabella. Consentono di fare riferimento e visualizzare dinamicamente i dati all'interno della tabella. Sfruttando questi campi di espressione, è possibile creare colonne dinamiche, passare dati ad azioni a livello di riga e fare riferimento ai dati della tabella da altri componenti o espressioni all'interno dell'applicazione.

##### Esempi: riferimento ai valori delle righe
<a name="table-component-properties-examples-referencing-row-values"></a>

`{{currentRow.columnName}}`oppure `{{currentRow["Column Name"]}}` Queste espressioni consentono di fare riferimento al valore di una colonna specifica per la riga corrente di cui viene eseguito il rendering. Sostituisci *columnName* o *Column Name* con il nome effettivo della colonna a cui desideri fare riferimento.

Esempi:
+ `{{currentRow.productName}}`Visualizza il nome del prodotto per la riga corrente.
+ `{{currentRow["Supplier Name"]}}`Visualizza il nome del fornitore per la riga corrente, dove si trova l'intestazione della colonna. *Supplier Name*
+ `{{currentRow.orderDate}}`Visualizza la data dell'ordine per la riga corrente.

##### Esempi: riferimento alla riga selezionata
<a name="table-component-properties-examples-referencing-selected-row"></a>

`{{ui.table1.selectedRow["columnName"]}}`Questa espressione consente di fare riferimento al valore di una colonna specifica per la riga attualmente selezionata nella tabella con l'ID*table1*. Sostituisci *table1* con l'ID effettivo del componente della tabella e *columnName* con il nome della colonna a cui desideri fare riferimento.

Esempi:
+ `{{ui.ordersTable.selectedRow["totalAmount"]}}`Visualizza l'importo totale per la riga attualmente selezionata nella tabella con l'ID*ordersTable*.
+ `{{ui.customersTable.selectedRow["email"]}}`Visualizza l'indirizzo e-mail per la riga attualmente selezionata nella tabella con l'ID*customersTable*.
+ `{{ui.employeesTable.selectedRow["department"]}}`Visualizza il reparto per la riga attualmente selezionata nella tabella con l'ID*employeesTable*.

##### Esempi: creazione di colonne personalizzate
<a name="table-component-properties-examples-creating-custom-columns"></a>

È possibile aggiungere colonne personalizzate a una tabella in base ai dati restituiti dall'azione, dall'automazione o dall'espressione dei dati sottostanti. È possibile utilizzare i valori e JavaScript le espressioni di colonna esistenti per creare nuove colonne.

Esempi:
+ `{{currentRow.quantity * currentRow.unitPrice}}`Crea una nuova colonna che mostra il prezzo totale moltiplicando le colonne della quantità e del prezzo unitario.
+ `{{new Date(currentRow.orderDate).toLocaleDateString()}}`Crea una nuova colonna che mostra la data dell'ordine in un formato più leggibile.
+ `{{currentRow.firstName + ' ' + currentRow.lastName + ' (' + currentRow.email + ')' }}`Crea una nuova colonna che mostra il nome completo e l'indirizzo e-mail per ogni riga.

##### Esempi: personalizzazione dei valori di visualizzazione delle colonne:
<a name="table-component-properties-examples-customizing-column-display-values"></a>

È possibile personalizzare il valore di visualizzazione di un campo all'interno di una colonna della tabella impostando il `Value` campo della mappatura delle colonne. Ciò consente di applicare formattazioni o trasformazioni personalizzate ai dati visualizzati.

Esempi:
+ `{{ currentRow.rating >= 4 ? '⭐️'.repeat(currentRow.rating) : currentRow.rating }}`Visualizza gli emoji a forma di stella in base al valore di valutazione per ogni riga.
+ `{{ currentRow.category.toLowerCase().replace(/\b\w/g, c => c.toUpperCase()) }}`Visualizza il valore della categoria con ogni parola in maiuscolo per ogni riga.
+ `{{ currentRow.status === 'Active' ? '🟢 Active' : '🔴 Inactive' }}`: visualizza un'emoji a forma di cerchio colorato e un testo in base al valore di stato di ogni riga.

##### Azioni dei pulsanti a livello di riga
<a name="table-component-properties-examples-row-level-button-actions"></a>

`{{currentRow.columnName}}`oppure `{{currentRow["Column Name"]}}` È possibile utilizzare queste espressioni per passare il contesto della riga di riferimento all'interno di un'azione a livello di riga, ad esempio passare a un'altra pagina con i dati della riga selezionata o attivare un'automazione con i dati della riga.

Esempi:
+ Se hai un pulsante di modifica nella colonna di azione della riga, puoi passare `{{currentRow.orderId}}` come parametro per accedere a una pagina di modifica dell'ordine con l'ID dell'ordine selezionato.
+ Se hai un pulsante di eliminazione nella colonna di azione della riga, puoi passare `{{currentRow.customerName}}` a un'automazione che invia un'email di conferma al cliente prima di eliminare l'ordine.
+ Se hai un pulsante Visualizza i dettagli nella colonna di azione della riga, puoi passare `{{currentRow.employeeId}}` a un'automazione che registra il dipendente che ha visualizzato i dettagli dell'ordine.

Sfruttando questi campi di espressione e le funzionalità di azione a livello di riga, puoi creare tabelle altamente personalizzate e interattive che visualizzano e manipolano i dati in base ai tuoi requisiti specifici. Inoltre, puoi collegare azioni a livello di riga con altri componenti o automazioni all'interno dell'applicazione, garantendo un flusso di dati e funzionalità senza interruzioni.

### Dettaglio
<a name="detail-component"></a>

Il componente **Detail** è progettato per visualizzare informazioni dettagliate su un record o un elemento specifico. Fornisce uno spazio dedicato per la presentazione di dati completi relativi a una singola entità o riga, il che lo rende ideale per mostrare dettagli approfonditi o facilitare le attività di immissione e modifica dei dati.

#### Proprietà di dettaglio
<a name="detail-component-properties"></a>

Il componente **Detail** condivide diverse proprietà comuni con altri componenti, ad esempio `Name``Source`, e`Actions`. Per ulteriori informazioni su queste proprietà, vedere[Proprietà comuni dei componenti](#common-properties).

Il componente **Detail** ha anche proprietà e opzioni di configurazione specifiche`Fields`, tra cui`Layout`, e`Expressions`.

#### Layout
<a name="detail-component-properties-layout"></a>

La sezione **Layout** consente di personalizzare la disposizione e la presentazione dei campi all'interno del componente **Detail**. È possibile configurare opzioni come:
+ **Numero di colonne**: Specificare il numero di colonne in cui visualizzare i campi.
+ **Ordinamento dei campi**: trascina e rilascia i campi per riordinarne l'aspetto.
+ **Spaziatura e allineamento**: regola la spaziatura e l'allineamento dei campi all'interno del componente.

#### Espressioni ed esempi
<a name="detail-component-properties-expressions"></a>

Il componente **Detail** fornisce vari campi di espressione che consentono di fare riferimento e visualizzare i dati all'interno del componente in modo dinamico. Queste espressioni consentono di creare componenti **Detail** personalizzati e interattivi che si connettono perfettamente con i dati e la logica dell'applicazione.

##### Esempio: riferimento ai dati
<a name="detail-component-properties-examples-referencing-data"></a>

`{{ui.details.data[0]?.["colName"]}}`: Questa espressione consente di fare riferimento al valore della colonna denominata «colName» per il primo elemento (indice 0) nell'array di dati connesso al componente **Detail** con l'ID «details». Sostituisci «colName» con il nome effettivo della colonna a cui desideri fare riferimento. Ad esempio, l'espressione seguente mostrerà il valore della colonna «customerName» per il primo elemento dell'array di dati connesso al componente «details»:

```
{{ui.details.data[0]?.["customerName"]}}
```

**Nota**  
**Questa espressione è utile quando il componente **Detail** si trova nella stessa pagina della tabella a cui si fa riferimento e si desidera visualizzare i dati della prima riga della tabella nel componente Detail.**

##### Esempio: rendering condizionale
<a name="detail-component-properties-examples-conditional-rendering"></a>

`{{ui.table1.selectedRow["colName"]}}`: Questa espressione restituisce true se la riga selezionata nella tabella con l'ID *table1* contiene dati per la colonna denominata*colName*. Può essere utilizzata per mostrare o nascondere in modo condizionale il componente **Detail** a seconda che la riga selezionata della tabella sia vuota o meno.

Esempio:

È possibile utilizzare questa espressione nella `Visible if` proprietà del componente **Detail** per mostrarla o nasconderla in modo condizionale in base alla riga selezionata nella tabella.

```
{{ui.table1.selectedRow["customerName"]}}
```

Se questa espressione restituisce true (la riga selezionata nel *table1* componente ha un valore per la *customerName* colonna), il componente **Detail** sarà visibile. Se l'espressione restituisce false (ad esempio, la riga selezionata è vuota o non ha un valore per «customerName»), **il** componente Detail verrà nascosto.

##### Esempio: visualizzazione condizionale
<a name="detail-component-properties-examples-conditional-display"></a>

`{{(ui.Component.value === "green" ? "🟢" : ui.Component.value === "yellow" ? "🟡" : ui.detail1.data?.[0]?.CustomerStatus)}}`: Questa espressione visualizza in modo condizionale un'emoji in base al valore di un componente o di un campo dati.

Suddivisione:
+ `ui.Component.value`: fa riferimento al valore di un componente con l'ID. *Component*
+ `=== "green"`: Verifica se il valore del componente è uguale alla stringa «green».
+ `? "🟢"`: Se la condizione è vera, visualizza l'emoji del cerchio verde.
+ `: ui.Component.value === "yellow" ? "🟡"`: Se la prima condizione è falsa, controlla se il valore del componente è uguale alla stringa «yellow».
+ `? "🟡"`: Se la seconda condizione è vera, visualizza l'emoji a forma di quadrato giallo.
+ `: ui.detail1.data?.[0]?.CustomerStatus`: Se entrambe le condizioni sono false, fa riferimento al valore "CustomerStatus" del primo elemento dell'array di dati connesso al componente Detail con l'ID «detail1".

**Questa espressione può essere utilizzata per visualizzare un'emoji o un valore specifico basato sul valore di un componente o di un campo dati all'interno del componente Detail.**

### Metriche
<a name="metrics-component"></a>

Il componente **Metrics** è un elemento visivo che mostra metriche o punti dati chiave in un formato simile a una scheda. È progettato per fornire un modo conciso e visivamente accattivante per presentare informazioni importanti o indicatori di performance.

#### Proprietà delle metriche
<a name="metrics-properties"></a>

Il componente **Metrics** condivide diverse proprietà comuni con altri componenti, ad esempio `Name``Source`, e. `Actions` Per ulteriori informazioni su queste proprietà, vedere[Proprietà comuni dei componenti](#common-properties).

#### Tendenza
<a name="metrics-properties-trend"></a>

La funzione di tendenza delle metriche consente di visualizzare un indicatore visivo della performance o della variazione nel tempo della metrica visualizzata.

##### Valore di tendenza
<a name="metrics-properties-trend-value"></a>

Questo campo consente di specificare il valore o l'espressione da utilizzare per determinare la direzione e l'ampiezza del trend. In genere, si tratta di un valore che rappresenta la variazione o la performance in un periodo di tempo specifico.

Esempio:

```
{{ui.salesMetrics.data?.[0]?.monthOverMonthRevenue}}
```

Questa espressione recupera il valore month-over-month dei ricavi dal primo elemento nei dati connessi alle metriche «SalesMetrics».

##### Tendenza positiva
<a name="metrics-properties-positive-trend"></a>

Questo campo consente di inserire un'espressione che definisce la condizione per una tendenza positiva. L'espressione deve restituire vero o falso.

Esempio:

```
{{ui.salesMetrics.data?.[0]?.monthOverMonthRevenue > 0}}
```

Questa espressione verifica se il valore month-over-month delle entrate è maggiore di 0, indicando una tendenza positiva.

##### Tendenza negativa
<a name="metrics-properties-negative-trend"></a>

Questo campo consente di inserire un'espressione che definisce la condizione per una tendenza negativa. L'espressione deve restituire vero o falso.

Esempio:

```
{{ui.salesMetrics.data?.[0]?.monthOverMonthRevenue < 0}}
```

Questa espressione verifica se il valore month-over-month delle entrate è inferiore a 0, indicando una tendenza negativa.

##### Barra dei colori
<a name="metrics-properties-color-bar"></a>

Questo interruttore consente di abilitare o disabilitare la visualizzazione di una barra colorata per indicare visivamente lo stato della tendenza.

##### Esempi di barre a colori:
<a name="metrics-properties-color-bar-examples"></a>

##### Esempio: andamento delle metriche di vendita
<a name="metrics-properties-color-bar-examples-sales-metrics-trend"></a>
+ **Valore di tendenza**: `{{ui.salesMetrics.data?.[0]?.monthOverMonthRevenue}}`
+ **Tendenza positiva**: `{{ui.salesMetrics.data?.[0]?.monthOverMonthRevenue > 0}}`
+ **Tendenza negativa**: `{{ui.salesMetrics.data?.[0]?.monthOverMonthRevenue < 0}}`
+ **Barra dei colori**: abilitata

##### Esempio: andamento delle metriche di inventario
<a name="metrics-properties-color-bar-examples-inventory-metrics-trend"></a>
+ **Valore di tendenza**: `{{ui.inventoryMetrics.data?.[0]?.currentInventory - ui.inventoryMetrics.data?.[1]?.currentInventory}}`
+ **Tendenza positiva**: `{{ui.inventoryMetrics.data?.[0]?.currentInventory > ui.inventoryMetrics.data?.[1]?.currentInventory}}`
+ **Tendenza negativa**: `{{ui.inventoryMetrics.data?.[0]?.currentInventory < ui.inventoryMetrics.data?.[1]?.currentInventory}}`
+ Barra **dei colori: abilitata**

##### Esempio: tendenza alla soddisfazione dei clienti
<a name="metrics-properties-color-bar-examples-customer-satisfaction-trend"></a>
+ **Valore di tendenza**: `{{ui.customerSatisfactionMetrics.data?.[0]?.npsScore}}`
+ **Tendenza positiva**: `{{ui.customerSatisfactionMetrics.data?.[0]?.npsScore >= 8}}`
+ **Tendenza negativa**: `{{ui.customerSatisfactionMetrics.data?.[0]?.npsScore < 7}}`
+ **Barra dei colori**: abilitata

Configurando queste proprietà relative alle tendenze, puoi creare componenti **Metrics** che forniscono una rappresentazione visiva delle prestazioni o delle modifiche nel tempo della metrica visualizzata.

Sfruttando queste espressioni, puoi creare componenti di metriche altamente personalizzati e interattivi che fanno riferimento e visualizzano i dati in modo dinamico, consentendoti di mostrare metriche chiave, indicatori di performance e visualizzazioni basate sui dati all'interno dell'applicazione.

#### Esempi di espressioni metriche
<a name="metrics-expression-examples"></a>

Nel pannello delle proprietà, è possibile inserire espressioni per visualizzare il titolo, il valore primario, il valore secondario e la didascalia del valore per visualizzare dinamicamente un valore.

##### Esempio: riferimento al valore primario
<a name="metrics-expression-examples-referencing-primary-value"></a>

`{{ui.metric1.primaryValue}}`: Questa espressione consente di fare riferimento al valore principale del componente **Metrics** con l'ID *metric1* di altri componenti o espressioni all'interno della stessa pagina.

Esempio: `{{ui.salesMetrics.primaryValue}}` mostrerà il valore principale del componente *salesMetrics* **Metrics**.

##### Esempio: riferimento a un valore secondario
<a name="metrics-expression-examples-referencing-secondary-value"></a>

`{{ui.metric1.secondaryValue}}`: Questa espressione consente di fare riferimento al valore secondario del componente **Metriche** con l'ID *metric1* di altri componenti o espressioni all'interno della stessa pagina.

Esempio: `{{ui.revenueMetrics.secondaryValue}}` mostrerà il valore secondario del componente *revenueMetrics* **Metrics**.

##### Esempio: dati di riferimento
<a name="metrics-expression-examples-referencing-data"></a>

`{{ui.metric1.data}}`: Questa espressione consente di fare riferimento ai dati del componente **Metriche** con l'ID *metric1* di altri componenti o espressioni all'interno della stessa pagina.

Esempio: `{{ui.kpiMetrics.data}}` farà riferimento ai dati collegati al componente *kpiMetrics* **Metrics**.

##### Esempio: visualizzazione di valori di dati specifici:
<a name="metrics-expression-examples-displaying-specific-data-values"></a>

`{{ui.metric1.data?.[0]?.id}}`: Questa espressione è un esempio di come visualizzare un'informazione specifica dai dati collegati al componente **Metrics** con l'ID*metric1*. È utile quando si desidera visualizzare una proprietà specifica del primo elemento nei dati.

Ripartizione:
+ `ui.metric1`: fa riferimento al componente **Metrics** con l'ID. *metric1*
+ `data`: si riferisce alle informazioni o al set di dati collegati a quel componente.
+ `?.[0]`: indica il primo elemento o voce in quel set di dati.
+ `?.id`: Visualizza il *id* valore o l'identificatore del primo elemento o voce.

Esempio: `{{ui.orderMetrics.data?.[0]?.orderId}}` mostrerà il *orderId* valore del primo elemento nei dati collegati al componente *orderMetrics* **Metrics**.

##### Esempio: visualizzazione della lunghezza dei dati
<a name="metrics-expression-examples-displaying-data-length"></a>

`{{ui.metric1.data?.length}}`: Questa espressione dimostra come visualizzare la lunghezza (numero di elementi) nei dati collegati al componente **Metrics** con l'ID. *metric1* È utile quando si desidera visualizzare il numero di elementi nei dati.

Ripartizione:
+ `ui.metric1.data`: fa riferimento al set di dati collegato al componente.
+ `?.length`: accede al conteggio totale o al numero di elementi o voci in quel set di dati.

Esempio: `{{ui.productMetrics.data?.length}}` mostrerà il numero di elementi nei dati collegati al componente *productMetrics* **Metrics**.

### Ripetitore
<a name="repeater-component"></a>

Il componente **Repeater** è un componente dinamico che consente di generare e visualizzare una raccolta di elementi basata su una fonte di dati fornita. È progettato per facilitare la creazione di elenchi, griglie o schemi ripetuti all'interno dell'interfaccia utente dell'applicazione. Alcuni esempi di casi d'uso includono:
+ Visualizzazione di una scheda per ogni utente in un account
+ Mostra un elenco di prodotti che includono immagini e un pulsante per aggiungerli al carrello
+ Visualizzazione di un elenco di file a cui l'utente può accedere

Il componente **Repeater** si differenzia dal componente **Table** con contenuti avanzati. Un componente **Table** ha un formato rigoroso di righe e colonne. Il **ripetitore** può visualizzare i dati in modo più flessibile.

#### Proprietà del ripetitore
<a name="repeater-component-properties"></a>

Il componente **Repeater** condivide diverse proprietà comuni con altri componenti, ad esempio `Name``Source`, e. `Actions` Per ulteriori informazioni su queste proprietà, vedere[Proprietà comuni dei componenti](#common-properties).

Oltre alle proprietà comuni, il componente **Repeater** presenta le seguenti proprietà e opzioni di configurazione aggiuntive.

#### Modello di articolo
<a name="repeater-component-properties-item-template"></a>

Il **modello Item** è un contenitore in cui è possibile definire la struttura e i componenti che verranno ripetuti per ogni elemento nell'origine dati. Puoi trascinare e rilasciare altri componenti in questo contenitore, come **testo**, **immagine**, **pulsante** o qualsiasi altro componente necessario per rappresentare ogni elemento.

All'interno del **modello Item**, puoi fare riferimento a proprietà o valori dell'elemento corrente utilizzando le espressioni nel formato`{{currentItem.propertyName}}`.

Ad esempio, se l'origine dati contiene una `itemName` proprietà, è possibile utilizzarla `{{currentItem.itemName}}` per visualizzare i nomi degli elementi dell'elemento corrente.

#### Layout
<a name="repeater-component-properties-layout"></a>

La sezione **Layout** consente di configurare la disposizione degli elementi ripetuti all'interno del componente Repeater.

##### Orientation (Orientamento)
<a name="repeater-component-properties-orientation"></a>
+ **Elenco**: dispone gli elementi ripetuti verticalmente in un'unica colonna.
+ **Griglia**: dispone gli elementi ripetuti in un layout a griglia con più colonne.

##### Righe per pagina
<a name="repeater-component-properties-rows-per-page"></a>

Specificate il numero di righe da visualizzare per pagina nel layout dell'elenco. L'impaginazione viene fornita per gli elementi che superano il numero di righe specificato.

##### Colonne e righe per pagina (griglia)
<a name="columns-and-rows-per-page-grid"></a>
+ **Colonne**: Specificare il numero di colonne nel layout a griglia.
+ **Righe per pagina**: Specificare il numero di righe da visualizzare per pagina nel layout a griglia. L'impaginazione viene fornita per gli elementi che superano le dimensioni della griglia specificate.

#### Espressioni ed esempi
<a name="repeater-component-properties-expressions"></a>

Il componente **Repeater** fornisce vari campi di espressione che consentono di fare riferimento e visualizzare i dati all'interno del componente in modo dinamico. Queste espressioni consentono di creare componenti **Repeater** personalizzati e interattivi che si connettono perfettamente con i dati e la logica dell'applicazione.

##### Esempio: riferimenti a elementi
<a name="repeater-component-properties-expressions-examples-referencing-items"></a>
+ `{{currentItem.propertyName}}`: Fai riferimento alle proprietà o ai valori dell'elemento corrente all'interno del **modello di elemento**.
+ `{{ui.repeaterID[index]}}`: Fate riferimento a un elemento specifico nel componente Repeater in base al relativo indice.

##### Esempio: visualizzazione di un elenco di prodotti
<a name="repeater-component-properties-expressions-examples-rendering-product-list"></a>
+ **Fonte**: seleziona l'*Products*entità come fonte di dati.
+ **Modello di articolo**: aggiungi un componente **Contenitore** con un componente **Testo** all'interno per visualizzare il nome del prodotto (`{{currentItem.productName}}`) e un componente **Immagine** per visualizzare l'immagine del prodotto (`{{currentItem.productImageUrl}}`).
+ **Layout**: imposta `Orientation` la parte `List` superiore e `Rows per Page` regolala come desideri.

##### Esempio: generazione di una griglia di avatar utente
<a name="repeater-component-properties-expressions-examples-generating-user-avatar-grid"></a>
+ **Fonte**: utilizza un'espressione per generare una serie di dati utente (ad es.). `[{name: 'John', avatarUrl: '...'}, {...}, {...}]`
+ **Modello di elemento**: aggiungi un componente **Image** e imposta la sua `Source` proprietà su`{{currentItem.avatarUrl}}`.
+ **Layout**: imposta su`Grid`, specifica il numero di `Columns` e `Rows per Page` e regola la `Space Between` e `Padding` secondo necessità. `Orientation`

Utilizzando il `Repeater` componente, è possibile creare interfacce utente dinamiche e basate sui dati, semplificando il processo di rendering di raccolte di elementi e riducendo la necessità di ripetizioni manuali o di codifica rigida.

### Modulo
<a name="form-component"></a>

Il componente Form è progettato per acquisire l'input dell'utente e facilitare le attività di immissione dei dati all'interno dell'applicazione. Fornisce un layout strutturato per la visualizzazione di campi di input, menu a discesa, caselle di controllo e altri controlli del modulo, consentendo agli utenti di inserire o modificare i dati senza problemi. È possibile inserire altri componenti all'interno di un componente del modulo, ad esempio una tabella.

#### Proprietà del modulo
<a name="form-component-properties"></a>

Il componente **Form** condivide diverse proprietà comuni con altri componenti, ad esempio `Name``Source`, e`Actions`. Per ulteriori informazioni su queste proprietà, vedere[Proprietà comuni dei componenti](#common-properties).

#### Genera modulo
<a name="form-component-properties-generate-form"></a>

La funzione **Genera modulo** semplifica la creazione rapida di campi modulo compilandoli automaticamente in base a una fonte di dati selezionata. Ciò consente di risparmiare tempo e fatica durante la creazione di moduli che richiedono la visualizzazione di un gran numero di campi.

**Per utilizzare la funzione **Genera modulo**:**

1. Nelle proprietà del componente **Form**, individuate la sezione **Generate Form**.

1. Seleziona l'origine dati che desideri utilizzare per generare i campi del modulo. Può trattarsi di un'entità, di un flusso di lavoro o di qualsiasi altra fonte di dati disponibile nell'applicazione.

1. I campi del modulo verranno generati automaticamente in base all'origine dati selezionata, incluse le etichette dei campi, i tipi e le mappature dei dati.

1. Rivedi i campi generati e apporta le personalizzazioni necessarie, ad esempio aggiungendo regole di convalida o modificando l'ordine dei campi.

1. Quando sei soddisfatto della configurazione del modulo, scegli **Invia** per applicare i campi generati al componente **Modulo**.

La funzionalità **Genera modulo** è particolarmente utile quando nell'applicazione è presente un modello di dati o un insieme di entità ben definito per il quale è necessario acquisire l'input dell'utente. Generando automaticamente i campi del modulo, è possibile risparmiare tempo e garantire la coerenza tra i moduli dell'applicazione.

Dopo aver utilizzato la funzione **Genera modulo**, puoi personalizzare ulteriormente il layout, le azioni e le espressioni del componente **Modulo** in base alle tue esigenze specifiche.

#### Espressioni ed esempi
<a name="form-component-properties-expressions"></a>

Come altri componenti, è possibile utilizzare le espressioni per fare riferimento e visualizzare i dati all'interno del componente **Form**. Esempio:
+ `{{ui.userForm.data.email}}`: fa riferimento al valore del `email` campo dall'origine dati collegata al componente **Form** con l'ID`userForm`.

**Nota**  
[Proprietà comuni dei componenti](#common-properties)Per ulteriori esempi di espressioni delle proprietà comuni, vedere.

Configurando queste proprietà e sfruttando le espressioni, puoi creare componenti Form personalizzati e interattivi che si integrano perfettamente con le fonti di dati e la logica dell'applicazione. Questi componenti possono essere utilizzati per acquisire l'input dell'utente, visualizzare dati precompilati e attivare azioni in base all'invio del modulo o alle interazioni degli utenti.

### Stepflow
<a name="stepflow-component"></a>

Il componente **Stepflow** è progettato per guidare gli utenti attraverso processi o flussi di lavoro in più fasi all'interno dell'applicazione. Fornisce un'interfaccia strutturata e intuitiva per presentare una sequenza di passaggi, ciascuno con il proprio set di input, convalide e azioni.

Il componente Stepflow condivide diverse proprietà comuni con altri componenti, ad esempio`Name`, `Source` e. `Actions` Per ulteriori informazioni su queste proprietà, vedere[Proprietà comuni dei componenti](#common-properties).

Il componente **Stepflow** dispone di proprietà e opzioni di configurazione aggiuntive, ad esempio `Step Navigation``Validation`, e`Expressions`.

## Componenti AI
<a name="ai-components"></a>

### Generazione AI
<a name="genai-component"></a>

Il componente **Gen AI** è un contenitore di raggruppamento che viene utilizzato per raggruppare i componenti e la relativa logica per modificarli facilmente con l'intelligenza artificiale utilizzando la chat all'interno dello studio applicativo. Quando usi la chat per creare componenti, questi verranno raggruppati in un contenitore **Gen** AI. Per informazioni sulla modifica o sull'utilizzo di questo componente, consulta[Creazione o modifica della tua app](generative-ai.md#generative-ai-build-app).

## Componenti di testo e numeri
<a name="text-and-number-components"></a>

### Inserimento di testo
<a name="text-input-component"></a>

Il componente **di immissione di testo** consente agli utenti di inserire e inviare dati di testo all'interno dell'applicazione. Fornisce un modo semplice e intuitivo per acquisire gli input dell'utente, come nomi, indirizzi o qualsiasi altra informazione testuale.
+ `{{ui.inputTextID.value}}`: restituisce il valore fornito nel campo di immissione.
+ `{{ui.inputTextID.isValid}}`: restituisce la validità del valore fornito nel campo di input.

### Testo
<a name="text-component"></a>

Il componente **Testo** viene utilizzato per visualizzare informazioni testuali all'interno dell'applicazione. Può essere usato per mostrare testo statico, valori dinamici o contenuti generati da espressioni.

### Area di testo
<a name="text-area-component"></a>

Il componente **Area di testo** è progettato per acquisire l'input di testo su più righe dagli utenti. Fornisce un'area di immissione più ampia per consentire agli utenti di inserire voci di testo più lunghe, come descrizioni, note o commenti.
+ `{{ui.textAreaID.value}}`: restituisce il valore fornito nell'area di testo.
+ `{{ui.textAreaID.isValid}}`: restituisce la validità del valore fornito nell'area di testo.

### Email
<a name="email-component"></a>

Il componente **Email** è un campo di input specializzato progettato per acquisire gli indirizzi e-mail degli utenti. Può applicare regole di convalida specifiche per garantire che il valore inserito sia conforme al formato e-mail corretto.
+ `{{ui.emailID.value}}`: restituisce il valore fornito nel campo di immissione dell'e-mail.
+ `{{ui.emailID.isValid}}`: restituisce la validità del valore fornito nel campo di immissione dell'e-mail.

### Password
<a name="password-component"></a>

Il componente **Password** è un campo di immissione progettato specificamente per consentire agli utenti di inserire informazioni sensibili, come password o codici PIN. Maschera i caratteri inseriti per mantenere la privacy e la sicurezza.
+ `{{ui.passwordID.value}}`: restituisce il valore fornito nel campo di immissione della password.
+ `{{ui.passwordID.isValid}}`: Restituisce la validità del valore fornito nel campo di immissione della password.

### Cerca
<a name="search-component"></a>

Il componente **Search** fornisce agli utenti un campo di input dedicato per eseguire query di ricerca o inserire termini di ricerca all'interno dei dati popolati all'interno dell'applicazione.
+ `{{ui.searchID.value}}`: restituisce il valore fornito nel campo di ricerca.

### Telefono
<a name="phone-component"></a>

Il componente **Telefono** è un campo di immissione progettato per acquisire numeri di telefono o altre informazioni di contatto dagli utenti. Può includere regole di convalida e opzioni di formattazione specifiche per garantire che il valore inserito aderisca al formato corretto del numero di telefono.
+ `{{ui.phoneID.value}}`: restituisce il valore fornito nel campo di immissione del telefono.
+ `{{ui.phoneID.isValid}}`: restituisce la validità del valore fornito nel campo di immissione del telefono.

### Numero
<a name="number-component"></a>

Il componente **Number** è un campo di input progettato specificamente per consentire agli utenti di inserire valori numerici. Può applicare regole di convalida per garantire che il valore inserito sia un numero valido all'interno di un intervallo o formato specificato.
+ `{{ui.numberID.value}}`: restituisce il valore fornito nel campo di immissione del numero.
+ `{{ui.numberID.isValid}}`: restituisce la validità del valore fornito nel campo di immissione del numero.

### Valuta
<a name="currency-component"></a>

Il componente **Valuta** è un campo di input specializzato per l'acquisizione di valori o importi monetari. Può includere opzioni di formattazione per visualizzare simboli di valuta, separatori decimali e applicare regole di convalida specifiche per gli input di valuta.
+ `{{ui.currencyID.value}}`: restituisce il valore fornito nel campo di immissione della valuta.
+ `{{ui.currencyID.isValid}}`: restituisce la validità del valore fornito nel campo di immissione della valuta.

### Coppia di dettagli
<a name="detail-pair-component"></a>

Il componente **Detail pair** viene utilizzato per visualizzare coppie chiave-valore o coppie di informazioni correlate in un formato strutturato e leggibile. Viene comunemente utilizzato per presentare dettagli o metadati associati a un elemento o un'entità specifici.

## Componenti di selezione
<a name="selection-components"></a>

### Effettua lo switch
<a name="switch-component"></a>

Il componente **Switch** è un controllo dell'interfaccia utente che consente agli utenti di passare tra due stati o opzioni, ad esempio. on/off, true/false, or enabled/disabled Fornisce una rappresentazione visiva dello stato corrente e consente agli utenti di modificarlo con un solo clic o tocco.

### Cambia gruppo
<a name="switch-group-component"></a>

Il componente del **gruppo Switch** è una raccolta di controlli di switch individuali che consentono agli utenti di selezionare una o più opzioni da un set predefinito. Fornisce una rappresentazione visiva delle opzioni selezionate e non selezionate, facilitando la comprensione e l'interazione degli utenti con le scelte disponibili.

#### Cambia i campi di espressione di gruppo
<a name="switch-group-expression-fields"></a>
+ `{{ui.switchGroupID.value}}`: restituisce una matrice di stringhe contenente il valore di ogni switch abilitato dall'utente dell'app.

### Gruppo di caselle di controllo
<a name="checkbox-group-component"></a>

Il componente del **gruppo Checkbox** presenta agli utenti un gruppo di caselle di controllo che consentono loro di selezionare più opzioni contemporaneamente. È utile quando si desidera fornire agli utenti la possibilità di scegliere uno o più elementi da un elenco di opzioni.

#### Campi di espressione del gruppo Checkbox
<a name="checkbox-group-expression-fields"></a>
+ `{{ui.checkboxGroupID.value}}`: restituisce una matrice di stringhe contenente il valore di ogni casella di controllo selezionata dall'utente dell'app.

### Gruppo radiofonico
<a name="radio-group-component"></a>

Il componente del **gruppo Radio** è un insieme di pulsanti di opzione che consentono agli utenti di selezionare una singola opzione tra più scelte che si escludono a vicenda. Garantisce che sia possibile selezionare una sola opzione alla volta, fornendo agli utenti un modo chiaro e inequivocabile di effettuare una selezione.

#### Campi di espressione dei gruppi radio
<a name="radio-group-expression-fields"></a>

I seguenti campi possono essere utilizzati nelle espressioni.
+ `{{ui.radioGroupID.value}}`: restituisce il valore del pulsante radio selezionato dall'utente dell'app.

### Selezione singola
<a name="single-select-component"></a>

Il componente **Selezione singola** presenta agli utenti un elenco di opzioni da cui è possibile selezionare un singolo elemento. Viene comunemente utilizzato in scenari in cui gli utenti devono scegliere tra un insieme predefinito di opzioni, come la selezione di una categoria, una posizione o una preferenza.

#### Campi di espressione a selezione singola
<a name="single-select-expression-fields"></a>
+ `{{ui.singleSelectID.value}}`: restituisce il valore della voce dell'elenco selezionata dall'utente dell'app.

### Selezione multipla
<a name="multi-select-component"></a>

Il componente **Selezione multipla** è simile al componente **Selezione singola** ma consente agli utenti di selezionare più opzioni contemporaneamente da un elenco di scelte. È utile quando gli utenti devono effettuare selezioni multiple da un insieme predefinito di opzioni, ad esempio selezionare più tag, interessi o preferenze.

#### Campi di espressione a selezione multipla
<a name="multi-select-expression-fields"></a>
+ `{{ui.multiSelectID.value}}`: restituisce una matrice di stringhe contenente il valore di ogni voce dell'elenco selezionata dall'utente dell'app.

## Pulsanti e componenti di navigazione
<a name="buttons-and-navigation-components"></a>

L'application studio offre una varietà di pulsanti e componenti di navigazione per consentire agli utenti di attivare azioni e navigare all'interno dell'applicazione.

### Componenti dei pulsanti
<a name="button-components"></a>

I componenti dei pulsanti disponibili sono:
+ Button
+ Pulsante delineato
+ Pulsante a icona
+ Pulsante di testo

Questi componenti dei pulsanti condividono le seguenti proprietà comuni:

#### Contenuti
<a name="button-content"></a>
+ **Etichetta del pulsante**: il testo da visualizzare sul pulsante.

#### Tipo
<a name="button-type"></a>
+ **Tasto**: un pulsante standard.
+ **Delineato**: un bottone con uno stile delineato.
+ **Icona**: un pulsante con un'icona.
+ **Testo**: un pulsante di solo testo.

#### Dimensione
<a name="button-size"></a>

La dimensione del pulsante. I valori possibili sono `Small`, `Medium` e `Large`.

#### Icon
<a name="button-icon"></a>

È possibile scegliere tra diverse icone da visualizzare sul pulsante, tra cui:
+ Busta chiusa
+ campana
+ Person
+ Menù a base di hamburger
+ Cerca
+ Informazioni cerchiate
+ Ingranaggio
+ Chevron a sinistra
+ Chevron a destra
+ Punti orizzontali
+ Cestino
+ Modifica
+ Verifica
+ Chiudi
+ Home
+ Più

#### Triggers
<a name="button-triggers"></a>

Quando si fa clic sul pulsante, è possibile configurare una o più azioni da attivare. I tipi di azioni disponibili sono:
+ **Di base**
  + Esegui azione componente: esegue un'azione specifica all'interno di un componente.
  + Naviga: passa a un'altra pagina o visualizzazione.
  + Invoke Data Action: attiva un'azione relativa ai dati, come la creazione, l'aggiornamento o l'eliminazione di un record.
+ **Avanzato**
  + JavaScript: esegue codice personalizzato. JavaScript 
  + Invoke Automation: avvia un'automazione o un flusso di lavoro esistente.

#### JavaScript proprietà del pulsante di azione
<a name="button-examples-javascript"></a>

Seleziona il tipo di `JavaScript` azione per eseguire il JavaScript codice personalizzato quando si fa clic sul pulsante.

##### Codice sorgente
<a name="button-source-code"></a>

Nel `Source code` campo, puoi inserire la tua JavaScript espressione o funzione. Esempio:

```
return "Hello World";
```

Ciò restituirà semplicemente la stringa `Hello World` quando si fa clic sul pulsante.

##### Condizione: Esegui se
<a name="button-run-if"></a>

Puoi anche fornire un'espressione booleana che determina se l' JavaScript azione deve essere eseguita o meno. Questo utilizza la sintassi seguente:

```
{{ui.textinput1.value !== ""}}
```

In questo esempio, l' JavaScript azione verrà eseguita solo se il valore del `textinput1` componente non è una stringa vuota.

Utilizzando queste opzioni di attivazione avanzate, è possibile creare comportamenti dei pulsanti altamente personalizzati che si integrano direttamente con la logica e i dati dell'applicazione. Ciò consente di estendere la funzionalità integrata dei pulsanti e personalizzare l'esperienza utente in base alle esigenze specifiche.

**Nota**  
Verifica sempre attentamente JavaScript le tue azioni per assicurarti che funzionino come previsto.

### Collegamento ipertestuale
<a name="hyperlink-component"></a>

Il componente **Hyperlink** fornisce un link cliccabile per navigare verso percorsi di applicazione esterni URLs o interni.

#### Proprietà del collegamento ipertestuale
<a name="hyperlink-properties"></a>

##### Contenuti
<a name="hyperlink-properties-content"></a>
+ **Etichetta del collegamento ipertestuale**: il testo da visualizzare come etichetta del collegamento ipertestuale.

##### URL
<a name="hyperlink-properties-url"></a>

L'URL di destinazione del collegamento ipertestuale, che può essere un sito Web esterno o un percorso interno dell'applicazione.

##### Triggers
<a name="hyperlink-properties-triggers"></a>

Quando si fa clic sul collegamento ipertestuale, è possibile configurare una o più azioni da attivare. I tipi di azioni disponibili sono gli stessi di quelli per i componenti dei pulsanti.

## Componenti di data e ora
<a name="date-and-time-components"></a>

### Data
<a name="date-component"></a>

Il componente **Data** consente agli utenti di selezionare e inserire le date.

Il componente **Date** condivide diverse proprietà comuni con altri componenti, ad esempio `Name``Source`, e`Validation`. Per ulteriori informazioni su queste proprietà, vedere[Proprietà comuni dei componenti](#common-properties).

Oltre alle proprietà comuni, il componente **Date** presenta le seguenti proprietà specifiche:

#### Proprietà Date
<a name="date-component-properties"></a>

##### Formato
<a name="date-component-properties-format"></a>
+ **YYYY/MM/DD**, **DD/MM/YYYY**,, **YYYY/MM/DD**YYYY/DD/MM****, **MM/GG**, **GG/MM**: il formato in cui deve essere visualizzata la data.

##### Valore
<a name="date-component-properties-value"></a>
+ **AAAA-MM-GG**: il formato in cui il valore della data è memorizzato internamente.

##### Data minima
<a name="date-component-properties-min-date"></a>
+ **AAAA-MM-GG**: La data minima selezionabile.
**Nota**  
Questo valore deve corrispondere al formato di. `YYYY-MM-DD`

##### Data massima
<a name="date-component-properties-max-date"></a>
+ **AAAA-MM-GG**: La data massima selezionabile.
**Nota**  
Questo valore deve corrispondere al formato di. `YYYY-MM-DD`

##### Tipo di calendario
<a name="date-component-properties-calendar-type"></a>
+ **1 mese**, **2 mesi**: il tipo di interfaccia utente del calendario da visualizzare.

##### Date disabilitate
<a name="date-component-properties-disabled-dates"></a>
+ **Fonte**: l'origine dati per le date che devono essere disabilitate. Ad esempio: Nessuno, Espressione.
+ **Date disattivate**: un'espressione che determina quali date devono essere disabilitate, ad esempio:
  + `{{currentRow.column}}`: disattiva le date che corrispondono a quelle valutate da questa espressione.
  + `{{new Date(currentRow.dateColumn) < new Date("2023-01-01")}}`: disabilita le date precedenti al 1° gennaio 2023
  + `{{new Date(currentRow.dateColumn).getDay() === 0 || new Date(currentRow.dateColumn).getDay() === 6}}`: disabilita i fine settimana.

##### Comportamento
<a name="date-component-properties-behavior"></a>
+ **Visibile se**: espressione che determina la visibilità del componente **Date**.
+ **Disable if**: espressione che determina se il componente **Date** deve essere disabilitato.

#### Convalida
<a name="date-component-properties-validation"></a>

La sezione **Convalida** consente di definire regole e vincoli aggiuntivi per l'immissione della data. Configurando queste regole di convalida, è possibile garantire che i valori di data immessi dagli utenti soddisfino i requisiti specifici dell'applicazione. È possibile aggiungere i seguenti tipi di convalide:
+ **Obbligatorio**: questo interruttore assicura che l'utente debba inserire un valore di data prima di inviare il modulo.
+ **Personalizzato**: è possibile creare regole di convalida personalizzate utilizzando espressioni. JavaScript Esempio:

  ```
  {{new Date(ui.dateInput.value) < new Date("2023-01-01")}}
  ```

  Questa espressione verifica se la data inserita è precedente al 1 gennaio 2023. Se la condizione è vera, la convalida avrà esito negativo.

  Puoi anche fornire un messaggio di convalida personalizzato da visualizzare quando la convalida non viene soddisfatta:

  ```
  "Validation not met. The date must be on or after January 1, 2023."
  ```

Configurando queste regole di convalida, è possibile garantire che i valori di data immessi dagli utenti soddisfino i requisiti specifici dell'applicazione.

#### Espressioni ed esempi
<a name="date-component-expressions"></a>

Il componente **Date** fornisce il seguente campo di espressione:
+ `{{ui.dateID.value}}`: restituisce il valore della data inserito dall'utente nel formato`YYYY-MM-DD`.

### Orario
<a name="time-component"></a>

Il componente **Ora** consente agli utenti di selezionare e inserire valori temporali. Configurando le varie proprietà del componente **Time**, è possibile creare campi di immissione temporale che soddisfino i requisiti specifici dell'applicazione, come la limitazione dell'intervallo di tempo selezionabile, la disabilitazione di determinati orari e il controllo della visibilità e dell'interattività del componente.

#### Proprietà temporali
<a name="time-component-properties"></a>

Il componente **Time** condivide diverse proprietà comuni con altri componenti, ad esempio `Name``Source`, e`Validation`. Per ulteriori informazioni su queste proprietà, vedere[Proprietà comuni dei componenti](#common-properties).

Oltre alle proprietà comuni, il componente **Time** presenta le seguenti proprietà specifiche:

##### Intervalli di tempo
<a name="time-component-properties-time-intervals"></a>
+ **5 minuti**, **10 minuti**, **15 minuti**, **20 minuti**, **25 minuti, 30 minuti****, **60 minuti****: gli intervalli disponibili per la selezione dell'ora.

##### Valore
<a name="time-component-properties-value"></a>
+ **HH:MM AA**: Il formato in cui il valore temporale è memorizzato internamente.
**Nota**  
Questo valore deve corrispondere al formato di. `HH:MM AA`

##### Placeholder
<a name="time-component-properties-placeholder"></a>
+ **Impostazioni del calendario**: il testo segnaposto visualizzato quando il campo orario è vuoto.

##### Tempo minimo
<a name="time-component-properties-min-time"></a>
+ **HH:MM AA**: Il tempo minimo selezionabile.
**Nota**  
Questo valore deve corrispondere al formato di. `HH:MM AA`

##### Tempo massimo
<a name="time-component-properties-max-time"></a>
+ **HH:MM AA**: Il tempo massimo selezionabile.
**Nota**  
Questo valore deve corrispondere al formato di. `HH:MM AA`

##### Orari per disabili
<a name="time-component-properties-disabled-times"></a>
+ **Fonte**: l'origine dati per gli orari che devono essere disabilitati (ad esempio, None, Expression).
+ **Orari di disabilitazione**: un'espressione che determina quali orari devono essere disabilitati, ad esempio`{{currentRow.column}}`.

##### Configurazione degli orari disabilitati
<a name="disabled-times-configuration"></a>

È possibile utilizzare la sezione **Disabled Times** per specificare quali valori temporali non devono essere disponibili per la selezione.

##### Origine
<a name="disabled-times-configuration-source"></a>
+ **Nessuno**: nessun orario è disabilitato.
+ **Espressione**: È possibile utilizzare un' JavaScript espressione per determinare quali orari devono essere disabilitati, ad esempio`{{currentRow.column}}`.

##### Espressione di esempio:
<a name="disabled-times-configuration-expression-example"></a>

```
{{currentRow.column === "Lunch Break"}}
```

Questa espressione disabiliterebbe tutte le volte in cui la colonna «Lunch Break» è vera per la riga corrente.

Configurando queste regole di convalida e disabilitando le espressioni temporali, è possibile garantire che i valori temporali immessi dagli utenti soddisfino i requisiti specifici dell'applicazione.

##### Comportamento
<a name="time-component-properties-behavior"></a>
+ **Visibile se**: espressione che determina la visibilità del componente Time.
+ **Disable if**: un'espressione che determina se il componente Time deve essere disabilitato.

##### Convalida
<a name="time-component-properties-validation"></a>
+ **Obbligatorio**: un interruttore che garantisce che l'utente debba inserire un valore temporale prima di inviare il modulo.
+ **Personalizzato**: consente di creare regole di convalida personalizzate utilizzando espressioni. JavaScript 

  **Messaggio di convalida personalizzato**: il messaggio da visualizzare quando la convalida personalizzata non viene soddisfatta.

Esempio:

```
{{ui.timeInput.value === "09:00 AM" || ui.timeInput.value === "09:30 AM"}}
```

Questa espressione controlla se l'ora inserita è le 9:00 o le 9:30. Se la condizione è vera, la convalida avrà esito negativo.

Puoi anche fornire un messaggio di convalida personalizzato da visualizzare quando la convalida non viene soddisfatta:

```
Validation not met. The time must be 9:00 AM or 9:30 AM.
```

#### Espressioni ed esempi
<a name="time-component-expressions"></a>

Il componente Time fornisce il seguente campo di espressione:
+ `{{ui.timeID.value}}`: restituisce il valore temporale inserito dall'utente nel formato HH:MM AA.

##### Esempio: valore temporale
<a name="time-component-expressions-examples-time-value"></a>
+ `{{ui.timeID.value}}`: restituisce il valore temporale inserito dall'utente nel formato`HH:MM AA`.

##### Esempio: confronto temporale
<a name="time-component-expressions-examples-time-comparison"></a>
+ `{{ui.timeInput.value > "10:00 AM"}}`: Verifica se il valore dell'ora è maggiore delle 10:00.
+ `{{ui.timeInput.value < "05:00 pM"}}`: Verifica se il valore dell'ora è inferiore alle 17:00.

### Intervallo di date
<a name="date-range-component"></a>

Il componente **Intervallo di date** consente agli utenti di selezionare e inserire un intervallo di date. Configurando le varie proprietà del componente Date Range, è possibile creare campi di input per intervalli di date che soddisfano i requisiti specifici dell'applicazione, come la limitazione dell'intervallo di date selezionabile, la disabilitazione di determinate date e il controllo della visibilità e dell'interattività del componente.

#### Proprietà dell'intervallo di date
<a name="date-range-component-properties"></a>

Il componente **Date Range** condivide diverse proprietà comuni con altri componenti, ad esempio `Name``Source`, e`Validation`. Per ulteriori informazioni su queste proprietà, vedere[Proprietà comuni dei componenti](#common-properties).

Oltre alle proprietà comuni, il componente **Date Range** presenta le seguenti proprietà specifiche:

##### Formato
<a name="date-range-component-properties-format"></a>
+ **MM/DD/YYYY**: Il formato in cui deve essere visualizzato l'intervallo di date.

##### Data di inizio
<a name="date-range-component-properties-start-date"></a>
+ **AAAA-MM-GG**: La data minima che può essere selezionata come inizio dell'intervallo.
**Nota**  
Questo valore deve corrispondere al formato di. `YYYY-MM-DD`

##### Data di fine
<a name="date-range-component-properties-end-date"></a>
+ **AAAA-MM-GG**: la data massima che può essere selezionata come fine dell'intervallo.
**Nota**  
Questo valore deve corrispondere al formato di. `YYYY-MM-DD`

##### Placeholder
<a name="date-range-component-properties-placeholder"></a>
+ **Impostazioni del calendario**: il testo segnaposto visualizzato quando il campo dell'intervallo di date è vuoto.

##### Data minima
<a name="date-range-component-properties-min-date"></a>
+ **AAAA-MM-GG**: La data minima selezionabile.
**Nota**  
Questo valore deve corrispondere al formato di. `YYYY-MM-DD`

##### Data massima
<a name="date-range-component-properties-max-date"></a>
+ **AAAA-MM-GG**: La data massima selezionabile.
**Nota**  
Questo valore deve corrispondere al formato di. `YYYY-MM-DD`

##### Tipo di calendario
<a name="date-range-component-properties-calendar-type"></a>
+ **1 mese**: il tipo di interfaccia utente del calendario da visualizzare. Ad esempio, un solo mese.
+ **2 mesi**: il tipo di interfaccia utente del calendario da visualizzare. Ad esempio, due mesi.

##### Giorni obbligatori selezionati
<a name="date-range-component-properties-mandatory-days-selected"></a>
+ **0**: il numero di giorni obbligatori che devono essere selezionati nell'intervallo di date.

##### Date disabilitate
<a name="date-range-component-properties-disabled-dates"></a>
+ **Fonte**: l'origine dati per le date che devono essere disabilitate (ad esempio, Nessuna, Espressione, Entità o Automazione).
+ **Date disabilitate**: un'espressione che determina quali date devono essere disabilitate, ad esempio`{{currentRow.column}}`.

##### Convalida
<a name="date-range-component-properties-validation"></a>

La sezione **Convalida** consente di definire regole e vincoli aggiuntivi per l'immissione dell'intervallo di date.

#### Espressioni ed esempi
<a name="date-range-component-expressions"></a>

Il componente **Date Range** fornisce i seguenti campi di espressione:
+ `{{ui.dateRangeID.startDate}}`: restituisce la data di inizio dell'intervallo selezionato nel formato`YYYY-MM-DD`.
+ `{{ui.dateRangeID.endDate}}`: restituisce la data di fine dell'intervallo selezionato nel formato`YYYY-MM-DD`.

##### Esempio: calcolo della differenza di data
<a name="date-range-component-expressions-examples-calculating-date-difference"></a>
+ `{(new Date(ui.dateRangeID.endDate) - new Date(ui.dateRangeID.startDate)) / (1000 * 60 * 60 * 24)}}`Calcola il numero di giorni tra le date di inizio e fine.

##### Esempio: visibilità condizionale basata sull'intervallo di date
<a name="date-range-component-expressions-examples-conditional-visibility-based-on-date-range"></a>
+ `{{new Date(ui.dateRangeID.startDate) < new Date("2023-01-01") || new Date(ui.dateRangeID.endDate) > new Date("2023-12-31")}}`Verifica se l'intervallo di date selezionato non è compreso nell'anno 2023.

##### Esempio: date disabilitate in base ai dati della riga corrente
<a name="date-range-component-expressions-examples-disabled-dates-based-on-current-row-data"></a>
+ `{{currentRow.isHoliday}}`Disattiva le date in cui la colonna «IsHoliday» nella riga corrente è vera.
+ `{{new Date(currentRow.dateColumn) < new Date("2023-01-01")}}`Disattiva le date precedenti al 1 gennaio 2023 in base alla «DateColumn» nella riga corrente.
+ `{{new Date(currentRow.dateColumn).getDay() === 0 || new Date(currentRow.dateColumn).getDay() === 6}}`Disattiva i fine settimana in base alla «DateColumn» nella riga corrente.

##### Convalida personalizzata
<a name="date-range-component-expressions-examples-custom-validation"></a>
+ `{{new Date(ui.dateRangeID.startDate) > new Date(ui.dateRangeID.endDate)}}`Verifica se la data di inizio è successiva alla data di fine, operazione che fallirebbe la convalida personalizzata.

## Componenti multimediali
<a name="media-components"></a>

Lo studio applicativo fornisce diversi componenti per l'incorporamento e la visualizzazione di vari tipi di file multimediali all'interno dell'applicazione.

### Incorporamento iFrame
<a name="iframe-embed-component"></a>

Il componente **iFrame embed** consente di incorporare contenuti o applicazioni Web esterni all'interno dell'applicazione utilizzando un iFrame.

#### Proprietà di incorporamento iFrame
<a name="iframe-embed-properties"></a>

##### URL
<a name="iframe-embed-properties-iframe-url"></a>

**Nota**  
La fonte dei contenuti multimediali visualizzati in questo componente deve essere consentita nelle impostazioni di sicurezza dei contenuti dell'applicazione. Per ulteriori informazioni, consulta [Visualizzazione o aggiornamento delle impostazioni di sicurezza dei contenuti dell'app](app-content-security-settings-csp.md).

L'URL del contenuto o dell'applicazione esterna che desideri incorporare.

##### Layout
<a name="iframe-embed-properties-iframe-layout"></a>
+ **Larghezza**: la larghezza dell'iFrame, specificata come percentuale (%) o come valore fisso in pixel (ad esempio, 300 px).
+ **Altezza**: l'altezza dell'iFrame, specificata come percentuale (%) o come valore fisso in pixel.

### Caricamento S3
<a name="s3-upload-component"></a>

Il componente di **caricamento S3** consente agli utenti di caricare file su un bucket Amazon S3. Configurando il componente **S3 Upload**, puoi consentire agli utenti di caricare facilmente i file sullo storage Amazon S3 della tua applicazione e quindi sfruttare le informazioni sui file caricati all'interno della logica e dell'interfaccia utente dell'applicazione.

**Nota**  
Ricorda di assicurarti che siano disponibili le autorizzazioni necessarie e le configurazioni dei bucket Amazon S3 per supportare i caricamenti di file e i requisiti di archiviazione della tua applicazione.

#### Proprietà di caricamento S3
<a name="s3-upload-properties"></a>

##### Configurazione S3
<a name="s3-upload-component-properties-configuration"></a>
+ **Connettore**: seleziona il connettore Amazon S3 preconfigurato da utilizzare per il caricamento dei file.
+ **Bucket: il bucket** Amazon S3 in cui verranno caricati i file.
+ **Cartella**: la cartella all'interno del bucket Amazon S3 in cui verranno archiviati i file.
+ **Nome file**: la convenzione di denominazione per i file caricati.

##### Configurazione del caricamento dei file
<a name="s3-upload-component-properties-file-upload-configuration"></a>
+ **Etichetta**: l'etichetta o le istruzioni visualizzate sopra l'area di caricamento del file.
+ **Descrizione**: istruzioni o informazioni aggiuntive sul caricamento del file.
+ **Tipo di file**: il tipo di file che possono essere caricati. Ad esempio: immagine, documento o video.
+ **Dimensione**: la dimensione massima dei singoli file che possono essere caricati.
+ **Etichetta del pulsante**: il testo visualizzato sul pulsante di selezione del file.
+ **Stile del pulsante**: lo stile del pulsante di selezione dei file. Ad esempio, delineato o riempito.
+ **Dimensione del pulsante**: la dimensione del pulsante di selezione del file.

##### Convalida
<a name="s3-upload-component-properties-validation"></a>
+ **Numero massimo di file**: il numero massimo di file che possono essere caricati contemporaneamente.
+ **Dimensione massima del file**: la dimensione massima consentita per ogni singolo file.

##### Triggers
<a name="s3-upload-component-properties-triggers"></a>
+ **In caso di successo**: azioni da attivare quando il caricamento di un file ha esito positivo.
+ **In caso di errore**: azioni da attivare quando il caricamento di un file non riesce.

#### Campi di espressione di caricamento S3
<a name="s3-upload-expression-fields"></a>

Il componente di **caricamento S3** fornisce i seguenti campi di espressione:
+ `{{ui.s3uploadID.files}}`: restituisce un array dei file che sono stati caricati.
+ `{{ui.s3uploadID.files[0]?.size}}`: restituisce la dimensione del file all'indice designato.
+ `{{ui.s3uploadID.files[0]?.type}}`: restituisce il tipo di file nell'indice designato.
+ `{{ui.s3uploadID.files[0]?.nameOnly}}`: restituisce il nome del file, senza suffisso di estensione, all'indice designato.
+ `{{ui.s3uploadID.files[0]?.nameWithExtension}}`: restituisce il nome del file con il relativo suffisso di estensione all'indice designato.

#### Espressioni ed esempi
<a name="s3-upload-component-expression-examples"></a>

##### Esempio: accesso ai file caricati
<a name="s3-upload-component-expression-examples-accessing-uploaded-files"></a>
+ `{{ui.s3uploadID.files.length}}`: restituisce il numero di file che sono stati caricati.
+ `{{ui.s3uploadID.files.map(f => f.name).join(', ')}}`: restituisce un elenco separato da virgole dei nomi di file che sono stati caricati.
+ `{{ui.s3uploadID.files.filter(f => f.type.startsWith('image/'))}}`: restituisce una matrice contenente solo i file di immagine che sono stati caricati.

##### Esempio: convalida dei caricamenti di file
<a name="s3-upload-component-expression-examples-validating-file-uploads"></a>
+ `{{ui.s3uploadID.files.some(f => f.size > 5 * 1024 * 1024)}}`: Verifica se uno dei file caricati supera i 5 MB di dimensione.
+ `{{ui.s3uploadID.files.every(f => f.type === 'image/png')}}`: Controlla se tutti i file caricati sono immagini PNG.
+ `{{ui.s3uploadID.files.length > 3}}`: Controlla se sono stati caricati più di 3 file.

##### Esempio: attivazione di azioni
<a name="s3-upload-component-expression-examples-triggering-actions"></a>
+ `{{ui.s3uploadID.files.length > 0 ? 'Upload Successful' : 'No files uploaded'}}`: visualizza un messaggio di successo se è stato caricato almeno un file.
+ `{{ui.s3uploadID.files.some(f => f.type.startsWith('video/')) ? triggerVideoProcessing() : null}}`: attiva un'automazione dell'elaborazione video se sono stati caricati dei file video.
+ `{{ui.s3uploadID.files.map(f => f.url)}}`: recupera i file caricati, che possono essere utilizzati per visualizzare o elaborare ulteriormente i file. URLs 

Queste espressioni consentono di accedere ai file caricati, convalidare i caricamenti di file e attivare azioni in base ai risultati del caricamento dei file. Utilizzando queste espressioni, è possibile creare un comportamento più dinamico e intelligente all'interno della funzionalità di caricamento dei file dell'applicazione.

**Nota**  
*s3uploadID*Sostituiscilo con l'ID del tuo componente di **caricamento S3**.

### Componente visualizzatore PDF
<a name="pdf-viewer-component"></a>

Il componente di **visualizzazione PDF** consente agli utenti di visualizzare e interagire con i documenti PDF all'interno dell'applicazione. App Studio supporta questi diversi tipi di input per PDF Source, il componente di **visualizzazione PDF** che offre flessibilità nel modo in cui è possibile integrare documenti PDF nell'applicazione, che si tratti di un URL statico, di un URI di dati in linea o di contenuti generati dinamicamente.

#### Proprietà del visualizzatore PDF
<a name="pdf-viewer-properties"></a>

##### Origine
<a name="pdf-viewer-properties-source"></a>

**Nota**  
La fonte dei file multimediali visualizzati in questo componente deve essere consentita nelle impostazioni di sicurezza dei contenuti dell'applicazione. Per ulteriori informazioni, consulta [Visualizzazione o aggiornamento delle impostazioni di sicurezza dei contenuti dell'app](app-content-security-settings-csp.md).

L'origine del documento PDF, che può essere un'espressione, un'entità, un URL o un'automazione.

##### Expression
<a name="pdf-viewer-properties-source-expression"></a>

Utilizzate un'espressione per generare dinamicamente la sorgente PDF.

##### Entità
<a name="pdf-viewer-properties-source-entity"></a>

Connect il componente di **visualizzazione PDF** a un'entità di dati che contiene il documento PDF.

##### URL
<a name="pdf-viewer-properties-source-url"></a>

Specificate l'URL del documento PDF.

##### URL
<a name="pdf-viewer-properties-source-url-example"></a>

Puoi inserire un URL che punti al documento PDF che desideri visualizzare. Potrebbe trattarsi di un URL Web pubblico o di un URL all'interno della propria applicazione.

Ad esempio: `https://example.com/document.pdf`

##### URI dei dati
<a name="pdf-viewer-properties-source-url-data-uri"></a>

Un **URI di dati** è un modo compatto per includere file di dati di piccole dimensioni (come immagini o PDFs) in linea all'interno dell'applicazione. Il documento PDF è codificato come stringa base64 e incluso direttamente nella configurazione del componente.

##### Blob o ArrayBuffer
<a name="pdf-viewer-properties-source-url-blob-or-arraybuffer"></a>

Puoi anche fornire il documento PDF come BLOB o ArrayBuffer oggetto, il che ti consente di generare o recuperare dinamicamente i dati PDF da varie fonti all'interno dell'applicazione.

##### Automazione
<a name="pdf-viewer-properties-source-automation"></a>

Connect il componente di **visualizzazione PDF** a un'automazione che fornisce il documento PDF.

##### Azioni
<a name="pdf-viewer-properties-actions"></a>
+ **Scarica**: aggiunge un pulsante o un link che consente agli utenti di scaricare il documento PDF.

##### Layout
<a name="pdf-viewer-properties-layout"></a>
+ **Larghezza**: la larghezza del visualizzatore PDF, specificata come percentuale (%) o come valore fisso in pixel (ad esempio, 600 px).
+ **Altezza**: l'altezza del visualizzatore PDF, specificata come valore fisso in pixel.

### Visualizzatore di immagini
<a name="image-viewer-component"></a>

Il componente **Visualizzatore di immagini** consente agli utenti di visualizzare e interagire con i file di immagine all'interno dell'applicazione.

#### Proprietà del visualizzatore di immagini
<a name="image-viewer-properties"></a>

##### Origine
<a name="image-viewer-properties-source"></a>

**Nota**  
La fonte dei contenuti multimediali visualizzati in questo componente deve essere consentita nelle impostazioni di sicurezza dei contenuti dell'applicazione. Per ulteriori informazioni, consulta [Visualizzazione o aggiornamento delle impostazioni di sicurezza dei contenuti dell'app](app-content-security-settings-csp.md).
+ **Entità**: Connect il componente **Image viewer** a un'entità di dati che contiene il file di immagine.
+ **URL**: specifica l'URL del file di immagine.
+ **Espressione**: utilizza un'espressione per generare dinamicamente l'origine dell'immagine.
+ **Automazione**: Connect il componente **Image viewer** a un'automazione che fornisce il file di immagine.

##### Testo alternativo
<a name="image-viewer-properties-alt-text"></a>

La descrizione testuale alternativa dell'immagine, utilizzata per scopi di accessibilità.

##### Layout
<a name="image-viewer-properties-layout"></a>
+ **Adattamento dell'immagine**: determina come l'immagine deve essere ridimensionata e visualizzata all'interno del componente. Ad esempio: `Contain`, `Cover` o `Fill`.
+ **Larghezza**: la larghezza del componente del **visualizzatore di immagini**, specificata come percentuale (%) o come valore fisso in pixel (ad esempio, 300 px).
+ **Altezza**: l'altezza del componente del **visualizzatore di immagini**, specificata come valore fisso in pixel.
+ **Sfondo**: consente di impostare un colore o un'immagine di sfondo per il componente **Visualizzatore di immagini**.

# Automazioni e azioni: definisci la logica di business della tua app
<a name="automations"></a>

**Le automazioni** sono il modo in cui definisci la logica di business della tua applicazione. I componenti principali di un'automazione sono: i trigger che avviano l'automazione, una sequenza di una o più azioni, i parametri di input utilizzati per passare i dati all'automazione e un output.

**Topics**
+ [Concetti di automazione](automations-concepts.md)
+ [Creazione, modifica ed eliminazione di automazioni](automations-create-edit-delete.md)
+ [Aggiungere, modificare ed eliminare azioni di automazione](automations-actions-add-edit-delete.md)
+ [Informazioni di riferimento relative alle operazioni di automazione](automations-actions-reference.md)

# Concetti di automazione
<a name="automations-concepts"></a>

Ecco alcuni concetti e termini da conoscere per definire e configurare la logica di business dell'app utilizzando le automazioni in App Studio.

## Automazioni
<a name="automations-concepts-automations"></a>

**Le automazioni** sono il modo in cui definisci la logica di business della tua applicazione. I componenti principali di un'automazione sono: i trigger che avviano l'automazione, una sequenza di una o più azioni, i parametri di input utilizzati per passare i dati all'automazione e un output.

## Azioni
<a name="automations-concepts-actions"></a>

Un'azione di automazione, comunemente denominata **azione**, è un singolo passaggio della logica che costituisce un'automazione. Ogni azione esegue un'attività specifica, che si tratti di inviare un'e-mail, creare un record di dati, richiamare una funzione Lambda o chiamare. APIs Le azioni vengono aggiunte alle automazioni dalla libreria di azioni e possono essere raggruppate in istruzioni condizionali o cicli.

## Parametri di input di automazione
<a name="automations-concepts-parameters"></a>

I **parametri di input per l'automazione** sono valori di input dinamici che è possibile trasmettere dai componenti alle automazioni per renderli flessibili e riutilizzabili. Pensate ai parametri come a variabili per la vostra automazione: invece di codificare i valori in un'automazione, potete definire parametri e fornire valori diversi quando necessario. I parametri consentono di utilizzare la stessa automazione con input diversi ogni volta che viene eseguita. 

## Output simulato
<a name="automations-concepts-mocked-output"></a>

Alcune azioni interagiscono con risorse o servizi esterni tramite connettori. Quando si utilizza l'ambiente di anteprima, le applicazioni non interagiscono con servizi esterni. Per testare le azioni che utilizzano i connettori nell'ambiente di anteprima, potete utilizzare l'**output simulato** per simulare il comportamento e l'output del connettore. L'output simulato viene configurato utilizzando JavaScript e il risultato viene memorizzato nei risultati di un'azione, proprio come la risposta del connettore viene archiviata in un'app pubblicata.

Utilizzando il mocking, puoi utilizzare l'ambiente di anteprima per testare vari scenari e il loro impatto su altre azioni con l'automazione, ad esempio simulando diversi valori di risultato, scenari di errore, casi limite o percorsi infelici senza chiamare il servizio esterno tramite connettori.

## Output di automazione
<a name="automations-concepts-automation-output"></a>

Un **output di automazione** viene utilizzato per passare valori da un'automazione ad altre risorse di un'app, come componenti o altre automazioni. Gli output di automazione sono configurati come espressioni e l'espressione può restituire un valore statico o dinamico calcolato da parametri e azioni di automazione. Per impostazione predefinita, le automazioni non restituiscono alcun dato, inclusi i risultati delle azioni all'interno dell'automazione.

Un paio di esempi di come è possibile utilizzare gli output dell'automazione:
+ È possibile configurare un output di automazione per restituire un array e passarlo per popolare un componente di dati.
+ È possibile utilizzare un'automazione per calcolare un valore e passare tale valore a più altre automazioni per centralizzare e riutilizzare la logica aziendale.

## Triggers
<a name="automations-concepts-triggers"></a>

Un **trigger** determina quando e a quali condizioni verrà eseguita un'automazione. Alcuni esempi di trigger riguardano i pulsanti e `On click` gli input `On select` di testo. Il tipo di componente determina l'elenco dei trigger disponibili per quel componente. I trigger vengono aggiunti ai [componenti](concepts.md#concepts-component) e configurati nello studio dell'applicazione. 

# Creazione, modifica ed eliminazione di automazioni
<a name="automations-create-edit-delete"></a>

**Contents**
+ [Creazione di un'automazione](#automations-create)
+ [Visualizzazione o modifica delle proprietà di automazione](#automations-edit)
+ [Eliminazione di un'automazione](#automations-delete)

## Creazione di un'automazione
<a name="automations-create"></a>

Utilizza la seguente procedura per creare un'automazione in un'applicazione App Studio. Una volta creata, un'automazione deve essere configurata modificandone le proprietà e aggiungendovi azioni.

**Per creare un'automazione**

1. Se necessario, accedi allo studio applicativo della tua applicazione.

1. Scegli la scheda **Automazioni**.

1. Se non hai automazioni, scegli **\$1 Aggiungi automazione** nell'area di disegno. **Altrimenti, nel menu **Automazioni** a sinistra, scegli \$1 Aggiungi.**

1. Verrà creata una nuova automazione e potrai iniziare a modificarne le proprietà o ad aggiungere e configurare azioni per definire la logica di business dell'applicazione.

## Visualizzazione o modifica delle proprietà di automazione
<a name="automations-edit"></a>

Utilizzare la procedura seguente per visualizzare o modificare le proprietà di automazione.

**Per visualizzare o modificare le proprietà di automazione**

1. Se necessario, accedete allo studio applicativo dell'applicazione.

1. Scegli la scheda **Automazioni**.

1. **Nel menu **Automazioni** a sinistra, scegliete l'automazione di cui desiderate visualizzare o modificare le proprietà per aprire il menu Proprietà a destra.**

1. Nel menu **Proprietà**, puoi visualizzare le seguenti proprietà:
   + **Identificatore di automazione**: il nome univoco dell'automazione. Per modificarlo, inserisci un nuovo identificatore nel campo di testo.
   + **Parametri** di automazione: i parametri di automazione vengono utilizzati per passare valori dinamici dall'interfaccia utente dell'app alle azioni di automazione e sui dati. Per aggiungere un parametro, scegli **\$1 Aggiungi**. Scegli l'icona a forma di matita per modificare il nome, la descrizione o il tipo del parametro. Per rimuovere un parametro, scegli l'icona del cestino.
**Suggerimento**  
Puoi anche aggiungere parametri di automazione direttamente dall'area di disegno.
   + **Output di automazione**: l'output dell'automazione viene utilizzato per configurare a quali dati dell'automazione è possibile fare riferimento in altre automazioni o componenti. Per impostazione predefinita, le automazioni non creano un output. Per aggiungere un output di automazione, scegli **\$1 Aggiungi**. Per rimuovere l'output, scegli l'icona del cestino.

1. Definisci cosa fa un'automazione aggiungendo e configurando azioni. Per ulteriori informazioni sulle azioni, vedere [Aggiungere, modificare ed eliminare azioni di automazione](automations-actions-add-edit-delete.md) e[Informazioni di riferimento relative alle operazioni di automazione](automations-actions-reference.md).

## Eliminazione di un'automazione
<a name="automations-delete"></a>

Utilizza la seguente procedura per eliminare un'automazione in un'applicazione App Studio.

**Per eliminare un'automazione**

1. Se necessario, accedete allo studio applicativo della vostra applicazione.

1. Scegli la scheda **Automazioni**.

1. **Nel menu **Automazioni** a sinistra, scegli il menu con i puntini di sospensione dell'automazione che desideri eliminare e scegli Elimina.** **In alternativa, puoi scegliere l'icona del cestino dal menu Proprietà a destra dell'automazione.**

1. Nella finestra di dialogo di conferma, seleziona **Elimina**.

# Aggiungere, modificare ed eliminare azioni di automazione
<a name="automations-actions-add-edit-delete"></a>

Un'azione di automazione, comunemente denominata **azione**, è un singolo passaggio della logica che costituisce un'automazione. Ogni azione esegue un'attività specifica, che si tratti di inviare un'e-mail, creare un record di dati, richiamare una funzione Lambda o chiamare. APIs Le azioni vengono aggiunte alle automazioni dalla libreria di azioni e possono essere raggruppate in istruzioni condizionali o cicli.

**Contents**
+ [Aggiungere un'azione di automazione](#automations-actions-add)
+ [Visualizzazione e modifica delle proprietà delle azioni di automazione](#automations-actions-edit)
+ [Eliminazione di un'azione di automazione](#automations-actions-delete)

## Aggiungere un'azione di automazione
<a name="automations-actions-add"></a>

Utilizza la seguente procedura per aggiungere un'azione a un'automazione in un'applicazione App Studio.

**Per aggiungere un'azione di automazione**

1. Se necessario, accedi allo studio applicativo della tua applicazione.

1. Scegli la scheda **Automazioni**.

1. Nel menu **Automazioni** a sinistra, scegli l'automazione a cui desideri aggiungere un'azione.

1. Nel menu **Azione** a destra, scegli l'azione che desideri aggiungere o trascina l'azione nell'area di disegno. Dopo aver creato l'azione, puoi scegliere l'azione per configurare le proprietà dell'azione per definire la funzionalità dell'azione. Per ulteriori informazioni sulle proprietà delle azioni e sulla loro configurazione, consulta[Informazioni di riferimento relative alle operazioni di automazione](automations-actions-reference.md).

## Visualizzazione e modifica delle proprietà delle azioni di automazione
<a name="automations-actions-edit"></a>

Utilizzare la procedura seguente per visualizzare o modificare le proprietà di un'azione di automazione in un'applicazione App Studio.

**Per visualizzare o modificare le proprietà delle azioni di automazione**

1. Se necessario, accedete allo studio applicativo dell'applicazione.

1. Scegli la scheda **Automazioni**.

1. Nel menu **Automazioni** a sinistra, scegliete l'azione di cui desiderate visualizzare o modificare le proprietà. In alternativa, puoi scegliere l'azione nell'area di disegno quando visualizzi l'automazione che la contiene.

1. È possibile visualizzare o modificare le proprietà dell'azione nel menu **Proprietà** a destra. Le proprietà di un'azione sono diverse per ogni tipo di azione. Per ulteriori informazioni sulle proprietà delle azioni e sulla loro configurazione, vedere[Informazioni di riferimento relative alle operazioni di automazione](automations-actions-reference.md).

## Eliminazione di un'azione di automazione
<a name="automations-actions-delete"></a>

Utilizza la seguente procedura per eliminare un'azione da un'automazione in un'applicazione App Studio.

**Per eliminare un'azione di automazione**

1. Se necessario, accedete allo studio applicativo della vostra applicazione.

1. Scegli la scheda **Automazioni**.

1. Nel menu **Automazioni** a sinistra, scegli l'automazione che contiene l'azione che desideri eliminare.

1. **Nell'area di disegno, scegli l'icona del cestino nell'azione che desideri eliminare e scegli Elimina.**

# Informazioni di riferimento relative alle operazioni di automazione
<a name="automations-actions-reference"></a>

Di seguito è riportata la documentazione di riferimento per le azioni di automazione utilizzate in App Studio.

Un'azione di automazione, comunemente denominata **azione**, è un singolo passaggio della logica che costituisce un'automazione. Ogni azione esegue un'attività specifica, che si tratti di inviare un'e-mail, creare un record di dati, richiamare una funzione Lambda o chiamare. APIs Le azioni vengono aggiunte alle automazioni dalla libreria di azioni e possono essere raggruppate in istruzioni condizionali o cicli.

Per informazioni sulla creazione e la configurazione delle automazioni e sulle relative azioni, consulta gli argomenti in. [Automazioni e azioni: definisci la logica di business della tua app](automations.md)

## Invoca l'API
<a name="automations-actions-reference-invoke-API"></a>

Richiama una richiesta API REST HTTP. I costruttori possono utilizzare questa azione per inviare richieste da App Studio ad altri sistemi o servizi con. APIs Ad esempio, puoi utilizzarla per connetterti a sistemi di terze parti o applicazioni sviluppate internamente per accedere a dati aziendali critici o richiamare endpoint API che non possono essere richiamati da azioni dedicate di App Studio.

[Per ulteriori informazioni su REST APIs, consulta Cos'è un'API? RESTful ](https://aws.amazon.com/what-is/restful-api/) .

### Properties
<a name="automations-actions-reference-invoke-API-properties"></a>

#### Connector
<a name="automations-actions-reference-invoke-API-properties-connector"></a>

Il **connettore** da utilizzare per le richieste API effettuate da questa azione. L'elenco a discesa dei connettori contiene solo connettori dei seguenti tipi: `API Connector` e`OpenAPI Connector`. A seconda di come è configurato, il connettore può contenere informazioni importanti come credenziali e intestazioni predefinite o parametri di query.

Per ulteriori informazioni sui connettori API, incluso un confronto tra l'utilizzo `API Connector` e`OpenAPI Connector`, vedere. [Connect a servizi di terze parti](add-connector-third-party.md)

#### Proprietà di configurazione delle richieste API
<a name="automations-actions-reference-invoke-API-properties-request-config"></a>

Scegliete **Configura richiesta API** dal pannello delle proprietà per aprire la finestra di dialogo di configurazione della richiesta. Se è selezionato un **connettore API**, la finestra di dialogo includerà le informazioni sul connettore.

**Metodo:** il metodo per la chiamata API. I valori possibili sono i seguenti:
+ `DELETE`: elimina una risorsa specificata.
+ `GET`: recupera informazioni o dati.
+ `HEAD`: recupera solo le intestazioni di una risposta senza il corpo.
+ `POST`: invia i dati da elaborare.
+ `PUSH`: invia i dati da elaborare.
+ `PATCH`: aggiorna parzialmente una risorsa specificata.

**Percorso:** il percorso relativo alla risorsa.

**Intestazioni:** qualsiasi intestazione sotto forma di coppie chiave-valore da inviare con la richiesta API. Se viene selezionato un connettore, le relative intestazioni configurate verranno aggiunte automaticamente e non possono essere rimosse. Le intestazioni configurate non possono essere modificate, ma è possibile sostituirle aggiungendo un'altra intestazione con lo stesso nome.

**Parametri di query:** qualsiasi parametro di query sotto forma di coppie chiave-valore da inviare con la richiesta API. Se viene selezionato un connettore, i relativi parametri di interrogazione configurati verranno aggiunti automaticamente e non possono essere modificati o rimossi.

**Corpo:** informazioni da inviare con la richiesta API in formato JSON. Non esiste un corpo per `GET` le richieste.

#### Output simulato
<a name="automations-actions-reference-invoke-API-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## Invoca AWS
<a name="automations-actions-reference-invoke-aws"></a>

Richiama un'operazione da un servizio. AWS Si tratta di un'azione generale per chiamare AWS servizi o operazioni e deve essere utilizzata se non esiste un'azione dedicata per il AWS servizio o l'operazione desiderati.

### Properties
<a name="automations-actions-reference-invoke-aws-properties"></a>

#### Servizio
<a name="automations-actions-reference-invoke-aws-properties-service"></a>

Il AWS servizio che contiene l'operazione da eseguire.

#### Operation
<a name="automations-actions-reference-invoke-aws-properties-operation"></a>

L'operazione da eseguire.

#### Connector
<a name="automations-actions-reference-invoke-aws-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene le risorse a cui si fa riferimento nell'operazione.

#### Configurazione
<a name="automations-actions-reference-invoke-aws-properties-configuration"></a>

L'input JSON da utilizzare quando si esegue l'operazione specificata. Per ulteriori informazioni sulla configurazione degli input per AWS le operazioni, consulta. [AWS SDK per JavaScript](https://docs.aws.amazon.com/sdk-for-javascript)

## Invoca Lambda
<a name="automations-actions-reference-invoke-lambda"></a>

Richiama una funzione Lambda esistente.

### Properties
<a name="automations-actions-reference-invoke-lambda-properties"></a>

#### Connector
<a name="automations-actions-reference-invoke-lambda-properties-connector"></a>

Il connettore da utilizzare per le funzioni Lambda eseguite da questa azione. Il connettore configurato deve essere configurato con le credenziali appropriate per accedere alla funzione Lambda e altre informazioni di configurazione, come AWS la regione che contiene la funzione Lambda. Per ulteriori informazioni sulla configurazione di un connettore per Lambda, vedere. [Fase 3: Creare un connettore Lambda](connectors-lambda.md#connectors-lambda-create-connector)

#### Nome funzione
<a name="automations-actions-reference-invoke-lambda-properties-function-name"></a>

Il nome della funzione Lambda da eseguire. Tieni presente che questo è il nome della funzione e non la funzione ARN (Amazon Resource Name).

#### Evento della funzione
<a name="automations-actions-reference-invoke-lambda-properties-function-event"></a>

Coppie chiave-valore da passare alla funzione Lambda come payload dell'evento.

#### Output simulato
<a name="automations-actions-reference-invoke-lambda-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## Loop
<a name="automations-actions-reference-loop"></a>

Esegue ripetutamente azioni annidate per scorrere un elenco di elementi, un elemento alla volta. Ad esempio, aggiungi l'[Crea record](#automations-actions-reference-create-record)azione a un'azione di loop per creare più record.

L'azione di loop può essere annidata all'interno di altri loop o azioni condizionali. Le azioni del ciclo vengono eseguite in sequenza e non in parallelo. È possibile accedere ai risultati di ogni azione all'interno del ciclo solo alle azioni successive all'interno della stessa iterazione del ciclo. Non è possibile accedervi all'esterno del ciclo o in diverse iterazioni del ciclo.

### Properties
<a name="automations-actions-reference-loop-properties"></a>

#### Origine
<a name="automations-actions-reference-loop-properties-source"></a>

L'elenco degli elementi da esaminare, un elemento alla volta. L'origine può essere il risultato di un'azione precedente o di un elenco statico di stringhe, numeri o oggetti che è possibile fornire utilizzando un' JavaScript espressione.

##### Esempi
<a name="automations-actions-reference-loop-properties-source-examples"></a>

L'elenco seguente contiene esempi di input di origine.
+ Risultati di un'azione precedente: `{{results.actionName.data}}`
+ Un elenco di numeri: `{{[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]}}`
+ Un elenco di stringhe: `{{["apple", "banana", "orange", "grape", "kiwi"]}}`
+ Un valore calcolato: `{{params.actionName.split("\n")}}`

#### Nome dell'articolo corrente
<a name="automations-actions-reference-loop-properties-function-name"></a>

Il nome della variabile che può essere utilizzata per fare riferimento all'elemento corrente in fase di iterazione. Il nome dell'elemento corrente è configurabile in modo da poter annidare due o più loop e accedere alle variabili da ciascun ciclo. Ad esempio, se stai esplorando paesi e città con due loop, puoi configurare e fare riferimento a e. `currentCountry` `currentCity`

## Condizione
<a name="automations-actions-reference-condition"></a>

Esegue azioni in base al risultato di una o più condizioni logiche specificate che vengono valutate quando viene eseguita l'automazione. L'azione di condizione è composta dai seguenti componenti:
+ Un campo di *condizione*, utilizzato per fornire un' JavaScript espressione che restituisce `true` o`false`.
+ Un *vero ramo*, che contiene le azioni che vengono eseguite se la condizione restituisce a. `true`
+ Un *ramo falso*, che contiene le azioni che vengono eseguite se la condizione restituisce a. `false`

Aggiungi azioni ai rami vero e falso trascinandole nell'azione della condizione.

### Properties
<a name="automations-actions-reference-condition-properties"></a>

#### Condizione
<a name="automations-actions-reference-condition-properties-condition"></a>

L' JavaScript espressione da valutare quando viene eseguita l'azione.

## Crea record
<a name="automations-actions-reference-create-record"></a>

Crea un record in un'entità App Studio esistente.

### Properties
<a name="automations-actions-reference-create-record-properties"></a>

#### Entità
<a name="automations-actions-reference-create-record-properties-entity"></a>

L'entità in cui deve essere creato un record. Una volta selezionata un'entità, è necessario aggiungere valori ai campi dell'entità per creare il record. I tipi di campi e se i campi sono obbligatori o facoltativi sono definiti nell'entità.

## Aggiorna record
<a name="automations-actions-reference-update-record"></a>

Aggiorna un record esistente in un'entità App Studio.

### Properties
<a name="automations-actions-reference-update-record-properties"></a>

#### Entità
<a name="automations-actions-reference-update-record-properties-entity"></a>

L'entità che contiene i record da aggiornare.

#### Condizioni
<a name="automations-actions-reference-update-record-properties-conditions"></a>

I criteri che definiscono quali record vengono aggiornati dall'azione. È possibile raggruppare le condizioni per creare un'unica dichiarazione logica. È possibile combinare gruppi o condizioni con le `OR` istruzioni `AND` or.

#### Campi
<a name="automations-actions-reference-update-record-properties-fields"></a>

I campi da aggiornare nei record specificati dalle condizioni.

#### Valori
<a name="automations-actions-reference-update-record-properties-values"></a>

I valori da aggiornare nei campi specificati.

## Eliminare il record
<a name="automations-actions-reference-delete-record"></a>

Elimina un record da un'entità App Studio.

### Properties
<a name="automations-actions-reference-delete-record-properties"></a>

#### Entità
<a name="automations-actions-reference-delete-record-properties-entity"></a>

L'entità che contiene i record da eliminare.

#### Condizioni
<a name="automations-actions-reference-delete-record-properties-conditions"></a>

I criteri che definiscono quali record vengono eliminati dall'azione. È possibile raggruppare le condizioni per creare un'unica istruzione logica. È possibile combinare gruppi o condizioni con le `OR` istruzioni `AND` or.

## Invoca un'azione sui dati
<a name="automations-actions-reference-invoke-data-action"></a>

Esegue un'azione sui dati con parametri opzionali.

### Properties
<a name="automations-actions-reference-invoke-data-action-properties"></a>

#### Azione sui dati
<a name="automations-actions-reference-invoke-data-action-properties-data-action"></a>

L'azione sui dati che deve essere eseguita dall'azione.

#### Parameters
<a name="automations-actions-reference-invoke-data-action-properties-parameters"></a>

Parametri dell'azione dati che devono essere utilizzati dall'azione dati. I parametri di azione dei dati vengono utilizzati per inviare valori che vengono utilizzati come input per le azioni sui dati. I parametri di azione dei dati possono essere aggiunti durante la configurazione dell'azione di automazione, ma devono essere modificati nella scheda **Dati**.

#### Impostazioni avanzate
<a name="automations-actions-reference-invoke-data-action-properties-advanced-settings"></a>

L'`Invoke data action`azione contiene le seguenti impostazioni avanzate:
+ **Dimensione della pagina:** il numero massimo di record da recuperare in ogni query. Il valore predefinito è 500 e il valore massimo è 3000.
+ **Token di impaginazione:** il token utilizzato per recuperare record aggiuntivi da una query. Ad esempio, se `Page size` è impostato su 500, ma ci sono più di 500 record, passando il token di impaginazione a una query successiva verranno recuperati i 500 successivi. Il token non sarà definito se non esistono più record o pagine.

## Amazon S3: oggetto Put
<a name="automations-actions-reference-s3-put-object"></a>

Utilizza l'`Amazon S3 PutObject`operazione per aggiungere un oggetto identificato da una chiave (percorso del file) a un bucket Amazon S3 specificato.

### Properties
<a name="automations-actions-reference-s3-put-object-properties"></a>

#### Connector
<a name="automations-actions-reference-s3-put-object-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene le risorse a cui si fa riferimento nell'operazione.

#### Configurazione
<a name="automations-actions-reference-s3-put-object-properties-configuration"></a>

Le opzioni richieste da utilizzare nel comando. `PutObject` Le opzioni sono le seguenti:

**Nota**  
Per ulteriori informazioni sull'`Amazon S3 PutObject`operazione, consulta il *riferimento [PutObject](https://docs.aws.amazon.com/AmazonS3/latest/API/API_PutObject.html)all'API di Amazon Simple Storage Service*.
+ **Bucket:** il nome del bucket Amazon S3 in cui inserire un oggetto.
+ **Chiave:** il nome univoco dell'oggetto da inserire nel bucket Amazon S3.
+ **Corpo:** il contenuto dell'oggetto da inserire nel bucket Amazon S3.

#### Output simulato
<a name="automations-actions-reference-s3-put-object-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## Amazon S3: eliminare un oggetto
<a name="automations-actions-reference-s3-delete-object"></a>

Utilizza l'`Amazon S3 DeleteObject`operazione per eliminare un oggetto identificato da una chiave (percorso del file) da un bucket Amazon S3 specificato.

### Properties
<a name="automations-actions-reference-s3-delete-object-properties"></a>

#### Connector
<a name="automations-actions-reference-s3-delete-object-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene le risorse a cui si fa riferimento nell'operazione.

#### Configurazione
<a name="automations-actions-reference-s3-delete-object-properties-configuration"></a>

Le opzioni richieste da utilizzare nel comando. `DeleteObject` Le opzioni sono le seguenti:

**Nota**  
Per ulteriori informazioni sull'`Amazon S3 DeleteObject`operazione, consulta il *riferimento [DeleteObject](https://docs.aws.amazon.com/AmazonS3/latest/API/API_DeleteObject.html)all'API di Amazon Simple Storage Service*.
+ **Bucket:** il nome del bucket Amazon S3 da cui eliminare un oggetto.
+ **Chiave:** il nome univoco dell'oggetto da eliminare dal bucket Amazon S3.

#### Output simulato
<a name="automations-actions-reference-s3-delete-object-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## Amazon S3: ottieni oggetto
<a name="automations-actions-reference-s3-get-object"></a>

Utilizza l'`Amazon S3 GetObject`operazione per recuperare un oggetto identificato da una chiave (percorso del file) da un bucket Amazon S3 specificato.

### Properties
<a name="automations-actions-reference-s3-get-object-properties"></a>

#### Connector
<a name="automations-actions-reference-s3-get-object-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene le risorse a cui si fa riferimento nell'operazione.

#### Configurazione
<a name="automations-actions-reference-s3-get-object-properties-configuration"></a>

Le opzioni richieste da utilizzare nel comando. `GetObject` Le opzioni sono le seguenti:

**Nota**  
Per ulteriori informazioni sull'`Amazon S3 GetObject`operazione, consulta il *riferimento [GetObject](https://docs.aws.amazon.com/AmazonS3/latest/API/API_GetObject.html)all'API di Amazon Simple Storage Service*.
+ **Bucket:** il nome del bucket Amazon S3 da cui recuperare un oggetto.
+ **Chiave:** il nome univoco dell'oggetto da recuperare dal bucket Amazon S3.

#### Output simulato
<a name="automations-actions-reference-s3-get-object-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## Amazon S3: elenca oggetti
<a name="automations-actions-reference-s3-list-objects"></a>

Utilizza l'`Amazon S3 ListObjects`operazione per elencare gli oggetti in un bucket Amazon S3 specificato.

### Properties
<a name="automations-actions-reference-s3-list-objects-properties"></a>

#### Connector
<a name="automations-actions-reference-s3-list-objects-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene le risorse a cui si fa riferimento nell'operazione.

#### Configurazione
<a name="automations-actions-reference-s3-list-objects-properties-configuration"></a>

Le opzioni richieste da utilizzare nel comando. `ListObjects` Le opzioni sono le seguenti:

**Nota**  
Per ulteriori informazioni sull'`Amazon S3 ListObjects`operazione, consulta il *riferimento [ListObjects](https://docs.aws.amazon.com/AmazonS3/latest/API/API_ListObjects.html)all'API di Amazon Simple Storage Service*.
+ **Bucket: il nome del bucket** Amazon S3 da cui elencare gli oggetti.

#### Output simulato
<a name="automations-actions-reference-s3-list-objects-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## Amazon Textract: analizza il documento
<a name="automations-actions-reference-textract-analyze-document"></a>

Utilizza l'`Amazon Textract AnalyzeDocument`operazione per analizzare un documento di input per verificare le relazioni tra gli elementi rilevati.

### Properties
<a name="automations-actions-reference-textract-analyze-document-properties"></a>

#### Connector
<a name="automations-actions-reference-textract-analyze-document-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene le risorse a cui si fa riferimento nell'operazione.

#### Configurazione
<a name="automations-actions-reference-textract-analyze-document-properties-configuration"></a>

Il contenuto della richiesta da utilizzare nel `AnalyzeDocument` comando. Le opzioni sono le seguenti:

**Nota**  
Per ulteriori informazioni sull'`Amazon Textract AnalyzeDocument`operazione, consulta [AnalyzeDocument](https://docs.aws.amazon.com/textract/latest/dg/API_AnalyzeDocument.html)la *Amazon Textract Developer* Guide.
+ **Document/S3Object/Bucket: il nome del bucket** Amazon S3. **Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento S3.**
+ **Document/S3Object/Name: il nome** del file del documento di input. Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento **S3**.
+ **Document/S3Object/Version:** se il bucket Amazon S3 ha il controllo delle versioni abilitato, puoi specificare la versione dell'oggetto. **Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento S3.**
+ **FeatureTypes:** Un elenco dei tipi di analisi da eseguire. I valori validi sono: `TABLES`, `FORMS`, `QUERIES`, `SIGNATURES` e `LAYOUT`.

#### Output simulato
<a name="automations-actions-reference-textract-analyze-document-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## Amazon Textract: analizza le spese
<a name="automations-actions-reference-textract-analyze-expense"></a>

Utilizza l'`Amazon Textract AnalyzeExpense`operazione per analizzare un documento di input per verificare le relazioni finanziarie tra il testo.

### Properties
<a name="automations-actions-reference-textract-analyze-expense-properties"></a>

#### Connector
<a name="automations-actions-reference-textract-analyze-expense-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene le risorse a cui si fa riferimento nell'operazione.

#### Configurazione
<a name="automations-actions-reference-textract-analyze-expense-properties-configuration"></a>

Il contenuto della richiesta da utilizzare nel `AnalyzeExpense` comando. Le opzioni sono le seguenti:

**Nota**  
Per ulteriori informazioni sull'`Amazon Textract AnalyzeExpense`operazione, consulta [AnalyzeExpense](https://docs.aws.amazon.com/textract/latest/dg/API_AnalyzeExpense.html)la *Amazon Textract Developer* Guide.
+ **Document/S3Object/Bucket: il nome del bucket** Amazon S3. **Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento S3.**
+ **Document/S3Object/Name: il nome** del file del documento di input. Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento **S3**.
+ **Document/S3Object/Version:** se il bucket Amazon S3 ha il controllo delle versioni abilitato, puoi specificare la versione dell'oggetto. **Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento S3.**

#### Output simulato
<a name="automations-actions-reference-textract-analyze-expense-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## Amazon Textract: analizza l'ID
<a name="automations-actions-reference-textract-analyze-id"></a>

Utilizza l'`Amazon Textract AnalyzeID`operazione per analizzare un documento di identità alla ricerca di informazioni pertinenti.

### Properties
<a name="automations-actions-reference-textract-analyze-id-properties"></a>

#### Connector
<a name="automations-actions-reference-textract-analyze-id-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene le risorse a cui si fa riferimento nell'operazione.

#### Configurazione
<a name="automations-actions-reference-textract-analyze-id-properties-configuration"></a>

Il contenuto della richiesta da utilizzare nel `AnalyzeID` comando. Le opzioni sono le seguenti:

**Nota**  
Per ulteriori informazioni sull'`Amazon Textract AnalyzeID`operazione, consulta [AnalyzeID](https://docs.aws.amazon.com/textract/latest/dg/API_AnalyzeID.html) nella *Amazon Textract Developer* Guide.
+ **Document/S3Object/Bucket: il nome del bucket** Amazon S3. **Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento S3.**
+ **Document/S3Object/Name: il nome** del file del documento di input. Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento **S3**.
+ **Document/S3Object/Version:** se il bucket Amazon S3 ha il controllo delle versioni abilitato, puoi specificare la versione dell'oggetto. **Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento S3.**

#### Output simulato
<a name="automations-actions-reference-textract-analyze-id-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## Amazon Textract: rileva il testo del documento
<a name="automations-actions-reference-textract-detect-document-text"></a>

Utilizza l'`Amazon Textract DetectDocumentText`operazione per rilevare le righe di testo e le parole che compongono una riga di testo in un documento di input.

### Properties
<a name="automations-actions-reference-textract-detect-document-text-properties"></a>

#### Connector
<a name="automations-actions-reference-textract-detect-document-text-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene le risorse a cui si fa riferimento nell'operazione.

#### Configurazione
<a name="automations-actions-reference-textract-detect-document-text-properties-configuration"></a>

Il contenuto della richiesta da utilizzare nel `DetectDocumentText` comando. Le opzioni sono le seguenti:

**Nota**  
Per ulteriori informazioni sull'`Amazon Textract DetectDocumentText`operazione, consulta [DetectDocumentText](https://docs.aws.amazon.com/textract/latest/dg/API_DetectDocumentText.html)la *Amazon Textract Developer* Guide.
+ **Document/S3Object/Bucket: il nome del bucket** Amazon S3. **Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento S3.**
+ **Document/S3Object/Name: il nome** del file del documento di input. Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento **S3**.
+ **Document/S3Object/Version:** se il bucket Amazon S3 ha il controllo delle versioni abilitato, puoi specificare la versione dell'oggetto. **Questo parametro può essere lasciato vuoto se un file viene passato all'azione con il componente di caricamento S3.**

#### Output simulato
<a name="automations-actions-reference-textract-detect-document-text-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## Amazon Bedrock: GenAI Prompt
<a name="automations-actions-reference-bedrock-prompt"></a>

Utilizza l' InvokeModeloperazione [Amazon Bedrock](https://docs.aws.amazon.com/bedrock/latest/APIReference/API_runtime_InvokeModel.html) per eseguire l'inferenza utilizzando i parametri di prompt e inferenza forniti nelle proprietà dell'azione. L'azione può generare testo, immagini e incorporamenti.

### Properties
<a name="automations-actions-reference-bedrock-prompt-properties"></a>

#### Connector
<a name="automations-actions-reference-bedrock-prompt-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Per utilizzare correttamente questa azione, il connettore deve essere configurato con **Amazon Bedrock Runtime** come servizio. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene tutte le risorse a cui si fa riferimento nell'operazione.

#### Modello
<a name="automations-actions-reference-bedrock-prompt-properties-model"></a>

Il modello base che verrà utilizzato da Amazon Bedrock per elaborare la richiesta. Per ulteriori informazioni sui modelli in Amazon Bedrock, consulta le [informazioni sul modello Amazon Bedrock Foundation](https://docs.aws.amazon.com/bedrock/latest/userguide/foundation-models-reference.html) nella *Amazon Bedrock User Guide*.

#### Tipo di input
<a name="automations-actions-reference-bedrock-prompt-properties-input-type"></a>

Il tipo di input dell'input inviato al modello Amazon Bedrock. I valori possibili sono **Text**, **Document** e **Image**. Se un tipo di input non è disponibile per la selezione, probabilmente non è supportato dal modello configurato.

#### Richiesta dell'utente
<a name="automations-actions-reference-bedrock-prompt-properties-user-prompt"></a>

Il prompt da inviare al modello Amazon Bedrock da elaborare per generare una risposta. Puoi inserire testo statico o trasmettere un input da un'altra parte dell'applicazione, ad esempio da un componente che utilizza parametri, un'azione precedente nell'automazione o un'altra automazione. Gli esempi seguenti mostrano come passare un valore da un componente o da un'azione precedente:
+ Per passare un valore da un componente utilizzando i parametri: `{{params.paramName}}`
+ Per passare un valore da un'azione precedente: `{{results.actionName}}`

#### Prompt di sistema (modelli Claude)
<a name="automations-actions-reference-bedrock-prompt-properties-system-prompt"></a>

Il prompt di sistema che deve essere utilizzato dal modello Amazon Bedrock durante l'elaborazione della richiesta. Il prompt di sistema viene utilizzato per fornire contesto, istruzioni o linee guida ai modelli Claude.

#### Impostazioni della richiesta
<a name="automations-actions-reference-bedrock-prompt-properties-request-settings"></a>

Configura varie impostazioni di richiesta e parametri di inferenza del modello. Ora puoi configurare le impostazioni seguenti:
+ **Temperatura**: la temperatura che deve essere utilizzata dal modello Amazon Bedrock durante l'elaborazione della richiesta. La temperatura determina la casualità o la creatività dell'output del modello Bedrock. Più alta è la temperatura, più creativa e meno analitica sarà la risposta. I valori possibili sono`[0-10]`.
+ **Numero massimo di token**: limita la lunghezza dell'output del modello Amazon Bedrock.
+ **TopP****: nel campionamento del nucleo, il modello calcola la distribuzione cumulativa su tutte le opzioni per ogni token successivo in ordine di probabilità decrescente e la interrompe quando raggiunge una particolare probabilità specificata dal TopP.** ****È necessario modificare la temperatura o il TopP, ma non entrambi****
+ **Sequenze di arresto**: sequenze che causano l'interruzione dell'elaborazione della richiesta e della generazione dell'output da parte del modello.

Per ulteriori informazioni, consulta [i parametri della richiesta di inferenza e i campi di risposta per i modelli di base](https://docs.aws.amazon.com/bedrock/latest/userguide/model-parameters.html) nella *Amazon Bedrock User Guide*.

#### Stop Sequences
<a name="automations-actions-reference-bedrock-prompt-properties-guardrail"></a>

**Inserisci un **ID** e una versione di Amazon Bedrock Guardrail.** I guardrail vengono utilizzati per implementare misure di protezione basate sui casi d'uso e sulle politiche di intelligenza artificiale responsabili. Per ulteriori informazioni, consulta [Blocca i contenuti dannosi nei modelli che utilizzano Amazon Bedrock Guardrails](https://docs.aws.amazon.com/bedrock/latest/userguide/guardrails.html) nella *Amazon Bedrock* User Guide.

#### Output simulato
<a name="automations-actions-reference-bedrock-prompt-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## Amazon Bedrock: modello Invoke
<a name="automations-actions-reference-bedrock-invoke-model"></a>

Utilizza l' InvokeModeloperazione [Amazon Bedrock](https://docs.aws.amazon.com/bedrock/latest/APIReference/API_runtime_InvokeModel.html) per eseguire l'inferenza utilizzando i parametri di prompt e inferenza forniti nel corpo della richiesta. Utilizzi l'inferenza del modello per generare testo, immagini e incorporamenti.

### Properties
<a name="automations-actions-reference-bedrock-invoke-model-properties"></a>

#### Connector
<a name="automations-actions-reference-bedrock-invoke-model-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Per utilizzare correttamente questa azione, il connettore deve essere configurato con **Amazon Bedrock Runtime** come servizio. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene tutte le risorse a cui si fa riferimento nell'operazione.

#### Configurazione
<a name="automations-actions-reference-bedrock-invoke-model-properties-configuration"></a>

Il contenuto della richiesta da utilizzare nel `InvokeModel` comando.

**Nota**  
Per ulteriori informazioni sull'`Amazon Bedrock InvokeModel`operazione, inclusi i comandi di esempio, consulta [InvokeModel](https://docs.aws.amazon.com/textract/latest/dg/API_DetectDocumentText.html)*Amazon Bedrock API Reference*.

#### Output simulato
<a name="automations-actions-reference-bedrock-invoke-model-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

## JavaScript
<a name="automations-actions-reference-javascript"></a>

Esegue una JavaScript funzione personalizzata per restituire un valore specificato.

**Importante**  
App Studio non supporta l'utilizzo di JavaScript librerie personalizzate o di terze parti.

### Properties
<a name="automations-actions-reference-javascript-properties"></a>

#### Codice sorgente
<a name="automations-actions-reference-javascript-properties-source-code"></a>

Il frammento di JavaScript codice che deve essere eseguito dall'azione.

**Suggerimento**  
Puoi utilizzare l'intelligenza artificiale per aiutarti a generare JavaScript per te eseguendo i seguenti passaggi:  
Scegli l'icona di espansione per aprire l' JavaScript editor espanso.
(Facoltativo): abilita l'interruttore **Modifica codice** per modificare qualsiasi codice esistente. JavaScript Altrimenti, l'intelligenza artificiale sostituirà quella esistente. JavaScript
In **Generate JavaScript**, descrivi cosa vuoi fare JavaScript, per esempio:**Add two numbers**.
Scegli l'icona di invio per generare il tuo JavaScript.

## Invoca l'automazione
<a name="automations-actions-reference-invoke-automation"></a>

Esegue un'automazione specificata.

### Properties
<a name="automations-actions-reference-invoke-automation-properties"></a>

#### Invoca l'automazione
<a name="automations-actions-reference-invoke-automation-properties-invoke-automation"></a>

L'automazione che deve essere eseguita dall'azione.

## Invio di e-mail
<a name="automations-actions-reference-send-email"></a>

Utilizza l'`Amazon SES SendEmail`operazione per inviare un messaggio di posta elettronica.

### Properties
<a name="automations-actions-reference-send-email-properties"></a>

#### Connector
<a name="automations-actions-reference-send-email-properties-connector"></a>

Il connettore da utilizzare per le operazioni eseguite da questa azione. Il connettore configurato deve essere configurato con le credenziali appropriate per eseguire l'operazione e altre informazioni di configurazione, come la AWS regione che contiene le risorse a cui si fa riferimento nell'operazione.

#### Configurazione
<a name="automations-actions-reference-send-email-properties-configuration"></a>

Il contenuto della richiesta da utilizzare nel `SendEmail` comando. Le opzioni sono le seguenti:

**Nota**  
Per ulteriori informazioni sull'`Amazon SES SendEmail`operazione, consulta il *riferimento [SendEmail](https://docs.aws.amazon.com/ses/latest/APIReference-V2/API_SendEmail.html)all'API di Amazon Simple Email Service*.

#### Output simulato
<a name="automations-actions-reference-send-email-properties-mocked-output"></a>

Le azioni non interagiscono con servizi o risorse esterne nell'ambiente di anteprima. Il campo di **output Mocked** viene utilizzato per fornire un'espressione JSON che simula il comportamento di un connettore nell'ambiente di anteprima a scopo di test. Questo frammento è memorizzato nella `results` mappa dell'azione, proprio come lo sarebbe la risposta del connettore per un'app pubblicata nell'ambiente live.

Con questo campo, puoi testare vari scenari e il loro impatto su altre azioni all'interno dell'automazione, come la simulazione di diversi valori di risultato, scenari di errore, casi limite o percorsi non soddisfacenti senza comunicare con servizi esterni tramite connettori.

# Entità e azioni sui dati: configura il modello di dati della tua app
<a name="data"></a>

**Le entità** sono tabelle di dati in App Studio. Le entità interagiscono direttamente con le tabelle nelle fonti di dati. Le entità includono campi per descrivere i dati in esse contenuti, query per individuare e restituire dati e mappature per connettere i campi dell'entità alle colonne di un'origine dati.

**Topics**
+ [Le migliori pratiche per la progettazione di modelli di dati](data-model-best-practices.md)
+ [Creazione di un'entità in un'app App Studio](data-entities-create.md)
+ [Configurazione o modifica di un'entità in un'app App Studio](data-entities-edit.md)
+ [Eliminazione di un'entità](data-entities-delete.md)
+ [Entità di dati gestite in AWS App Studio](managed-data-entities.md)

# Le migliori pratiche per la progettazione di modelli di dati
<a name="data-model-best-practices"></a>

Utilizza le seguenti best practice per creare un modello di dati relazionale robusto, scalabile e sicuro da utilizzare nell' AWS applicazione App Studio che soddisfi i requisiti dell'applicazione e garantisca l'affidabilità e le prestazioni a lungo termine dell'infrastruttura di dati.
+ **Scegli il servizio AWS dati giusto:** a seconda delle tue esigenze, scegli il servizio AWS dati appropriato. Ad esempio, per un'applicazione OLTP (Online Transaction Processing), potresti prendere in considerazione un database (DB) come Amazon Aurora, un servizio di database relazionale, completamente gestito e nativo del cloud che supporta vari motori di database come MySQL e PostgreSQL. Per un elenco completo delle versioni di Aurora supportate da App Studio, consulta. [Connect ad Amazon Aurora](connectors-aurora.md) D'altra parte, per i casi d'uso dell'Online Analytical Processing (OLAP), prendi in considerazione l'utilizzo di Amazon Redshift, un data warehouse cloud che consente di eseguire query complesse su set di dati molto grandi. Il completamento di queste query può spesso richiedere tempo (molti secondi), il che rende Amazon Redshift meno adatto alle applicazioni OLTP che richiedono un accesso ai dati a bassa latenza.
+ **Progettazione per la scalabilità:** pianifica il tuo modello di dati pensando alla crescita e alla scalabilità future. Prendi in considerazione fattori come il volume di dati previsto, i modelli di accesso e i requisiti di prestazioni quando scegli un servizio dati e una configurazione appropriati per il servizio dati e il tipo di istanza di database (ad esempio la capacità assegnata).
  + Per ulteriori informazioni sulla scalabilità con Aurora serverless, [consulta Prestazioni e scalabilità per Aurora Serverless V2](https://docs.aws.amazon.com/AmazonRDS/latest/AuroraUserGuide/aurora-serverless-v2.setting-capacity.html).
+ Normalizza i **dati: segui i principi della normalizzazione** dei database per ridurre al minimo la ridondanza dei dati e migliorare l'integrità dei dati. Ciò include la creazione di tabelle appropriate, la definizione di chiavi primarie ed esterne e la creazione di relazioni tra le entità. In App Studio, quando si interrogano dati da un'entità, è possibile recuperare i dati correlati da un'altra entità specificando una `join` clausola nella query.
+ **Implementa l'indicizzazione appropriata:** identifica le query e i modelli di accesso più importanti e crea indici appropriati per ottimizzare le prestazioni.
+ **Sfrutta le funzionalità AWS dei servizi dati:** sfrutta le funzionalità offerte dal servizio AWS dati che scegli, come backup automatici, implementazioni Multi-AZ e aggiornamenti software automatici.
+ **Proteggi i tuoi dati:** implementa solide misure di sicurezza, come le policy IAM (AWS Identity and Access Management), la creazione di utenti del database con autorizzazioni limitate a tabelle e schemi e applica la crittografia a riposo e in transito.
+ **Monitora e ottimizza le prestazioni:** monitora continuamente le prestazioni del database e apporta le modifiche necessarie, ad esempio scalando le risorse, ottimizzando le query o ottimizzando le configurazioni del database.
+ **Automatizza la gestione dei database:** utilizza AWS servizi come Aurora Autoscaling, Performance Insights for Aurora AWS e Database Migration Service per automatizzare le attività di gestione dei database e ridurre il sovraccarico operativo.
+ **Implementa strategie di disaster recovery e backup:** assicurati di disporre di un piano di backup e ripristino ben definito, sfruttando funzionalità come i backup automatizzati Aurora, il point-in-time ripristino e le configurazioni di replica tra regioni.
+ **Segui le AWS best practice e la documentazione:** attieniti alle AWS best practice, alle linee guida e alla documentazione più recenti per il servizio dati prescelto per assicurarti che il modello di dati e l'implementazione siano in linea up-to-date con i consigli. AWS 

Per indicazioni più dettagliate su ciascun servizio AWS dati, consulta i seguenti argomenti:
+ [Le migliori pratiche con Amazon Aurora](https://docs.aws.amazon.com/AmazonRDS/latest/AuroraUserGuide/Aurora.BestPractices.html)
+ [Le migliori pratiche con Amazon Aurora MySQL](https://docs.aws.amazon.com/AmazonRDS/latest/AuroraUserGuide/AuroraMySQL.BestPractices.html)
+ [Ottimizzazione delle prestazioni delle query di Amazon Redshift](https://docs.aws.amazon.com/redshift/latest/dg/c-optimizing-query-performance.html)
+ [Le migliori pratiche per l'interrogazione e la scansione dei dati in Amazon DynamoDB](https://docs.aws.amazon.com/amazondynamodb/latest/developerguide/bp-query-scan.html)

# Creazione di un'entità in un'app App Studio
<a name="data-entities-create"></a>

Esistono quattro metodi per creare un'entità in un'app App Studio. L'elenco seguente contiene ogni metodo, i relativi vantaggi e un collegamento alle istruzioni per l'utilizzo di tale metodo per creare e quindi configurare l'entità.
+ [Creazione di un'entità da una fonte di dati esistente](#data-entities-create-existing-data-source): Crea automaticamente un'entità e i relativi campi da una tabella di origini dati esistente e mappa i campi alle colonne della tabella delle origini dati. Questa opzione è preferibile se disponi di un'origine dati esistente che desideri utilizzare nell'app App Studio.
+ [Creazione di un'entità con un'origine dati gestita da App Studio](#data-entities-create-managed-data-source): crea un'entità e una tabella DynamoDB gestite da App Studio per te. La tabella DynamoDB viene aggiornata automaticamente man mano che aggiorni l'entità. Con questa opzione, non è necessario creare, gestire o connettere manualmente un'origine dati di terze parti o designare la mappatura dai campi delle entità alle colonne della tabella. Tutta la modellazione e la configurazione dei dati dell'app vengono eseguite in App Studio. Questa opzione è preferibile se non desideri gestire le tue fonti di dati e una tabella DynamoDB e le sue funzionalità sono sufficienti per la tua app.
+ [Creazione di un'entità vuota](#data-entities-create-empty): Crea un'entità vuota completamente da zero. Questa opzione è preferibile se non disponi di fonti di dati o connettori esistenti creati da un amministratore e desideri progettare in modo flessibile il modello di dati dell'app senza essere vincolato da fonti di dati esterne. Puoi connettere l'entità a una fonte di dati dopo la creazione.
+ [Creazione di un'entità con l'intelligenza artificiale](#data-entities-create-with-ai): genera un'entità, campi, azioni sui dati e dati di esempio in base al nome dell'entità specificato. Questa opzione è preferibile se hai un'idea del modello di dati per la tua app, ma desideri aiuto per tradurlo in un'entità.

## Creazione di un'entità da una fonte di dati esistente
<a name="data-entities-create-existing-data-source"></a>

Usa una tabella da una fonte di dati per creare automaticamente un'entità e i relativi campi e mappare i campi dell'entità alle colonne della tabella. Questa opzione è preferibile se disponi di un'origine dati esistente che desideri utilizzare nell'app App Studio.

1. Se necessario, accedi alla tua applicazione.

1. Scegli la scheda **Dati** nella parte superiore dell'area di disegno.

1. Se non ci sono entità nella tua app, scegli **\$1 Crea entità**. Altrimenti, nel menu **Entità** a sinistra, scegli **\$1** Aggiungi.

1. Seleziona **Usa una tabella da un'origine dati esistente**.

1. In **Connettore**, seleziona il connettore che contiene la tabella che desideri utilizzare per creare l'entità.

1. In **Tabella**, scegli la tabella che desideri utilizzare per creare la tua entità.

1. Seleziona la casella di controllo **Crea azioni sui dati** per creare azioni sui dati.

1. Scegliere **Create entity** (Crea entità). **La tua entità è ora creata e puoi vederla nel pannello Entità a sinistra.**

1. Configura la tua nuova entità seguendo le procedure riportate in. [Configurazione o modifica di un'entità in un'app App Studio](data-entities-edit.md) Tieni presente che, poiché l'entità è stata creata con un'origine dati esistente, alcune proprietà o risorse sono già state create, come i campi, l'origine dati connessa e la mappatura dei campi. Inoltre, l'entità conterrà azioni relative ai dati se hai selezionato la casella di controllo **Crea azioni sui dati** durante la creazione.

## Creazione di un'entità con un'origine dati gestita da App Studio
<a name="data-entities-create-managed-data-source"></a>

Crea un'entità gestita e la tabella DynamoDB corrispondente gestita da App Studio. Sebbene la tabella DynamoDB esista nell'account AWS associato, quando vengono apportate modifiche all'entità nell'app App Studio, la tabella DynamoDB viene aggiornata automaticamente. Con questa opzione, non è necessario creare, gestire o connettere manualmente un'origine dati di terze parti o designare la mappatura dai campi delle entità alle colonne della tabella. Questa opzione è preferibile se non desideri gestire le tue fonti di dati e una tabella DynamoDB e le sue funzionalità sono sufficienti per la tua app. Per ulteriori informazioni sulle entità gestite, consulta. [Entità di dati gestite in AWS App Studio](managed-data-entities.md)

È possibile utilizzare le stesse entità gestite in più applicazioni. Per istruzioni, consulta [Creazione di un'entità da una fonte di dati esistente](#data-entities-create-existing-data-source).

1. Se necessario, accedi alla tua applicazione.

1. Scegli la scheda **Dati** nella parte superiore dell'area di disegno.

1. Se non ci sono entità nella tua app, scegli **\$1 Crea entità**. Altrimenti, nel menu **Entità** a sinistra, scegli **\$1** Aggiungi.

1. Seleziona **Crea entità gestita da App Studio**.

1. In **Nome dell'entità**, fornisci un nome per la tua entità.

1. In **Chiave primaria**, fornisci un nome per la chiave primaria della tua entità. La chiave primaria è l'identificatore univoco dell'entità e non può essere modificata dopo la creazione dell'entità.

1. In **Tipo di dati chiave primaria**, seleziona il tipo di dati della chiave primaria della tua entità. Il tipo di dati non può essere modificato dopo la creazione dell'entità.

1. Scegliere **Create entity** (Crea entità). La tua entità è ora creata e puoi vederla nel pannello **Entità** a sinistra.

1. Configura la tua nuova entità seguendo le procedure riportate in. [Configurazione o modifica di un'entità in un'app App Studio](data-entities-edit.md) Tieni presente che, poiché l'entità è stata creata con dati gestiti, alcune proprietà o risorse sono già state create, come il campo della chiave primaria e l'origine dati connessa.

## Creazione di un'entità vuota
<a name="data-entities-create-empty"></a>

Crea un'entità vuota completamente da zero. Questa opzione è preferibile se non disponi di fonti di dati o connettori esistenti creati da un amministratore. La creazione di un'entità vuota offre flessibilità, in quanto puoi progettare la tua entità all'interno dell'app App Studio senza essere vincolato da fonti di dati esterne. Dopo aver progettato il modello di dati dell'app e aver configurato l'entità di conseguenza, puoi comunque collegarlo a una fonte di dati esterna in un secondo momento.

1. Se necessario, accedi alla tua applicazione.

1. Scegli la scheda **Dati** nella parte superiore dell'area di disegno.

1. Se non ci sono entità nella tua app, scegli **\$1 Crea entità**. Altrimenti, nel menu **Entità** a sinistra, scegli **\$1** Aggiungi.

1. Seleziona **Crea un'entità**.

1. Scegliere **Create entity** (Crea entità). La tua entità è ora creata e puoi vederla nel pannello **Entità** a sinistra.

1. Configura la tua nuova entità seguendo le procedure riportate in. [Configurazione o modifica di un'entità in un'app App Studio](data-entities-edit.md)

## Creazione di un'entità con l'intelligenza artificiale
<a name="data-entities-create-with-ai"></a>

Genera un'entità, campi, azioni sui dati e dati di esempio in base al nome dell'entità specificato. Questa opzione è preferibile se hai un'idea del modello di dati per la tua app, ma desideri aiuto per tradurlo in un'entità.

1. Se necessario, accedi alla tua applicazione.

1. Scegli la scheda **Dati** nella parte superiore dell'area di disegno.

1. Se non ci sono entità nella tua app, scegli **\$1 Crea entità**. Altrimenti, nel menu **Entità** a sinistra, scegli **\$1** Aggiungi.

1. Seleziona **Crea un'entità con** AI.

1. In **Nome dell'entità**, fornisci un nome per la tua entità. Questo nome viene utilizzato per generare i campi, le azioni relative ai dati e i dati di esempio dell'entità.

1. Seleziona la casella di controllo **Crea azioni sui dati** per creare azioni sui dati.

1. Scegli **Genera un'entità**. La tua entità è ora creata e puoi vederla nel pannello **Entità** a sinistra.

1. Configura la tua nuova entità seguendo le procedure riportate in. [Configurazione o modifica di un'entità in un'app App Studio](data-entities-edit.md) Tieni presente che, poiché la tua entità è stata creata con l'intelligenza artificiale, conterrà già i campi generati. Inoltre, l'entità conterrà azioni relative ai dati se hai selezionato la casella di controllo **Crea azioni sui dati** durante la creazione.

# Configurazione o modifica di un'entità in un'app App Studio
<a name="data-entities-edit"></a>

Utilizza i seguenti argomenti per configurare un'entità in un'applicazione App Studio.

**Topics**
+ [Modifica del nome dell'entità](data-entities-edit-name.md)
+ [Aggiungere, modificare o eliminare i campi dell'entità](data-entities-edit-fields.md)
+ [Azioni di creazione, modifica o eliminazione dei dati](data-entities-edit-data-actions.md)
+ [Aggiungere o eliminare dati di esempio](data-entities-edit-sample-data.md)
+ [Aggiungi o modifica l'origine dati connessa e i campi della mappa](data-entities-edit-connection.md)

# Modifica del nome dell'entità
<a name="data-entities-edit-name"></a>

1. Se necessario, accedi all'entità che desideri modificare.

1. Nella scheda **Configurazione**, in **Nome dell'entità**, aggiorna il nome dell'entità e scegli una posizione esterna alla casella di testo per salvare le modifiche.

# Aggiungere, modificare o eliminare i campi dell'entità
<a name="data-entities-edit-fields"></a>

**Suggerimento**  
Puoi premere CTRL\$1Z per annullare la modifica più recente all'entità.

1. Se necessario, accedi all'entità che desideri modificare.

1. Nella scheda **Configurazione**, in **Campi**, visualizzi una tabella dei campi della tua entità. I campi di entità hanno le seguenti colonne:
   + **Nome visualizzato:** il nome visualizzato è simile all'intestazione di una tabella o a un campo del modulo ed è visualizzabile dagli utenti dell'applicazione. Può contenere spazi e caratteri speciali ma deve essere univoco all'interno di un'entità.
   + **Nome del sistema:** il nome del sistema è un identificatore univoco utilizzato nel codice per fare riferimento a un campo. Quando si esegue il mapping su una colonna in una tabella Amazon Redshift, questa deve corrispondere al nome della colonna della tabella Amazon Redshift.
   + **Tipo di dati:** il tipo di dati che verranno archiviati in questo campo, ad esempio`Integer`, `Boolean` o. `String`

1. Per aggiungere campi:

   1. Per utilizzare l'intelligenza artificiale per generare campi in base al nome dell'entità e all'origine dati connessa, scegli **Genera altri campi**.

   1. Per aggiungere un singolo campo, scegli **\$1 Aggiungi campo**.

1. Per modificare un campo:

   1. Per modificare il nome visualizzato, immettete il valore desiderato nella casella di testo **Nome visualizzato**. Se il nome di sistema del campo non è stato modificato, verrà aggiornato al nuovo valore del nome visualizzato.

   1. Per modificare il nome del sistema, inserite il valore desiderato nella casella di testo **Nome sistema**.

   1. Per modificare il tipo di dati, scegli il menu a discesa **Tipo di dati** e seleziona il tipo desiderato dall'elenco.

   1. Per modificare le proprietà del campo, scegli l'icona a forma di ingranaggio del campo. L'elenco seguente descrive in dettaglio le proprietà del campo:
      + **Obbligatorio**: abilita questa opzione se il campo è richiesto dalla tua fonte di dati.
      + **Chiave primaria**: abilita questa opzione se il campo è mappato a una chiave primaria nell'origine dati.
      + **Unico**: abilita questa opzione se il valore di questo campo deve essere unico.
      + **Usa l'origine dati predefinita**: abilita questa opzione se il valore del campo è fornito dall'origine dati, ad esempio utilizzando l'incremento automatico o un timestamp dell'evento.
      + **Opzioni relative ai tipi di dati**: i campi di determinati tipi di dati possono essere configurati con opzioni di tipo di dati come valori minimi o massimi.

1. Per eliminare un campo, scegli l'icona del cestino del campo che desideri eliminare.

# Azioni di creazione, modifica o eliminazione dei dati
<a name="data-entities-edit-data-actions"></a>

Le azioni relative ai dati vengono utilizzate nelle applicazioni per eseguire azioni sui dati di un'entità, come il recupero di tutti i record o il recupero di un record per ID. Le azioni sui dati possono essere utilizzate per individuare e restituire dati che corrispondono a condizioni specifiche da visualizzare in componenti come tabelle o viste di dettaglio.

**Contents**
+ [Creazione di azioni relative ai dati](#data-entities-data-action-add)
+ [Modifica o configurazione delle azioni relative ai dati](#data-entities-data-action-edit)
+ [Operatori ed esempi delle condizioni di azione dei dati](#data-entities-data-action-operators)
  + [Supporto agli operatori delle condizioni tramite database](#data-entities-data-action-operators-support)
  + [Esempi di condizioni di azione dei dati](#data-entities-data-action-operators-examples)
+ [Eliminazione delle azioni relative ai dati](#data-entities-data-action-delete)

## Creazione di azioni relative ai dati
<a name="data-entities-data-action-add"></a>

**Suggerimento**  
Puoi premere CTRL\$1Z per annullare la modifica più recente all'entità.

1. Se necessario, accedi all'entità per la quale desideri creare azioni relative ai dati.

1. Scegli la scheda **Azioni sui dati**.

1. Esistono due metodi per creare azioni relative ai dati:
   + (Consigliato) Per utilizzare l'intelligenza artificiale per generare azioni sui dati per te, in base al nome dell'entità, ai campi e all'origine dati connessa, scegli **Genera azioni sui dati**. Verranno generate le seguenti azioni:

     1. `getAll`: recupera tutti i record da un'entità. Questa azione è utile quando è necessario visualizzare un elenco di record o eseguire operazioni su più record contemporaneamente.

     1. `getByID`: recupera un singolo record da un'entità in base al suo identificatore univoco (ID o chiave primaria). Questa azione è utile quando è necessario visualizzare o eseguire operazioni su un record specifico.
   + Per aggiungere una singola azione sui dati, scegli **\$1 Aggiungi azione dati**.

1. Per visualizzare o configurare la nuova azione relativa ai dati, consulta la sezione seguente,[Modifica o configurazione delle azioni relative ai dati](#data-entities-data-action-edit).

## Modifica o configurazione delle azioni relative ai dati
<a name="data-entities-data-action-edit"></a>

1. Se necessario, accedi all'entità per la quale desideri creare azioni relative ai dati.

1. Scegli la scheda **Azioni sui dati**.

1. In **Campi** configura i campi che devono essere restituiti dalla query. Per impostazione predefinita, vengono selezionati tutti i campi configurati nell'entità.

   È inoltre possibile aggiungere **join** all'azione relativa ai dati eseguendo le seguenti operazioni:

   1. Scegli **\$1 Aggiungi Join** per aprire una finestra di dialogo.

   1. In **Entità correlata**, seleziona l'entità che desideri unire all'entità corrente.

   1. In **Alias**, inserisci facoltativamente un alias temporaneo per l'entità correlata.

   1. In **Tipo di join**, seleziona il tipo di join desiderato.

   1. Definite la clausola di join selezionando i campi di ciascuna entità.

   1. Scegli **Aggiungi** per creare il join.

   Una volta creato, il join verrà visualizzato nella sezione **Join**, rendendo disponibili campi aggiuntivi nel menu a discesa **Campi da restituire**. Puoi aggiungere più join, compresi i join concatenati tra le entità. Puoi anche filtrare e ordinare i campi delle entità unite.

   Per eliminare un join, scegli l'icona del cestino accanto ad esso. Ciò rimuoverà tutti i campi da quel join e interromperà eventuali join o vincoli dipendenti che utilizzano tali campi.

1. In **Condizioni**, aggiungi, modifica o rimuovi le regole che filtrano l'output della query. È possibile organizzare le regole in gruppi e concatenare più regole con le `OR` istruzioni `AND` or. Per ulteriori informazioni sugli operatori che è possibile utilizzare, vedere[Operatori ed esempi delle condizioni di azione dei dati](#data-entities-data-action-operators).

1. In **Ordinamento**, configura il modo in cui i risultati della query vengono ordinati scegliendo un attributo e scegliendo l'ordine crescente o decrescente. È possibile rimuovere la configurazione di ordinamento scegliendo l'icona del cestino accanto alla regola di ordinamento.

1. In **Transform results**, puoi inserire risultati personalizzati JavaScript per modificare o formattare prima che vengano visualizzati o inviati alle automazioni.

1. In **Output preview**, visualizza una tabella di anteprima dell'output della query in base ai campi configurati, ai filtri, all'ordinamento e. JavaScript

## Operatori ed esempi delle condizioni di azione dei dati
<a name="data-entities-data-action-operators"></a>

È possibile utilizzare gli operatori di condizione per confrontare un valore di espressione configurato con una colonna di entità per restituire un sottoinsieme di oggetti del database. Gli operatori che puoi utilizzare dipendono dal tipo di dati della colonna e dal tipo di database a cui l'entità è connessa, come Amazon Redshift, Amazon Aurora o Amazon DynamoDB.

I seguenti operatori di condizioni possono essere utilizzati con tutti i servizi di database:
+ `=`e`!=`: disponibile per tutti i tipi di dati (escluse le colonne chiave primarie).
+ `<=`, `>=``<`, e`>=`: Disponibile solo per le colonne numeriche.
+ `IS NULL`e`IS NOT NULL`: utilizzato per abbinare colonne con valori nulli o vuoti. I valori nulli vengono spesso interpretati in modo diverso in ogni database, tuttavia in App Studio l'`NULL`operatore abbina e restituisce i record con valori nulli nella tabella del database connessa.

I seguenti operatori di condizione possono essere utilizzati solo nelle entità connesse ai servizi di database che li supportano:
+ `LIKE`and `NOT LIKE` (Redshift, Aurora): utilizzato per eseguire query basate su pattern nel database connesso. L'`LIKE`operatore offre flessibilità nella funzionalità di ricerca perché trova e restituisce i record che soddisfano i modelli specificati. I pattern vengono definiti utilizzando caratteri jolly che corrispondono a qualsiasi carattere o sequenza di caratteri all'interno del pattern. Ogni sistema di gestione di database dispone di un set unico di caratteri jolly, ma i due più diffusi sono quelli di `%` rappresentare un numero qualsiasi di caratteri (incluso 0) e di `_` rappresentare un singolo carattere.
+ `Contains`and `Not Contains` (DynamoDB): utilizzato per eseguire una ricerca con distinzione tra maiuscole e minuscole per determinare se il testo specificato viene trovato all'interno dei valori delle colonne. 
+ `Starts With`and `Not Starts With` (DynamoDB): utilizzato per eseguire una ricerca con distinzione tra maiuscole e minuscole per determinare se il testo specificato viene trovato all'inizio dei valori delle colonne. 

### Supporto agli operatori delle condizioni tramite database
<a name="data-entities-data-action-operators-support"></a>

La tabella seguente mostra quali operatori di condizione di azione dei dati sono supportati da ciascun database che può connettersi ad App Studio.


|  | =, \$1=, <, >, <=, >= | PIACE, NON PIACE | Contiene, non contiene | Inizia con, non inizia con | È NULLO, NON È NULLO | 
| --- | --- | --- | --- | --- | --- | 
|  **DynamoDB**  |  Sì  |  No  |  Sì  |  Sì  |  Sì  | 
|  **Aurora**  |  Sì   |  Sì  |  No  |  No  |  Sì  | 
|  **Redshift**  |  Sì   |  Sì  |  No  |  No  |  Sì  | 

### Esempi di condizioni di azione dei dati
<a name="data-entities-data-action-operators-examples"></a>

Considerate la seguente tabella di database, che include più elementi con `name``city`, e `hireDate` campi.


| nome | città | Data di assunzione | 
| --- | --- | --- | 
|  Adamo  |  Seattle  |  01/03/2025  | 
|  Adrienne  |  Boston  |  2025-03-05  | 
|  Bob  |  Albuquerque  |  2025-03-06  | 
|  Carlos  |  Chicago  |  2025-03-10  | 
|  Carolina  |  NULL  |  2025-03-12  | 
|  Rita  |  Miami  |  2025-03-15  | 

Ora, considera la possibilità di creare azioni di dati in App Studio che restituiscano il `name` campo per gli elementi che soddisfano le condizioni specificate. L'elenco seguente contiene esempi di condizioni e i valori che la tabella restituisce per ciascuna di esse. 

**Nota**  
Gli esempi sono formattati come esempi SQL: potrebbero non apparire come in App Studio, ma vengono utilizzati per illustrare il comportamento degli operatori.
+ `WHERE name LIKE 'Adam'`: Restituisce. `Adam`
+ `WHERE name LIKE 'A%'`: Restituisce `Adam` e`Adrienne`.
+ `WHERE name NOT LIKE 'B_B'`: Restituisce `Adam``Adrienne`,`Carlos`,`Caroline`, e`Rita`.
+ `WHERE contains(name, 'ita')`: Restituisce`Rita`.
+ `WHERE begins_with(name, 'Car')`: Restituisce `Carlos` e`Caroline`.
+ `WHERE city IS NULL`: Restituisce`Caroline`.
+ `WHERE hireDate < "2025-03-06"`: Restituisce `Adam` e`Adrienne`.
+ `WHERE hireDate >= DateTime.now().toISODate()`: Nota che `DateTime.now().toISODate()` restituisce la data corrente. In uno scenario in cui la data corrente è 2025-03-10, l'espressione restituisce`Carlos`, `Caroline` e. `Rita`

**Suggerimento**  
Per ulteriori informazioni sul confronto di date e ore nelle espressioni, vedere. [Data e ora](expressions.md#expressions-date-time)

## Eliminazione delle azioni relative ai dati
<a name="data-entities-data-action-delete"></a>

Utilizza la seguente procedura per eliminare le azioni relative ai dati da un'entità di App Studio.

1. Se necessario, vai all'entità per la quale desideri eliminare le azioni relative ai dati.

1. Scegli la scheda **Azioni sui dati**.

1. Per ogni azione relativa ai dati che desideri eliminare, scegli il menu a discesa accanto a **Modifica** e scegli **Elimina**.

1. Scegli **Conferma** nella finestra di dialogo.

# Aggiungere o eliminare dati di esempio
<a name="data-entities-edit-sample-data"></a>

È possibile aggiungere dati di esempio alle entità in un'applicazione App Studio. Poiché le applicazioni non comunicano con i servizi esterni fino a quando non vengono pubblicate, i dati di esempio possono essere utilizzati per testare l'applicazione e l'entità in ambienti di anteprima.

1. Se necessario, accedi all'entità che desideri modificare.

1. Scegli la scheda **Dati di esempio**.

1. Per generare dati di esempio, scegli **Genera altri dati di esempio**.

1. Per eliminare i dati di esempio, seleziona le caselle di controllo dei dati che desideri eliminare e premi il tasto Elimina o Backspace. Scegliete **Salva** per salvare le modifiche.

# Aggiungi o modifica l'origine dati connessa e i campi della mappa
<a name="data-entities-edit-connection"></a>

**Suggerimento**  
Puoi premere CTRL\$1Z per annullare la modifica più recente all'entità.

1. Se necessario, accedi all'entità che desideri modificare.

1. Scegli la scheda **Connessione** per visualizzare o gestire la connessione tra l'entità e una tabella di origini dati in cui vengono archiviati i dati quando l'applicazione viene pubblicata. Una volta connessa una tabella di origine dati, puoi mappare i campi dell'entità alle colonne della tabella.

1. In **Connector**, scegli il connettore che contiene una connessione alla tabella delle sorgenti dati desiderata. Per ulteriori informazioni sui connettori, vedere[Connetti App Studio ad altri servizi con connettori](connectors.md).

1. In **Tabella**, scegli la tabella che desideri utilizzare come fonte di dati per l'entità.

1. La tabella mostra i campi dell'entità e la colonna dell'origine dati a cui sono mappati. Scegli **Mappa automatica per mappare** automaticamente i campi dell'entità con le colonne delle fonti di dati. Puoi anche mappare i campi manualmente nella tabella scegliendo la colonna dell'origine dati nel menu a discesa per ogni campo di entità.

# Eliminazione di un'entità
<a name="data-entities-delete"></a>

Utilizzare la seguente procedura per eliminare un'entità da un'applicazione App Studio.

**Nota**  
L'eliminazione di un'entità da un'app App Studio non elimina la tabella delle sorgenti dati connesse, inclusa la tabella DynamoDB corrispondente delle entità gestite. Le tabelle delle fonti di dati rimarranno nell' AWS account associato e, se lo si desidera, dovranno essere eliminate dal servizio corrispondente.

**Per eliminare un'entità**

1. Se necessario, accedi alla tua applicazione.

1. Seleziona la scheda **Dati**

1. **Nel menu **Entità** a sinistra, scegli il menu con le ellissi accanto all'entità che desideri eliminare e scegli Elimina.**

1. Controlla le informazioni nella finestra di dialogo, inserisci **confirm** e scegli **Elimina per eliminare** l'entità.

# Entità di dati gestite in AWS App Studio
<a name="managed-data-entities"></a>

In genere, si configura un'entità in App Studio con una connessione a una tabella di database esterna e si deve creare e mappare ogni campo di entità con una colonna nella tabella del database connessa. Quando si apporta una modifica al modello di dati, è necessario aggiornare sia la tabella del database esterno che l'entità e i campi modificati devono essere rimappati. Sebbene questo metodo sia flessibile e consenta l'uso di diversi tipi di fonti di dati, richiede una pianificazione più anticipata e una manutenzione continua.

Un'*entità gestita* è un tipo di entità per la quale App Studio gestisce l'intero processo di archiviazione e configurazione dei dati per te. Quando si crea un'entità gestita, viene creata una tabella DynamoDB corrispondente nell'account associato. AWS Ciò garantisce una gestione dei dati sicura e trasparente all'interno. AWS Con un'entità gestita, si configura lo schema dell'entità in App Studio e anche la tabella DynamoDB corrispondente viene aggiornata automaticamente.

## Utilizzo di entità gestite in più applicazioni
<a name="managed-data-entities-other-applications"></a>

Una volta creata un'entità gestita in un'app App Studio, tale entità può essere utilizzata in altre app App Studio. Ciò è utile per configurare l'archiviazione dei dati per app con modelli e schemi di dati identici, poiché fornisce un'unica risorsa sottostante da gestire.

Quando si utilizza un'entità gestita in più applicazioni, tutti gli aggiornamenti dello schema alla tabella DynamoDB corrispondente devono essere effettuati utilizzando l'applicazione originale in cui è stata creata l'entità gestita. Qualsiasi modifica allo schema apportata all'entità in altre applicazioni non aggiornerà la tabella DynamoDB corrispondente.

## Limitazioni delle entità gestite
<a name="managed-data-entities-limitations"></a>

**Restrizioni all'aggiornamento della chiave primaria**: non è possibile modificare il nome o il tipo di chiave primaria dell'entità dopo la sua creazione, poiché si tratta di una modifica distruttiva in DynamoDB e comporterebbe la perdita dei dati esistenti.

**Ridenominazione delle colonne**: quando si rinomina una colonna in DynamoDB, si crea effettivamente una nuova colonna mentre la colonna originale rimane con i dati originali. I dati originali non vengono copiati automaticamente nella nuova colonna o eliminati dalla colonna originale. Puoi rinominare i campi delle entità gestite, noti come *nome di sistema*, ma perderai l'accesso alla colonna originale e ai relativi dati. Non ci sono restrizioni alla ridenominazione del nome visualizzato.

**Modifica del tipo di dati**: sebbene DynamoDB offra la flessibilità necessaria per modificare i tipi di dati delle colonne dopo la creazione della tabella, tali modifiche possono influire gravemente sui dati esistenti, nonché sulla logica e sulla precisione delle query. Le modifiche ai tipi di dati richiedono la trasformazione di tutti i dati esistenti per renderli conformi al nuovo formato, che è complesso per le tabelle attive di grandi dimensioni. Inoltre, le azioni relative ai dati possono restituire risultati imprevisti fino al completamento della migrazione dei dati. È possibile cambiare i tipi di dati dei campi, ma i dati esistenti non verranno migrati al nuovo tipo di dati.

**Colonna di ordinamento**: DynamoDB consente il recupero di dati ordinati tramite chiavi di ordinamento. Le chiavi di ordinamento devono essere definite come parte delle chiavi primarie composite insieme alla chiave di partizione. Le limitazioni includono la chiave di ordinamento obbligatoria, l'ordinamento limitato all'interno di una partizione e l'assenza di ordinamento globale tra le partizioni. È necessaria un'attenta modellazione dei dati delle chiavi di ordinamento per evitare partizioni calde. Non supporteremo Sorting for Preview milestone.

**Join: i join** non sono supportati in DynamoDB. Le tabelle sono denormalizzate in base alla progettazione per evitare costose operazioni di unione. Per modellare one-to-many le relazioni, la tabella secondaria contiene un attributo che fa riferimento alla chiave primaria della tabella principale. Le interrogazioni su dati multitabella implicano la ricerca di elementi dalla tabella principale per recuperare i dettagli. Non supporteremo i join nativi per le entità gestite come parte della pietra miliare dell'anteprima. Come soluzione alternativa, introdurremo una fase di automazione in grado di eseguire un'unione di dati di 2 entità. Sarà molto simile a una ricerca a un livello. Non supporteremo Sorting for Preview milestone.

**Env Stage**: consentiremo la pubblicazione in fase di test, ma utilizzeremo lo stesso archivio gestito in entrambi gli ambienti

# Parametri di pagina e automazione
<a name="paramters"></a>

I parametri sono una potente funzionalità di AWS App Studio che viene utilizzata per trasferire valori dinamici tra diversi componenti, pagine e automazioni all'interno dell'applicazione. Utilizzando i parametri, puoi creare esperienze flessibili e sensibili al contesto, rendendo le tue applicazioni più reattive e personalizzate. Questo articolo tratta due tipi di parametri: parametri di pagina e parametri di automazione.

**Topics**
+ [Parametri della pagina](parameters-page.md)
+ [Parametri di automazione](parameters-automation.md)

# Parametri della pagina
<a name="parameters-page"></a>

I parametri di pagina sono un modo per inviare informazioni tra le pagine e vengono spesso utilizzati durante la navigazione da una pagina all'altra all'interno di un'app App Studio per mantenere il contesto o trasmettere dati. I parametri della pagina sono in genere costituiti da un nome e un valore.

## Casi d'uso dei parametri di pagina
<a name="parameters-pages-use-cases"></a>

I parametri di pagina vengono utilizzati per lo scambio di dati tra diverse pagine e componenti all'interno delle applicazioni App Studio. Sono particolarmente utili per i seguenti casi d'uso:

1. **Ricerca e filtraggio**: quando gli utenti effettuano ricerche nella home page dell'app, i termini di ricerca possono essere passati come parametri alla pagina dei risultati, consentendole di visualizzare solo gli elementi filtrati pertinenti. Ad esempio, se un utente cerca*noise-cancelling headphones*, il parametro con il valore *noise-cancelling headphones* può essere passato alla pagina di elenco dei prodotti.

1. **Visualizzazione dei dettagli dell'articolo**: se un utente fa clic su un'offerta, ad esempio un prodotto, l'identificatore univoco di tale articolo può essere passato come parametro alla pagina dei dettagli. Ciò consente alla pagina dei dettagli di visualizzare tutte le informazioni sull'articolo specifico. Ad esempio, quando un utente fa clic su un prodotto con cuffie, l'ID univoco del prodotto viene passato come parametro alla pagina dei dettagli del prodotto.

1. **Passaggio del contesto utente nella navigazione della pagina**: mentre gli utenti navigano tra le pagine, i parametri possono trasmettere un contesto importante, come la posizione dell'utente, le categorie di prodotti preferite, il contenuto del carrello degli acquisti e altre impostazioni. Ad esempio, quando un utente naviga tra diverse categorie di prodotti sull'app, la sua posizione e le categorie preferite vengono mantenute come parametri, offrendo un'esperienza personalizzata e coerente.

1. **Link diretti**: utilizza i parametri della pagina per condividere o aggiungere ai segnalibri un link a una pagina specifica all'interno dell'app.

1. **Azioni sui dati**: puoi creare azioni sui dati che accettano i valori dei parametri per filtrare e interrogare le fonti di dati in base ai parametri passati. Ad esempio, nella pagina di elenco dei prodotti, puoi creare un'azione sui dati che accetta `category` i parametri per recuperare i prodotti pertinenti.

## Considerazioni sulla sicurezza dei parametri di pagina
<a name="parameters-pages-security"></a>

Sebbene i parametri di pagina offrano un modo efficace per trasferire dati tra le pagine, è necessario utilizzarli con cautela, poiché possono potenzialmente esporre informazioni riservate se non utilizzati correttamente. Ecco alcune importanti considerazioni sulla sicurezza da tenere a mente:

1. **Evita di esporre dati sensibili in URLs**

   1. **Rischio**: URLs, compresi i parametri di azione dei dati, sono spesso visibili nei log del server, nella cronologia del browser e in altri luoghi. Pertanto, è essenziale evitare di esporre dati sensibili, come credenziali utente, informazioni personali identificabili (PII) o altri dati riservati, nei valori dei parametri della pagina.

   1. **Attenuazione**: prendi in considerazione l'utilizzo di identificatori che possono essere mappati in modo sicuro sui dati sensibili. Ad esempio, invece di passare il nome o l'indirizzo e-mail di un utente come parametro, è possibile passare un identificatore univoco casuale che può essere utilizzato per recuperare il nome o l'e-mail dell'utente.

# Parametri di automazione
<a name="parameters-automation"></a>

I parametri di automazione sono una potente funzionalità di App Studio che può essere utilizzata per creare automazioni flessibili e riutilizzabili passando valori dinamici da varie fonti, come l'interfaccia utente, altre automazioni o azioni sui dati. Agiscono come segnaposto che vengono sostituiti con valori effettivi quando viene eseguita l'automazione, consentendoti di utilizzare la stessa automazione con input diversi ogni volta. 

All'interno di un'automazione, i parametri hanno nomi univoci ed è possibile fare riferimento al valore di un parametro utilizzando la variabile params seguita dal nome del parametro, ad esempio. `{{params.customerId}}`

Questo articolo fornisce una comprensione approfondita dei parametri di automazione, inclusi i concetti fondamentali, l'utilizzo e le migliori pratiche.

## Vantaggi dei parametri di automazione
<a name="parameters-automation-benefits"></a>

I parametri di automazione offrono diversi vantaggi, tra cui il seguente elenco:

1. **Riusabilità**: utilizzando i parametri, è possibile creare automazioni riutilizzabili che possono essere personalizzate con valori di input diversi, che consentono di riutilizzare la stessa logica di automazione con input diversi.

1. **Flessibilità**: invece di codificare i valori in un'automazione, è possibile definire parametri e fornire valori diversi quando necessario, rendendo le automazioni più dinamiche e adattabili.

1. **Separazione delle preoccupazioni**: i parametri aiutano a separare la logica di automazione dai valori specifici utilizzati, promuovendo l'organizzazione e la manutenibilità del codice.

1. **Convalida**: ogni parametro ha un tipo di dati, ad esempio stringa, numero o booleano, che viene convalidato in fase di esecuzione. Ciò garantisce che le richieste con tipi di dati errati vengano rifiutate senza la necessità di un codice di convalida personalizzato.

1. **Parametri opzionali e obbligatori**: è possibile designare i parametri di automazione come facoltativi o obbligatori. I parametri obbligatori devono essere forniti durante l'esecuzione dell'automazione, mentre i parametri opzionali possono avere valori predefiniti o essere omessi. Questa flessibilità consente di creare automazioni più versatili in grado di gestire diversi scenari in base ai parametri forniti.

## Scenari e casi d'uso
<a name="parameters-automation-scenarios"></a>

### Scenario: recupero dei dettagli del prodotto
<a name="parameters-automation-scenario-product-details"></a>



Immagina di avere un'automazione che recupera i dettagli del prodotto da un database basato su un ID del prodotto. Questa automazione potrebbe avere un parametro chiamato`productId`.

Il `productId` parametro funge da segnaposto che è possibile inserire con il valore effettivo dell'ID del prodotto durante l'esecuzione dell'automazione. Invece di codificare un ID prodotto specifico nell'automazione, puoi definire il `productId` parametro e passare valori ID di prodotto diversi ogni volta che esegui l'automazione.

Puoi richiamare questa automazione dalla fonte dati di un componente, passando l'ID del prodotto selezionato come `productId` parametro utilizzando la sintassi con doppia parentesi curva:. `{{ui.productsTable.selectedRow.id}}` In questo modo, quando un utente seleziona un prodotto da una tabella (`ui.productsTable`), l'automazione recupererà i dettagli del prodotto selezionato passando l'id della riga selezionata come parametro. `productId`

In alternativa, puoi richiamare questa automazione da un'altra automazione che esegue un ciclo su un elenco di prodotti e recupera i dettagli di ciascun prodotto passando l'id del prodotto come parametro. `productId` In questo scenario, il valore del `productId` parametro verrebbe fornito dinamicamente dall'`{{product.id}}`espressione in ogni iterazione del ciclo.

Utilizzando il `productId` parametro e la sintassi con doppia parentesi curva, è possibile rendere questa automazione più flessibile e riutilizzabile. Invece di creare automazioni separate per ogni prodotto, puoi disporre di un'unica automazione in grado di recuperare i dettagli di qualsiasi prodotto semplicemente fornendo l'ID del prodotto appropriato come valore del parametro da diverse fonti, come componenti dell'interfaccia utente o altre automazioni.

### Scenario: gestione dei parametri opzionali con valori di fallback
<a name="parameters-automation-scenario-optional-parameters"></a>

Prendiamo in considerazione uno scenario in cui si dispone di un'entità «Task» con una colonna «Owner» obbligatoria, ma si desidera che questo campo sia facoltativo nell'automazione e fornisca un valore di fallback se il proprietario non è selezionato.

1. Crea un'automazione con un parametro denominato `Owner` mappato al `Owner` campo dell'`Task`entità.

1. Poiché il `Owner` campo è obbligatorio nell'entità, il `Owner` parametro si sincronizzerà con l'impostazione richiesta.

1. Per rendere il `Owner` parametro opzionale nell'automazione, disattiva l'`required`impostazione per questo parametro.

1. Nella logica di automazione, puoi usare un'espressione come. `{{params.Owner || currentUser.userId}}` Questa espressione verifica se il `Owner` parametro è fornito. Se non viene fornito, tornerà all'ID dell'utente corrente come proprietario.

1. In questo modo, se l'utente non seleziona un proprietario in un modulo o in un componente, l'automazione assegnerà automaticamente l'utente corrente come proprietario dell'attività.

Modificando l'`required`impostazione del `Owner` parametro e utilizzando un'espressione di fallback, è possibile disaccoppiarlo dal requisito del campo di entità, renderlo facoltativo nell'automazione e fornire un valore predefinito quando il parametro non viene fornito.

## Definizione dei tipi di parametri di automazione
<a name="parameters-automation-create"></a>

Utilizzando i tipi di parametri per specificare i tipi di dati e impostare i requisiti, puoi controllare gli input per le tue automazioni. Questo aiuta a garantire che le automazioni funzionino in modo affidabile con gli input previsti.

### Sincronizzazione dei tipi da un'entità
<a name="parameters-automation-synchronize-entity"></a>

La sincronizzazione dinamica dei tipi di parametri e dei requisiti dalle definizioni dei campi di entità semplifica la creazione di automazioni che interagiscono con i dati delle entità, garantendo che il parametro rifletta sempre il tipo e i requisiti più recenti dei campi di entità.

La procedura seguente descrive in dettaglio i passaggi generali per la sincronizzazione dei tipi di parametri da un'entità:

1. Crea un'entità con campi digitati (ad esempio Booleano, Numero, ecc.) e contrassegna i campi secondo necessità.

1. Crea una nuova automazione.

1. Aggiungi parametri all'automazione e, quando scegli il **Tipo**, scegli il campo dell'entità con cui desideri sincronizzarti. Il tipo di dati e l'impostazione richiesta verranno sincronizzati automaticamente dal campo dell'entità mappata

1. Se necessario, puoi sovrascrivere l'impostazione «obbligatoria» modificandola per ogni parametro. on/off Ciò significa che lo stato richiesto non verrà mantenuto sincronizzato con il campo dell'entità, ma in caso contrario rimarrà sincronizzato.

### Definizione manuale dei tipi
<a name="parameters-automation-custom-types"></a>

È inoltre possibile definire i tipi di parametri manualmente senza sincronizzarsi da un'entità

Definendo tipi di parametri personalizzati, è possibile creare automazioni che accettano tipi di input specifici e gestiscono parametri opzionali o obbligatori in base alle esigenze, senza fare affidamento sulle mappature dei campi delle entità.

1. Crea un'entità con campi digitati (ad esempio Booleano, Numero, ecc.) e contrassegna i campi secondo necessità.

1. Crea una nuova automazione.

1. Aggiungi parametri all'automazione e, quando scegli il **Tipo**, scegli il tipo desiderato.

## Configurazione dei valori dinamici da passare ai parametri di automazione
<a name="parameters-automation-pass-values"></a>

Dopo aver definito i parametri per un'automazione, è possibile passare loro dei valori quando si richiama l'automazione. Puoi passare i valori dei parametri in due modi:

1. **Trigger dei** componenti: se richiami l'automazione da un trigger del componente, ad esempio facendo clic su un pulsante, puoi utilizzare JavaScript le espressioni per passare valori dal contesto del componente. Ad esempio, se hai un campo di immissione di testo denominato`emailInput`, puoi passarne il valore al parametro email con la seguente espressione:. `ui.emailInput.value`

1. **Altre automazioni**: Se stai richiamando l'automazione da un'altra automazione, puoi utilizzare JavaScript le espressioni per passare valori dal contesto di automazione. Ad esempio, puoi passare il valore di un altro parametro o il risultato di un'azione precedente.

## Tipo di sicurezza
<a name="parameters-automation-type-safety"></a>

Definendo parametri con tipi di dati specifici, come String, Number o Boolean, puoi assicurarti che i valori passati all'automazione siano del tipo previsto.

**Nota**  
In App Studio, le date sono date di stringhe ISO e anch'esse verranno convalidate.

Questo tipo di sicurezza aiuta a prevenire le discrepanze tra i tipi, che possono portare a errori o comportamenti imprevisti nella logica di automazione. Ad esempio, se definisci un parametro come a`Number`, puoi essere certo che qualsiasi valore passato a quel parametro sarà un numero e non dovrai eseguire ulteriori controlli o conversioni di tipo all'interno dell'automazione.

## Convalida
<a name="parameters-automation-validation"></a>

Puoi aggiungere regole di convalida ai parametri, assicurandoti che i valori passati all'automazione soddisfino determinati criteri.

Sebbene App Studio non fornisca impostazioni di convalida integrate per i parametri, puoi implementare convalide personalizzate aggiungendo un' JavaScript azione all'automazione che genera un errore in caso di violazione di vincoli specifici.

Per i campi di entità, è supportato un sottoinsieme di regole di convalida, come i valori. minimum/maximum Tuttavia, questi non vengono convalidati a livello di automazione, ma solo a livello di dati, quando si eseguono Create/Update/Delete azioni Record.

## Le migliori pratiche per i parametri di automazione
<a name="parameters-automation-best-practices"></a>

Per garantire che i parametri di automazione siano ben progettati, gestibili e facili da usare, segui queste best practice:

1. **Usa nomi descrittivi dei parametri**: scegli nomi di parametro che descrivano chiaramente lo scopo o il contesto del parametro.

1. **Fornisci descrizioni dei parametri**: sfrutta il campo **Descrizione** quando definisci i parametri per spiegarne lo scopo, i vincoli e le aspettative. Queste descrizioni verranno visualizzate nei JSDoc commenti quando si fa riferimento al parametro, nonché in tutte le interfacce utente in cui gli utenti devono fornire valori per i parametri quando richiamano l'automazione.

1. **Utilizza tipi di dati appropriati**: considera attentamente il tipo di dati di ciascun parametro in base ai valori di input previsti, ad esempio: String, Number, Boolean, Object.

1. **Convalida dei valori dei parametri**: implementa i controlli di convalida appropriati all'interno dell'automazione per garantire che i valori dei parametri soddisfino requisiti specifici prima di procedere con ulteriori azioni.

1. **Usa valori di fallback o predefiniti**: Sebbene App Studio attualmente non supporti l'impostazione di valori predefiniti per i parametri, puoi implementare valori di fallback o predefiniti quando utilizzi i parametri nella tua logica di automazione. Ad esempio, puoi usare un'espressione come `{{ params.param1 || "default value" }}` per fornire un valore predefinito se il `param1` parametro non viene fornito o ha un valore falso.

1. **Mantieni la coerenza dei parametri**: se disponi di più automazioni che richiedono parametri simili, prova a mantenere la coerenza nei nomi dei parametri e nei tipi di dati tra tali automazioni.

1. **Documenta l'utilizzo dei parametri**: mantieni una documentazione chiara per le tue automazioni, comprese le descrizioni di ciascun parametro, il suo scopo, i valori previsti ed eventuali esempi o casi limite pertinenti.

1. **Rivedi e rifattorizza frequentemente**: rivedi periodicamente le automazioni e i relativi parametri, rifattorizzando o consolidando i parametri secondo necessità per migliorare la chiarezza, la manutenibilità e la riusabilità.

1. **Limita il numero di parametri: sebbene i parametri** offrano flessibilità, troppi parametri possono rendere un'automazione complessa e difficile da usare. Cerca di trovare un equilibrio tra flessibilità e semplicità limitando il numero di parametri solo a ciò che è necessario.

1. **Prendi in considerazione il raggruppamento dei** parametri: se ti ritrovi a definire più parametri correlati, valuta la possibilità di raggrupparli in un unico parametro. *Object*

1. **Preoccupazioni separate**: evita di utilizzare un singolo parametro per più scopi o di combinare valori non correlati in un unico parametro. Ogni parametro deve rappresentare un problema o un dato distinto.

1. **Usa alias di parametri**: se disponi di parametri con nomi lunghi o complessi, prendi in considerazione l'utilizzo di alias o versioni abbreviate all'interno della logica di automazione per una migliore leggibilità e gestibilità.

Seguendo queste best practice, è possibile garantire che i parametri di automazione siano ben progettati, gestibili e facili da usare, migliorando in ultima analisi la qualità e l'efficienza complessive delle automazioni.

# Utilizzo JavaScript per scrivere espressioni in App Studio
<a name="expressions"></a>

In AWS App Studio, puoi usare JavaScript le espressioni per controllare dinamicamente il comportamento e l'aspetto delle tue applicazioni. Le JavaScript espressioni a riga singola sono scritte tra parentesi graffe doppie e possono essere utilizzate in vari contesti come automazioni, componenti dell'interfaccia utente e query di dati. `{{ }}` Queste espressioni vengono valutate in fase di esecuzione e possono essere utilizzate per eseguire calcoli, manipolare dati e controllare la logica delle applicazioni.

App Studio fornisce supporto nativo per tre librerie JavaScript open source: Luxon, UUID, Lodash e integrazioni SDK per rilevare errori di JavaScript sintassi e controllo dei tipi all'interno delle configurazioni dell'app.

**Importante**  
App Studio non supporta l'utilizzo di librerie personalizzate o di terze parti. JavaScript 

## Sintassi di base
<a name="expressions-basic-syntax"></a>

JavaScript le espressioni possono includere variabili, valori letterali, operatori e chiamate di funzioni. Le espressioni vengono comunemente utilizzate per eseguire calcoli o valutare condizioni.

Fare riferimento agli esempi riportati di seguito:
+ `{{ 2 + 3 }}`valuterà fino a 5.
+ `{{ "Hello, " + "World!" }}`valuterà «Hello, World\$1».
+ `{{ Math.max(5, 10) }}`valuterà fino a 10.
+ `{{ Math.random() * 10 }}`restituisce un numero casuale (con decimali) compreso tra [0-10).

## Interpolazione
<a name="expressions-interpolation"></a>

È inoltre possibile utilizzarla JavaScript per interpolare valori dinamici all'interno di testo statico. Ciò si ottiene racchiudendo l' JavaScript espressione tra parentesi doppie arricciate, come nell'esempio seguente:

```
Hello {{ currentUser.firstName }}, welcome to App Studio!
```

In questo esempio, `currentUser.firstName` è un' JavaScript espressione che recupera il nome dell'utente corrente, che viene quindi inserito dinamicamente nel messaggio di saluto.

## Concatenazione
<a name="expressions-concatenation"></a>

È possibile concatenare stringhe e variabili utilizzando l'`+`operatore in, come nell' JavaScriptesempio seguente.

```
{{ currentRow.FirstName + " " + currentRow.LastName }}
```

Questa espressione combina i valori di `currentRow.FirstName` e `currentRow.LastName` con uno spazio intermedio, ottenendo il nome completo della riga corrente. Ad esempio, se `currentRow.FirstName` è `John` ed `currentRow.LastName` è`Doe`, l'espressione si risolverà in`John Doe`.

## Data e ora
<a name="expressions-date-time"></a>

JavaScript fornisce varie funzioni e oggetti per lavorare con date e ore. Esempio:
+ `{{ new Date().toLocaleDateString() }}`: restituisce la data corrente in un formato localizzato.
+ `{{ DateTime.now().toISODate() }}`: restituisce la data corrente in YYYY-MM-DD formato, da utilizzare nel componente Date.

### Confronto tra data e ora
<a name="expressions-date-time-comparison"></a>

Utilizza operatori come`=`,, `>` `<``>=`, o `<=` per confrontare i valori di data e ora. Esempio:
+ `{{ui.timeInput.value > "10:00 AM"}}`: Verifica se l'ora è successiva alle 10:00.
+ `{{ui.timeInput.value <= "5:00 PM"}}`: Controlla se l'ora è alle 17:00 o prima.
+ `{{ui.timeInput.value > DateTime.now().toISOTime()}}`: Verifica se l'ora è successiva all'ora corrente.
+ `{{ui.dateInput.value > DateTime.now().toISODate()}}`: Verifica se la data è precedente alla data corrente.
+ `{{ DateTime.fromISO(ui.dateInput.value).diff(DateTime.now(), "days").days >= 5 }}`: Verifica se la data è ad almeno 5 giorni dalla data corrente.

## Blocchi di codice
<a name="expressions-code-block"></a>

Oltre alle espressioni, puoi anche scrivere blocchi di JavaScript codice multilinea. A differenza delle espressioni, i blocchi di codice non richiedono parentesi graffe. Puoi invece scrivere il JavaScript codice direttamente all'interno dell'editor di blocchi di codice.

**Nota**  
Mentre le espressioni vengono valutate e i relativi valori vengono visualizzati, vengono eseguiti blocchi di codice e viene visualizzato il relativo output (se presente).

## Variabili e funzioni globali
<a name="expressions-global-variables-functions"></a>

App Studio fornisce l'accesso a determinate variabili e funzioni globali che possono essere utilizzate all'interno JavaScript delle espressioni e dei blocchi di codice. Ad esempio, `currentUser` è una variabile globale che rappresenta l'utente attualmente connesso e puoi accedere a proprietà come `currentUser.role` recuperare il ruolo dell'utente.

## Riferimento o aggiornamento dei valori dei componenti dell'interfaccia utente
<a name="expressions-UI-component-values"></a>

È possibile utilizzare le espressioni nei componenti e nelle azioni di automazione per fare riferimento e aggiornare i valori dei componenti dell'interfaccia utente. Facendo riferimento e aggiornando a livello di codice i valori dei componenti, è possibile creare interfacce utente dinamiche e interattive che rispondono all'input dell'utente e alle modifiche dei dati.

### Riferimento ai valori dei componenti dell'interfaccia utente
<a name="expressions-UI-component-values-referencing"></a>

È possibile creare applicazioni interattive e basate sui dati implementando un comportamento dinamico accedendo ai valori dei componenti dell'interfaccia utente.

È possibile accedere ai valori e alle proprietà dei componenti dell'interfaccia utente sulla stessa pagina utilizzando lo `ui` spazio dei nomi nelle espressioni. Facendo riferimento al nome di un componente, è possibile recuperarne il valore o eseguire operazioni in base al suo stato.

**Nota**  
Il `ui` namespace mostrerà solo i componenti nella pagina corrente, poiché i componenti sono limitati alle rispettive pagine.

La sintassi di base per fare riferimento ai componenti in un'app App Studio è:. `{{ui.componentName}}`

Il seguente elenco contiene esempi di utilizzo dello spazio dei `ui` nomi per accedere ai valori dei componenti dell'interfaccia utente:
+ `{{ui.textInputName.value}}`: rappresenta il valore di un componente di input di testo denominato. *textInputName*
+ `{{ui.formName.isValid}}`: Controlla se tutti i campi del modulo denominato *formName* sono validi in base ai criteri di convalida forniti.
+ `{{ui.tableName.currentRow.columnName}}`: rappresenta il valore di una colonna specifica nella riga corrente di un componente della tabella denominato*tableName*.
+ `{{ui.tableName.selectedRowData.fieldName}}`: Rappresenta il valore del campo specificato dalla riga selezionata in un componente di tabella denominato*tableName*. È quindi possibile aggiungere un nome di campo come `ID` (`{{ui.tableName.selectedRowData.ID}}`) per fare riferimento al valore di quel campo dalla riga selezionata.

L'elenco seguente contiene esempi più specifici di riferimento ai valori dei componenti:
+ `{{ui.inputText1.value.trim().length > 0}}`: Controlla se il valore del *inputText1* componente, dopo aver tagliato qualsiasi spazio bianco iniziale o finale, ha una stringa non vuota. Questo può essere utile per convalidare l'input dell'utente o enabling/disabling altri componenti in base al valore del campo di testo di input.
+ `{{ui.multiSelect1.value.join(", ")}}`: Per un componente a selezione multipla denominato*multiSelect1*, questa espressione converte la matrice di valori delle opzioni selezionate in una stringa separata da virgole. Ciò può essere utile per visualizzare le opzioni selezionate in un formato intuitivo o per passare le selezioni a un altro componente o automazione.
+ `{{ui.multiSelect1.value.includes("option1")}}`: Questa espressione controlla se il valore *option1* è incluso nella matrice di opzioni selezionate per il *multiSelect1* componente. Restituisce vero se *option1* è selezionato e falso in caso contrario. Ciò può essere utile per eseguire il rendering condizionale dei componenti o eseguire azioni basate su selezioni di opzioni specifiche.
+ `{{ui.s3Upload1.files.length > 0}}`: per un componente di caricamento di file di Amazon S3 denominato*s3Upload1*, questa espressione verifica se sono stati caricati dei file controllando la lunghezza dell'array di file. Può essere utile per enabling/disabling altri componenti o azioni a seconda che i file siano stati caricati.
+ `{{ui.s3Upload1.files.filter(file => file.type === "image/png").length}}`: Questa espressione filtra l'elenco dei file caricati nel *s3Upload1* componente per includere solo i file di immagine PNG e restituisce il conteggio di tali file. Ciò può essere utile per convalidare o visualizzare informazioni sui tipi di file caricati.

### Aggiornamento dei valori dei componenti dell'interfaccia utente
<a name="expressions-UI-component-values-updating"></a>

Per aggiornare o manipolare il valore di un componente, utilizzalo all'`RunComponentAction`interno di un'automazione. Ecco un esempio della sintassi che puoi usare per aggiornare il valore di un componente di immissione di testo denominato *myInput* utilizzando l'azione`RunComponentAction`:

```
RunComponentAction(ui.myInput, "setValue", "New Value")
```

In questo esempio, il `RunComponentAction` passaggio richiama l'`setValue`azione sul *myInput* componente, passando il nuovo valore,*New Value*.

## Lavorare con i dati delle tabelle
<a name="expressions-table-data"></a>

È possibile accedere ai dati e ai valori della tabella per eseguire operazioni. È possibile utilizzare le seguenti espressioni per accedere ai dati della tabella:
+ `currentRow`: utilizzato per accedere ai dati della tabella dalla riga corrente all'interno della tabella. Ad esempio, impostare il nome di un'azione della tabella, inviare un valore dalla riga a un'automazione avviata da un'azione o utilizzare i valori delle colonne esistenti in una tabella per creare una nuova colonna.
+ `ui.tableName.selectedRow`e `ui.tableName.selectedRowData` vengono entrambi utilizzati per accedere ai dati della tabella da altri componenti della pagina. Ad esempio, impostando il nome di un pulsante all'esterno della tabella in base alla riga selezionata. I valori restituiti sono gli stessi, ma le differenze tra `selectedRow` e `selectedRowData` sono le seguenti:
  + `selectedRow`: questo namespace include il nome mostrato nell'intestazione della colonna per ogni campo. È consigliabile utilizzarlo `selectedRow` quando si fa riferimento a un valore da una colonna visibile nella tabella. Ad esempio, se nella tabella è presente una colonna personalizzata o calcolata che non esiste come campo nell'entità.
  + `selectedRowData`: questo spazio dei nomi include i campi dell'entità utilizzata come origine per la tabella. Dovresti `selectedRowData` utilizzarlo per fare riferimento a un valore dell'entità che non è visibile nella tabella, ma è utile per altri componenti o automazioni dell'app.

L'elenco seguente contiene esempi di accesso ai dati della tabella nelle espressioni:
+ `{{ui.tableName.selectedRow.columnNameWithNoSpace}}`: restituisce il valore della *columnNameWithNoSpace* colonna dalla riga selezionata nella tabella.
+ `{{ui.tableName.selectedRow.['Column Name With Space']}}`: restituisce il valore della *Column Name With Space* colonna dalla riga selezionata nella tabella.
+ `{{ui.tableName.selectedRowData.fieldName}}`: restituisce il valore del campo dell'*fieldName*entità dalla riga selezionata nella tabella.
+ `{{ui.tableName.selectedRows[0].columnMappingName}}`: fa riferimento al nome della colonna della riga selezionata da altri componenti o espressioni nella stessa pagina.
+ `{{currentRow.firstName + ' ' + currentRow.lastNamecolumnMapping}}`: concatena i valori da più colonne per creare una nuova colonna in una tabella.
+ `{{ { "Blocked": "🔴", "Delayed": "🟡", "On track": "🟢" }[currentRow.statuscolumnMapping] + " " + currentRow.statuscolumnMapping}}`: Personalizza il valore di visualizzazione di un campo all'interno di una tabella in base al valore di stato memorizzato.
+ `{{currentRow.colName}}`, `{{currentRow["First Name"]}}``{{currentRow}}`, o`{{ui.tableName.selectedRows[0]}}`: Passa il contesto della riga di riferimento all'interno di un'azione di riga.

## Accesso alle automazioni
<a name="expressions-automations"></a>

Puoi utilizzare le automazioni per eseguire la logica e le operazioni lato server in App Studio. All'interno delle azioni di automazione, puoi utilizzare le espressioni per elaborare dati, generare valori dinamici e incorporare risultati di azioni precedenti.

### Accesso ai parametri di automazione
<a name="expressions-automations-parameters"></a>

Puoi passare valori dinamici dai componenti dell'interfaccia utente e da altre automazioni alle automazioni, rendendole riutilizzabili e flessibili. Questa operazione viene eseguita utilizzando i parametri di automazione con lo spazio dei `params` nomi nel modo seguente:

`{{params.parameterName}}`: fa riferimento a un valore passato all'automazione da un componente dell'interfaccia utente o da un'altra fonte. Ad esempio, `{{params.ID}}` farebbe riferimento a un parametro denominato*ID*.

#### Manipolazione dei parametri di automazione
<a name="expressions-automations-parameters-manipulate"></a>

È possibile utilizzare JavaScript per manipolare i parametri di automazione. Fare riferimento agli esempi riportati di seguito:
+ `{{params.firstName}} {{params.lastName}}`: concatena i valori passati come parametri.
+ `{{params.numberParam1 + params.numberParam2}}`: aggiunge due parametri numerici.
+ `{{params.valueProvided?.length > 0 ? params.valueProvided : 'Default'}}`: Controlla se un parametro non è nullo o non definito e ha una lunghezza diversa da zero. Se vero, usa il valore fornito; in caso contrario, imposta un valore predefinito.
+ `{{params.rootCause || "No root cause provided"}}`: se il `params.rootCause` parametro è falso (null, undefined o una stringa vuota), utilizza il valore predefinito fornito.
+ `{{Math.min(params.numberOfProducts, 100)}}`: limita il valore di un parametro a un valore massimo (in questo caso,`100`).
+ `{{ DateTime.fromISO(params.startDate).plus({ days: 7 }).toISO() }}`: Se il `params.startDate` parametro è`"2023-06-15T10:30:00.000Z"`, questa espressione restituirà a`"2023-06-22T10:30:00.000Z"`, che è la data di una settimana dopo la data di inizio.

### Accesso ai risultati di automazione di un'azione precedente
<a name="expressions-automations-results"></a>

Le automazioni consentono alle applicazioni di eseguire la logica e le operazioni lato server, come interrogare i database, interagire con APIs o eseguire trasformazioni dei dati. Il `results` namespace fornisce l'accesso agli output e ai dati restituiti dalle azioni precedenti all'interno della stessa automazione. Tieni presente i seguenti punti sull'accesso ai risultati dell'automazione:

1. È possibile accedere ai risultati delle fasi di automazione precedenti solo all'interno della stessa automazione.

1. Se hai azioni denominate *action1* e *action2* in questo ordine, *action1* non puoi fare riferimento a nessun risultato e *action2* puoi solo accedere`results.action1`.

1. Funziona anche nelle azioni lato client. Ad esempio, se hai un pulsante che attiva un'automazione utilizzando l'azione. `InvokeAutomation` È quindi possibile impostare una fase di navigazione con una `Run If` condizione come quella di accedere `results.myInvokeAutomation1.fileType === "pdf"` a una pagina con un visualizzatore PDF se l'automazione indica che il file è un PDF.

L'elenco seguente contiene la sintassi per accedere ai risultati di automazione di un'azione precedente utilizzando il `results` namespace.
+ `{{results.stepName.data}}`: recupera l'array di dati da una fase di automazione denominata. *stepName*
+ `{{results.stepName.output}}`: recupera l'output di una fase di automazione denominata. *stepName*

Il modo in cui si accede ai risultati di un passaggio di automazione dipende dal tipo di azione e dai dati restituiti. Azioni diverse possono restituire proprietà o strutture di dati diverse. Ecco alcuni esempi comuni:
+ Per un'azione sui dati, puoi accedere all'array di dati restituito utilizzando`results.stepName.data`.
+ Per un'azione di chiamata API, puoi accedere al corpo della risposta utilizzando`results.stepName.body`.
+ Per un'azione Amazon S3, puoi accedere al contenuto del file utilizzando. `results.stepName.Body.transformToWebStream()`

Consulta la documentazione relativa ai tipi di azioni specifici che stai utilizzando per comprendere la forma dei dati che restituiscono e come accedervi all'interno del `results` namespace. L'elenco seguente contiene alcuni esempi
+ `{{results.getDataStep.data.filter(row => row.status === "pending").length}}`: Supponendo che *getDataStep* sia un'azione di `Invoke Data Action` automazione che restituisce una matrice di righe di dati, questa espressione filtra l'array di dati per includere solo le righe in cui il campo di stato è uguale a `pending` e restituisce la lunghezza (conteggio) dell'array filtrato. Ciò può essere utile per interrogare o elaborare dati in base a condizioni specifiche.
+ `{{params.email.split("@")[0]}}`: Se il `params.email` parametro contiene un indirizzo e-mail, questa espressione divide la stringa in corrispondenza del simbolo @ e restituisce la parte che precede il simbolo @, estraendo in modo efficace la parte relativa al nome utente dell'indirizzo e-mail.
+ `{{new Date(params.timestamp * 1000)}}`: Questa espressione accetta un parametro Unix timestamp (`params.timestamp`) e lo converte in un oggetto Date. JavaScript Presuppone che il timestamp sia espresso in secondi, quindi lo moltiplica per 1000 per convertirlo in millisecondi, che è il formato previsto dal costruttore. `Date` Questo può essere utile per lavorare con i valori di data e ora nelle automazioni.
+ `{{results.stepName.Body}}`: Per un'azione di `Amazon S3 GetObject` automazione denominata*stepName*, questa espressione recupera il contenuto del file, che può essere utilizzato da componenti dell'interfaccia utente come **Image** o **PDF Viewer** per visualizzare il file recuperato. Nota che questa espressione deve essere configurata nell'**output di automazione dell'automazione** da utilizzare nei componenti.

# Dipendenze dei dati e considerazioni sulla tempistica
<a name="data-dependencies-timing-considerations"></a>

Quando si creano applicazioni complesse in App Studio, è fondamentale comprendere e gestire le dipendenze dei dati tra i diversi componenti dei dati, come moduli, visualizzazioni di dettaglio e componenti basati sull'automazione. I componenti e le automazioni dei dati potrebbero non completare il recupero o l'esecuzione dei dati contemporaneamente, il che può portare a problemi di tempistica, errori e comportamenti imprevisti. Conoscendo i potenziali problemi di tempistica e seguendo le best practice, puoi creare esperienze utente più affidabili e coerenti nelle tue applicazioni App Studio.

Alcuni potenziali problemi sono i seguenti:

1. **Conflitti nei tempi di rendering:** i componenti dei dati possono essere visualizzati in un ordine che non è in linea con le dipendenze dei dati, causando potenzialmente incongruenze o errori visivi.

1. **Tempi di esecuzione dell'automazione: le attività di** automazione possono essere completate prima del caricamento completo dei componenti, con conseguenti errori di esecuzione in fase di esecuzione.

1. **Arresti anomali dei componenti:** i componenti alimentati dalle automazioni possono bloccarsi in caso di risposte non valide o quando l'automazione non ha terminato l'esecuzione.

## Esempio: dettagli dell'ordine e informazioni sui clienti
<a name="data-dependencies-timing-considerations-example"></a>

Questo esempio dimostra come le dipendenze tra i componenti dei dati possono portare a problemi di tempistica e potenziali errori nella visualizzazione dei dati.

Consideriamo un'applicazione con i seguenti due componenti di dati sulla stessa pagina:
+ Un componente Detail (`orderDetails`) che recupera i dati dell'ordine.
+ Un componente Detail (`customerDetails`) che mostra i dettagli del cliente relativi all'ordine.

In questa applicazione, ci sono due campi nel componente di `orderDetails` dettaglio, configurati con i seguenti valori:

```
// 2 text fields within the orderDetails detail component

// Info from orderDetails Component
{{ui.orderDetails.data[0].name}} 

// Info from customerDetails component
{{ui.customerDetails.data[0].name}} // Problematic reference
```

In questo esempio, il `orderDetails` componente sta tentando di visualizzare il nome del cliente facendo riferimento ai dati del `customerDetails` componente. Questo è problematico, perché il `orderDetails` componente può renderizzare prima che abbia recuperato i `customerDetails` dati. Se il recupero dei dati del `customerDetails` componente viene ritardato o fallisce, il `orderDetails` componente mostrerà informazioni incomplete o errate. 

## Migliori pratiche di dipendenza dai dati e tempistica
<a name="data-dependencies-timing-considerations-example"></a>

Utilizza le seguenti best practice per mitigare i problemi di dipendenza dai dati e di tempistica nella tua app App Studio:

1. **Usa il rendering condizionale:** esegui il rendering dei componenti o visualizza i dati solo dopo aver confermato che sono disponibili. Usa le istruzioni condizionali per verificare la presenza dei dati prima di visualizzarli. Il frammento seguente mostra un esempio di istruzione condizionale:

   ```
   {{ui.someComponent.data ? ui.someComponent.data.fieldName : "Loading..."}}
   ```

1. **Gestisci la visibilità dei componenti secondari:** per componenti come Stepflow, Form o Detail che eseguono il rendering dei componenti secondari prima del caricamento dei dati, imposta manualmente la visibilità dei componenti secondari. Il seguente frammento mostra un esempio di impostazione della visibilità in base alla disponibilità dei dati dei componenti principali:

   ```
   {{ui.parentComponent.data ? true : false}}
   ```

1. **Usa le query di join:** quando possibile, usa le query di join per recuperare i dati correlati in una singola query. Ciò riduce il numero di recuperi di dati separati e minimizza i problemi di temporizzazione tra i componenti dei dati.

1. **Implementa la gestione degli errori nelle automazioni: implementa una solida gestione degli errori nelle automazioni per gestire con eleganza gli scenari in cui i dati previsti non sono disponibili o vengono ricevute** risposte non valide.

1. **Usa il concatenamento opzionale:** quando accedi alle proprietà annidate, usa il concatenamento opzionale per evitare errori se una proprietà principale non è definita. Il frammento seguente mostra un esempio di concatenamento opzionale:

   ```
   {{ui.component.data?.[0]?.fieldSystemName}}
   ```

# Creazione di un'app con più utenti
<a name="builder-collaboration"></a>

Più utenti possono lavorare su una singola app App Studio, tuttavia solo un utente può modificare un'app alla volta. Consulta le sezioni seguenti per informazioni su come invitare altri utenti a modificare un'app e sul comportamento quando più utenti tentano di modificare un'app contemporaneamente.

## Invita i builder a modificare un'app
<a name="builder-collaborate-invite"></a>

Usa le seguenti istruzioni per invitare altri builder a modificare un'app App Studio.

**Per invitare altri builder a modificare un'app**

1. Se necessario, accedi allo studio applicativo della tua applicazione.

1. Scegli **Condividi**.

1. Nella scheda **Sviluppo**, utilizzate la casella di testo per cercare e selezionare gruppi o singoli utenti che desiderate invitare a modificare l'app.

1. Per ogni utente o gruppo, scegli il menu a discesa e seleziona le autorizzazioni da concedere a quell'utente o gruppo.
   + **Comproprietario**: i comproprietari hanno le stesse autorizzazioni dei proprietari delle app.
   + **Solo modifica**: gli utenti con il ruolo di **sola modifica** dispongono delle stesse autorizzazioni dei proprietari e dei comproprietari, ad eccezione di quanto segue:
     + Non possono invitare altri utenti a modificare l'app.
     + Non possono pubblicare l'app negli ambienti di test o produzione.
     + Non possono aggiungere fonti di dati all'app.
     + Non possono eliminare o duplicare l'app.

## Tentativo di modificare un'app che viene modificata da un altro utente
<a name="builder-collaborate-behavior"></a>

Una singola app App Studio può essere modificata da un solo utente alla volta. Guarda l'esempio seguente per capire cosa succede quando più utenti tentano di modificare un'app contemporaneamente.

In questo esempio, `User A` sta attualmente modificando un'app e l'ha condivisa con`User B`. `User B`quindi tenta di modificare l'app che viene modificata da`User A`.

Quando si `User B` tenta di modificare l'app, viene visualizzata una finestra di dialogo che informa che l'app `User A` è in corso di modifica e che continuando `User A` si esce dallo studio dell'applicazione e tutte le modifiche verranno salvate. `User B`puoi scegliere di annullare e lasciare `User A` continuare, oppure continuare ed entrare nello studio dell'applicazione per modificare l'app. In questo esempio, scelgono di modificare l'app.

Quando `User B` scelgono di modificare l'app, `User A` riceve una notifica che indica che `User B` è iniziata la modifica dell'app e la loro sessione è terminata. Tieni presente che se l'app `User A` fosse aperta in una scheda del browser inattiva, potrebbero non ricevere la notifica. In questo caso, se provano a tornare all'app e ad apportare una modifica, riceveranno un messaggio di errore e verranno guidati ad aggiornare la pagina, che li riporterà all'elenco delle applicazioni.

# Visualizzazione o aggiornamento delle impostazioni di sicurezza dei contenuti dell'app
<a name="app-content-security-settings-csp"></a>

Ogni applicazione in App Studio dispone di impostazioni di sicurezza dei contenuti che possono essere utilizzate per limitare il caricamento di contenuti multimediali o risorse esterne come immagini, iFrame o consentite solo da domini o URLs (inclusi i bucket Amazon S3). PDFs Puoi anche specificare i domini su cui l'app può caricare oggetti su Amazon S3.

Le impostazioni di sicurezza dei contenuti predefinite per tutte le app consistono nel bloccare il caricamento di tutti i contenuti multimediali da fonti esterne, inclusi i bucket Amazon S3, e nel bloccare il caricamento di oggetti su Amazon S3. Pertanto, per caricare immagini, iFrame o contenuti multimediali simili PDFs, devi modificare le impostazioni per consentire l'accesso alle sorgenti dei file multimediali. Inoltre, per consentire il caricamento di oggetti su Amazon S3, è necessario modificare le impostazioni per consentire i domini su cui è possibile caricare.

**Nota**  
Le impostazioni di sicurezza dei contenuti vengono utilizzate per configurare le intestazioni della Content Security Policy (CSP) nell'applicazione. CSP è uno standard di sicurezza che aiuta a proteggere l'app da XSS (Cross-Site Scripting), clickjacking e altri attacchi di iniezione di codice. Per ulteriori informazioni su CSP, consulta [Content Security Policy (](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP)CSP) in MDN Web Docs.

**Per aggiornare le impostazioni di sicurezza dei contenuti dell'app**

1. Se necessario, accedi allo studio applicativo dell'applicazione scegliendo di modificarla dall'elenco delle applicazioni.

1. Scegliete **le impostazioni dell'app**.

1. Scegli la scheda **Impostazioni di sicurezza dei contenuti** per visualizzare le seguenti impostazioni:
   + **Fonte frame**: utilizzata per gestire i domini da cui l'app può caricare frame e iframe (come contenuti interattivi o PDFs). Questa impostazione influisce sui seguenti componenti o risorse dell'app:
     + Componente di incorporamento iFrame
     + Componente visualizzatore PDF
   + **Fonte dell'immagine**: utilizzato per gestire i domini da cui l'app può caricare le immagini. Questa impostazione influisce sui seguenti componenti o risorse dell'app:
     + Logo e banner dell'app
     + Componente visualizzatore di immagini
   + **Connect source**: utilizzato per gestire i domini su cui l'app può caricare oggetti Amazon S3.

1. Per ogni impostazione, scegli l'impostazione desiderata dal menu a discesa:
   + **Blocca tutto frames/images/connections**: non consente il caricamento di contenuti multimediali (immagini, frame PDFs) o il caricamento di oggetti su Amazon S3.
   + **Consenti tutto frames/images/connections**: consenti il caricamento di tutti i file multimediali (immagini, frame PDFs) di tutti i domini o consenti il caricamento di oggetti su Amazon S3 per tutti i domini.
   + **Consenti domini specifici**: consenti il caricamento di contenuti multimediali da o il caricamento di contenuti multimediali su domini specifici. I domini o URLs sono specificati come un elenco di espressioni separate da spazi, dove è possibile utilizzare i caratteri jolly (`*`) per i sottodomini, l'indirizzo host o il numero di porta per indicare che tutti i valori legali di ciascuno sono validi. `https`Specificando anche le corrispondenze. `http` L'elenco seguente contiene esempi di voci valide:
     + `blob:`: corrisponde a tutti i blob, inclusi i dati di file restituiti da azioni di automazione, come la `GetObject` restituzione di articoli dai bucket Amazon S3 o le immagini generate da Amazon Bedrock.
**Importante**  
È necessario includere nell'espressione fornita `blob:` per consentire la restituzione dei dati sui file mediante azioni, anche se l'espressione lo è`*`, è necessario aggiornarla a `* blob:`
     + `http://*.example.com`: corrisponde a tutti i tentativi di caricamento da qualsiasi sottodominio di`example.com`. Corrisponde anche alle `https` risorse.
     + `https://source1.example.com https//source2.example.com`: corrisponde a tutti i tentativi di caricamento da entrambi `https://source1.example.com` e `https://source2.example.com`
     + `https://example.com/subdirectory/`: corrisponde a tutti i tentativi di caricare file nella directory della sottodirectory. Ad esempio, `https://example.com/subdirectory/path/to/file.jpeg`. Non corrisponde`https://example.com/path/to/file.jpeg`.

1. Scegli **Salva** per salvare le modifiche.