GSP1348

概要

バイブ コーディングは、AI を使用して自然言語プロンプトから実用的なコードを生成する新しいソフトウェア開発手法です。これにより開発が加速され、特にプログラミング経験が少ない人でも、アプリの構築が身近になります。

AI 研究者の Andrej Karpathy 氏が 2025 年初頭に考案したこの用語は、コードを 1 行ずつ記述するのではなく、Gemini CLI などの AI アシスタントをガイドしながら、会話的なプロセスを通じてアプリケーションを生成、改良、デバッグするワークフローのことを指します。実際のコードの記述は AI が処理するため、ユーザーはアプリ全体の設計や主な目標に集中できます。

Gemini CLI は、Gemini の機能をターミナルから直接利用できるオープンソースの AI エージェントです。Gemini CLI プロジェクトはオープンソースであるため、公開ロードマップから機能強化の予定や今後の機能、バグ修正の詳細を確認できます。

学習内容

このラボでは、次のタスクの実行方法について学びます。

• Gemini CLI を構成する。
• Gemini CLI を操作する。
• Gemini CLI の組み込みツールを調べる。
• シェルモードで Gemini CLI を使用する。
• Gemini CLI で MCP サーバーを構成する方法を確認する。
• Gemini CLI を使用してバイブ コーディングを行う。

必要なもの

このラボは、Gemini CLI がプリインストールされた Google Cloud Shell 内ですべて実行できます。

初心者を含むあらゆるレベルのユーザーと開発者を対象としています。

設定と要件

[ラボを開始] ボタンをクリックする前に

こちらの説明をお読みください。ラボには時間制限があり、一時停止することはできません。タイマーは、Google Cloud のリソースを利用できる時間を示しており、[ラボを開始] をクリックするとスタートします。

このハンズオンラボでは、シミュレーションやデモ環境ではなく実際のクラウド環境を使って、ラボのアクティビティを行います。そのため、ラボの受講中に Google Cloud にログインおよびアクセスするための、新しい一時的な認証情報が提供されます。

このラボを完了するためには、下記が必要です。

• 標準的なインターネット ブラウザ（Chrome を推奨）

注: このラボの実行には、シークレット モード（推奨）またはシークレット ブラウジング ウィンドウを使用してください。これにより、個人アカウントと受講者アカウント間の競合を防ぎ、個人アカウントに追加料金が発生しないようにすることができます。

• ラボを完了するための時間（開始後は一時停止できません）

注: このラボでは、受講者アカウントのみを使用してください。別の Google Cloud アカウントを使用すると、そのアカウントに料金が発生する可能性があります。

Cloud Shell をアクティブにする

Cloud Shell は、開発ツールと一緒に読み込まれる仮想マシンです。5 GB の永続ホーム ディレクトリが用意されており、Google Cloud で稼働します。Cloud Shell を使用すると、コマンドラインで Google Cloud リソースにアクセスできます。

1. Google Cloud コンソールの上部にある「Cloud Shell をアクティブにする」アイコン をクリックします。

2. ウィンドウで次の操作を行います。

   • Cloud Shell 情報ウィンドウで操作を進めます。
   • Cloud Shell が認証情報を使用して Google Cloud API を呼び出すことを承認します。

接続した時点で認証が完了しており、プロジェクトに各自の Project_ID、 が設定されます。出力には、このセッションの PROJECT_ID を宣言する次の行が含まれています。

Your Cloud Platform project in this session is set to {{{project_0.project_id | "PROJECT_ID"}}}

gcloud は Google Cloud のコマンドライン ツールです。このツールは、Cloud Shell にプリインストールされており、タブ補完がサポートされています。

3. （省略可）次のコマンドを使用すると、有効なアカウント名を一覧表示できます。

gcloud auth list

4. [承認] をクリックします。

出力:

ACTIVE: * ACCOUNT: {{{user_0.username | "ACCOUNT"}}} To set the active account, run: $ gcloud config set account `ACCOUNT`

