Crea un'app no code utilizzando il database nativo AppSheet

1. Prima di iniziare

Il database AppSheet (ASDB) è il database proprietario nativo di AppSheet per organizzare e gestire i dati alla base delle app AppSheet. La sua interfaccia e le prestazioni migliorate offrono un'esperienza migliore sia per il creator dell'app sia per l'utente finale rispetto ad altre origini dati esterne di uso comune come Fogli Google, BigQuery e Cloud SQL. Il database AppSheet è disponibile come opzione di dati predefinita per qualsiasi applicazione AppSheet.

Cosa imparerai a fare

  • Come creare un nuovo database AppSheet con dati di esempio o dati importati da un foglio Google.
  • Come personalizzare i dati nell'editor di database di AppSheet.
  • Come generare un'applicazione AppSheet da un database AppSheet.
  • Come modificare il database e rigenerare le tabelle in AppSheet per tenere conto delle modifiche alla struttura delle tabelle.

Cosa creerai

Questo codelab illustra come generare e personalizzare un nuovo database AppSheet, prima da zero con i dati predefiniti forniti da un database AppSheet e poi dai dati esistenti in un foglio Google. Illustrerà quindi come generare una nuova applicazione AppSheet da un database di AppSheet. Infine, mostra come modificare una tabella di database nell'editor di database e poi rigenerare la tabella nell'editor dell'app AppSheet.

Che cosa ti serve

  • Accesso all'ambiente di sviluppo di AppSheet ( appsheet.com).

2. Crea e personalizza un nuovo database AppSheet da zero

Per iniziare, crea e personalizza un nuovo database AppSheet da zero utilizzando il database di partenza predefinito. In questo modo, hai la possibilità di fare esperimenti con l'editor del database senza interrompere nessuno dei passaggi successivi del codelab.

  1. Vai alla home page di AppSheet ( appsheet.com) e fai clic su Crea > Database > Nuovo database.

Nuovo database da zero

  1. Viene creato un nuovo database di esempio e viene visualizzato l'editor del database AppSheet.

Immagine di un nuovo database di esempio nell'editor di database di AppSheet.

  1. Personalizza il database modificandone il nome da Database senza titolo a DB Attività. Fai doppio clic sul titolo predefinito Database senza titolo per modificare il nome del database.
  2. Modifica il nome della tabella Tabella 1 in Attività. Fai doppio clic sulla scheda per modificarla.
  3. Modifica la prima colonna da Titolo a Attività.
  4. Aggiungi un nuovo record facendo clic su + nell'angolo in alto a sinistra .

Immagine di come aggiungere un nuovo record facendo clic su + nell'angolo in alto a sinistra

  1. Fai doppio clic sulla colonna Stato per vedere come vengono utilizzati i tipi Enum e Elemento menu a discesa.

Editor di proprietà per la colonna "Stato". Vengono utilizzati Tipo: "Enum" e Tipo di elemento: "Menu a discesa"

  1. (Facoltativo) Fai clic sui pulsanti dopo i segni = per colorare ogni opzione del menu a discesa.

Colorazione delle opzioni del menu a discesa con un selettore colori.

  1. (Facoltativo) Fai altri esperimenti con l'editor aggiungendo nuove opzioni per l'enum Status (fai clic su Aggiungi opzione) e nuovi colori.
  2. (Facoltativo) Prova diversi tipi di colonna, ad esempio Colore, Avanzamento, Sì/No e Telefono, quindi osserva il loro comportamento.

Menu contestuale per tutti i tipi di dati supportati in ASDB.

Non esitare a fare altri esperimenti con l'editor del database. Nei passaggi successivi, creerai un nuovo database.

3. Creare e personalizzare un nuovo database importandolo da un foglio Google

I passaggi successivi mostrano come importare i dati da un foglio Google.

Creare il database da un foglio

  1. Innanzitutto, crea una copia di questo foglio Google pubblico e rinominalo ASDB: IO Codelab.

Tieni presente che sono presenti due schede, Attività e Proprietari.

  1. Come prima, vai alla home page di AppSheet ( appsheet.com) e fai clic su Crea > Database > Importa da Fogli.

Creare un database dall'importazione di Fogli

  1. Nel selettore file di Google Drive, seleziona la tua copia del foglio ASDB: IO Codelab o il nome che hai assegnato.

