GSP910

Présentation

L'objectif de cet atelier est d'apprendre à connecter et à configurer des données provenant de plusieurs sources pour votre application à l'aide d'AppSheet.

Dans cet atelier, vous allez utiliser AppSheet pour améliorer une application de base en y ajoutant des fonctionnalités à l'aide de données provenant de plusieurs sources. Dans l'éditeur AppSheet, vous allez configurer le type de données utilisé dans l'application et créer une relation entre les sources de données ou les tables afin d’ajouter des fonctionnalités supplémentaires à votre application.

Objectifs

Dans cet atelier, vous allez apprendre à effectuer les tâches suivantes :

• Utiliser l'UI d'AppSheet pour configurer une application à l'aide de données provenant de plusieurs sources
• Ajouter une deuxième source de données à l'application à l'aide d'une autre feuille de calcul Google Sheets
• Configurer les types des données des tables utilisées dans l'application
• Créer une relation entre les tables existantes et nouvelles
• Vérifier que des données qui viennent d'être ajoutées et modifiées sont présentes dans la feuille de calcul Google Sheets sous-jacente

Préparation

Avant de cliquer sur le bouton "Démarrer l'atelier"

Lisez ces instructions. Les ateliers sont minutés, et vous ne pouvez pas les mettre en pause. Le minuteur, qui démarre lorsque vous cliquez sur Démarrer l'atelier, indique combien de temps les ressources de l'atelier resteront accessibles.

Cet atelier pratique vous permet de suivre les activités dans un véritable environnement cloud, et non dans un environnement de simulation ou de démonstration. Des identifiants temporaires vous sont fournis pour vous permettre de vous connecter à AppSheet le temps de l'atelier.

Ce dont vous avez besoin

Pour réaliser cet atelier, vous devez :