5. （省略可）次のコマンドを使用すると、プロジェクト ID を一覧表示できます。

gcloud config list project

出力:

[core] project = {{{project_0.project_id | "PROJECT_ID"}}} 注: Google Cloud における gcloud ドキュメントの全文については、gcloud CLI の概要ガイドをご覧ください。

タスク 1. ニーズに合わせて Gemini CLI を構成する

Gemini CLI の Cloud Logging を有効にする

このラボの一部のタスクは、スコアリングするために Gemini CLI に対して Cloud Logging を有効にする必要があります。

• Cloud Shell で次のコマンドを実行して、Gemini CLI の Cloud Logging を構成します。

export ZONE=$(gcloud compute instances list \ --filter "name="lab-vm"" --format "value(zone.basename())") export EXTERNAL_IP=$(gcloud compute instances describe \ lab-vm --zone=$ZONE \ --format='get(networkInterfaces[0].accessConfigs[0].natIP)')

Gemini CLI の構成オプション

Gemini CLI の動作は、構成ファイルと環境変数によって制御されます。動作に影響を与える重要なファイルとして、次の 2 つがあります。

• .gemini/settings.json: このファイルは外部ツールへの接続方法など、CLI の構成を制御します。

• GEMINI.md: このファイルは、モデルに自然言語のガイドラインとコンテキストを提供します。CLI はこのファイルを読み取って、プロジェクトのコーディング標準と規則を把握します。

settings.json による Gemini CLI の構成

Cloud Shell を使用して Gemini を実行する場合、Gemini CLI のデフォルトのテーマと認証方法がすでに選択され、構成されています。Gemini CLI が設定を「記憶」するために使用するファイルは settings.json と呼ばれ、Gemini CLI のカスタマイズにも使用できます。

Cloud Shell では、このファイルは次のディレクトリにあります。

~/.gemini/settings.json

GEMINI.md による Gemini CLI の構成

Gemini CLI の動作は、~/.gemini/ ディレクトリにある settings.json ファイルで構成できますが、GEMINI.md を使用して構成することもできます。

GEMINI.md ファイルは、Gemini モデルに提供される指示コンテキスト（「メモリー」とも呼ばれます）を構成するための重要なコンテキスト ファイルです。デフォルトは GEMINI.md ですが、settings.json ファイルの contextFileName プロパティで構成できます。

このファイルを使用することで、プロジェクト固有の指示やコーディング スタイルガイド、関連する背景情報を AI に提供でき、ニーズに合わせてカスタマイズされた正確な回答を得られます。

GEMINI.md ファイルはマークダウン形式です。

GEMINI.md ファイルには何が含まれているのでしょうか。以下に、Gemini CLI の公式ドキュメントに基づいて作成された例の内容を示します。

GEMINI.md ファイルのサンプル:

# プロジェクト: My Awesome TypeScript Library ## 一般的な指示: - 新しい TypeScript コードを生成するときは、既存のコーディング スタイルに従う。 - すべての新しい関数とクラスに JSDoc コメントがあることを確認する。 - 適切な場合は、関数型プログラミング パラダイムを優先する。 - すべてのコードは TypeScript 5.0 および Node.js 20 以降と互換性があること。 ## コーディング スタイル: - インデントには 2 つのスペースを使用する。 - インターフェース名には接頭辞「I」を付ける必要がある（例: 「IUserService」）。 - 非公開クラスのメンバーには接尾辞としてアンダースコア（「_」）を使用する。 - 常に厳密等価演算子（「===」、「!==」）を使用する。 ## 特定のコンポーネント: 「src/api/client.ts」 - このファイルは、すべての送信 API リクエストを処理する。 - 新しい API 呼び出し関数を追加する際は、堅牢なエラー処理とロギングを含める。 - すべての GET リクエストに既存の「fetchWithRetry」ユーティリティを使用する。 ## 依存関係について: - 絶対に必要な場合を除き、新しい外部依存関係を導入しない。 - 新しい依存関係が必要な場合は、その理由を明示する。

