Utiliser les compétences d'agent d'IA (avec Gemini CLI et Agent Skills pour Firebase)

1. Introduction

Dans cet atelier, vous allez apprendre à créer des compétences d'agent pour permettre aux LLM d'accéder à des connaissances et des workflows personnalisés. Vous allez le créer en tant que compétence locale accessible depuis Gemini CLI.

Objectifs de l'atelier

• Créez vos propres compétences d'agent pour vos centres d'intérêt.
• Utiliser Gemini CLI pour interroger votre skill
• Installez les compétences agentiques officielles pour Firebase et utilisez-les pour créer et déployer une application.

Points abordés

• Structurer une skill
• Comment écrire un fichier SKILL.md.
• Utiliser des compétences locales avec Gemini CLI

2. Configuration du projet

1. Si vous ne possédez pas encore de compte Google, vous devez en créer un.
   • Utilisez un compte personnel au lieu d'un compte professionnel ou scolaire. Il est possible que les comptes professionnels et scolaires soient soumis à des restrictions qui vous empêchent d'activer les API nécessaires pour cet atelier.
2. Connectez-vous à la console Google Cloud.
3. Activez la facturation dans la console Cloud.
   • L'exécution de cet atelier devrait coûter moins de 1 USD en ressources Cloud.
   • Vous pouvez suivre les étapes à la fin de cet atelier pour supprimer les ressources et éviter ainsi des frais supplémentaires.
   • Les nouveaux utilisateurs peuvent bénéficier d'un essai sans frais pour un crédit de 300 $.
4. Créez un projet ou réutilisez-en un existant.
   • Si vous voyez une erreur concernant le quota de projet, réutilisez un projet existant ou supprimez-en un pour en créer un.

3. Ouvrir l'éditeur Cloud Shell

1. Cliquez sur ce lien pour accéder directement à l'éditeur Cloud Shell.
2. Si vous êtes invité à autoriser l'accès à un moment donné aujourd'hui, cliquez sur Autoriser pour continuer.
3. Si le terminal ne s'affiche pas en bas de l'écran, ouvrez-le :
   • Cliquez sur Afficher.
   • Cliquez sur Terminal.
4. Dans le terminal, définissez votre projet à l'aide de la commande suivante :
   • Format :

     gcloud config set project [PROJECT_ID]
     

   • Exemple :

     gcloud config set project lab-project-id-example
     

   • Si vous ne vous souvenez pas de l'ID de votre projet :
     • Vous pouvez lister tous vos ID de projet avec la commande suivante :

       gcloud projects list | awk '/PROJECT_ID/{print $2}'
       

     
5. Le message suivant doit s'afficher :

   Updated property [core/project].
   

   Si le message WARNING s'affiche et que vous êtes invité à Do you want to continue (Y/n)?, cela signifie probablement que vous avez saisi l'ID du projet de manière incorrecte. Appuyez sur n, puis sur Enter, et réessayez d'exécuter la commande gcloud config set project.

4. Créer votre compétence personnalisée

Les compétences d'agent sont des répertoires contenant au minimum un fichier SKILL.md qui fournit des instructions et des connaissances à un agent d'IA. Dans cette section, vous allez créer une compétence qui apprend à Gemini CLI vos choses préférées.

1. Créez un répertoire pour cet atelier et accédez-y :

   mkdir ~/agent-skills-lab && cd ~/agent-skills-lab
   

2. Créez un répertoire pour la skill de votre projet :

   mkdir -p ~/agent-skills-lab/.agents/skills/my-favorite-things
   

3. Créez et ouvrez un fichier SKILL.md pour votre skill :

   cloudshell edit ~/agent-skills-lab/.agents/skills/my-favorite-things/SKILL.md
   

   La commande cloudshell edit ouvre le fichier SKILL.md dans l'éditeur au-dessus du terminal.
4. Ajoutez le contenu suivant au fichier SKILL.md :

   ---
   name: my-favorite-things
   description: Provides personal information about my favorite color, food, and programming language. Use this skill when the user asks questions about my personal preferences or favorite things.
   ---
   
   # Knowledge
   
   - **Favorite Color:** Blue
   - **Favorite Food:** Pizza
   - **Favorite Programming Language:** Python
   
   If asked about one of my favorite things, please respond with the information provided above.
   

Vous venez de créer votre première skill avec un simple fichier SKILL.md ! Il est temps d'utiliser cette compétence dans Gemini CLI.

5. Utiliser votre compétence depuis Gemini CLI

Maintenant que vous avez créé une compétence, Gemini CLI peut déjà la découvrir, car elle se trouve dans le répertoire .agents/skills.

1. Lancez Gemini CLI :

   gemini
   

   Vous devriez voir Gemini CLI reconnaître la nouvelle compétence. Vous devrez peut-être appuyer sur Enter pour accepter certains paramètres par défaut.

Remarque : Gemini CLI est préinstallé dans Cloud Shell.

