Gemini CLI 软件开发实战

摘要

本课程演示了如何使用 Gemini CLI 完成软件开发全流程，包括功能实现、代码测试和自动代码审查。通过构建会议网站的实际案例，展示了自定义斜杠命令、GitHub Actions 集成以及图像分析功能的应用。

要点

• Gemini CLI 可执行完整开发工作流：代码研究、功能实现、测试和审查
• 自定义斜杠命令支持调用外部工具（如 GitHub CLI）和 shell 命令
• 集成 GitHub Actions 实现自动 PR 审查，可添加评论和建议改进
• 支持图像分析功能，可通过截图理解 UI 问题并进行优化

视频信息：Gemini CLI for Software Development

中文翻译

现在,让我们看看 Gemini CLI 在软件开发中的实际应用。在本节课中,你将使用 Gemini CLI 为会议网站构建一个功能,包括研究代码库、实现功能以及进行测试。你将看到 Gemini CLI 如何处理从开始到结束的完整开发工作流。

让我们深入代码。Gemini CLI 是一个功能全面的工具,你可以用它来处理各种不同类型的任务,例如"氛围编程"(vibe coding)、自动化和编写脚本。你可以编写测试、清理代码库、调试问题。真的,在软件开发方面,可能性是无限的。

接着我们在会议项目上停下的地方继续,我们可以利用 Gemini CLI 来增强我们的网站并构建一些功能。我们刚刚确定了会议的日程安排和演讲者名单。我们将让 Gemini CLI 实际实现一个功能请求,即填充会议网站上的"会议目录(session catalog)“页面。

我绝对建议再次查看我们的扩展页面,因为有很多非常棒的面向开发者的工具可以作为扩展进行安装。如果我们回到 TechStack 会议网站并进入会议目录页面,我们可以看到目前目录中没有任何会议。在 GitHub 上有一个针对此功能的未解决功能请求(Feature Request)。它非常详细,你可以去浏览一下,其中包含了我们希望每个会议能够被过滤或搜索的信息类型。

我们在前面简要提到过,但现在我们将向你展示 Gemini CLI 中自定义斜杠命令(custom slash commands)的威力。自定义斜杠命令存放在你 .gemini 文件夹下的 commands 子文件夹中。这些是 .toml 文件,允许你设置描述和提示词。这可以是任何东西,从像我们在这里做的实现功能请求,到代码审查。

实际上,我们将调用 GitHub CLI 并通过使用以下语法实际触发一个 shell 命令。我们会通过一个感叹号后跟花括号来告诉它使用 shell 命令。在花括号内,我们放入我们的 shell 命令,即 gh issue view。这将继续并实际使用 GitHub CLI 来拉取我们的功能请求,并获取我们需要的所有信息,以便继续并实现它。我们还通过花括号接收参数。这让我们能够传递我们想要拉取的问题编号。因此,当我们触发此命令时,我们将传入数字 5,因为那是我们仓库中的问题编号。

当我们运行这个斜杠命令时,它会询问我们是否要触发其中的 shell 命令。让我们允许它。

在我们的自定义斜杠命令中,我们告诉 Gemini CLI 去计划,然后迭代,接着测试和审查。所以它将按照我们定义的顺序执行所有这些动作。你会看到,一旦它完成更改,它就会提示运行测试。npm run test 命令早些时候已经在我们的 GEMINI.MD 上下文文件中了。所以我们可以实际看到测试失败了,因为我们添加了新功能。Gemini CLI 应该能够捕捉到这一点。

对于交互式命令,Gemini CLI 允许你按 Ctrl+F 聚焦到 shell 上。所以我们可以聚焦到 shell 上并按 Q 退出。现在 Gemini CLI 应该有望去修复这些测试。

现在,在它修复更改后,让我们继续再次运行测试。我们可以看到所有测试都通过了,代码已正确更新。现在 Gemini CLI 告诉我们该功能已完全实现。让我们去检查一下。