• avoir accès à un navigateur Internet standard (nous vous recommandons d'utiliser Chrome) ;
• disposer de suffisamment de temps pour effectuer l'atelier en une fois.

Démarrer votre atelier et vous connecter à AppSheet

1. Lorsque vous êtes prêt, cliquez sur Démarrer l'atelier.

   Le volet "Détails concernant l'atelier" s'affiche avec les identifiants temporaires que vous devez utiliser pour vous connecter à AppSheet pour cet atelier.

   Si l'atelier est payant, une boîte de dialogue s'affiche pour vous permettre de sélectionner un mode de paiement.

   Remarque : Si vous utilisez d'autres identifiants, des messages d'erreur s'afficheront ou des frais seront appliqués.

2. Cliquez sur Ouvrir AppSheet.

   L'atelier lance les ressources, puis ouvre la page "Se connecter" dans un nouvel onglet.

   Conseil : Réorganisez les onglets dans des fenêtres distinctes, placées côte à côte.

3. Connectez-vous avec Google.

4. Si nécessaire, copiez le nom d'utilisateur ci-dessous et collez-le dans la boîte de dialogue Se connecter.

   {{{user_0.username | "Username"}}}

5. Cliquez sur Suivant.

6. Copiez le mot de passe ci-dessous et collez-le dans la boîte de dialogue Bienvenue.

   {{{user_0.password | "Password"}}}

7. Cliquez sur Suivant.

8. Cliquez sur J'ai compris pour accepter les conditions.

9. Cliquez sur Continuer pour accepter les règles et les conditions d'utilisation de Google AppSheet.

10. Sur la page d'autorisation d'AppSheet, cliquez sur Autoriser. AppSheet peut ainsi accéder aux dossiers Google Drive associés à votre compte Google Cloud Skills Boost.

11. Vous êtes maintenant connecté à AppSheet.

    Si nécessaire, fermez la boîte de dialogue Mieux vous connaître pour faire de meilleures recommandations pour afficher la page "Mes applications" d'AppSheet.

    La page est vide, car vous n'avez encore aucune application.

Tâche 1 : Copier l'application

Lorsque vous travaillez sur votre propre application ou celle de votre entreprise, vous la développez généralement de façon incrémentielle, en l’améliorant tout au long du projet.

Pour continuer à développer l'application dans cet environnement d'atelier, vous devez d'abord copier l'application créée dans l'atelier précédent.

Copier l'application dans votre compte AppSheet

1. Ouvrez le lien dans un autre onglet de navigateur pour copier l'application Contacts clients dans votre compte AppSheet : Application Contacts clients.

2. Cliquez sur Copier l'application dans le volet de gauche.

3. Dans le formulaire Copier l'application, spécifiez les paramètres suivants et conservez les valeurs par défaut pour les autres champs :

   Nom de l'application

   Contacts client

4. Cliquez sur Copier l'application.

   Vous pouvez également accéder à l'application depuis la page Mes applications de l'UI AppSheet, sous Applications.

Votre application est configurée avec la source de données de contacts d'origine. Vous pouvez maintenant continuer à développer ses fonctionnalités.

Cliquez sur Vérifier ma progression pour valider l'objectif. Créer l'application

Tâche 2 : Configurer votre application avec une deuxième source de données

Notre application Contacts client utilise actuellement une feuille de calcul Google Sheets contenant des exemples de coordonnées.

Dans cette tâche, vous allez ajouter à l'application une deuxième feuille de calcul Google Sheets contenant des informations sur les entreprises.

Sélectionner des données pour votre application

AppSheet appelle tables les fichiers de données utilisés dans votre application. Une table est une description des lignes et des colonnes de votre feuille de calcul. Bien que toutes les données soient stockées dans votre feuille de calcul, cette description fait partie de la définition de votre application.

Ajouter une table est souvent l’une des premières étapes quand vous créez une application.

Pour ajouter des tables après avoir créé votre application, procédez comme suit :

1. Copiez le lien ci-dessous et collez-le dans un nouvel onglet du navigateur : Copie de entreprises.

2. Cliquez sur Créer une copie pour créer une copie de la feuille de calcul dans votre dossier Google Drive.

3. Dans l'angle supérieur gauche de la feuille, cliquez n'importe où dans le nom de fichier et remplacez-le par entreprises.

   

4. Accédez à drive.google.com pour vérifier que le fichier a bien été enregistré dans votre dossier Mon Drive.

   

5. Dans l'UI Contacts client - AppSheet, utilisez la barre de navigation de gauche et accédez à Données > Contacts

   

6. Pour ajouter une deuxième source de données à votre application, cliquez sur Ajouter des données (+) à côté de Données.

7. Dans le formulaire Ajouter des données, sélectionnez Google Sheets.

8. Dans le sélecteur de fichiers, sélectionnez la feuille entreprises que vous avez importée à l'étape précédente, puis cliquez sur Sélectionner.

9. Dans le formulaire Créer une nouvelle table, conservez les paramètres par défaut et cliquez sur Ajouter une table.

   Les paramètres de cette boîte de dialogue vous permettent de sélectionner une feuille de calcul spécifique ou un autre type de source de données, , et de décider si les utilisateurs de l’application peuvent ou non modifier ces données.

   Remarque : L'éditeur AppSheet ne reconnaît qu'une seule table par feuille de calcul. Si vous avez plusieurs tables dans la même feuille de calcul, vous devez déplacer les tables vers de nouveaux onglets du classeur ou de la feuille de calcul Google Sheets.

AppSheet ajoute la table entreprises à votre application. Cette table contient des informations sur différents exemples d'entreprises.

10. Prévisualisez les données de la nouvelle table à l'aide de la fonctionnalité en preview en direct de l'application dans AppSheet.

    

Cliquez sur Vérifier ma progression pour valider l'objectif. Configurer votre application avec une deuxième source de données

Tâche 3 : Configurer la structure de données de votre application

Lorsqu'une source de données est ajoutée en tant que table à votre application, AppSheet lit chaque en-tête de colonne pour définir la structure des colonnes de l'application. Chaque colonne contenant des données doit avoir un en-tête dans la source de données.

Dans cette tâche, vous allez examiner et, si nécessaire, mettre à jour le type et les propriétés des colonnes (la structure par défaut) qu'AppSheet a déduits et définis pour l'application.

Mettre à jour la structure de la colonne pour : contacts

1. Dans le menu de navigation de gauche de l'éditeur AppSheet, sélectionnez Données.

2. Pour examiner la structure des colonnes de la table contacts, cliquez sur contacts.

   

La table ci-dessous présente les colonnes et certaines de leurs propriétés telles qu'elles ont été déduites par AppSheet.

3. Déterminez s’il est nécessaire de modifier le type ou d'autres propriétés de chaque colonne (faites défiler vers la droite dans l'éditeur AppSheet pour afficher toutes les propriétés).

   Nom	Type	Clé ?	Étiquette ?	Formule	Afficher ?	Modifiable ?	Obligatoire ?
   _RowNumber (colonne virtuelle générée par le système)	Nombre
   ID	Nombre	coché			coché	coché	coché
   Adresse e-mail	E-mail				coché	coché	coché
   Prénom	Nom				coché	coché	coché
   Nom	Nom				coché	coché
   Téléphone	Texte				coché	coché
   _ComputedName (colonne virtuelle générée par le système)	Nom		coché	CONCATENATE([First Name]," ",[Last Name])	coché

   Selon vous, quelles propriétés des colonnes ci-dessus doivent être mises à jour ?

   Cela dépend généralement des exigences de votre application. Dans cet atelier, les colonnes mises en évidence dans la table ci-dessus sont des candidats dont les propriétés doivent être modifiées.