1. Demandez à Gemini de lister les compétences disponibles dans son contexte.

   /skills
   

   Vous devriez voir my-favorite-things dans la liste des skills disponibles.
2. Demandez à Gemini quelle est votre couleur préférée :

   What is my favorite color?
   

   Gemini CLI doit utiliser la compétence my-favorite-things pour répondre à votre question. Si vous y êtes invité, autorisez Gemini CLI à utiliser la compétence.

Le résultat doit indiquer que Gemini CLI a utilisé votre compétence et a répondu quelque chose comme "Bleu" ou "Ma couleur préférée est le bleu".

Vous avez réussi ! Vous avez créé une compétence et l'avez testée à l'aide de Gemini CLI.

Pour terminer votre session, saisissez /quit, puis appuyez sur Enter pour quitter Gemini CLI.

6. (Facultatif) Compiler et déployer une application sur Firebase Hosting

En plus de créer vos propres compétences, vous pouvez installer celles créées par d'autres utilisateurs. Cela illustre l'utilisation de compétences portables, c'est-à-dire des modules autonomes de connaissances, d'instructions et de workflows qui peuvent être facilement partagés et réutilisés.

Les compétences agentiques pour Firebase sont un excellent exemple de ces modules portables. Elles sont conçues pour aider les assistants IA à comprendre les bonnes pratiques Firebase et à exécuter des tâches complexes avec une plus grande précision et un coût en jetons plus faible.

Utilisez maintenant les compétences d'agent pour Firebase afin de créer une application Web "To Do" avec authentification des utilisateurs et base de données, puis déployez-la sur Firebase Hosting.

Configurer votre projet

1. Si vous êtes toujours dans Gemini CLI, saisissez /quit pour quitter.
2. Créez un répertoire pour votre projet et accédez-y :

   mkdir ~/todo-app && cd ~/todo-app
   