サンプル GEMINI.md ファイルには、一般的な指示に加えて、コーディング スタイルや依存関係の管理など、非常に具体的な指示が記載されています。これを参考に、使用するプログラミング言語やフレームワーク、コーディング スタイル、その他のプロジェクト固有の設定に基づいて、独自のガイドラインを作成することもできます。

GEMINI.md ファイルは、Gemini CLI をユーザーの好みに合わせるうえで重要です。詳しくは、実践 Gemini CLI シリーズをご覧ください。このシリーズでは、プロジェクトのファイルを自動生成する方法や、システム プロンプトをカスタマイズする方法などを詳しく説明しています。

プロジェクト固有の構成を設定する

Gemini CLI の使用を開始する前に、ホームフォルダとして使用するフォルダを作成する必要があります。このホームフォルダの中に、すべてのプロジェクトを作成します。ホームフォルダは Gemini CLI が動作するための開始点ですが、必要に応じてシステム上の他のフォルダを参照する場合があります。

1. Cloud Shell で次のコマンドを実行して、サンプル フォルダ gemini-cli-projects を作成し、そのフォルダに移動します。

mkdir gemini-cli-projects cd gemini-cli-projects

2. 次に、以下のコマンドを実行して、settings.json 構成ファイルを含む .gemini サブディレクトリを作成します。

mkdir -p .gemini echo '{ "telemetry": { "enabled": true, "target": "gcp", "otlpEndpoint": "http://${EXTERNAL_IP}:4318/v1/logs", "otlpProtocol": "http", "logPrompts": true, "useCollector": true } }' > .gemini/settings.json

Cloud Shell には Gemini CLI がプリインストールされています。

3. Gemini CLI の操作を開始するには、Cloud Shell ターミナルの [✦ Gemini CLI] タブに切り替えます。

Gemini CLI を初めて使用するときに、認証方法の選択を求められる場合があります。

4. 認証モードの選択を求められた場合は、2 を押して [2. Use Cloud Shell user credentials] を選択します。認証を求められない場合は、そのままで構いません。このステップは無視して、ラボを進めてください。

認証に成功すると、Gemini CLI がコマンドを受け付ける状態になります。サンプルのスクリーンショットを以下に示します。

後続のタスクでモデルを詳しく扱うため、ここで Gemini CLI を終了しても構いません。

5. Gemini CLI を終了するには、Ctrl+D キーまたは Ctrl+C キーを 2 回押すか、/quit コマンドを実行します。

タスク 2. Gemini CLI を操作する

このタスクでは、Gemini CLI の使用を開始します。このラボのスコアリング機能を安定させるために、まず Gemini CLI の特定のバージョンをインストールします。その後、Gemini CLI 操作用に作成したプロジェクト固有のフォルダ内で作業を開始し、新しい Gemini セッションを開始します。

1. Cloud Shell で次のコマンドを実行して、関連するバージョンの Gemini CLI をグローバルにインストールします。 npm install -g @google/gemini-cli@0.6.1

注: インストール プロセスの完了には、最大で 5 分ほどかかります。

2. 次のコマンドを実行して Gemini CLI を起動し、新しいセッションを開始します。

   gemini

3. 以下のテキストをコピーして貼り付け、Enter キーを押して Gemini CLI に最初のクエリのプロンプトを入力します。

AI に関する名言と、その発言者を教えてください。

想定されるレスポンスは次のとおりです。

出力:

╭─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╮ │ ✓ GoogleSearch でウェブを検索: 「AI に関する名言」 │ │ │ │ 「AI に関する名言」の検索結果が返されました。 │ ╰─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╯ ✦ 「完全な人工知能の開発は、人類の終焉を意味する可能性がある。」- スティーヴン ホーキング

クエリの結果、GoogleSearch ツール（Gemini CLI の組み込みツール）が呼び出されました。組み込みツールについては、このラボで後ほど詳しく説明します。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 Gemini CLI を操作する