4. Comme il s'agit d'une application de contacts, toutes les cellules de la colonne Prénom doivent contenir des données valides. La propriété Require? de cette colonne doit donc être cochée.

Notez qu'AppSheet a défini la propriété type de la colonne Téléphone sur texte.

Cela permet à la colonne de contenir une seule ligne de texte. Comme cette colonne est destinée à stocker un numéro de téléphone valide, modifiez le type en Téléphone à l'aide de la liste déroulante.

5. Cliquez sur ENREGISTRER pour enregistrer les modifications apportées à la configuration des colonnes.

Mettre à jour la structure de la colonne entreprises

Suivez la même procédure pour mettre à jour la structure des colonnes de la table entreprises, si nécessaire.

1. Pour réaliser cette étape, reportez-vous aux éléments mis en évidence dans la table ci-dessous pour mettre à jour les propriétés des colonnes :

   Nom	Type	Clé ?	Étiquette ?	Formule	Afficher ?	Modifiable ?	Obligatoire ?
   _RowNumber (colonne virtuelle générée par le système)	Nombre
   ID	Nombre	coché			coché	coché	coché
   Téléphone	Texte				coché	coché	coché
   Nom de l'entreprise	Nom				coché	coché	coché
   Secteur	Texte				coché	coché	coché
   Adresse de l'entreprise	Adresse				coché	coché	coché
   Informations de livraison	LongText		coché		coché	coché

2. Répétez l'étape précédente pour chacune des colonnes mise en évidence dans le tableau ci-dessus, à l'exception de la colonne Secteur, qui sera mise à jour à l'étape suivante.

AppSheet accepte le type Énuméré pour les colonnes. Les colonnes de ce type sont limitées à une ou plusieurs valeurs autorisées provenant d’une liste fixe. Dans cette étape, vous allez modifier la propriété type de la colonne Secteur pour utiliser le type Enum (valeur unique) ou EnumList (valeurs multiples).

1. Cliquez sur l'icône en forme de crayon à gauche de la colonne Secteur.

   

2. Dans le formulaire de détails de la colonne, indiquez les paramètres suivants et laissez les autres paramètres par défaut :

   Propriété	Valeur (saisir ou sélectionner)
   Type	Enum
   Détails du type Valeurs	Comptabilité Finance Santé Commerce Voyage et hôtellerie

3. Cliquez sur Ajouter pour chaque valeur enum à ajouter à la liste des valeurs autorisées.

   Remarque : À titre d'information uniquement
   L'option Autoriser d'autres valeurs permet aux utilisateurs de saisir la valeur de leur choix en plus des valeurs autorisées affichées dans la liste déroulante.
   L'option Suggérer d'autres valeurs permet à l'utilisateur de choisir plus facilement parmi les valeurs saisies précédemment et de s'assurer que toutes les entrées sont uniformes, évitant ainsi les fautes de frappe.
   En définissant le mode de saisie, vous pouvez choisir si les valeurs s'affichent sous forme de boutons disposés naturellement ou en pile verticale, ou sous forme de menu déroulant de cases d'option dans l'application.

4. Une fois que vous avez saisi toutes les valeurs, cliquez sur Terminé dans le formulaire.

5. Cliquez sur ENREGISTRER pour enregistrer les modifications de configuration de l'application.

Prévisualiser les changements dans l'application pour entreprises

Pour prévisualiser les modifications dans l'éditeur AppSheet, vous allez créer une vue pour les données entreprises.

1. Dans l'éditeur AppSheet, accédez à Application (), puis cliquez sur Vues ().

2. Pour ajouter une nouvelle vue à la navigation principale, cliquez sur +.

3. Dans la boîte de dialogue Ajouter une nouvelle vue, cliquez sur Créer une nouvelle vue Spécifiez les paramètres suivants et conservez les valeurs par défaut des autres paramètres :

   Propriété	Valeur (saisir ou sélectionner)
   Nom de la vue	entreprises
   Pour ces données	entreprises

4. Pour enregistrer la nouvelle vue, cliquez sur Enregistrer.