Il risultato è un nuovo database AppSheet generato dai dati nel foglio.

Screenshot del database AppSheet generato da un foglio, nell'editor di database.

Aggiungere un riferimento alla tabella Tasks

Aggiungi un riferimento alla tabella Proprietari dalla tabella Attività.

  1. Nella tabella Attività del database AppSheet, fai doppio clic sulla colonna Proprietario per modificarne le impostazioni.
  2. Modifica il tipo da Testo a Riferimenti > Riferimento.

selezione del tipo di riferimento

  1. Imposta Tabella di riferimento su Proprietari e poi fai clic su Salva.

Finestra di dialogo per impostare Tipo: Riferimento e Tabella a cui fare riferimento: Proprietari

  1. Viene visualizzato un avviso relativo alla modifica del tipo di colonna. In questo caso, i dati di questa colonna sono compatibili con il nuovo tipo di colonna, quindi puoi fare clic su per procedere.

Finestra di dialogo Sì/No per la modifica del tipo di colonna.

  1. Il database AppSheet tenta quindi di abbinare le righe corrispondenti nella tabella Proprietari ai nomi nella tabella Attività. Poiché questo set di dati corrisponde, il database AppSheet dovrebbe compilare la colonna Proprietario con i riferimenti corretti alle righe Proprietari.

Tabella delle attività nell'editor ASDB che mostra il valore corretto della colonna Proprietario.

  1. Per testare il riferimento, fai clic su una cella Proprietario e aggiornala con un altro proprietario, ad esempio Sarah.

Selezionare un altro proprietario tramite un popup fornito dal riferimento.

Una volta selezionato, il nuovo valore (Sarah) viene visualizzato nella cella Proprietario (nella tabella Attività).

Dopo aver selezionato un proprietario diverso, il nome del proprietario, Sarah,  viene visualizzato nella colonna Proprietario della tabella Attività.

Modifica la colonna Etichetta della tabella di riferimento

Il database AppSheet ti consente di selezionare una colonna di etichette per qualsiasi tabella. In questo modo puoi specificare quale colonna vuoi che venga visualizzata in una tabella padre. Regola anche ciò che viene mostrato nella tabella principale in un'app frontend AppSheet collegata. Pertanto, anziché visualizzare la colonna Nome della tabella Proprietari nella tabella Attività (mostrata in precedenza), puoi visualizzare la colonna Email della tabella Proprietari.

  1. Per farlo, cambia Colonna di etichetta nella tabella Proprietari in Email passando il mouse sopra il lato destro dell'intestazione della colonna Email e facendo clic sull'elisione verticale.

Immagine che mostra i puntini di sospensione verticali sul lato destro dell'intestazione Colonna.

Viene visualizzato il menu contestuale della colonna.

Il menu contestuale della colonna con l'opzione "Usa la colonna come etichetta" selezionata.

  1. Seleziona Usa la colonna come etichetta nel menu contestuale per impostare l'etichetta della colonna sulla colonna Email.

Intestazione della colonna Email con l'indicatore di etichetta colonna in alto a sinistra dell'intestazione.

  1. Per vedere che la colonna Email è selezionata come etichetta di colonna che fa riferimento alla tabella Tasks, fai clic sulla scheda della tabella Attività e nota che ora nella colonna Proprietario vengono visualizzati gli indirizzi email. Per visualizzare la colonna Proprietario aggiornata, potrebbe essere necessario aggiornare il browser.

La colonna Proprietario della tabella Tasks che mostra gli indirizzi email da quando la colonna Email della tabella Proprietari referenziati è stata impostata come etichetta di colonna.

4. Generare un'app AppSheet da un database AppSheet

Una volta completate le personalizzazioni del database, puoi generare un'app AppSheet direttamente dal database. Ciò è utile se vuoi una UI frontend personalizzata, devi aggiungere automazioni o filtri di sicurezza e così via. Per farlo, segui questi passaggi:

  1. Fai clic su App sul lato destro dell'editor ASDB.

Screenshot dell'editor di database di AppSheet con il pulsante "App" evidenziato a destra.

Viene visualizzato il menu contestuale a destra per generare una nuova app.

Stesso screenshot di prima, ma con la finestra di dialogo con il pulsante "Nuova app AppSheet".

  1. Fai clic su Nuova app AppSheet per generare una nuova app.