4. Gemini CLI と、サポートされているコマンドを確認したい場合は、先頭にスラッシュを付けて「/help」と入力するだけで、利用可能なコマンドやキーボード ショートカットの一覧が表示されます。

/help コマンドは、いわゆるスラッシュ コマンドの一例です。これらの組み込みの Gemini CLI コマンドの詳細については、スラッシュ コマンド（/）のドキュメントをご覧ください。

タスク 3. Gemini CLI の組み込みツールを調べる

Gemini CLI には、Gemini モデルがローカル環境と連携し、情報の取得や各種アクションを実行するための組み込みツールが用意されています。これらのツールは CLI の機能を強化し、テキスト生成だけでなく、幅広いタスクの支援にも役立ちます。

詳しくは、ツールのドキュメントをご覧ください。

• 現在の組み込みツールのリストを取得するには、/tools コマンド（/tools と入力）を呼び出します。

出力例:

ℹ 利用可能な Gemini CLI ツール: - Edit - FindFiles - GoogleSearch - ReadFile - ReadFolder - ReadManyFiles - Save Memory - SearchText - Shell - WebFetch - WriteFile

Gemini CLI がこれらのツールを必要に応じて簡単に呼び出せるかというと、答えは「いいえ」です。デフォルトでは、ローカル システムへの書き込み、外部システムからの読み取り、外部ネットワークへのアクセスなど、機密性の高い操作を行う場合、モデルは常に許可を求めます。

CLI を起動するときに --yolomode を使用できます（通常は推奨されません）。この場合、Gemini CLI は選択したツールを実行する際に、権限を求めるメッセージを表示することがあります。権限を拒否する、1 回だけ実行する、包括的な権限を付与して常に実行する、のいずれかを選択できます。これにより、すべてを完全に制御できます。

プロンプトを入力して CLI に組み込みツールを使用させる

このセクションではプロンプトを入力して Gemini CLI に組み込みツールを 1 つ選択および実行させることで、Gemini CLI の仕組みを理解します。

たとえば、世界中の最新の金融ニュースに関する情報を取得し、Gemini CLI を起動したローカル作業ディレクトリ内のファイルに保存するとします。

1. Gemini CLI に次のプロンプトを入力します。

今日の金融業界の最新ニュースを検索し、finance-news-today.txt というファイルに保存してください。

まず、GoogleSearch ツールを呼び出してウェブを検索します。

検索が完了すると、次のようなデータが取得されます。

その後、ファイルに書き込む準備が整うと、WriteFile ツールが使用されます。書き込みは機密性の高い操作であるため、実行には権限が必要です。権限は、1 回のみ許可する、常に許可するなど、必要に応じて選択できます。

2. ここでは、1 回のみ許可するために Enter キーを押します。

その後、情報がファイルに書き込まれ、次のような成功メッセージが表示されます。

想定される出力:

✦ 最新の金融ニュースの見出しを finance-news-today.txt に保存しました。

ファイルが書き込まれているかを確認するには、@file を使用してコンテンツを読み取るよう指示します。また、「@」と入力すると、作成したファイルを含む現在のフォルダ内のファイル一覧が表示されます。

注: Flash モデルを使用する場合は、Cloud Shell で次のコマンド（-m パラメータの後にモデル名を指定）を実行します。

gemini -m "gemini-2.5-flash"

Gemini CLI の実行中は、Gemini CLI ターミナルの右下で現在実行中のモデルを確認できます（次のスクリーンショットを参照）。

非インタラクティブ モードを使用する

Gemini CLI には、非インタラクティブ モードで実行するオプションもあります。このモードでは、プロンプトを直接指定することで、Gemini CLI のインタラクティブ ターミナルを開かずに Gemini が回答します。スクリプトやその他の自動化プロセスの一部として Gemini CLI を使用する場合に非常に便利です。

1. セッションを終了します（Ctrl+D キー、もしくは Ctrl+C キーを 2 回押す、または /quit プロンプトを実行）。

2. Cloud Shell で、-p パラメータを指定して次のコマンドを実行します。