5. Prévisualisez la modification dans l'aperçu en direct de l'application :

• Sélectionnez la table entreprises puis sélectionnez l'une des fiches d'entreprise dans la vue.

• Sur la page d'informations de l'entreprise, cliquez sur l'icône en forme de crayon pour modifier la fiche de l'entreprise.

  

• Faites défiler le menu déroulant et sélectionnez la colonne Industry. Les valeurs enum s'affichent. Sélectionnez l'une des valeurs.

  

• Cliquez sur Enregistrer pour enregistrer les modifications apportées aux données.

Pour en savoir plus, consultez le document sur les types de données des colonnes.

Tâche 4 : Régénérer la structure de données de votre application

AppSheet lit les métadonnées des colonnes de votre source de données pour définir la structure des colonnes de l'application. Pour les feuilles de calcul, AppSheet extrait ces informations des en-têtes des colonnes. Chaque fois que vous modifiez les colonnes de la feuille de calcul, vous devez régénérer la structure des colonnes dans l'application. Sinon, AppSheet ne pourra pas localiser les colonnes pour lire et écrire des données et votre application cessera de fonctionner.

Dans cette tâche, vous allez régénérer la structure de données de votre application après avoir ajouté une colonne à la feuille de calcul sur Google Drive.

Ajouter une colonne à la feuille contacts

1. Ouvrez un onglet de navigateur et accédez à Google Drive. Si l’onglet est déjà ouvert, passez simplement à celui-ci.

2. Dans Google Drive, ouvrez le dossier appsheet/data en double-cliquant sur appsheet, puis sur data.

3. Ouvrez le dossier CustomerContacts-NNNNNNN.

   Remarque : Le nom réel du dossier contient des chiffres représentés par NNNNNNN.

4. Ouvrez la feuille contacts.

5. Ajoutez un nouvel en-tête de colonne dans la ligne 1, colonne F, avec la valeur Dernier contact.

   Nous allons utiliser cette nouvelle colonne pour stocker la date et l'heure du dernier contact avec la personne.

   

6. Passez à l'éditeur AppSheet dans votre navigateur et accédez à Données > Contacts

7. Cliquez sur Plus(trois points) dans le bloc Contacts, puis sélectionnez Régénérer le schéma.

8. Cliquez sur Régénérer pour confirmer.

   AppSheet régénère la structure des colonnes de la table contacts et synchronise à nouveau l'application dans l'aperçu en direct.

AppSheet déduit également le type de la nouvelle colonne, qui n'est pas forcément celui que vous souhaitez.

9. Dans la liste déroulante Type, remplacez le type de la colonne Dernier contact par Date/Heure.

10. Comme tous les contacts n’ont pas besoin d’avoir une valeur pour cette colonne, faites défiler les propriétés de la colonne vers la droite et vérifiez que la propriété Obligatoire ? n'est pas cochée. Si la case est cochée, cliquez dessus pour la décocher.

11. Cliquez sur ENREGISTRER pour enregistrer les modifications apportées à la configuration de l'application.

Prévisualiser la nouvelle colonne dans l'application

1. Dans l'aperçu en direct, sélectionnez l'un des contacts de la liste.

2. Cliquez sur l'icône en forme de crayon pour modifier le contact.

3. Faites défiler la page jusqu'en bas et cliquez sur l'icône en forme de calendrier pour définir la valeur du champ Dernier contact pour le contact.

4. Cliquez sur Enregistrer dans l'aperçu de l'application pour enregistrer les données de ce contact.

5. Affichez la feuille contacts sur Google Drive pour vérifier que le contact qui a été mis à jour via l'application reflète la valeur mise à jour dans la colonne Dernier contact.

Cliquez sur Vérifier ma progression pour valider l'objectif. Regénérer la structure de données de votre application

Tâche 5 : Créer des relations entre les tables

Les contacts de la feuille contacts travaillent probablement dans les entreprises dont les informations sont stockées dans la feuille entreprises.

Cela implique qu'il existe une relation entre les deux tables. AppSheet vous permet de définir les relations entre les lignes de tables associées à l'aide d'un type de colonne spécial appelé Ref.

Dans cette tâche, vous allez utiliser le type de colonne Ref pour définir la relation entre les lignes des deux tables.

Consultez le document AppSheet pour en savoir plus sur le type de colonne Ref.

Configurer la colonne de référence dans la feuille contacts