回到网站并查看我们新的会议目录页面。页面显示了 32 个会议,我们可以实际滚动浏览并查看所有不同的会议及其详细信息。我们甚至可以进行过滤和搜索,比如我们可以搜索"Future of AI is Here"并找到相应的会议。Gemini CLI 已经成功实现并测试了这个新功能。

在查看会议目录时,我注意到日程安排和"本周概览(week at a glance)“的格式并不是很好看。它占据了屏幕的整个宽度,而我们其实可以将所有这些信息分栏显示,以便你可以在一个地方看到所有内容。我们可以截一张图,然后实际将其粘贴到 Gemini CLI 中,让 Gemini CLI 分析图像并理解它,然后做出适当的更改。

我们只需像往常一样输入提示词并粘贴我们的图像,你应该会看到它被添加到提示框中。看起来 Gemini CLI 甚至在确保它不会破坏任何测试。干得好,Gemini。这看起来好多了。

我们现在甚至会让 Gemini CLI 检出一个新分支并提交我们刚刚所做的更改。在执行此过程中,Gemini CLI 甚至会生成一个非常漂亮的提交信息。

在我推送这些更改之前,我实际上想设置一个自动拉取请求(Pull Request)审查器,以便作为 GitHub Action 的 Gemini CLI 实际上能在每一个拉取请求上运行并进行详细的审查。我们可以通过使用 /setup-github 命令在 Gemini CLI 中完成此操作。这个命令的作用是下载 GitHub Actions 的所有工作流文件,并自动为你的仓库配置它们。然后它会打开一个页面,你可以通过该页面查看所有详细信息以及如何对其进行身份验证。我会将这些步骤添加到课程末尾的阅读列表中。

我已经设置好了所有这些自动化,所以我们不必从头走一遍所有步骤,但当我们提交这个拉取请求时,我们应该会看到 Gemini CLI 自动启动拉取请求审查。

Gemini CLI 的 GitHub Action 也可以用于不同的工作流。你甚至可以直接在拉取请求上发表评论”@Gemini CLI, can you please explain this to me?(@Gemini CLI,你能给我解释一下这个吗?)",它实际上会启动一个工作流来添加评论并为你描述该拉取请求。

当 GitHub Action 完成后,它会在拉取请求上评论其摘要以及一般反馈,并且它实际上会添加带有建议更改的评论。它还会根据严重程度用不同的颜色(如黄色)标记它们。这个建议看起来不错。让我们继续提交它,然后合并。

所以现在我们实际上已经用 Gemini CLI 实现了一个功能,并让它审查自己的功能,实际上还根据它自己的审查进行了修复。我建议你试一试,并在你自己的仓库中配置它。让我们知道进展如何。

English Script

Now let’s see Gemini CLI in action for software development. In this lesson, you’ll use Gemini CLI to build a feature for a conference website, researching the code base, implementing the feature, and testing it. You’ll see how Gemini CLI handles the full development workflow from start to finish.

Let’s dive into the code. Gemini CLI is a well-rounded tool that you can use for all sorts of different types of tasks, such as vibe coding, automation and writing scripts. You can write tests, clean up your codebases, debug issues. Really, the possibilities are endless in terms of software development.

Continuing where we left off with the conference, we can leverage Gemini CLI to enhance our website and build out some features. We just finalized the schedule and list of speakers for the conference. We’re going to have Gemini CLI actually implement a feature request to populate the session catalog page on the conference website.

I definitely recommend checking out our extensions page again as there are a lot of great developer focused tools that you can install as extensions. If we head back over to the TechStack conference website and go to the session catalog page, we can see that we currently don’t have any sessions in our catalog. There is an open feature request on GitHub for this feature. It’s quite detailed and you can go ahead and look through it and it has the type of information that we want each session to be able to be filtered by or searched through.

