【無料でスタート!】Gemini CLI + VS CodeでAIエージェント開発を体験しよう

この記事の内容

  • Googleアカウントだけで無料から使えるGemini CLIの導入手順を解説します
  • VS CodeとNode.jsのインストールから、Gemini CLIのセットアップまでをゼロから説明します
  • AIエージェントに指示するだけでToDoアプリを自動生成する体験ができます
  • 応答を日本語化する設定ファイル(Gemini.md)の使い方を紹介します
  • YOLOモードなどの高度な機能についても触れます

はじめに:このハンズオンの目的

今回の内容は「Gemini CLIとVS Codeを使って、AIエージェントによる開発をゼロから体験する」ことを目的としています。初心者でも理解できる内容で、以下の3つのゴールを目指します。

  • 無料で環境を整える
  • AIエージェントに指示して簡単なアプリを作成する
  • 「自分でも試せる」と思える段階まで理解する

使用ツール一覧

今回使用するツールは以下の通りです。

  • CLI(コマンドラインインターフェース)
  • Visual Studio Code
  • Gemini CLI + Companion拡張機能
  • Node.js

対象環境はWindowsですが、Macでもほぼ同様の手順で設定可能です。いずれも無料で利用でき、Googleアカウントが必要です。


VS CodeとNode.jsのインストール

VS Codeのインストール

まずはVS Codeをインストールします。

  1. ブラウザで code.visualstudio.com にアクセスします
  2. Windows版をダウンロードしてインストールします
  3. オプションで「右クリックメニューに『Codeで開く』を追加」を有効化しておくと便利です

Node.jsのインストール

Gemini CLIの動作にはNode.jsが必要です。

  1. nodejs.org からLTS版(x64)をダウンロードします
  2. インストール後、PowerShellで以下を実行してバージョンを確認します
node -v
npm -v

バージョンが表示されれば正常です。

もし「スクリプト実行が無効」と表示された場合は、管理者権限で以下のコマンドを入力します。

Set-ExecutionPolicy RemoteSigned

「Y」または「A」で許可し、PowerShellを再起動してください。


Gemini CLIのインストールとログイン

Node.jsの準備ができたら、Gemini CLIをインストールします。

npm install -g @google/gemini-cli

完了後、次のコマンドで起動します。

gemini

初回起動時に「Sign in with Google」画面が表示されるので、Googleアカウントで認証します。ブラウザが自動的に開き、認証が完了すればGeminiが利用可能になります。

認証後に再起動を促すメッセージが出た場合は「R」を押して再起動しましょう。試しに「こんにちは」と入力すると応答が返ってきます。これで正常に動作していることが確認できます。


VS Codeとの連携設定

CLI単体でも使えますが、VS Codeと連携させることで編集内容をAIが理解しやすくなります。

  1. VS Codeを開き、「ターミナル → 新しいターミナル」を起動します
  2. ターミナルで gemini と入力します
  3. 「VS CodeとGemini CLIを連携しますか?」と聞かれたら「Yes」を選択します

拡張機能が自動でインストールされない場合は、手動で「Gemini CLI Companion」を検索してインストールしてください。

接続が「Disconnected」と表示される場合は、以下を確認してください。

  • フォルダを開いていない可能性があります(例:gemini_test フォルダを作成して開く)
  • バージョン不一致の可能性があります(Gemini CLI 0.27.3、VS Code 1.19.0推奨)

再インストールや再起動で改善する場合もあります。なお、連携が不安定でもCLI単体での動作は問題ありません。


無料利用時の注意点

無料のGoogleアカウントで利用する場合、入力したデータがモデルの学習に使われる可能性があります。機密情報を扱う際は、有料プランの利用を検討してください。


AIエージェントでアプリを作成してみよう

環境が整ったら、いよいよAIエージェントを使ってアプリを作成します。例として「ローカルで動くシンプルなToDoアプリ」を作ってみましょう。

AIに次のように指示します。

ToDo

すると、AIが自動的に index.htmlstyle.cssscript.js を生成します。ファイル作成の確認が求められた際は「常に許可する」を選択するとスムーズです。

AIが生成したアプリは、ブラウザで開くとタスクの追加・削除が可能な基本的なToDoアプリとして動作します。人間が「ToDoアプリを作って」と指示するだけで、AIが構成を考え、コードを自動生成してくれます。


AIエージェントとの対話のコツ

AIエージェントはコマンドの実行やファイル操作も行えます。重要なのは「自分で操作する」のではなく、「AIに任せる」という発想です。

  • 分からないことは「分かりません」と伝えて説明を求める
  • 操作も「あなたが開いてください」と指示する
  • 設定ファイルの編集もAIに依頼する

こうした対話を繰り返すことで、AIに作業を委任する感覚を自然に身につけることができます。


応答を日本語化する:Gemini.mdの活用

AIの応答を日本語化したい場合は、プロジェクトのルートに Gemini.md ファイルを作成し、以下のように記述します。

この設定ファイルは自動的に読み込まれ、プロジェクト全体に反映されます。設定や振る舞いをAIに指示して自動構成させることも可能です。


高度な機能:YOLOモードと自動実行

「YOLOモード(You Only Live Once)」を使うと、AIが確認なしでコマンドやファイル操作を自動実行します。通常は操作のたびに確認が入りますが、YOLOモードではそのステップをスキップして処理を進めることができます。作業効率を上げたい場合に活用できる機能です。


まとめ

今回はGemini CLIとVS Codeを組み合わせたAIエージェント開発環境の構築手順を解説しました。

  • Node.jsとVS Codeをインストールし、npm install -g @google/gemini-cli でGemini CLIを導入できます
  • Googleアカウントで認証するだけで無料から利用を開始できます
  • VS CodeのCompanion拡張機能と連携することで、よりシームレスな開発体験が得られます
  • Gemini.md に指示を書くことで、日本語応答などの動作をカスタマイズできます
  • 「ToDoアプリを作って」と一言指示するだけで、AIがファイル構成からコード生成まで自動で行います

AIエージェントに作業を委任する感覚を掴むことが、AIを活用した開発の第一歩です。まずは無料の環境で気軽に試してみてください。