Gemini CLI Tutorial #10 - Using the Nanobanana Extension

Key Takeaways

Okay then gang. In this lesson we're going to be adding another extension to the Gemini CLI and that is the Google Nano Banana one which allows us to essentially use the Nano Banana models to generate images using some added commands. So I've already searched for the Nano Banana um extension on this page and it's this one that we want to install right here. If we click on that we can see the install command which I'm going to copy and then we can head back to VS Code to install it. So then I've got a terminal open here to install the extension from because we don't need to do it from within only our project in VS Code. The extension gets added globally to Gemini on the computer inside this dogeemini folder that I've already got open. And in fact, I'm just going to head into the extensions folder as well. So we can see over here when it does get added. All right. So now let me come to the terminal, paste in the command, and then hit enter. And then after a moment we should see the new nano banana extension folder added over here. Okay then. So now we can start using that extension and the commands it provides to generate images for this project. Now before we go any further I want to mention that you will need an API key to use this nano banana extension and it does cost money to use it. I think it works out that every image generated costs somewhere between about 15 and0 cents depending on the quality of the image. Now the process of creating an API key is exactly the same as before when we created one in the Google AI studio for authenticating in the Gemini CLI. And in fact, if you want, you can use the same API key for this, which is what I'm going to do. Now, if you've not watched that earlier lesson where we made an API key, then definitely go and check that out. First of all, I think it was lesson six in this series. Then we need to take that API key and add it to thev file so that nano banana can use it. So let's open thev file and make a new variable called nano banana all in uppercase gemini_appi_key and nanoanana will automatically use this environment variable when we send a request to generate an image. Anyway, I'm going to paste in my API key now and also save the file. And although I'm showing you my key, I would advise you not to make your own key public in any way because then other people can use it. So I'll be deleting mine after recording this course. So now we've installed the Nano Banana extension which includes a global MCP server setup and some custom commands that we can use in the CLI and we've also set up the API key as well for it to use. Now let's spin up a new instance of Gemini in the terminal and start using it. So then if we type a forward slash into the chat import then we can key up to see all the new nanobanana commands which have been added like the diagram one to generate a diagram the edit one to edit images uh the generate one to generate images the icon one to make icons and so forth and we can use any of these now to make an image and we can also manually add context to the commands as well. So, let's give this a whirl. I want Nano Banana to generate some images for the combo cards on the homepage. And if we open that homepage up and scroll down, we'll eventually reach those combo cards, which I'm going to select to add them to the context automatically. Then, in the chat, I'm going to use the generate command to generate some images. And after that, I'm going to paste in the following prompt. I need three images for the food combinations on the homepage. One for cheese and marmite, one for crisps and chocolate, and one for strawberries and pepper. So then I'm going to hit enter and see what happens. Okay. And like always, it's asking us for permission before it uses this MCP tool called generate image. I'm going to go to option two and say always allow this. All right. So now it's finished and it said it's put all the images inside this nano banana output directory. So let's take a look at that. I'm going to close this off and open up the file explorer and we can see this folder with three images. So this first one is mama and cheese. Looks pretty good. The second one is chocolate and crisps. That also looks good. By the way, if you've never had this combo, chocolate with salt and vinegar crisps, uh definitely try it. Love it. Third one is the strawberries with pepper. All right, so it's generated all those images for us. Awesome. So, I'm actually now going to ask it to use those images in this file right here for these combo cards. So, let me open up the um chat again. And by the way, we get this error. MCP error context 7. This is something I've been experiencing over the last week or so with the uh context 7 MCP server. If you restart your chat, it does go away. Anyway, I'm not going to do that. Instead, I'm going to say, "Can you add the three new images to the combo cards on the homepage?" All right, then. Let's see what it does. Let's press enter. All right. And it looks like it's added all those. So, I'm not going to browse the code. I can see that right here we've got an image URL. It also created some images inside one of these folders over here. I think it's in the public one. So, it moved them into the public directory. So, now I'm just going to jump straight to the browser so we can preview this. All right. So, moment of truth. Let's scroll down. All right. There we go. Cool. Looks pretty good. All right then, my friends. So, that's pretty much the end of this series. I hope you have learned a fair amount about the Gemini CLI and I would strongly recommend trying it out if you're open to using coding agents in your workflow. But again, like I say in a lot of my videos, be very careful about relying on AI too much when it comes to coding or anything else for that matter. I think if you rely on it too much, it's going to hamper your skill development in every single area of life. Coding, writing, design, or whatever else. Also, in the case of coding, AI is not a silver bullet. It can't solve every problem and it can make mistakes. So, it is important to stay in the loop at all stages of development in my experience and guide the AI correctly, dive it into the weeds when you need to. Anyway, if you want to see more of this tool on my channel, please let me know in the comments. And if you enjoy the videos, don't forget to share, subscribe, and like. That really helps out a lot. And I'm going to see you all in the very next series. And just one more thing before I leave, I wanted to let you know you can access my entire library of nearly 200 courses at netinja.dev. And included in that library are a load of longer masterclass courses and other pro exclusive tutorials not found anywhere else. And I'm frequently adding to them as well. So you can access them all by signing up for a Net Ninja Pro membership which is just $9 a month. And you'll get your first month half price using this promo code right here. Also by signing up to the site, you'll get access to the community boards which has support for all the Net Ninja courses, too. So I'll leave a link to the signup page down below the video and hopefully I'll see you all there. Heat. Heat. N. Hey, hey,