Screenshot dell'app AppSheet generata.

Quando l'app viene generata, noterai che ha un avviso:

Column "Owner" in Tasks_Schema has a reference to an unknown table or slice "Owners". Open the column definition to select a source table.

Questo perché l'app generata contiene solo la tabella Tasks e la relativa colonna Proprietario contiene un riferimento a una tabella sconosciuta, Proprietari.

Per risolvere il problema, aggiungi la tabella Proprietari all'app AppSheet.

  1. Nella pagina Dati dell'editor di AppSheet, fai clic su +.

Pagina dei dati con l'icona "+" evidenziata.

  1. Nel menu contestuale Aggiungi dati, seleziona Database AppSheet come origine dati.

Menu contestuale Aggiungi dati.

  1. Quindi seleziona il database ASDB: IO Codelab (o il nome che hai assegnato al database nei passaggi precedenti).

Seleziona l'opzione di menu del database.

  1. Nella finestra di dialogo successiva, seleziona la casella di controllo predefinita SELEZIONA TUTTO e poi fai clic su Aggiungi all'app.

Finestra di dialogo per selezionare la tabella Proprietari da aggiungere all'app AppSheet.

Quando la tabella Proprietari viene aggiunta all'app, l'errore Riferimento non viene più visualizzato.

Screenshot dell'app AppSheet senza errori di riferimento.

  1. Ora che è stata aggiunta la nuova tabella Proprietari di AppSheet, puoi creare una nuova vista per visualizzare questi dati facendo clic sulla pagina Visualizzazioni in AppSheet e facendo clic su + accanto a NAVIGAZIONE PRINCIPALE.

La pagina Visualizzazioni con l'icona "+" evidenziata.

  1. Nella finestra di dialogo Aggiungi una nuova visualizzazione, fai clic su Crea una nuova visualizzazione.

Aggiungi una nuova finestra di dialogo Visualizza.

  1. Quando viene creata la nuova visualizzazione, imposta le seguenti opzioni:

Nome della visualizzazione: Proprietari Per questi dati: Proprietari Tipo di visualizzazione: deck

Visualizza la pagina di modifica per la visualizzazione Proprietari.

Congratulazioni, la tua app è stata completata.

  1. Per testare il riferimento tra Tasks e Proprietari, fai clic sulla visualizzazione Proprietari o Attività nell'anteprima per dispositivi mobili, poi seleziona un record per vedere i relativi record (riferiti).

Screenshot dell'app AppSheet con l'anteprima mobile evidenziata a destra.

Ad esempio, puoi fare clic sulla visualizzazione Proprietari e poi su un record per visualizzarne in dettaglio i record Attività correlati.

Immagine che mostra la selezione di un proprietario e la visualizzazione in dettaglio di un'attività correlata.

5. Modifica il database e rigenera la tabella Attività

Ora che hai creato un database AppSheet e generato una nuova app da esso, prova a modificare una tabella nel database. Modifica il tipo di dati di una colonna e osserva cosa succede nell'app AppSheet collegata.

  1. Nella tabella Tasks del database, modifica il tipo della colonna Data di consegna in Data e ora > Data.

Modifica del tipo della colonna Data di scadenza della tabella Attività in Data nell'editor ASDB.

Quando torni all'app AppSheet, viene rilevato che il database è stato aggiornato con un avviso:

App Schema for table 'Tasks' is out of sync with the schema in AppSheet database. Please regenerate the table structure

L'editor di AppSheet rileva una modifica dello schema nel database e fornisce un avviso.

  1. Per rigenerare, fai clic sull'icona d1a956498c05d75f.png rigenera nell'angolo in alto a destra.
  2. Viene visualizzata una finestra di dialogo di avviso:

Finestra di dialogo di avviso sulla rigenerazione.

  1. Fai clic su Rigenera per continuare. In questo modo, il tipo della colonna Data di consegna nell'app viene aggiornato in modo da essere di tipo Data e viene attivato l'elemento di input del selettore della data nel modulo Modifica per i record delle attività.

Modulo di modifica dell'app AppSheet che mostra l'elemento di input DatePicker.

6. Complimenti

Hai completato il codelab del database AppSheet (ASDB).

Letture aggiuntive