How to use AI Agent Skills (with Gemini CLI and Agent Skills for Firebase)

1. Introduction

Agent Skills lab cover photo

In this lab, you will learn how to create Agent Skills to provide LLMs with access to bespoke knowledge and workflows. You will create it as a local skill that can be accessed from Gemini CLI.

What you'll do

  • Create your own Agent Skills for your favorite things.
  • Use Gemini CLI to query your skill.
  • Install official Agent Skills for Firebase and use them to build and deploy an app.

What you'll learn

  • How to structure a skill.
  • How to write a SKILL.md file.
  • How to use local skills with Gemini CLI.

2. Project Setup

  1. If you don't already have a Google Account, you must create a Google Account.
    • Use a personal account instead of a work or school account. Work and school accounts may have restrictions that prevent you from enabling the APIs needed for this lab.
  2. Sign-in to the Google Cloud Console.
  3. Enable billing in the Cloud Console.
    • Completing this lab should cost less than $1 USD in Cloud resources.
    • You can follow the steps at the end of this lab to delete resources to avoid further charges.
    • New users are eligible for the $300 USD Free Trial.
  4. Create a new project or choose to reuse an existing project.
    • If you see an error about project quota, reuse an existing project or delete an existing project to create a new project.

3. Open Cloud Shell Editor

  1. Click this link to navigate directly to Cloud Shell Editor
  2. If prompted to authorize at any point today, click Authorize to continue. Click to authorize Cloud Shell
  3. If the terminal doesn't appear at the bottom of the screen, open it:
    • Click View
    • Click TerminalOpen new terminal in Cloud Shell Editor
  4. In the terminal, set your project with this command:
    • Format:
      gcloud config set project [PROJECT_ID]
      
    • Example:
      gcloud config set project lab-project-id-example
      
    • If you can't remember your project id:
      • You can list all your project ids with:
        gcloud projects list | awk '/PROJECT_ID/{print $2}'
        
      Set project id in Cloud Shell Editor terminal
  5. You should see this message:
    Updated property [core/project].
    
    If you see a WARNING and are asked Do you want to continue (Y/n)?, then you have likely entered the project ID incorrectly. Press n, press Enter, and try to run the gcloud config set project command again.

4. Create your "favorite things" skill

Agent Skills are directories containing at minimum a SKILL.md file that provides instructions and knowledge to an AI agent. In this section, you will create a skill that teaches Gemini CLI about your favorite things.

  1. Create a directory for this lab and navigate into it:
    mkdir ~/agent-skills-lab && cd ~/agent-skills-lab
    
  2. Create a directory for your project skill:
    mkdir -p ~/agent-skills-lab/.agents/skills/my-favorite-things
    
  3. Create and open a new SKILL.md file for your skill:
    cloudshell edit ~/agent-skills-lab/.agents/skills/my-favorite-things/SKILL.md
    
    The cloudshell edit command will open the SKILL.md file in the editor above the terminal.
  4. Add the following content to the SKILL.md file:
    ---
    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.
    

With only a SKILL.md file, you have created your first skill! It is time to use this skill in Gemini CLI.

5. Use your skill from Gemini CLI

Now that you've successfully created a skill, it is already discoverable by Gemini CLI because it is located in the .agents/skills directory.

  1. Start Gemini CLI:
    gemini
    
    You should see Gemini CLI recognize the new skill. You may need to press Enter to accept some default settings.
  1. Have gemini list the skills available to it within its context
    /skills
    
    You should see my-favorite-things in the list of available skills.
  2. Ask gemini about your favorite color:
    What is my favorite color?
    
    The Gemini CLI should use the my-favorite-things skill to answer your question. If prompted, allow Gemini CLI to use the skill.

The output should show that Gemini CLI used your skill and replied with something like "Blue" or "My favorite color is blue."

You have done it! You have successfully created a skill and tested it using Gemini CLI.

When you are ready to end your session, type /quit and then press Enter to exit Gemini CLI.

6. (Optional) Build and deploy an application to Firebase Hosting

In addition to creating your own skills, you can install skills created by others. This demonstrates the use of portable skills—self-contained modules of knowledge, instructions, and workflows that can be easily shared and reused.

Agent Skills for Firebase are a great example of these portable modules. They are designed to help AI assistants understand Firebase best practices and execute complex tasks with higher accuracy and lower token cost.

Now use Agent Skills for Firebase to create a "To Do" web application, with user authentication and a database, and deploy it to Firebase Hosting.