gemini -p "Cloud Run にデプロイするための gcloud コマンドは何ですか？"

非インタラクティブ モードでは、フォローアップの質問で会話を続けることはできないことに注意してください。このモードでは、ツール（WriteFile を含む）の認証やシェルコマンドの実行もできません。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 Gemini の非インタラクティブ モードを使用する

タスク 4. シェルモードで Gemini CLI を使用する

Gemini CLI から直接シェルを操作することもできます。

1. 次のコマンドで Gemini CLI をもう一度起動します。

gemini

2. プロンプト ボックス内で ! キーを押すと、シェルモードに切り替わります。

シェルモードでは、以下に示すようにプロンプトの先頭に ! が表示されます。

シェルモードでは、pwd、cat、ls などの標準的なコマンドを直接使用できます。

cat コマンドを使用して、ファイルの内容を出力してみましょう。

3. Gemini CLI に次のプロンプトを入力します。 cat finance-news-today.txt

出力例:

4. シェルモードを終了するには、! キーをもう一度押すか、ESC キーを押します。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 シェルモードで Gemini CLI を使用する

タスク 5. Model Context Protocol（MCP）サーバーを構成する

MCP サーバーは、Model Context Protocol を介してツールやリソースを Gemini CLI に公開するアプリケーションです。これにより、Gemini CLI は外部のシステムやデータソースとやり取りできるようになります。MCP サーバーは、Gemini モデルとローカル環境または API などの他のサービスをつなぐ役割を果たします。

MCP サーバーにより、Gemini CLI はツールを検出して実行できるようになります。この結果、Gemini CLI の機能が拡張され、データベース、API、カスタム スクリプト、特殊なワークフローとのやり取りなど、組み込み機能を超えたアクションが可能となります。

Gemini CLI では、カスタムツールを検出して使用するために MCP サーバーの構成をサポートしています。

1. Gemini CLI を起動している場合は、/mcp コマンドを使用して、構成された MCP サーバーを次のように確認できます。

MCP サーバーを構成していない場合は、Gemini CLI の MCP サーバーに関するドキュメントが表示されます。

MCP サーバーは、~/.gemini/settings.json ファイルまたはプロジェクトのルート ディレクトリにグローバル レベルで構成できます。

Gemini CLI を実行している場合は、Ctrl+D キーまたは Ctrl+C キーを 2 回押してセッションを終了できます。

2. Cloud Shell ターミナルで、ツールバーの [エディタを開く] をクリックして Cloud Shell エディタを起動します。
3. .gemini サブディレクトリはデフォルトでは非表示のため、[View] > [Toggle hidden files] を選択して、非表示のファイルとディレクトリを表示します。
4. Cloud Shell エディタで、プロジェクト固有のフォルダ gemini-cli-projects に移動して .gemini/settings.json ファイルを開きます。

~/.gemini/settings.json ファイル内で、mcpServers 構成ブロックを構成する必要があります。構文は次のとおりです。

"mcpServers": { "server_name_1": {}, "server_name_2": {}, "server_name_n": {} }

次のタスクでは、このファイルを MCP サーバーに対応するよう構成します。

リファレンス ドキュメントに記載されているとおり、各サーバー構成では次のプロパティがサポートされています。

必須（次のいずれか）

• command（文字列）: Stdio トランスポートの実行可能ファイルへのパス
• url（文字列）: SSE エンドポイントの URL（例: "http://localhost:8080/sse")
• httpUrl（文字列）: HTTP ストリーミング エンドポイントの URL

省略可

