1. Introduction
Dans cet atelier, vous allez utiliser Gemini Code Assist, un collaborateur optimisé par l'IA disponible dans Google Cloud, pour ajouter des tests à une application Web Python existante, et pour rechercher et corriger les erreurs de cette application divulguées par les tests. Vous utiliserez ensuite Code Assist pour créer des tests pour de nouvelles fonctionnalités, puis générer du code pour réussir ces tests et étendre l'application.
Ce que vous allez effectuer...
- Vous utiliserez l'éditeur Cloud Shell pour télécharger le code d'une application Web existante.
- Vous utiliserez Gemini Code Assist Chat dans l'éditeur Cloud Shell pour poser des questions générales sur Google Cloud.
- Vous utiliserez l'assistance au code intégrée de Gemini Code Assist dans l'éditeur Cloud Shell pour générer des tests pour l'application, les exécuter, rechercher et corriger des erreurs, puis étendre les fonctionnalités de l'application.
Ce que vous allez apprendre...
- Comment utiliser Gemini Code Assist pour effectuer plusieurs tâches de développement, comme la génération de tests et de code.
- Utiliser Gemini Code Assist pour en savoir plus sur Google Cloud
Ce dont vous avez besoin...
- Navigateur Web Chrome
- Un compte Gmail
- Un projet Cloud pour lequel la facturation est activée
- Gemini Code Assist activé pour votre projet Cloud
Cet atelier s'adresse aux développeurs de tous niveaux, y compris aux débutants. Bien que l'exemple d'application soit en langage Python, vous n'avez pas besoin d'être familiarisé avec la programmation Python pour comprendre ce qui se passe. Notre objectif sera de se familiariser avec les fonctionnalités de Gemini Code Assist pour les développeurs.
2. Configuration
Pour cet atelier, vous devez déjà disposer d'un projet Cloud pour lequel la facturation est activée. Nous allons maintenant activer l'API Gemini dans notre projet Google Cloud. Suivez les étapes ci-dessous :
- Accédez à https://console.cloud.google.com et veillez à sélectionner le projet Google Cloud que vous comptez utiliser dans cet atelier. Cliquez sur l'icône Gemini qui s'affiche en haut à droite.
- La fenêtre Gemini pour Cloud Console s'ouvre sur le côté droit de la console. Cliquez sur le bouton Enable (Activer) s'il apparaît ci-dessous. Si le bouton Activer ne s'affiche pas, mais qu'une interface Chat s'affiche, cela signifie que vous avez déjà activé Gemini pour Cloud pour le projet et que vous pouvez passer directement à l'étape suivante.
- Une fois qu'il est activé, vous pouvez tester Gemini en lui posant une ou deux requêtes. Quelques exemples de requêtes sont présentés, mais vous pouvez essayer une requête du type Qu'est-ce que Cloud Run ?
Code Assist fournit la réponse à votre question. Vous pouvez cliquer sur l'icône en haut à droite pour fermer la fenêtre de chat de Code Assist.
Activer Gemini dans l'éditeur Cloud Shell
Gemini Code Assist est disponible et se comporte de la même manière dans plusieurs IDE courants. Dans cet atelier de programmation, vous allez utiliser l'éditeur Google Cloud Shell, qui s'exécute entièrement dans votre navigateur Web. Vous devez activer et configurer Gemini dans l'éditeur Cloud Shell en suivant les étapes ci-dessous:
- Lancez Cloud Shell en cliquant sur l'icône ci-dessous. Comptez une ou deux minutes pour que l'instance Cloud Shell démarre.
- Cliquez sur le bouton Éditeur ou Ouvrir l'éditeur (selon le cas) et attendez que l'éditeur Cloud Shell s'affiche. Si le bouton Essayer le nouvel éditeur est affiché, cliquez dessus.
- Cliquez sur le bouton Cloud Code – Se connecter dans la barre d'état inférieure (voir ci-dessous). Autorisez le plug-in comme indiqué. Si Cloud Code – Aucun projet est affiché dans la barre d'état, cliquez dessus. Dans la liste des projets, sélectionnez le projet Google Cloud que vous comptez utiliser.
- Si vous ne voyez pas l'icône Gemini dans la barre d'état en bas à droite, vous devez l'activer dans Cloud Code. Avant cela, assurez-vous que Gemini (anciennement Duet AI pour les développeurs) est activé dans l'IDE. Pour ce faire, accédez à Extension Cloud Code → Paramètres, puis saisissez Duet AI: Activer, comme indiqué ci-dessous. Assurez-vous que la case est cochée. Vous devez actualiser votre IDE. Cela active Gemini dans Cloud Code, et la barre d'état Gemini s'affiche dans votre IDE.
- Cliquez sur le bouton Gemini en bas à droite comme illustré, puis sélectionnez le projet Google Cloud pour lequel nous avions activé l'API Cloud AI Companion.
- Après avoir sélectionné votre projet Google Cloud, vérifiez qu'il s'affiche dans le message d'état Cloud Code de la barre d'état et que Gemini est activé à droite dans la barre d'état, comme illustré ci-dessous:
Gemini Code Assist est prêt à l'emploi !
3. Télécharger et examiner l'application
Dans la fenêtre de terminal, exécutez la commande permettant de cloner le dépôt avec le code de démarrage, puis accédez au nouveau répertoire (si la fenêtre de terminal n'est plus ouverte, cliquez sur le bouton Terminal ou Ouvrir le terminal pour le restaurer):
git clone https://github.com/GoogleCloudPlatform/testing-with-duet-ai-codelab.git
cd testing-with-duet-ai-codelab
Ouvrez le fichier main.py dans l'éditeur, puis ouvrez la fenêtre Gemini Chat en cliquant sur l'icône Gemini Chat à gauche de l'éditeur. Cette fenêtre Gemini Chat se trouve dans l'IDE, et le code de l'IDE est disponible comme contexte pour les discussions. Saisissez la requête Expliquer ceci et voyez la réponse:
Vous pouvez faire défiler cette fenêtre de chat pour voir l'intégralité de la réponse. L'explication indique que nous pouvons exécuter ce programme en local à l'aide de la commande python3 main.py
dans la fenêtre de terminal.
4. Exécuter localement
Si nécessaire, accédez au répertoire du dépôt avec cd ~/testing-with-duet-ai-codelab
, puis saisissez la commande python3 main.py
dans la fenêtre de terminal:
Cliquez sur le lien http://127.0.0.1:8080 pour ouvrir la page d'accueil de l'application dans un nouvel onglet de navigateur:
L'application s'exécute "localement". En fait, l'éditeur Cloud Shell a fait un peu de magie dans ce cas. L'application s'exécute dans Cloud Shell, et non sur votre propre ordinateur. Lorsque vous avez cliqué sur le lien, un onglet a été ouvert non pas vers l'adresse locale réelle http://127.0.0.1:8080, mais vers un serveur proxy configuré uniquement à cet effet par Cloud Shell. Le résultat est le même que si vous l'exécutiez réellement en local.
Essayez-le ! Saisissez 25, puis appuyez sur Convert! (Convertir).
C'est exact, 25 est XXV en chiffres romains ! Vous devez le faire ici.
Vérifiez peut-être quelques autres chiffres. 25 fonctionnaient, et 24 ?
Nous étions peut-être un peu pressés de penser que tout allait bien. XXIIII correspond-il à la bonne conversion pour 24 ? Ne devrait-il pas s'agir de XXIV ?
On pourrait affirmer que la question XXIIII est correcte, mais ce n'est pas vraiment ce à quoi les gens s'attendent généralement. Ce n'est cependant pas vraiment mauvais (notez que de nombreuses horloges indiquent que le chiffre 4 correspond au chiffre IIII et qu'il s'agit du chiffre IIII).
Et si on essayait les nombres négatifs ? Zéro ? Il n'y a aucun moyen de représenter ces nombres en chiffres romains. L'utilisateur ne semble pas avoir reçu d'informations, ce qui semble indiquer une erreur à corriger.
Les tests peuvent vous aider à détecter et à éliminer les erreurs, et Gemini Code Assist peut nous aider à écrire et à utiliser des tests.
5. Ajouter des tests
Revenez à la fenêtre Gemini Chat et posez votre question
How can I test the number_to_roman function?
Lisez la réponse, qui doit inclure des explications sur les modules unittest et pytest.
Vous pouvez demander à Gemini Code Assist d'écrire ces tests à votre place. Ouvrez calendar.py (où se trouve le code de conversion) dans l'éditeur, revenez à la fenêtre Gemini Chat et demandez à nouveau
How can I test the number_to_roman function?
La réponse est maintenant plus précise et inclut même un module unittest que vous pouvez copier ou injecter dans un nouveau fichier:
import unittest
import calendar
class NumberToRomanTest(unittest.TestCase):
def test_convert_1(self):
self.assertEqual(calendar.number_to_roman(1), "I")
def test_convert_4(self):
self.assertEqual(calendar.number_to_roman(4), "IV")
def test_convert_9(self):
self.assertEqual(calendar.number_to_roman(9), "IX")
def test_convert_40(self):
self.assertEqual(calendar.number_to_roman(40), "XL")
def test_convert_90(self):
self.assertEqual(calendar.number_to_roman(90), "XC")
def test_convert_400(self):
self.assertEqual(calendar.number_to_roman(400), "CD")
def test_convert_900(self):
self.assertEqual(calendar.number_to_roman(900), "CM")
def test_convert_1990(self):
self.assertEqual(calendar.number_to_roman(1990), "MCMXC")
def test_convert_2023(self):
self.assertEqual(calendar.number_to_roman(2023), "MMXXIII")
Le code affiché peut être différent de celui de l'exemple ci-dessus. Les modèles sous-jacents de Gemini Code Assist sont mis à jour de temps en temps. Les réponses ne seront donc pas toujours les mêmes. Si vous voyez un autre ensemble de code, vous pouvez maintenant choisir de continuer avec les exemples présentés dans cet atelier de programmation en copiant le code présenté ici. Vous pouvez aussi essayer la réponse alternative que Gemini Code Assist vous propose désormais. Si vous avez le temps, vous pouvez même essayer les deux méthodes. Gemini Code Assist est un assistant de codage que vous pouvez utiliser comme bon vous semble.
Cliquez sur la double flèche à double point en haut à droite de la fenêtre Gemini Chat pour créer un fichier contenant le code du test unitaire, ou utilisez l'IDE pour créer un fichier et coller le code présenté dans cet atelier. Appuyez sur CTRL-S ou sur CMD-S dans cette fenêtre pour l'enregistrer, puis appelez le fichier enregistré calendar-unittest.py.
Revenez au terminal et appuyez sur CTRL+C pour arrêter le serveur Web que vous avez quitté précédemment et obtenir une invite de shell. Saisissez la commande
python3 calendar-unittest.py
pour exécuter les nouveaux tests.
Aucun résultat. Ce n'est pas ce qu'on attendait. Tout s'est-il passé silencieusement ? Vous voulez le savoir, c'est sûr. Consultez à nouveau la réponse de Gemini Code Assist incluant le code de test. Sous le code, des informations supplémentaires sur l'exécution du scénario de test s'affichent:
Essayez d'exécuter la commande recommandée:
python -m unittest discover
Il est possible que vous rencontriez un problème si votre machine n'alias la commande python3
en python
. Dans ce cas, exécutez la commande suivante:
python3 -m unittest discover
La commande s'exécute, mais elle renvoie Ran 0 tests in 0.000s
. Le module contient plusieurs tests. Que se passe-t-il ?
C'est le dernier mot de la commande, discover
. D'où cela vient-il ? Apparemment, Gemini Code Assist s'attendait à ce que le code de test soit enregistré dans un fichier nommé discover
ou discover.py
, mais n'a pas spécifié que c'est ce que vous devez faire. Puisque vous avez enregistré le fichier dans calendar-unittest.py
, essayez d'exécuter la commande suivante:
python3 -m unittest calendar-unittest
Vous obtenez de nombreux résultats, qui commencent par un résultat semblable à celui-ci:
$ python3 -m unittest calendar-unittest
.F.FFFFFF
======================================================================
FAIL: test_convert_1990 (calendar-unittest.NumberToRomanTest)
----------------------------------------------------------------------
Traceback (most recent call last):
File "/home/charles_engelke/testing-with-duet-ai-codelab/calendar-unittest.py", line 28, in test_convert_1990
self.assertEqual(calendar.number_to_roman(1990), "MCMXC")
AssertionError: 'MDCCCCLXXXX' != 'MCMXC'
- MDCCCCLXXXX
+ MCMXC
La première ligne indique un point pour chaque test réussi, et une valeur F
pour chaque test ayant échoué. La plupart des tests échouent. Il répertorie ensuite les tests ayant échoué individuellement, en affichant le résultat attendu et le résultat réel. L'ordre dans lequel ces tests ont été exécutés n'est pas clair. Il était classé par ordre alphabétique (et non selon l'ordre d'apparition des tests dans le fichier). test_convert_1
a donc été exécuté en premier, puis test_convert_1990
, puis test_convert_2023
, et ainsi de suite. Les scénarios de test pour 1
et 2023
sont les seuls ayant réussi.
Lorsque vous avez essayé ce code pour la première fois, vous avez remarqué qu'il avait converti 24
en XXIIII
, ce qui n'était pas tout à fait faux, mais ce n'était pas la forme courante dans laquelle IIII
est converti en IV
. Tous les tests ayant échoué concernaient des cas similaires. Lorsque ce problème a été identifié pour la première fois, l'atelier a déclaré : "Comme ce n'est pas vraiment faux (notez que de nombreuses horloges indiquent 4
comme chiffre romain IIII
), laissez le problème pour une amélioration ultérieure."
Vous pouvez modifier les scénarios de test afin d'accepter l'expression "pas vraiment mauvaise". répond au code reçu, ou accepter que l'heure de cette "amélioration future" soit arrivée. La prochaine étape consiste donc à corriger le code avec l'aide de Gemini Code Assist, afin de fournir des réponses plus acceptables que celles attendues par les tests.
6. Améliorer le code
Rappelez-vous que les réponses comme XXIIII
pour 24
, au lieu des XXIV
plus courantes, ont été considérées comme "pas vraiment fausses". et ont été reportés pour
une amélioration future. Cet avenir, c'est maintenant. Ceux qui sont « pas vraiment faux » les réponses restent
ennuyeuses.
La première règle pour les chiffres répétés en chiffres romains est la suivante: chaque fois que vous avez quatre chiffres identiques à la suite, ils doivent être remplacés par l'un des chiffres suivi du chiffre supérieur suivant. XXIIII
doit donc être remplacé par XXIV
. De même, XXXX
doit être remplacé par XL
, et CCCC
doit devenir CD
.
Demandez à Gemini Code Assist comment modifier la valeur de la variable roman juste avant qu'elle ne soit renvoyée par number_to_roman:
If the final value of roman has IIII in it, that should be replaced by IV. Similarly XXXX should be replaced by XL, and CCCC should become CD. How can I make those changes?
Nous vous suggérons d'ajouter du code à la fin:
Copiez-collez ou saisissez ces lignes dans l'éditeur, puis observez le résultat:
Gemini Code Assist a ajouté plus de lignes pour gérer les cas que vous pouvez rencontrer après avoir effectué le premier ensemble de substitutions. Par exemple, 19 serait converti en XVIIII, puis en XVIV, et enfin en XIX.
Si Gemini Code Assist a fait des suggestions apparemment utiles, appuyez sur la touche Tabulation pour accepter les recommandations, enregistrer le fichier et relancer le serveur Web. Sinon, ajoutez manuellement les lignes affichées dans cet exemple et enregistrez le fichier. Essayez une conversion difficile: 1999:
Bonne réponse.
Réexécutez les tests maintenant. Ils réussissent tous !
L'application Web semble prête à être mise en production.
7. Déployer dans Cloud Run
Cloud Run exécute pour vous une application conteneurisée sur Internet. Pour les applications écrites à l'aide de frameworks courants, tels que Flash, la commande gcloud run deploy
crée même ce conteneur avant de le déployer. Exécutez la commande suivante :
gcloud run deploy
Dans le terminal Lorsque vous êtes invité à indiquer l'emplacement du code source, appuyez sur Entrée pour accepter l'emplacement correct qu'il suggère. De même, lorsque vous êtes invité à saisir un nom de service, appuyez sur Entrée pour accepter la suggestion.
La commande peut échouer, car gcloud ne peut pas déterminer le projet à utiliser. Dans ce cas, exécutez la commande suivante:
gcloud config set core/project <project-id>
où
est remplacé par l'ID de votre projet, qui peut être identique à son nom. Ensuite, réexécutez la commande gcloud run deploy
.
- La commande vous indiquera que certaines API sont nécessaires et ne sont pas encore activées. Saisissez "y" pour les activer.
- Lorsque vous êtes invité à sélectionner une région, choisissez-en une qui vous convient. Vous pouvez choisir de saisir le nombre correspondant à
us-central1
. - Lorsque vous y êtes invité, saisissez "Y" pour continuer.
- Vous devez autoriser les appels non authentifiés de ce service Cloud Run. L'option d'authentification utilisée par Cloud Run convient aux programmes qui appellent le service. Puisqu'il s'agit d'un site Web, vous n'utiliserez pas l'authentification.
Google Cloud crée le conteneur, le déploie, achemine le trafic vers celui-ci, définit des règles d'accès, puis affiche le lien vers la page d'accueil:
Vous pouvez cliquer sur ce lien pour accéder à votre application.
Saisissez un chiffre et appuyez sur Entrée. Et voilà !
Quoi ?!
Cela a fonctionné sur votre machine ! Pourquoi n'est-ce pas terminé ?
Découvrez-le. Demandez à Gemini Code Assist,
Why am I getting an internal server error on cloud run?
Apparemment, Gemini Code Assist peut lire le fichier journal, qui indique quelque chose de similaire. Demandez à Gemini Code Assist ce que vous pouvez faire pour vous enregistrer vous-même:
Recherchez les lignes avec des signes !! d'erreurs, comme indiqué ci-dessous:
Cette étape est suivie de nombreuses lignes de détails sur la pile d'appel qui viennent ici, mais le voici:
Lorsque vous examinez votre fichier calendar.py, vous voyez la fonction number_to_roman. Et vous savez que c’est correct parce que cela a fonctionné sur votre machine. Quelles modifications pourraient être apportées à Cloud Run ?
La réponse est délicate. Python 3 comprend un module standard appelé calendar, tout comme le fichier calendar.py dans lequel la fonction number_to_roman est définie. Sur votre ordinateur local, lorsque Python a recherché un module appelé calendar, il a d'abord recherché dans le répertoire de votre application. Apparemment, Python sur Cloud Run a d'abord recherché les modules standards, les a importés, mais n'a pas trouvé de fonction number_to_roman.
Ces types de différences dans les environnements sont toujours possibles. Heureusement, lorsqu'une application est conteneurisée, elle possède son environnement. Par conséquent, quel que soit l'endroit où vous l'exécutez, vous pouvez vous attendre au même comportement. Si vous aviez exécuté localement la même application conteneurisée que celle de Cloud Run, vous auriez rencontré le même problème.
Résoudre ce problème Remplacez le nom de votre module d'agenda local par un nom qui ne soit pas un nom de module standard. Renommez le fichier calendar.py en my_calendar.py, puis remplacez les lignes import calendar
de main.py et calendar-unittest.py par import my_calendar
. Enfin, remplacez la ligne
roman = calendar.number_to_roman(number)
pour
roman = my_calendar.number_to_roman(number)
Essayez-le localement, exécutez les tests, puis redéployez:
gcloud run deploy
Et maintenant, cela fonctionne:
Vous pouvez partager cette URL, et toutes les personnes ayant besoin d'un outil de conversion de chiffres romains pourront utiliser la vôtre.
8. Facultatif: Améliorer le visuel
Votre application fonctionne correctement et est accessible à tous les internautes. Mais l'apparence est un peu simple. Avant d'en parler à tout le monde, pourquoi ne pas demander à Gemini Code Assist d'améliorer son apparence ?
Ouvrez le fichier templates/index.html
. Dans la fenêtre de chat Gemini, demandez:
Make this index.html file use material design.
La réponse consiste à effectuer des ajouts au fichier actuel, ce qui donne un résultat semblable à celui-ci:
<!DOCTYPE html>
<html>
<head>
<title>Roman Numerals</title>
<link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css">
<script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>
</head>
<body>
<h1 class="mdl-typography--title">Roman Numerals</h1>
<form action="/convert" method="post">
<div class="mdl-textfield mdl-js-textfield">
<input class="mdl-textfield__input" type="text" id="number" name="number" required />
<label class="mdl-textfield__label" for="number">Enter a number:</label>
</div>
<button class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored">
Convert!
</button>
</form>
</body>
</html>
Cliquez sur l'icône pour copier le code suggéré et collez-le sur le contenu existant du fichier index.html. Dans le terminal, exécutez python3 main.py
, puis cliquez sur le lien pour ouvrir une fenêtre d'aperçu. La page est maintenant un peu moins claire:
Si vous le souhaitez, vous pouvez répéter cette opération avec le fichier convert.html.
Gemini Code Assist connaît déjà très bien le CSS. Il peut vous aider à personnaliser le style des pages de l'application de différentes manières. Et ce n'est qu'un début.
Puisque vous souhaitez partager cette application, n'oubliez pas de la redéployer sur Cloud Run:
gcloud run deploy
Vous pouvez transmettre l'URL aux personnes qui doivent convertir leur code en chiffres romains.
9. Félicitations !
Félicitations ! Avec Gemini Code Assist, vous avez réussi à ajouter des tests à une application, à corriger les erreurs qu'elle contient et à ajouter des fonctionnalités améliorées.
Lorsque vous avez fini d'utiliser l'application que vous avez créée, vous pouvez la supprimer du tableau de bord de la console Cloud pour éviter que d'éventuels frais ne soient facturés à l'avenir.