We touched on it briefly earlier, but now we’re going to show you the power of custom slash commands in Gemini CLI. Custom slash commands live in your .gemini folder within a subfolder for commands. These are .toml files that let you put a description and a prompt. This can be anything from implementing a feature request like we’re doing here to reviewing code.

We’re actually going to call the GitHub CLI and actually trigger a shell command by using the following syntax. We’ll tell it to use a shell command by indicating an exclamation mark followed by curly brackets. Inside the curly brackets, we’ll put our shell command, so gh issue view. This is going to go ahead and actually use the GitHub CLI to pull in our feature request and get all the information we need to go ahead and then implement it. We also take in an arguments in curly brackets. This lets us pass the issue number that we want to go ahead and pull in. So when we trigger this, we will pass in number five as that is the issue number on our repository.

When we run the slash command, it will ask us if we want to trigger the shell command within it. Let’s go ahead and allow it.

In our custom slash command, we told the Gemini CLI to go and plan, then iterate, and then test and review. So it’s going to go through the motions of all of those in the order that we defined. And you’ll see that once it’s done making the changes, it’s going to go ahead and prompt to run the tests. The npm run test command was in our GEMINI.MD context file earlier. So we can actually see that the tests are failing since we’ve added new functionality. Gemini CLI should be able to pick up on this.

For commands that are interactive, Gemini CLI allows you to press Ctrl+F to focus in on the shell. So we can go ahead and focus in on the shell and press Q to quit. Now Gemini CLI should hopefully go and fix those tests.

Now let’s go ahead and run the tests again after it’s fixed the changes. We can see that all the tests passed, the code has been properly updated. Now Gemini CLI is telling us the feature has been fully implemented. Let’s go check it out.

Heading back over to the website and looking at our new session catalog page. The page is showing 32 sessions and we can actually scroll through and see all the different sessions and view the details. We can even filter and search, so we can go ahead and search “Future of AI is Here” and find the proper session. Gemini CLI has successfully implemented and tested the new feature.

While looking at the session catalog, I noticed that the schedule and week at a glance is not really the nicest format. It’s taking up the whole width of the screen, whereas we could display all this information in columns so that you can see it all in one place. We can take a screenshot and actually paste it into Gemini CLI and have Gemini CLI analyze the image and understand it and make proper changes.

We’ll just type out our prompt as normal and paste in our image and you should see it get added to the prompt box. It looks like Gemini CLI is even making sure it doesn’t break any tests. Good job, Gemini. That looks a lot better.

We’ll now have Gemini CLI even check out a new branch and commit the changes that we just made. As we go through this, Gemini CLI will even make a really nice commit message.

Before I push these changes, I actually want to set up an automatic pull request reviewer so that Gemini CLI as a GitHub action will actually run on every single pull request and do a detailed review. We can do this in Gemini CLI by using the /setup-github command. What this command does is it goes ahead and downloads all the workflow files for the GitHub actions and automatically configures them for your repository. It will then open up a page that you can go through to see all the details and how you can authenticate it. I’ll add these steps to the reading list at the end of the course.

I’ve already set up all this automation, so we don’t have to go through all the steps, but as we put up this pull request, we should see the Gemini CLI will automatically kick off a pull request review.

The GitHub action for Gemini CLI can also be used for different workflows. You can even just comment on a pull request “@Gemini CLI, can you please explain this to me?” and it’ll actually go ahead and kick off a workflow to just add a comment and describe the pull request for you.

When the GitHub action is done, it will comment on the pull request with its summary, as well as general feedback, and it will actually go ahead and add comments with suggested changes. And it will mark them with a different color such as yellow, based on the severity. This suggestion looks good. Let’s go ahead and commit it, and then merge.

So now we’ve actually implemented a feature with Gemini CLI and had it review its own feature and actually make a fix from its own feature. I recommend giving this a try and configuring it on your own repositories. Let us know how it goes.