• args（文字列の配列）: Stdio トランスポートのコマンドライン引数
• headers（オブジェクト）: url または httpUrl を使用する場合のカスタム HTTP ヘッダー
• env（オブジェクト）: サーバー プロセスの環境変数。値は、$$VAR_NAME または $${VAR_NAME} 構文を使用して環境変数を参照できます
• cwd（文字列）: Stdio トランスポートの作業ディレクトリ
• timeout（数値）: リクエストのタイムアウト（ミリ秒単位。デフォルトは 600,000 ミリ秒 = 10 分）
• trust（ブール値）: true の場合、このサーバーに対するすべてのツール呼び出し確認をバイパスします（デフォルトは false）
• includeTools（文字列の配列）: この MCP サーバーから利用を許可するツール名のリスト。指定した場合、このサーバーから利用できるのは、ここに記載されたツールのみになります（許可リスト方式）。指定しない場合は、サーバーのすべてのツールがデフォルトで有効になります。
• excludeTools（文字列の配列）: この MCP サーバーから除外するツール名のリスト。ここに記載されたツールは、サーバーによって公開されていても、モデルでは利用できません。なお、excludeTools は includeTools より優先されるため、両方のリストに記載されているツールは除外されます。

注: 次へ進む前に、サードパーティの MCP サーバーに接続または統合する際は注意が必要です。情報とシステムの完全性を保護するため、信頼でき、十分に精査されたソースの MCP サーバーのみと統合することをおすすめします。

GitHub MCP サーバーを設定する

GitHub の公式 MCP サーバーには、公開するツールとその構成方法に関する必要なドキュメントが用意されています。Gemini CLI はリモート MCP サーバーもサポートしているため、ローカルまたはリモートで実行できます。

このセクションでは、GitHub のリモート MCP サーバーを設定します。まず、GitHub の個人用アクセス トークン（PAT）を用意します。

次に、settings.json ファイルに MCP サーバー オブジェクトを追加して、GitHub MCP サーバー構成を指定します。

従来の GitHub PAT を作成する

このセクションでは、従来の GitHub PAT を作成し、トークンの有効期限を無期限に設定して、利用可能なすべての権限を許可します。

1. GitHub のデベロッパー設定ページに移動し、[Personal access tokens] プルダウンを開いて [Tokens (classic)] を選択します。
2. [Generate new token] をクリックし、プルダウンから [Generate new token (classic)] を選択します。
3. [Note] フィールドにトークンの一意の名前を入力し、[Expiration] を [No expiration] に設定します。[Select scopes] の下のチェックボックスをオンにし、利用可能なすべての権限を許可します。
4. [Generate token] をクリックします。
5. コピー（⧉）アイコンをクリックして、トークンをクリップボードにコピーし、後で使用できるように保存します。

詳細については従来の個人用アクセス トークンの作成に関する GitHub ドキュメントを参照して、独自の PAT を作成してください。

GitHub MCP サーバーの構成を進める

1. Cloud Shell で次のコマンドを実行して、Cloud Shell エディタで settings.json ファイルを開きます。

   edit .gemini/settings.json

2. settings.json ファイルを編集します（現在は次の例のようになっているはずです）。

   { "telemetry": { "enabled": true, "target": "gcp", "otlpEndpoint": "http://${EXTERNAL_IP}:4318/v1/logs", "otlpProtocol": "http", "logPrompts": true, "useCollector": true } }

