Comment créer une application sans code

1. Bienvenue au cours: Aujourd'hui, il n'est plus nécessaire d'être programmeur pour créer une application. Sans outils de code, n'importe qui peut créer des logiciels plus rapidement que jamais. Mais si vous essayez de créer rapidement un logiciel fonctionnel utile, peut être difficile de savoir par où commencer. Dans ce cours, je vais vous présenter un projet simple qui couvre tous les principes fondamentaux de la création de logiciels d' entreprise performants. Que vous soyez entrepreneur, indépendant ou propriétaire d'entreprise souhaitant rationaliser vos opérations, je vous guiderai étape par étape sur la meilleure façon d' aborder votre projet Dans ce cours, je vais aborder les principes fondamentaux du non-code. Comment planifier et structurer votre application avec des données commerciales réelles, comment concevoir une interface professionnelle, comment automatiser les flux de travail, déclencher des actions basées sur l'IA et intégrer des outils externes, et enfin, comment publier et partager votre application avec votre équipe ou vos clients en quelques minutes. Nous n'allons pas simplement aborder la théorie dans ce cours. Vous allez jeter les bases d' une application professionnelle fonctionnelle à partir de zéro. Vous verrez chaque étape en action, de la planification à la publication, afin que vous puissiez appliquer la même approche à vos propres projets. Aucune compétence technique n'est requise pour ce cours, juste une volonté d' apprendre et de rester impliqué. Je te verrai dans le cours. 2. Qu'est-ce que le développement d'applications sans code ?: logiciels sont omniprésents, des systèmes de gestion du trafic aux appareils médicaux en passant par votre banque. Lorsque les humains veulent faire quelque chose de plus efficace, nous essayons généralement de créer un outil avec des ordinateurs pour nous aider. Mais comment créer un logiciel si vous ne l'avez jamais fait auparavant ? Eh bien, dans cette vidéo, je vais vous donner un aperçu du développement sans code, un moyen puissant de créer de nouveaux logiciels sans expérience en ingénierie ou en conception. Maintenant, si vous ne connaissez pas encore de code, vous pouvez passer directement à la vidéo suivante où nous allons passer en revue un build ensemble. Tous les logiciels ne sont en réalité que des couches d'instructions, chacune s'appuyant sur les précédentes pour créer des systèmes fonctionnels complexes. Au niveau le plus bas, vous avez les instructions au niveau de la machine, qui sont les pièces brutes qui font fonctionner le matériel. Aujourd'hui, les développeurs utilisent généralement des langages de programmation de haut niveau pour écrire des logiciels. Ces langages fournissent une manière plus lisible par l'homme d'instruire l'ordinateur. Vous pourriez donc penser que programmer signifie donc utiliser du code pour créer des logiciels. Mais en réalité, à la base, la programmation consiste simplement à donner des instructions à un ordinateur. Peu importe la façon dont vous donnez ces instructions. Imaginons, par exemple, que vous avez un thermostat. Cela comporte des fonctionnalités, mais ne fait rien si vous ne le programmez pas. Vous devez dire quand il s' allumera et quand il se déclenchera. Mais bien entendu, il s'agit d'un exemple très simple. Ce n'est pas vraiment de la programmation. Il ne s'agit que de donner une instruction. On ne peut pas construire de nouvelles choses avec les commandes d'un thermostat. Les outils de développement visuel ou les logiciels sans code vous offrent une interface utilisateur dans laquelle vous pouvez programmer de nouveaux logiciels sans avoir à vous soucier des subtilités de la programmation basée sur le texte Maintenant, il y a des avantages et des inconvénients à chaque façon de créer un logiciel. programmation textuelle traditionnelle offre un contrôle illimité sur ce que vous essayez de créer, mais il faut généralement beaucoup de temps pour apprendre et même beaucoup de temps pour créer de petites applications simples autre côté, les outils utilisant peu ou pas de code font abstraction d'une grande partie des décisions de bas niveau que les développeurs traditionnels doivent prendre, vous accélère considérablement et vous permet de vous concentrer sur ce que vous voulez que le logiciel fasse Désormais, toutes les plateformes de développement NOC doivent prendre des décisions lors de leur conception quant aux parties du processus de développement qu'elles vous permettront contrôler et aux parties qu' elles géreront automatiquement pour vous Maintenant, en raison de cet équilibre entre puissance et facilité, différentes plateformes sans code abordent cela de manière assez différente. Certains sont très complexes et difficiles à apprendre, mais ils sont incroyablement flexibles. Et puis, à l'autre bout du spectre, d'autres sont très simples, faciles à apprendre, mais ne vous permettent créer que certains types de fonctionnalités. Et bien sûr, il y en a beaucoup entre les deux. Dans ce cours, nous allons utiliser Glide, une plateforme de création d'applications Web qui combine un mode de gestion de votre back-end semblable à une feuille de calcul avec une interface de programmation visuelle pour la mise en page et 3. Définir le problème: Donc, avant de commencer à développer quoi que ce soit, nous devons d'abord décider quel problème nous allons résoudre. Que vous développiez pour un client ou quelque chose pour vous-même ou pour votre entreprise, il est vraiment essentiel de commencer par comprendre pourquoi vous essayez de créer cette solution et tous les aspects de ce problème. Dans ce cours, nous allons donc travailler avec un client fictif afin concentrer nos efforts sur des besoins spécifiques. Cette personne a besoin d'un tableau de bord pour ses opérations d'inventaire. Aujourd'hui, les tableaux de bord et les portails font partie des types d' applications les plus courants dont les entreprises ont besoin Il peut prendre de nombreuses formes différentes, mais dans l'ensemble, un tableau de bord est un outil interne qui affiche des informations telles que des rapports financiers, administratifs, des KPI, etc. Et un portail est un outil externe permettant aux clients, aux employés ou aux investisseurs d' accéder à des informations ou d'effectuer des tâches. Maintenant, si la création d'un tableau de bord ou d'un portail ne vous intéresse pas , ne vous inquiétez pas, car nous avons choisi ces exemples car ils contiennent de nombreuses fonctionnalités très courantes dont vous aurez probablement besoin dans l' application que vous créez. Il existe donc de nombreuses façons planifier votre projet, à fois en termes de ce que vous planifiez et de la façon dont vous le planifiez. Vous pourriez rédiger un document détaillé décrivant tous les domaines Vous pouvez faire un plan de tableau blanc délabré ou simplement prendre quelques notes sur une feuille de papier Cela dépend entièrement de vous, mais les éléments suivants sont des éléments très importants à prendre en compte si vous souhaitez un plan vraiment complet. Donc, tout d'abord, vous devez comprendre les fonctionnalités de haut niveau. En d'autres termes, vous devez déterminer approximativement ce que les utilisateurs peuvent voir et faire. Ensuite, vous devez définir les rôles des utilisateurs. Cela implique de déterminer les types d'utilisateurs qui participeront à votre projet et de déterminer approximativement ce qu'ils peuvent faire. Par exemple, y a-t-il des administrateurs ? Y a-t-il des éditeurs ou des invités, des choses comme ça ? La troisième étape consiste à concevoir la structure des données. C'est ici que nous établissons le type de structure et de hiérarchie des données ou les relations entre les différentes collections de données de votre projet. Par exemple, les tableaux principaux tels que les catégories d'inventaire , les utilisateurs, les commandes, etc. Et puis toutes les autres tables, comme les commentaires ou les statuts. Ensuite, nous devons cartographier nos expériences utilisateur. Vous devez donc détailler le type d'expériences utilisateur et de fonctionnalités spécifiques que vous pourriez souhaiter, comme téléchargement d'un article ou modification de l'inventaire Vous pouvez ensuite passer à la planification détaillée, par exemple en décrivant les flux de travail et les actions ou la navigation Vous pouvez le faire par le biais d'un cadre métallique, spécifications ou simplement de simples puces. Donc, pour rendre tout cela un peu plus concret, voyons comment nous ferions cela avec notre client fictif. Notre cliente fictive est donc Sarah Thompson, qui travaille pour Ascent EV Sarah supervise les opérations de la chaîne d'approvisionnement, et elle nous a envoyé ce brief Nous avons besoin d'une meilleure façon de gérer notre inventaire et nos audits. Nous utilisons actuellement Google Sheets, et nos agents de terrain doivent souvent appeler ou consulter des feuilles de calcul sur leur téléphone, ce qui est loin d'être idéal Nous avons déjà essayé d'utiliser un logiciel personnalisé, mais nos processus changent tellement que sommes tenus à des feuilles de calcul Nous avons besoin d'une application qui assure suivi des stocks en temps réel, des alertes en cas de rupture de stock et un processus de gestion des commandes rationalisé direction a également besoin de tableaux de bord de base avec des indicateurs clés pour nous aider à prendre de meilleures décisions Ainsi, avec un peu de réflexion et éventuellement une conversation avec le client, nous pouvons tirer des idées de haut niveau sur ce projet. Tout d'abord, les besoins et les problèmes du client incluent la gestion des stocks. Ils utilisent des méthodes obsolètes telles que Google Sheets, ce qui entraîne des surstocks ou des ruptures de stock Ils doivent gérer le traitement des commandes. Il y a donc actuellement des inefficiences ou des retards dus au suivi manuel Il existe potentiellement un problème de visibilité des données. Ils manquent de données en temps réel ou souhaitent prendre des décisions plus éclairées sur ces données. Et puis, bien sûr, ils ont des agents de terrain. Ils comptent vraiment sur les personnes sur le terrain, et ils se fient actuellement appels téléphoniques ou à la mise à jour de feuilles de calcul, ce qui est loin d'être idéal Nous pouvons donc ensuite réfléchir aux principales fonctionnalités de cette application. Nous allons avoir besoin d'un tableau de bord, qui indique le type de ventes totales ou valeurs boursières ou tout autre type de KPI qu'ils souhaitent voir au plus haut niveau Nous allons avoir besoin d'une page sur la gestion des stocks, qui ne se limite pas à des listes d'inventaire détaillées, mais qui leur permet également de se réapprovisionner et peut-être de recevoir des alertes en cas de pénurie. Et puis vous aurez également besoin de quelque chose sur la gestion des commandes. agit donc du suivi des commandes auprès des clients Il s'agit donc du suivi des commandes auprès des clients, de leur statut et de tout autre détail dont ils ont besoin. Donc, évidemment, dans cette vidéo, je les ai mis sous forme de points assez simples et clairs parce que j'y ai en quelque sorte réfléchi avant de faire la vidéo. Pour vous, vous allez réfléchir et noter des éléments , puis les organiser selon un ensemble d'exigences premier temps, il est très important capturer tout ce qui est important pour le projet. Une chose à laquelle vous pensez et qui ne vous inquiétez pas trop à l'idée de l'inscrire immédiatement dans une spécification formelle. Voici donc un exemple de la façon dont cela pourrait fonctionner dans votre processus. Tout d'abord, vous pourriez avoir un tas de notes autocollantes comme celui-ci avec de nombreuses idées différentes, puis vous pourriez formaliser cela sous forme de tableaux, écrans, de fonctionnalités, etc. Ici, nous utilisons FIG Jam, un outil vraiment cool pour le tableau blanc et le brainstorming Mais vous pouvez utiliser tout ce que vous voulez, tout ce qui vous aide à réfléchir en profondeur à ce projet. Et vous pouvez voir ici que nous avons choisi nos quatre tables. Parlons-en donc dans la prochaine leçon sur la conception de structures de données. 4. Modélisation de données: Glide est une plateforme de conception logicielle très axée sur les données, mais qu'entendons-nous par conception axée sur les données Eh bien, comme nous l'avons vu dans la première vidéo, logiciels reposent sur de nombreuses couches de technologies, jusqu'aux uns et aux zéros du code machine Bien qu'il s'agisse techniquement de données, lorsque nous parlons de données, ce que nous voulons vraiment dire, ce sont les données spécifiques à votre application, c'est-à-dire les informations qui apparaissent dans l'interface utilisateur et qui répondent aux actions des utilisateurs. Glide, il y a trois zones. La création commence par l'enregistrement de vos données dans l'éditeur de données. Vous devez ensuite concevoir votre mise en page dans l'éditeur de mise en page et mapper ces données aux composants. Enfin, si nécessaire, vous pouvez créer des actions et des intégrations par dessus Maintenant, naturellement, pendant que vous construisez, vous allez faire des allers-retours entre ces étapes. Mais avant de commencer à créer, il est très important de mettre de l' ordre dans votre structure de données. Donc, si vous venez du monde des feuilles de calcul, vous êtes peut-être habitué à organiser vos données très librement Mais le glide est un peu différent de cela. Glide fonctionne un peu plus comme une base de données où vos données doivent être soigneusement structurées en lignes et en colonnes, chaque colonne ayant un en-tête Maintenant, si vous créez vos tableaux à partir zéro dans Glide, cela ne devrait pas poser de problème, mais si vous supprimez vos données d'une feuille Google Sheet existante, vous devrez peut-être envisager restructurer un peu ces données Nous voulons donc organiser nos données de manière très intelligente . Nous n'allons pas simplement créer une immense table avec 1 million de colonnes, et nous ne voulons pas non plus créer 1 million de tables pour tout ce à quoi nous pouvons penser. Lorsque vous commencez à créer, vous souhaitez disposer de quelques tables différentes qui décrivent les principales parties de votre processus. Vous pourrez toujours ajouter de nouvelles tables ultérieurement. Revenons donc à notre plan pendant une seconde. Maintenant, je sais déjà de combien de tables cette application aura besoin, car j'ai déjà créé des applications. Je sais qu'il va avoir besoin d'articles en stock, commandes, de fournisseurs et de personnel. Mais si vous débutez, vous aurez peut-être ce genre de brainstorming à propos des écrans, des fonctionnalités, des actions, des données, des lignes et des propriétés Oh, bien plus encore. Il se peut donc que les tables dont vous avez besoin ne soient pas encore claires. Donc, si vous vous sentez comme ça, il est très important de vous concentrer dès le début sur ce qui est le plus essentiel. Vous pouvez, bien sûr, créer beaucoup de choses très rapidement sans code, mais au début de ce projet, limitez-vous à un maximum de trois à cinq tables de données, et pas plus que cela. Alors que vous y réfléchissez, par souci de simplification, essayez de réfléchir à trois questions clés. Premièrement, quels sont vraiment les objets ou types d'objets principaux ou les plus importants de votre application ? Ici, nous ne parlons pas de fonctionnalités ou d'écrans. Pensez simplement aux catégories de données qui sous-tendent tout, comme les personnes, projets, les commandes, les clients, les rendez-vous ou les fournisseurs, etc. Chacun de ces éléments pourrait avoir une table dédiée avec des lignes de données. Deuxièmement, ces objets peuvent-ils être combinés en une seule catégorie ou certains peuvent-ils appartenir à d'autres ? Par exemple, un article en stock possède un prix, un SKU, un nom, une description, niveau de stock et potentiellement de nombreuses autres propriétés. Par conséquent, un article d'inventaire a clairement besoin de son propre tableau car il comporte de nombreuses colonnes différentes, mais un manuel d'instructions sera probablement simplement une propriété d'un article d'inventaire plutôt qu'un tableau distinct complet. Troisièmement, cet article a-t-il besoin de sa propre table ou peut-il être construit sur une table existante ? Ainsi, par exemple, le simple fait que vous souhaitiez un écran pour une fonction spécifique telle que l' ajout d'articles en stock ne signifie pas que vous avez besoin d'un tableau séparé. Par exemple, l'écran d'ajout d'inventaire peut utiliser le tableau d'inventaire existant plutôt que de demander un nouveau tableau. En posant ces questions, vous pourrez, espérons-le votre énorme remue-méninges de notes dans les tableaux les plus essentiels, ce qui rendra votre structure de données beaucoup plus claire et plus facile À présent, avant d'ajouter vos données, vous devez démarrer un projet vierge dans Glide Vous pouvez en fait demander à Glide de créer une application par défaut basée sur votre structure de données existante, mais comme nous apprenons des choses à partir de zéro, nous allons choisir un projet vierge et diriger vers l'éditeur de données une fois qu'il sera créé Désormais, si vos données existent déjà ailleurs et que vous souhaitez les synchroniser avec Glide, vous pouvez ajouter une nouvelle table dans l'éditeur de données et sélectionner votre source de données Vous pourrez voir les tableaux apparaître sur la gauche ici et vous pourrez désormais modifier vos données dans Glide, et les modifications que vous apportez dans Glide seront synchronisées et vice versa Vous pouvez également exporter vos données depuis cette source de données, les télécharger et les héberger dans une table glissante Maintenant, si vous créez votre application et vos données à partir de zéro, après avoir ajouté les colonnes dans vos tableaux, vous pouvez simplement ajouter quelques lignes de données afin de pouvoir travailler avec quelque chose. Ensuite, lorsque les utilisateurs commencent à utiliser l'application, ils peuvent commencer à renseigner ces données via les différents écrans que nous créons, et je vais vous montrer comment procéder dans la prochaine vidéo Nous y reviendrons maintenant, mais l'éditeur de données de Glide est incroyablement puissant et ajoute une toute nouvelle couche à vos données existantes Vous pouvez améliorer vos données grâce à de puissants calculs et travailler directement avec l'IA, sans formules ni codes complexes 5. Concevoir l'interface de l'application: Il est maintenant temps de créer la face avant de l'application, l' interface utilisateur ou l'interface utilisateur. C'est ce que les utilisateurs verront et utiliseront chaque fois qu'ils utiliseront l'application, et elle sera connectée directement à vos données, où qu'elles se trouvent, qu' elles soient en mode glissé ou qu'elles proviennent d' un autre endroit L'application que nous allons créer à partir de zéro dans ce cours est donc déjà un modèle entièrement intégré que vous pouvez copier gratuitement. Donc, si vous avez procédé à un cadrage ou à une cartographie des expériences utilisateur, le moment est venu de supprimer ces plans et de les utiliser au fur et à mesure que vous vous lancez dans l'éditeur de mise en page Maintenant, nous avons déjà nos tables. Glide ajoute automatiquement le tableau d'un utilisateur à toutes les nouvelles applications, et nous avons ajouté les trois autres ici Maintenant, dans mon plan, j'ai dit que je voulais commencer avec trois écrans principaux et ces sept fonctionnalités de base. Mais dans ce court cours, nous allons simplement aborder deux écrans et une fonctionnalité. Nous allons aborder l'écran d'inventaire. L'écran de commande puis l'alerte de rupture de stock. Le tableau de bord est un peu plus complexe et nécessite toutes les fonctionnalités que nous avons prévues ici et que FIG Jam doit d'abord être construit. Mais vous pouvez bien sûr explorer cela plus tard en examinant le modèle et en déconstruisant la façon dont il a été créé Pour ajouter un écran, nous cliquons ici. Vous pouvez créer des écrans blancs, écrans de formulaires et des écrans prédéfinis. Mais ce que nous allons faire, c'est créer un écran à partir de nos données. Nous allons donc cliquer sur notre tableau d'inventaire. Par défaut, Glide crée pour nous un écran avec un composant de collection dessus, et cette collection possède ce style ici Nous pouvons modifier différents styles ici et modifier les paramètres de cette collection. Désormais, chaque élément représente une ligne d' informations de notre tableau. Si nous cliquons sur l'un de ces éléments, nous pouvons voir la ligne entière représentée dans les composants visuels. Revenons à l'écran supérieur et ouvrons le panneau de données. Le panneau de données ressemble à un mini-éditeur de données. Et pendant que vous naviguez dans l'éditeur de mise en page, le panneau de données affiche toutes les données qui se trouvent derrière tout ce qui est actuellement sélectionné. Par exemple, si nous créons un nouvel écran à partir d'un autre tableau, par exemple le tableau des commandes, nous verrons, parce que nous avons sélectionné l'écran des commandes, toutes les données des commandes sont insérées et si nous modifions l'une des valeurs présentes dans l'onglet données, nous verrons cela se refléter dans l'interface utilisateur. Supprimons donc simplement cet écran et revenons à l'écran d'inventaire que nous venons de créer. Maintenant, la première ligne de notre tableau est affichée comme premier élément. Et si nous cliquons sur cet élément dans l'interface utilisateur, nous voyons l'ensemble de cette ligne représenté sous forme de composants. Chaque colonne de notre tableau est automatiquement mappée à un composant affiché à l'écran Aucune connexion manuelle de notre part n'est requise. Et c'est le schéma de base des glissades pour se faire une idée. Les collections affichent de nombreuses lignes de données, et un élément ou un écran détaillé affiche une ligne entière de notre tableau. Maintenant, si vous le souhaitez, vous pouvez mettre la vidéo en pause ici et jouer avec tout cela. Ajoutez de nombreux écrans, ajoutez et supprimez des composants, modifiez les données qu' ils affichent. Par exemple, tout peut être supprimé et vous pouvez simplement recommencer à zéro encore et encore. C'est vraiment important de s' amuser et de se sentir à l'aise ici. Ensuite, nous allons aborder l'édition et la suppression. Vous avez probablement vu dans mon plan ce mot Krud. Si vous ne le savez pas, Krud est un acronyme très utilisé dans le développement de logiciels Il signifie créer, lire, mettre à jour, supprimer Et il s'agit vraiment de l'ensemble de fonctionnalités le plus courant dont les logiciels ont besoin, en particulier les logiciels destinés aux entreprises. Et Glide, faisons-le dès la sortie de la boîte. Lorsqu'une collection est ajoutée à un tableau, ajout et la modification sont activés par défaut, mais vous pouvez les désactiver. Et, bien sûr, vous pouvez également autoriser les utilisateurs à supprimer. Et c'est ce qui fait la force ne pas coder sans pratiquement aucun effort : nous avons intégré nos données et nous pouvons envoyer et les publier à nos utilisateurs en quelques clics de plus. Maintenant, cet écran ne vous convient peut-être pas. Glide, bien sûr, vous donne des commandes pour personnaliser ce point de départ Alors allons-y maintenant. Nous avons donc affaire à un écran de haut niveau, un seul composant , une collection. Si nous cliquons sur cette collection, nous pouvons modifier les données affichées et plus de détails sur son style. Mais nous pouvons également ajouter d'autres composants à cet écran de haut niveau. Ajoutons un composant de titre, et nous le ferons glisser au-dessus de notre collection. Maintenant, le composant titre a plusieurs styles différents, et je vais choisir ce style de couverture. Par défaut, Glide mappe ce composant pour afficher certaines des données de la ligne supérieure de notre tableau C'est parce que l'écran sur lequel nous nous trouvons est construit au-dessus du tableau d'inventaire, mais ce n'est pas ce que nous voulons vraiment. Nous voulons saisir des valeurs personnalisées ici. valeurs et les types de valeurs sont un concept très important pour comprendre Glide, car vous cartographiez continuellement des valeurs à partir de vos données ou utilisez des valeurs personnalisées que vous entrez dans l'éditeur de mise en page Par exemple, ici, ce composant de titre affiche actuellement la ligne supérieure de notre tableau, et nous pouvons constater que les propriétés du titre, des sous-titres et de l'image ont été mappées aux données figurant dans cette Nous pouvons bien sûr remplacer les propriétés qu'il affiche par d'autres colonnes de cette ligne, mais nous ne voulons pas réellement qu'une valeur de colonne soit extraite de nos données ici. Nous voulons en fait une valeur personnalisée qui ne soit pas mappée à nos données Et pour cela, il vous suffit de le saisir dans le champ. Nous allons également supprimer le sous-titre et choisir une image de stock pour représenter cet écran Désormais, ce composant n'est pas mappé à une ligne de notre tableau, mais représente simplement ce que nous voulons afficher à cet endroit précis Maintenant, nous avons cette répétition des titres Je vais donc passer au composant collection et supprimer le titre afin que nous n'ayons que le titre de l' écran dans le composant titre. C'est vrai, c'est donc la base de notre écran de haut niveau. Notre écran publicitaire est en fait déjà configuré automatiquement pour nous par Glide, tout comme l'écran d'édition les écrans d'édition sont conçus avec des composants de saisie, permettant aux utilisateurs de saisir des données lorsqu' ils soumettent ces modifications, soit sous la forme d'une nouvelle ligne sur l'écran d'annonce, soit modifications apportées à une ligne existante sur l'écran d'édition Maintenant, vous pouvez bien sûr désactiver cette option globalement ou modifier les composants que les utilisateurs ont la possibilité de modifier. Il vous suffit de supprimer certains des composants cet écran certains des composants mappés aux colonnes que vous ne souhaitez pas que les utilisateurs modifient Ils pourront ensuite ajouter ou modifier des éléments, mais uniquement pour les colonnes que vous affichez dans cet écran. Lorsque vous cliquez sur un élément, vous accédez à l'écran de détail de cet élément. Les écrans de détail sont similaires aux écrans de haut niveau, sauf qu'ils montrent toujours le contexte d'une seule ligne. Par exemple, si nous rouvrions l'onglet de données ici, nous pourrions constater que si nous basculons entre les différents éléments, nous ne voyons qu'une seule ligne différente à chaque fois De plus, quoi que vous fassiez sur l'écran de détail d'un élément d'une collection s'appliquera à tous les autres éléments, écrans de détail de cette collection. Par exemple, si nous ajoutons un composant de notes à cet écran et que nous le mappons à la colonne de notes, nous verrons lorsque nous passerons aux autres éléments qu'ils reçoivent également un composant de notes mais mappés aux données de cette ligne Voici donc notre écran d'inventaire. Configurons rapidement l'écran de commande de la même manière. Nous ajouterons un nouvel écran, choisirons notre tableau des commandes et changerons la mise en page pour en faire un Cvan Nous allons approfondir les paramètres de collecte et les regrouper par statut. Nous pouvons désormais faire glisser nos commandes et modifier leur statut visuellement. Vous savez donc déjà comment personnaliser les écrans de détail ici, nous allons donc ignorer cela. Nous allons passer à nos deux fonctionnalités suivantes, qui sont des fonctionnalités assez simples, qui sont des fonctionnalités assez simples une liste des commandes en attente et un surlignage des stocks faibles. Créons donc un nouvel écran personnalisé pour le tableau de bord et ajoutons-y un composant de collection avec le style de tableau. Nous allons remplacer cette source de données par la table des commandes. Donc, ce que nous voulons montrer dans cette collection, ce sont vraiment tous les articles de commande dont le statut de commande est en attente. Ce dont nous avons besoin pour cette collection, c'est d'un filtre. Pour ce faire, nous allons passer aux options de ce composant et, dans la section des données de filtrage, nous ajouterons un nouveau filtre indiquant le statut de la commande en cours. Nous avons maintenant une collection qui nous montre toutes les commandes en attente. Nous pourrions, bien entendu, l'améliorer un peu. Choisissons un style plus compact et ajoutons le numéro de commande. Le client, la quantité et le montant de la commande. Et nous allons changer le titre de la collection pour qu' il soit « commandes en attente ». De plus, nous ne voulons pas que les utilisateurs puissent ajouter des articles ici. Nous voulons simplement que cette collection présente un ensemble spécifique de choses. Nous allons donc accéder à l'onglet Actions et désactiver l'ajout et la modification. Une autre façon de modifier ce qui apparaît dans votre interface utilisateur est de le faire d'abord dans l'éditeur de données pour créer essentiellement une colonne calculée dans l'éditeur de données qui change en fonction de certains critères. Ainsi, si le stock descend en dessous d'un certain niveau, une nouvelle valeur apparaîtra, que nous pourrons ensuite afficher dans l'éditeur de mise en page. Pour ce faire, nous allons utiliser la colonne if then else, qui examine les autres colonnes pour déterminer les valeurs qu'elle produit. Dans la première condition, nous dirons si stock actuel est inférieur ou égal à dix, puis nous produirons la valeur du stock faible. Et nous pouvons mettre un emoji ici, puis nous pouvons simplement laisser cette autre partie vide Maintenant, dans l'éditeur de mise en page, nous pouvons ajouter à la méta-propriété, et seuls les articles dont le stock est faible afficheront cette valeur. Voilà un aperçu de l'éditeur de mise en page. Nous avons beaucoup plus d'informations sur les différents composants dans notre documentation, et je vous encourage vivement à vous plonger dans le modèle final pour comprendre, explorer et explorer comment tout cela fonctionne réellement. Dans la vidéo suivante, nous allons voir comment nous pouvons commencer à étendre notre application grâce à la puissance des flux de travail et de l'intelligence artificielle 6. Étendre la puissance de votre appli grâce aux flux de travail, aux automatisations et à l’IA: Jusqu'à présent, nous avons abordé les données et la mise en page de notre application, mais la création d'un logiciel comporte une autre étape vraiment importante, à savoir création d'un logiciel comporte une autre étape vraiment importante, les actions qu'une application peut effectuer, il s'agisse d'envoyer un e-mail, avertir l'utilisateur par une notification ou même déclencher un flux de travail en arrière-plan sans que l'utilisateur soit impliqué En fait, il est très important de comprendre comment faire fonctionner votre application. Et pour cette application, nous allons nous concentrer sur fonctionnalités qui accélèrent réellement le processus de traitement des commandes pour notre client et éliminent le type de travail manuel pour l'équipe. L'application sur laquelle nous travaillons possède donc déjà de nombreuses fonctionnalités utiles qui sont simplement le résultat de la création de l'interface utilisateur. Nous avons créé, lu, mis à jour et supprimé les stocks et les commandes, et nous avons commencé à créer un tableau de bord de base contenant nos commandes en attente. Maintenant, lorsque vous parlez d'actions et de flux de travail, il est très important de diviser cette catégorie en deux domaines. Tout d'abord, il y a les actions qui se produisent lorsque les utilisateurs les initient, par exemple en appuyant sur un bouton ou en terminant une étape. Et puis il y a les flux de travail qui s'exécutent silencieusement en arrière-plan sans intervention de l'utilisateur Par exemple, les données peuvent être mises à jour tous les lundis à 9 h 00, ou un élément externe, tel qu'un e-mail, peut déclencher un événement mettant à jour quelque chose dans votre application. externe, tel qu'un e-mail, peut déclencher un événement mettant à jour quelque chose dans votre application Passons maintenant en revue quelques exemples pour vous donner une idée de ce qui est possible. Maintenant, vous avez peut-être déjà configuré certaines actions autonomes lors de l' ajout de composants Il s'agit d'actions ponctuelles. Lorsqu'un utilisateur interagit avec eux, ils ne font qu'une chose. Par exemple, nous avons ajouté ici un bloc de boutons contenant l'action e-mail et l' appel sur chaque bouton. Et lorsque nous cliquons sur chacune d'entre elles, cela déclenche automatiquement un e-mail ou un appel à notre client. Mais il ne s'agit que d'actions ponctuelles. L'éditeur de flux de travail vous permet de créer des flux de travail en plusieurs étapes pouvant effectuer une grande variété de tâches. Les flux de travail commencent par un déclencheur. Une fois le flux de travail déclenché, les étapes de ce flux de travail commencent à s'exécuter d'elles-mêmes. Ces flux de travail peuvent être déclenchés de différentes manières sans que l' utilisateur ne fasse quoi que ce soit. Les déclencheurs entrants tels que les e-mails et webhooks peuvent déclencher l'ensemble du processus. Revenons donc brièvement aux exigences initiales que notre client nous a données au début de ce cours. Ils ont indiqué qu' ils avaient besoin d'une application permettant de suivre leur inventaire en temps réel, de recevoir des alertes en cas de rupture de stock et d'un processus de gestion des commandes rationalisé. Aujourd'hui, l'application les aide déjà à rationaliser considérablement leurs flux de travail, mais nous pouvons les aider de plusieurs autres manières. Nous pouvons autoriser leurs clients à envoyer leurs commandes par e-mail et créer un flux de travail qui crée automatiquement une commande en fonction du contenu de cet e-mail. Nous pouvons également créer un flux de travail qui permet l'équipe interne de prendre des photos et télécharger son processus de formulaire papier, puis d'en extraire les données et de créer une nouvelle commande à partir de celui-ci. Nous allons passer en revue le premier exemple de ce cours, mais nous vous montrerons brièvement à la fin comment vous pouvez adapter à un scénario papier. Imaginons que notre client autorise ses clients à envoyer des e-mails à l'aide d'un formulaire de courrier électronique, et que les e-mails qu'ils reçoivent ressemblent à ceci. En réalité, il s'agit d'un exemple quelque peu simplifié , car les clients pourraient très probablement commander plusieurs unités de différentes pièces dans un seul e-mail. Mais dans le cadre de ce cours et comme c'est la première fois que vous jouez avec le flux de travail, nous allons rester simples et partir du principe que chaque client ne commandera qu'une seule pièce en particulier à la fois. Avant de créer notre flux de travail, dirigeons-nous vers l'éditeur de données pour voir où nos nouvelles lignes seront ajoutées. Il s'agit du tableau des commandes, qui est actuellement rempli manuellement par notre application lorsque les membres de l'équipe interne l'utilisent. Nous voulons que notre flux de travail ajoute l'e-mail du client, le nom du client, l'adresse du client, la pièce commandée, le nombre d'unités, le modèle du véhicule, la date de commande et le statut. Ce ne sont que des notes internes destinées à notre équipe, nous n'en avons donc pas besoin, et le reste sera automatiquement renseigné par notre application et les personnes qui l'utilisent. Nous allons maintenant faire en sorte que notre flux de travail extrait automatiquement ces données. Mais nous voulons également laisser une marge de surveillance humaine à ce sujet afin que quelqu'un puisse vérifier que la commande a été correctement créée. Nous ajouterons ici une nouvelle colonne appelée corps de l'e-mail, et c'est là que notre flux de travail copiera également l'intégralité du contenu de l'e-mail reçu, juste pour qu'un humain puisse le vérifier. Passons maintenant à l' éditeur de flux de travail et créons un nouveau flux de travail avec un e-mail comme déclencheur. Désormais, le flux de travail commence déjà par une action Ad R. Il s'agit de la valeur par défaut pour tous les nouveaux flux de travail, car il s'agit d'une opération très courante que vous souhaitez effectuer. Et nous pouvons déjà commencer à remplir les champs ici avec les valeurs provenant du déclencheur de l'e-mail Maintenant, si nous cliquons sur le menu ici et que nous allons sur le déclencheur, nous pouvons accéder à toutes les différentes propriétés associées à un e-mail lorsqu'il est reçu. Pour l' e-mail du client, nous voulons qu'il s' agisse de la valeur de l'e-mail d'origine. Pour le client, nous voulons la valeur du nom du formulaire. Pour la colonne du corps de l'e-mail, nous voulons un corps simple, et nous pouvons également ajouter la date et l'heure actuelles pour la date de commande. En gros, chaque fois que le flux de travail s'exécute, la date et l'heure d'exécution du flux de travail seront ajoutées ici. Envoyons donc un e-mail de test à notre flux de travail pour voir à quoi cela ressemble réellement . Génial. OK. Cela a donc créé une nouvelle ligne avec toutes ces parties extraites de l'e-mail, mais nous n'avons pas été en mesure d'extraire l'adresse du client, la quantité de pièces, etc., car nous avons besoin IA pour le faire, car c'est un peu plus complexe Je vais donc ajouter une nouvelle étape ici avant l'action Ad Row, car nous devons d' abord traiter l'e-mail avec l'IA et extraire ces bits avant d'ajouter enfin la ligne. Je vais donc aller à la section IA ici et choisir générer du texte, puis je vais cliquer dessus avec le bouton droit de la souris et renommer en commande partielle Cela m'aide simplement à suivre l'action de chaque action au fur et à mesure que je développe mon flux de travail. L' action de génération de texte comporte désormais deux parties. Il y a les instructions, où vous dites l'IA ce qu'elle doit faire, puis les entrées. Pour la saisie, nous allons vouloir extraire l'intégralité du courrier électronique reçu, c'est-à-dire le corps de l'avion, depuis notre déclencheur. Ensuite, nous pouvons indiquer à l'IA ce que nous voulons sortir ou extraire de cet e-mail. Mais maintenant, nous allons simplement indiquer uniquement la pièce qu'ils ont demandée, rien d'autre, par exemple, le module de commande. N'indiquez pas le nombre d' unités ou quoi que ce soit d'autre. Prompt précise vraiment à l'IA ce que nous voulons qu'elle fasse et l' empêche d' ajouter plus de contenu que ce dont nous avons besoin. N'ayez pas peur d'expérimenter avec vos instructions et de changer les choses Vous devez parfois itérer pour assurer que cette étape particulière de l'IA produit exactement ce que vous souhaitez dans vos flux C'est vrai. Je vais cliquer avec le bouton droit sur cette action, la dupliquer et l'adapter ensuite à l'adresse. Et je vais le refaire pour extraire le modèle du véhicule. Ensuite, dans notre dernière étape, je vais ajouter un autre type d'action d'IA , très similaire, mais spécifique à la sortie de chiffres uniquement. Il s'agit du texte pour numéroter l'action de l'IA. Et ici, je vais mettre les instructions. Veuillez extraire le nombre d' unités commandées par cette personne. Nous reviendrons ensuite à l'action ADR, et dans le champ d' adresse du client, nous pouvons maintenant voir que nous pouvons sélectionner l'adresse qui est sortie de l'action d'adresse, et nous pouvons également le faire avec les autres champs. Bien, envoyons un autre e-mail de test. Et nous pouvons maintenant constater que notre flux de travail, qui comprenait quatre étapes d'IA différentes a extrait tout ce dont nous avions besoin de ce client ou de ce courrier électronique pour remplir une nouvelle ligne dans le tableau des commandes Si nous le voulions, nous pourrions ajouter une dernière étape ici, comme une intégration permettant d' avertir quelqu'un via GML ou via un canal Slack Et si nous voulions adapter ce flux de travail pour les aider à saisir leurs formulaires papier, type de processus que j'ai mentionné plus tôt, cela pourrait ressembler à ceci. Dans ce flux de travail, nous utilisons un déclencheur d'interaction entre applications qui se déclenche lorsque quelqu'un télécharge un formulaire Le flux de travail extrait ensuite le texte de cette image dans le formulaire, puis toutes les étapes d'IA suivantes que nous avons effectuées précédemment font simplement la même chose, mais elles extraient du texte plus spécifique à partir du texte extrait de l'image Nous en sommes donc à la dernière étape. Dans la vidéo suivante, vous allez apprendre à publier votre application et à la partager avec vos utilisateurs. 7. Publier et partager votre solution: Nous en sommes maintenant aux dernières étapes avant publier et de partager avec nos utilisateurs, et tout cela se fait dans la zone des paramètres de Glide Commençons par le plus important, savoir la confidentialité et l'accès. Par défaut, toutes les applications que vous créez sont privées, ce qui signifie que seuls vous et les autres membres de votre équipe Glide pourrez y accéder Si vous venez de vous inscrire à Glide et que vous n'avez aucun autre développeur dans votre équipe, cela signifie que vous seul pourrez y accéder Si vous souhaitez ajouter des utilisateurs qui ne sont pas des développeurs dans votre équipe Glide, vous devez les placer le tableau des utilisateurs Cela signifie que toute personne ayant un profil dans le tableau des profils utilisateur pourra se connecter à votre application. Désormais, si vous utilisez des données privées dans votre application, vous devez préserver la confidentialité de l'accès à celle-ci. Toutefois, si vous créez une application destinée au public contenant des données non sensibles, vous pouvez la rendre publique. Dans ce cas, différentes options s'offrent à vous pour savoir si vous autorisez ou non vos utilisateurs à se connecter. Désormais, l' activation de la connexion sur les applications publiques présente des avantages et des inconvénients . Consultez donc notre vidéo sur les bases du profil utilisateur dans Glide University Ensuite, vous pouvez modifier le nom et l' icône de votre application ainsi que son apparence Ces commandes vous offrent ici options de thématisation de haut niveau pour votre application Personnellement, j'aime bien le meilleur style de navigation ici, mais vous pouvez également en ajouter un sur la gauche. J'aime également configurer mon environnement pour qu'il soit automatique , de sorte que si l' appareil de l'utilisateur est en mode sombre, l'application change également pour refléter cela. Nous sommes donc prêts à publier. Vous pouvez voir ici que notre application a reçu un domaine par défaut. Maintenant, vous pouvez modifier cela tant que l'URL est disponible, mais après avoir cliqué sur Publier, nous pouvons également ajouter un domaine personnalisé si nous en avons un. Maintenant, je vais le laisser tel quel et appuyer sur Publier. Et c'est tout. Notre application est désormais en ligne avec les paramètres de confidentialité que nous avons configurés, et nous pouvons la consulter dans notre navigateur ici copiant le lien ou en le scannant avec votre téléphone, et nous pouvons également l'ajouter à l'écran d'accueil de notre téléphone. Vous pouvez également inviter rapidement de nouveaux utilisateurs ici, et ils seront automatiquement ajoutés au tableau des utilisateurs . Donc, c'est ça. Si vous m'avez suivi, nous espérons que vous avez créé et publié votre première application. Et si vous apportez des modifications par la suite, que ce soit dans l'éditeur de données, dans l'éditeur de mise en page ou dans les actions, celles-ci seront immédiatement mises à jour pour vos utilisateurs. Vous pouvez donc continuer à itérer et à améliorer cette application au fil du temps sans avoir à vous soucier de la redéployer ou de la publier Toutefois, si vous souhaitez travailler sur les fonctionnalités et attendre qu'elles soient prêtes avant que ces modifications ne soient mises en ligne pour vos utilisateurs, vous pouvez modifier ce paramètre ici. Et c'est ainsi. Vous êtes arrivé à la fin du cours. N'oubliez pas que vous pouvez télécharger le modèle complet et en savoir plus sur la façon dont il a été créé. Vous le trouverez également dans les ressources du cours.