1. Dans la feuille contacts sur Google Drive, ajoutez un en-tête de colonne dans la ligne 1, colonne G, avec la valeur ID d'entreprise.

   Cette nouvelle colonne servira à stocker l'ID d'entreprise à laquelle le contact est associé.

   

2. Passez à l'éditeur AppSheet dans votre navigateur et accédez à Données > Contacts

3. Cliquez sur Plus(trois points) dans le bloc Contacts, puis sélectionnez Régénérer le schéma.

4. Cliquez sur Régénérer pour confirmer. AppSheet régénère la structure des colonnes de la table contacts et ajoute la nouvelle colonne ID d'entreprise à la liste des colonnes.

5. Cliquez sur l'icône en forme de crayon à gauche de la colonne ID d'entreprise pour modifier ses propriétés.

6. Dans le formulaire de détails de la colonne, indiquez les paramètres suivants et laissez les autres paramètres par défaut :

   Propriété	Valeur (saisir ou sélectionner)
   Type	Ref
   Tableau source	entreprises

   Cela change le type de la colonne pour en faire une référence à la table entreprises.

   Lorsque des contacts sont ajoutés ou mis à jour dans l'application pour inclure l'entreprise qui leur est associée, AppSheet stocke automatiquement l'ID d'entreprise dans cette colonne de la feuille contacts.

7. Comme la valeur affichée dans l'application pour cette colonne est le nom réel de l'entreprise, vous devez modifier le nom d'affichage la colonne. Pour ce faire, faites défiler le même formulaire et développez la section Affichage. Cliquez ensuite sur l'icône de l'assistant d'expression dans le champ Nom à afficher.

8. Dans le formulaire Assistant d'expression pour Expression nom à afficher pour la colonne ID d'entreprise (Texte), saisissez Entreprise.

9. Cliquez sur Enregistrer dans le formulaire de l'assistant d'expression.

10. Cliquez sur Terminé pour enregistrer les modifications apportées aux propriétés de la colonne.

11. Enfin, cliquez sur Enregistrer dans l'éditeur AppSheet pour enregistrer les modifications et actualiser l'application dans l'aperçu en direct.

Afficher un aperçu de la colonne Entreprise dans l'application.

1. Dans l'aperçu en direct, sélectionnez l'un des contacts de la liste contacts.

2. Cliquez sur l'icône en forme de crayon pour modifier le contact.

3. Faites défiler la page jusqu'en bas et sélectionnez une entreprise dans la liste déroulante. AppSheet a automatiquement rempli la liste à partir de la table entreprises.

4. Cliquez sur Enregistrer dans l'aperçu de l'application pour enregistrer les données de ce contact.

5. Affichez la feuille contacts sur Google Drive pour vérifier que le contact qui a été mis à jour via l'application contient l'ID d'entreprise sélectionnée.

Cliquez sur Vérifier ma progression pour valider l'objectif. Créer des relations entre les tables

Félicitations !

Vous avez configuré les données de plusieurs sources de données pour votre application à l'aide d'AppSheet.

Dans cet atelier, vous avez appris à effectuer les tâches suivantes :

• Utiliser l'UI d'AppSheet pour configurer une application à l'aide de données provenant de plusieurs sources
• Ajouter une deuxième source de données à l'application à l'aide d'une autre feuille de calcul Google Sheets
• Configurer les types des données des tables utilisées dans l'application
• Créer une relation entre les tables existantes et nouvelles
• Vérifier que des données qui viennent d'être ajoutées et modifiées sont présentes dans la feuille de calcul Google Sheets sous-jacente

Étapes suivantes et informations supplémentaires

• Consultez l'atelier Implémenter l'expérience utilisateur pour votre application AppSheet et les autres ateliers du cours Créer des applications sans code avec AppSheet.
• Centre de formation Google Workspace

Formations et certifications Google Cloud

Les formations et certifications Google Cloud vous aident à tirer pleinement parti des technologies Google Cloud. Nos cours portent sur les compétences techniques et les bonnes pratiques à suivre pour être rapidement opérationnel et poursuivre votre apprentissage. Nous proposons des formations pour tous les niveaux, à la demande, en salle et à distance, pour nous adapter aux emplois du temps de chacun. Les certifications vous permettent de valider et de démontrer vos compétences et votre expérience en matière de technologies Google Cloud.

Dernière mise à jour du manuel : 30 octobre 2024

Dernier test de l'atelier : 30 octobre 2024

Copyright 2026 Google LLC. Tous droits réservés. Google et le logo Google sont des marques de Google LLC. Tous les autres noms d'entreprises et de produits peuvent être des marques des entreprises auxquelles ils sont associés.