3. ファイルの先頭にある最初の波かっこ（{）に続けて、次の JSON を挿入します。"Bearer " の後の [プレースホルダ] は PAT に置き換えます。

"theme": "Default", "mcpServers": { "github": { "httpUrl": "https://api.githubcopilot.com/mcp/", "trust": false, "headers": { "Authorization": "Bearer [replace-with-your-github-PAT]" } } },

settings.json には、ほかにも設定が含まれている場合がありますが、最終的な結果は次のような形式になります。

{ "theme": "Default", "mcpServers": { "github": { "httpUrl": "https://api.githubcopilot.com/mcp/", "trust": false, "headers": { "Authorization": "Bearer [replace-with-your-github-PAT]" } } }, "telemetry": { "enabled": true, "target": "gcp", "otlpEndpoint": "http://${EXTERNAL_IP}:4318/v1/logs", "otlpProtocol": "http", "logPrompts": true, "useCollector": true } }

4. ツールバーの [ターミナルを開く] をクリックして Cloud Shell ターミナルに戻り、次のコマンドを実行して Gemini CLI を起動します。起動時に更新された settings.json ファイルが読み込まれ、構成済みの GitHub MCP サーバーが有効になります。

gemini

5. MCP サーバーが構成され、使用可能な状態であることを確認するには、/mcp プロンプトを入力します。

次のスクリーンショットは、マシンに構成された GitHub MCP サーバーと、Gemini CLI から MCP を操作するために使用できる各種ツールを示しています。

出力例:

次に、プロンプトを入力して GitHub MCP サーバーのツールを 1 つ呼び出します。

6. 次のプロンプトを入力します。

GitHub における私の名前は？

想定される出力:

GitHub MCP サーバーから適切なツールが選択されます。ただし、他の組み込みツールと同様に、このツールを呼び出すには明示的な権限を付与する必要があります。

7. Enter キーを押して [1. Yes, allow once] を選択し、GitHub サーバーの「get_me」ツールがクエリを実行できるようにします。

注: このタスクのスコアを取得するには、このインスタンスで [Yes, allow once] を選択する必要があります。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 「GitHub における私の名前は？」と尋ねる

GitHub MCP サーバーが構成されたので、GitHub プロジェクトの 1 つを操作するために、次のような自然言語でクエリを入力できます。

• <repo-name> について説明して。
• ローカルマシンに <repo-name> のクローンを作成して。
• @<file-name> や @<directory-name>/ について説明して。
• このリポジトリのコンポーネントにはどのようなものがありますか。
• 必要な変更を加えました。GitHub MCP サーバーツールを使って、この変更を GitHub に push できますか。

その他の MCP サーバー

以下は、参考として検討できるその他の MCP サーバーのリストです。

• Firebase MCP サーバー
• Google 生成 AI メディア サービス（Imagen、Veo、Lyria）
• データベース向け MCP ツールボックス（Firestore、BigQuery、Google Cloud のデータベースに対応）
• Google Workspace MCP サーバー（ドキュメント、スプレッドシート、カレンダー、Gmail に対応）

これらの MCP サーバーの設定手順は、このブログ投稿で公開されています。

タスク 6. Gemini CLI を使用してバイブ コーディングを行う

このタスクでは、Gemini CLI を使用してウェブサイトのバイブ コーディングを行います。Gemini CLI に対して、ウェブサイトの構造を生成し、設定するよう指示します。

注: 指示内容が正確であっても、バイブ コーディングでは、モデルが指示から逸脱することや、ハルシネーションの発生、ループ状態に陥ることがあります。モデルが行き詰まった場合は、ESC キーを押し、指示を更新して再度プロンプトを入力するか、以前の指示を繰り返します。

1. Gemini CLI で、次のプロンプトを入力します。

技術的な講演が盛りだくさんの 1 日イベント用のウェブサイトを生成してください。イベントでは、連続して 6 つの公演を行い、各講演の所要時間は 1 時間とします。講演ごとに、タイトル、講演者（1～2 名）、カテゴリ（1～3 つのキーワード）、所要時間、説明を記載します。ウェブサイトは 1 ページ構成とし、ユーザーが 1 日全体のスケジュールおよび各講演の開始時刻と終了時刻を確認できるようにしてください。イベントは午前 10 時に開始します。講演と講演の間には 10 分間の休憩を設け、1 時間の昼休みを 1 回入れてください。サーバーサイドには Node.js を使用し、フロントエンドには標準的な HTML、JavaScript、CSS を使用します。また、ユーザーがカテゴリに基づいて講演を検索できる機能を実装してください。 これらの作業は、次の手順で進めてください。 1. アプリケーションの設計方針とコーディング計画を立てます。 2. 不明な点があれば、随時質問してください。 3. ユーザーの了承を得た後、コードを生成し、ウェブサイトを単一のサーバーレス HTML ファイルにコンパイルします。 4. ウェブサイトの運用およびテスト手順を示してください（ローカルでプレビューできるよう、シンプルな Python サーバーを使用して index.html ファイルを配信します）。

Gemini CLI は、この時点でこれらの一連のアクションを実行します。

2. モデルから次のアクションや進め方について確認を求められた場合は、次のようにプロンプトを入力します。

プレースホルダ データを使用してウェブサイトを作成し、提案された計画に従って進めてください。 なお、Gemini CLI でタイムアウトが発生する場合や、ユーザー名が誤って認識される場合があります。その場合は、必要に応じて Gemini CLI とやり取りして修正を提案してください。

次のプロンプトと回答は、観察されたサンプルフローです。実際には、まったく異なる回答が返ってくる可能性があります。

必要に応じて、Gemini CLI とのやり取りを繰り返してください。

Gemini CLI は、実行したいコマンドを提案することがあります。このラボでは、タスクの進行はユーザーが制御します。

モデルがコマンドの実行を提案した場合は、ESC キーを押して提案をキャンセルし、次のようなメッセージでアプローチを軌道修正できます。

手順に沿ってサーバーを起動し、ホームページに移動すると、図のようなサンプルサイトが表示されます（同じプロンプトを使用した場合、類似のサイトのバリエーションが表示されます）。

Gemini CLI を使用して、さらに変更を加えることも可能です。

変更を GitHub リポジトリに push する

ウェブサイトが完成したので、このセクションでは、タスク 5 で構成したリモート GitHub MCP サーバーを使用して、作成した GitHub リポジトリに変更を push します。

まず、Gemini CLI を使用して .gitignore ファイルを作成します。

1. Gemini CLI に次のプロンプトを入力します。

このプロジェクトの .gitignore ファイルを作成してください。

続けて、このリポジトリを GitHub アカウントに push するよう Gemini CLI に指示します（これによりバックグラウンドで GitHub MCP サーバーツールが実行されます）。

2. 次のようなプロンプトを入力します（[Your-name] プレースホルダは自分の名前に置き換えてください）。

次に、GitHub MCP サーバーで「push_files」ツールを使用して、作成した内容を自分の GitHub アカウントの新しいリポジトリに push してください。GitHub MCP サーバー用に構成された個人用アクセス トークン（PAT）を使用して、HTTPS 経由で GitHub への認証を行います。このリポジトリの名前は [Your-Name]-event-talks-app にしてください。

この時点で、Gemini CLI は次のコマンドを実行します。

• リポジトリを作成する。
• ローカル Git リポジトリを管理するために、init、add、commit などの複数の Git コマンドを使用する。
• Git リモートを設定し、push を実行する。

注: Gemini CLI がタイムアウトする場合や、ユーザー名が誤って使用される場合があります。その場合は、必要に応じて操作を行い、適切な修正を提案してください。

変更を push する際に Gemini CLI で認証の問題が発生した場合は、GitHub MCP サーバーのツールを使用するよう指示します。

問題がなければ、GitHub リポジトリが作成されているはずです。サンプルのスクリーンショットを以下に示します。

これで完了です。Gemini CLI を使用してウェブサイトを作成し、作成した GitHub リポジトリに変更を push しました。

注: このラボではプロジェクトのユーザー フレンドリーな README.md ファイルは完成していません。実際の本番環境では完成させることをおすすめします。必要に応じて、Gemini CLI にその作業を依頼できます。

[進行状況を確認] をクリックして、目標に沿って進んでいることを確認します。 変更を GitHub リポジトリに push する

お疲れさまでした

Gemini CLI とその機能について学び、ユースケースに適用できるようになりました。

次のステップと詳細情報

• Gemini CLI に関するお知らせの投稿
• Gemini CLI プロジェクトのホームページ
• Gemini CLI のドキュメント

マニュアルの最終更新日: 2025 年 10 月 16 日

ラボの最終テスト日: 2025 年 10 月 16 日

Copyright 2026 Google LLC. All rights reserved. Google および Google のロゴは Google LLC の商標です。その他すべての企業名および商品名はそれぞれ各社の商標または登録商標です。