Set up your project

  1. If you are still in Gemini CLI, type /quit to exit.
  2. Create a new directory for your project and navigate into it:
    mkdir ~/todo-app && cd ~/todo-app
    
  3. Log in to Firebase using your Google account. Use the --no-localhost flag since you are in Cloud Shell:
    firebase login --no-localhost
    
    1. Interact with the CLI prompts:
      • When asked Enable Gemini in Firebase features?, type Y (for Yes) and press Enter.
      • When asked Allow Firebase to collect CLI and Emulator Suite usage and error reporting information?, type Y (for Yes) and press Enter.
    2. Authorize in the browser:
      • You'll see a URL in the terminal. Click the link to open the login page in a new browser tab.
      • Step 1 of 3 (Confirm command): Click Yes, I just ran this command.
      • Step 2 of 3 (Confirm session ID): Ensure the Session ID matches what is shown in your terminal, then click Yes, this is my session ID.
      • Step 3 of 3 (Copy code): Click Copy to copy the authorization code to your clipboard.
    3. Complete the login:
      • Go back to the Cloud Shell terminal and paste the authorization code at the ? Enter authorization code: prompt.
      • Press Enter.
    You should see a success message: ✔ Success! Logged in as .

Install Agent Skills for Firebase

Now that you've created your project directory, you should install the Agent Skills for Firebase within it.

You can install the Agent Skills for Firebase with the skills CLI in your terminal:

npx skills add firebase/agent-skills

During installation, you will be prompted to select which skills to install. Use your arrow keys to navigate the list and the spacebar to select these skills.

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

Selecting four Firebase skills

For subsequent prompts, you can safely accept the defaults by pressing Enter.

This command will download and install skills including firebase-basics and firebase-hosting-basics, making them available for use in Gemini CLI alongside your my-favorite-things skill.

To learn more about Agent Skills for Firebase, see Available skills.

Create and deploy a basic web app

  1. Enable the required APIs for your project:
    gcloud services enable \
      cloudresourcemanager.googleapis.com \
      firebase.googleapis.com
    
  2. Enable Firebase on your current Google Cloud project:
    firebase projects:addfirebase ${GOOGLE_CLOUD_PROJECT}
    
  3. Start Gemini CLI:
    gemini
    
  4. Ask Gemini to generate a basic index.html:
    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 will ask to create index.html and execute firebase. Press Enter to allow it to do so.Gemini CLI should use the Agent Skills for Firebase to create and deploy your website. Guide the agent along with approvals as needed.

When it is done deploying, it should provide a URL for your web app. Use ctrl+click (Windows) or cmc+click (Mac) to open links in Cloud Shell Editor terminal. Visit the URL for your deployed app!

Add Firebase Authentication

  1. Start Gemini CLI if not already started:
    gemini
    
    Gemini may ask questions like "Do you trust this folder?" Press Enter to accept the defaults.
  2. Now, ask Gemini to add Google Sign-in:
    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 may ask to create or update files like index.html, style.css, and script.js. Allow it to do so. Gemini may ask you to take some actions in the Firebase console. The CLI is capable of doing most of these if you ask it to try, but completing the steps manually (like enabling Google OAuth) may be required if your Cloud Shell instance has an older version of Firebase CLI installed.

When it is done deploying, it should provide a URL for your web app. Use ctrl+click (Windows) or cmc+click (Mac) to open links in Cloud Shell Editor terminal. Visit the URL for your deployed app!

To see your latest changes appear, you may need to perform a "Hard Refresh" with ctrl+shift+R (Windows) or cmd+shift+R (Mac).

Add Cloud Firestore

  1. Start Gemini CLI if not already started:
    gemini
    
    Gemini may ask questions like "Do you trust this folder?" Press Enter to accept the defaults.
  2. Ask Gemini to add Firestore to save tasks:
    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 will update the files. Allow it to do so.

When it is done deploying, it should provide a URL for your web app. Use ctrl+click (Windows) or cmc+click (Mac) to open links in Cloud Shell Editor terminal. Visit the URL for your deployed app!

To see your latest changes appear, you may need to perform a "Hard Refresh" with ctrl+shift+R (Windows) or cmd+shift+R (Mac).

If your application doesn't function as expected, continue working with Gemini CLI to get the functionality you expect. Example: shell Hide the task form when the user is logged out. Update the security rules so the user can see their TODOs.

Keep experimenting with the lab to add the features you would like to see in your new Firebase application.

7. Conclusion

Congratulations! You have successfully created a skill and learned how to install additional skills for Gemini CLI.

(Optional) Clean up

If you would like to clean up, you can delete your Cloud project to avoid incurring additional charges.

If you would like, delete the project:

gcloud projects delete $GOOGLE_CLOUD_PROJECT

You can also delete unnecessary resources from your Cloud Shell disk to free up space.

  1. Delete the lab directory (this removes both the skill and the app):
    rm -rf ~/agent-skills-lab
    
  2. Delete the "To Do" application directory (if you created it outside):
    rm -rf ~/todo-app
    

If you ever need to reset your Cloud Shell to its default state, you can follow the official documentation for instructions on how to do so safely.