3. Connectez-vous à Firebase avec votre compte Google. Utilisez l'indicateur --no-localhost puisque vous êtes dans Cloud Shell :

   firebase login --no-localhost
   

   1. Interagissez avec les invites de la CLI :
      • Lorsque la question Enable Gemini in Firebase features? s'affiche, saisissez Y (pour "Oui"), puis appuyez sur Enter.
      • Lorsque la question Allow Firebase to collect CLI and Emulator Suite usage and error reporting information? s'affiche, saisissez Y (pour "Oui"), puis appuyez sur Enter.
   2. Autoriser dans le navigateur :
      • Une URL s'affiche dans le terminal. Cliquez sur le lien (s'il n'est pas cliquable, mettez en surbrillance l'URL dans Cloud Shell pour la copier, puis collez-la dans votre navigateur) pour ouvrir la page de connexion dans un nouvel onglet du navigateur.
      • Étape 1 sur 3 (Confirmer la commande) : cliquez sur Oui, je viens d'exécuter cette commande.
      • Étape 2 sur 3 (Confirmer l'ID de session) : assurez-vous que l'ID de session correspond à celui affiché dans votre terminal, puis cliquez sur Oui, il s'agit de mon ID de session.
      • Étape 3 sur 3 (Copier le code) : cliquez sur Copier pour copier le code d'autorisation dans le presse-papiers.
   3. Connectez-vous :
      • Revenez au terminal Cloud Shell et collez le code d'autorisation à l'invite ? Enter authorization code:.
      • Appuyez sur la touche Enter.
   Un message confirmant le succès de l'opération doit s'afficher : ✔ Success! Logged in as .

Conseil : Lorsque vous collez le code d'autorisation dans Cloud Shell, recherchez une boîte de dialogue Chrome vous demandant l'autorisation d'accéder au presse-papiers et assurez-vous qu'elle est activée. Vous pouvez utiliser Ctrl+Shift+V (Windows) ou CMD+Shift+V (Mac) pour coller le code dans le terminal.

Installer les compétences agentiques pour Firebase

Maintenant que vous avez créé le répertoire de votre projet, vous devez y installer les compétences agentiques pour Firebase.

Vous pouvez installer les compétences agentiques pour Firebase avec la skills CLI dans votre terminal :

npx skills add firebase/agent-skills

Lors de l'installation, vous serez invité à sélectionner les compétences à installer. Utilisez les touches fléchées pour parcourir la liste et la barre d'espace pour sélectionner ces compétences.

• firebase-basics
• firebase-hosting-basics
• firebase-auth-basics
• firebase-firestore-enterprise-native-mode

Pour les invites suivantes, vous pouvez accepter les valeurs par défaut en appuyant sur Enter.

Cette commande téléchargera et installera les compétences, y compris firebase-basics et firebase-hosting-basics, ce qui les rendra disponibles pour une utilisation dans Gemini CLI aux côtés de votre compétence my-favorite-things.

Pour en savoir plus sur les compétences agentiques pour Firebase, consultez les compétences disponibles.

Créer et déployer une application Web de base

1. Activez les API requises pour votre projet :

   gcloud services enable \
     cloudresourcemanager.googleapis.com \
     firebase.googleapis.com
   

2. Activez Firebase dans votre projet Google Cloud actuel :

   firebase projects:addfirebase ${GOOGLE_CLOUD_PROJECT}
   

3. Lancez Gemini CLI :

   gemini
   

4. Demandez à Gemini de générer un index.html de base :

   Generate an index.html file with the content "Hello Firebase Hosting" and
   deploy the application to Firebase Hosting using the current Google Cloud
   Project.
   

   Gemini vous demandera de créer index.html et d'exécuter firebase. Appuyez sur Enter pour l'autoriser à le faire.Gemini CLI doit utiliser les compétences agentiques pour Firebase afin de créer et de déployer votre site Web. Guidez l'agent et accordez les approbations nécessaires.

Une fois le déploiement terminé, une URL pour votre application Web devrait s'afficher. Utilisez ctrl+click (Windows/Linux) ou cmd+click (Mac) pour ouvrir les liens dans le terminal de l'éditeur Cloud Shell. Accédez à l'URL de votre application déployée.

Ajouter Firebase Authentication

1. Démarrez Gemini CLI si ce n'est pas déjà fait :

   gemini
   

   Gemini peut vous poser des questions comme "Faites-vous confiance à ce dossier ?" Appuyez sur Enter pour accepter les valeurs par défaut.
2. Demandez maintenant à Gemini d'ajouter la connexion Google :

   Generate HTML, CSS, and Javascript for a single page application.
   It should use Google Sign-in with Firebase Authentication.
   A user should be able to sign in with their Google Account.
   Deploy when you are done and give the URL to the user.
   

   Gemini peut vous demander de créer ou de modifier des fichiers tels que index.html, style.css et script.js. Autorisez-le à le faire. Gemini peut vous demander d'effectuer certaines actions dans la console Firebase. La CLI est capable d'effectuer la plupart de ces opérations si vous lui demandez d'essayer, mais vous devrez peut-être effectuer les étapes manuellement (comme activer Google OAuth) si votre instance Cloud Shell dispose d'une ancienne version de la CLI Firebase.

Une fois le déploiement terminé, une URL pour votre application Web devrait s'afficher. Utilisez ctrl+click (Windows/Linux) ou cmd+click (Mac) pour ouvrir les liens dans le terminal de l'éditeur Cloud Shell. Accédez à l'URL de votre application déployée.

Pour que vos dernières modifications s'affichent, vous devrez peut-être effectuer une actualisation forcée avec ctrl+shift+R (Windows/Linux) ou cmd+shift+R (Mac).

Ajouter Cloud Firestore

1. Démarrez Gemini CLI si ce n'est pas déjà fait :

   gemini
   

   Gemini peut vous poser des questions comme "Faites-vous confiance à ce dossier ?" Appuyez sur Enter pour accepter les valeurs par défaut.
2. Demandez à Gemini d'ajouter Firestore pour enregistrer les tâches :

   Update the application to save tasks in Cloud Firestore for the signed-in user.
   A user should be able to add new tasks and see a list of their tasks.
   Deploy when you are done and give the URL to the user.
   

   Gemini mettra à jour les fichiers. Autorisez-le à le faire.

Une fois le déploiement terminé, une URL pour votre application Web devrait s'afficher. Utilisez ctrl+click (Windows/Linux) ou cmd+click (Mac) pour ouvrir les liens dans le terminal de l'éditeur Cloud Shell. Accédez à l'URL de votre application déployée.

Pour que vos dernières modifications s'affichent, vous devrez peut-être effectuer une actualisation forcée avec ctrl+shift+R (Windows/Linux) ou cmd+shift+R (Mac).

Si votre application ne fonctionne pas comme prévu, continuez à utiliser Gemini CLI pour obtenir la fonctionnalité souhaitée. Exemple : shell Hide the task form when the user is logged out. Update the security rules so the user can see their TODOs.

Continuez à expérimenter avec l'atelier pour ajouter les fonctionnalités que vous souhaitez voir dans votre nouvelle application Firebase.

7. Conclusion

Félicitations ! Vous avez créé une compétence et appris à installer des compétences supplémentaires pour Gemini CLI.

(Facultatif) Effectuer un nettoyage

Si vous souhaitez faire le ménage, vous pouvez supprimer votre projet Cloud pour éviter des frais supplémentaires.

Si vous le souhaitez, supprimez le projet :

gcloud projects delete $GOOGLE_CLOUD_PROJECT

Vous pouvez également supprimer les ressources inutiles de votre disque Cloud Shell pour libérer de l'espace.

1. Supprimez le répertoire de l'atelier (cela supprime à la fois la compétence et l'application) :

   rm -rf ~/agent-skills-lab
   

2. Supprimez le répertoire de l'application "To Do" (si vous l'avez créé en dehors) :

   rm -rf ~/todo-app
   

Si vous devez réinitialiser Cloud Shell à son état par défaut, vous pouvez suivre la documentation officielle pour savoir comment le faire en toute sécurité.