1. はじめに
このラボでは、Google Cloud の AI コラボレーターである Gemini Code Assist を使用して、既存の Python ウェブ アプリケーションにテストを追加し、テストで公開されたアプリケーションのエラーを見つけて修正します。その後、Code Assist を使用して新しい機能のテストを作成し、それらのテストに合格するためのコードを生成してアプリを拡張します。
演習内容
- Cloud Shell エディタを使用して、既存のウェブ アプリケーションのコードをダウンロードします。
- Cloud Shell エディタの Gemini Code Assist Chat を使用して、Google Cloud に関する一般的な質問をします。
- Cloud Shell エディタで Gemini Code Assist のインライン コード アシスタンスを使用して、アプリケーションのテストの生成、テストの実行、エラーの検出と修正、アプリケーションの機能の拡張を行います。
学習内容
- Gemini Code Assist を使用して、テスト生成やコード生成などのデベロッパーのタスクを行う方法。
- Gemini Code Assist を使用して Google Cloud について学習する。
必要なもの
- Chrome ウェブブラウザ
- Gmail アカウント
- 課金が有効になっている Cloud プロジェクト
- Cloud プロジェクトで Gemini Code Assist が有効になっている
このラボは、初心者を含むあらゆるレベルのデベロッパーを対象としています。サンプル アプリケーションは Python 言語ですが、何が起こっているのかを理解するために Python プログラミングに精通している必要はありません。デベロッパー向けの Gemini Code Assist の機能に慣れることに重点を置きます。
2. セットアップ
このラボで使用するには、課金が有効になっている Cloud プロジェクトがすでに存在している必要があります。次に、Google Cloud プロジェクトで Gemini API を有効にします。以下の手順に沿って操作してください。
- https://console.cloud.google.com にアクセスし、このラボで使用する Google Cloud プロジェクトが選択されていることを確認します。右上に表示される Gemini アイコンをクリックします。
- コンソールの右側に Gemini for Cloud コンソール ウィンドウが開きます。[有効にする] ボタンをクリックします(下に表示されている)。[有効にする] ボタンが表示されず、Chat インターフェースが表示されている場合は、すでにプロジェクトで Gemini for Cloud が有効になっています。そのまま次のステップに進みます。
- 有効にしたら、Gemini に 1 つか 2 つの質問をすると、Gemini をテストできます。いくつかのサンプルクエリがいくつか表示されますが、Cloud Run とはなどを試してみてください。
Code Assist が質問に対する回答を返します。右上にある アイコンをクリックすると、Code Assist のチャット ウィンドウを閉じることができます。
Cloud Shell エディタで Gemini を有効にする
Gemini Code Assist は、いくつかの一般的な IDE で利用可能で、同じように動作します。この Codelab では、Google Cloud Shell エディタを使用します。このエディタはウェブブラウザで完全に実行できます。Cloud Shell エディタで Gemini を有効にして構成する必要があります。手順は次のとおりです。
- 下に示すアイコンで Cloud Shell を起動します。Cloud Shell インスタンスの起動には 1~2 分かかる場合があります。
- [エディタ] ボタンまたは [エディタを開く] ボタン(該当する場合)をクリックし、Cloud Shell エディタが表示されるまで待ちます。[新しいエディタを試す] ボタンが表示されている場合は、クリックします。
- 下のステータスバーにある [Cloud Code - Sign in] ボタンをクリックします。指示に従ってプラグインを承認します。ステータスバーに「Cloud Code - no project」と表示されている場合は、それを選択して、使用するプロジェクトのリストから特定の Google Cloud プロジェクトを選択します。
- 右下のステータスバーに Gemini アイコンが表示されない場合は、Cloud Code で Gemini を有効にする必要があります。IDE で Gemini(旧称 Duet AI for Developers)が有効になっていることを確認する前に、[Cloud Code Extension] → [設定] に移動して、以下のように「Duet AI: 有効にする」というテキストを入力します。チェックボックスがオンになっていることを確認します。IDE を再読み込みする必要があります。これにより、Cloud Code で Gemini が有効になり、IDE に Gemini のステータスバーが表示されます。
- 右下隅にある [Gemini] ボタンをクリックし、Cloud AI Companion API を有効にした適切な Google Cloud プロジェクトを選択します。
- Google Cloud プロジェクトを選択したら、ステータスバーの Cloud Code ステータス メッセージにその旨が表示されること、また、右側にある Gemini が有効になっていることをステータスバーで確認できます(以下を参照)。
Gemini Code Assist をご利用いただけるようになりました。
3. アプリケーションをダウンロードして確認する
ターミナル ウィンドウで次のコマンドを実行して、開始コードを含むリポジトリのクローンを作成してから、新しいディレクトリに移動します(ターミナル ウィンドウが開いていない場合は、[ターミナル] または [ターミナルを開く] ボタンをクリックして復元します)。
git clone https://github.com/GoogleCloudPlatform/testing-with-duet-ai-codelab.git
cd testing-with-duet-ai-codelab
エディタで main.py を開き、エディタの左側にある Gemini チャット アイコンをクリックして、[Gemini Chat] ウィンドウを開きます。この [Gemini Chat] ウィンドウは IDE 内にあり、ディスカッションのコンテキストとして IDE 内のコードを利用できます。「Explain this」というプロンプトを入力し、答えを確認します。
このチャット ウィンドウをスクロールすると、回答全体を確認できます。ターミナル ウィンドウで python3 main.py
コマンドを使用することで、このプログラムをローカルで実行できるという説明が表示されます。
4. ローカルで実行する
必要に応じて、cd ~/testing-with-duet-ai-codelab
を使用してリポジトリ ディレクトリに移動し、ターミナル ウィンドウでコマンド python3 main.py
を入力します。
リンク http://127.0.0.1:8080 をクリックして、新しいブラウザタブを開き、アプリケーションのホームページを表示します。
アプリケーションが「ローカルで」実行されている。Cloud Shell エディタには魔法のような機能があります。このアプリケーションは、自分のパソコンではなく Cloud Shell で実行されています。リンクをクリックすると、実際のローカル アドレス http://127.0.0.1:8080 ではなく、Cloud Shell によってこの目的のために設定されたプロキシ サーバーがタブで開きます。実際にローカルで実行する場合と同じ効果があります。
試してみましょう。「25」と入力して [Convert!] を押します。
25 はローマ数字の XXV です。ここでは完了する必要があります。
もう少し数値を確認してみましょう。25 ではうまくいったのに、24 では?
すべて問題ないと思うのが少し急いでいたのかもしれません。XXIIII は 24 を表す正しい変換ですか?XXIV じゃない?
XXIIII が正しいと判断されることもありますが、これは人々が通常期待する内容ではありません。ただし、これは誤りではないため(多くの時計がローマ数字の IIII で 4 を示していることに注意してください)、この問題は今後の機能改善に任せておきます。
負の数を試してみてください。ゼロ?これらの数字をローマ数字で表す方法はありません。ユーザーに何も返されていないようです。対処が必要なエラーのようです。
テストはエラーを見つけて排除するのに役立ちます。また、Gemini Code Assist はテストの作成と使用に役立ちます。
5. テストの追加
Gemini Chat ウィンドウに戻って、
How can I test the number_to_roman function?
レスポンスに目を通します。レスポンスには、unittest モジュールと pytest モジュールに関する説明が含まれています。
Gemini Code Assist にこれらのテストを実際に作成させることもできます。実際の変換コードがある calendar.py を開き、エディタで Gemini Chat ウィンドウに戻り、もう一度質問します。
How can I test the number_to_roman function?
レスポンスはさらに具体的になりました。新しいファイルにコピーまたは挿入できる単体テストモジュールが追加されています。
import unittest
import calendar
class NumberToRomanTest(unittest.TestCase):
def test_convert_1(self):
self.assertEqual(calendar.number_to_roman(1), "I")
def test_convert_4(self):
self.assertEqual(calendar.number_to_roman(4), "IV")
def test_convert_9(self):
self.assertEqual(calendar.number_to_roman(9), "IX")
def test_convert_40(self):
self.assertEqual(calendar.number_to_roman(40), "XL")
def test_convert_90(self):
self.assertEqual(calendar.number_to_roman(90), "XC")
def test_convert_400(self):
self.assertEqual(calendar.number_to_roman(400), "CD")
def test_convert_900(self):
self.assertEqual(calendar.number_to_roman(900), "CM")
def test_convert_1990(self):
self.assertEqual(calendar.number_to_roman(1990), "MCMXC")
def test_convert_2023(self):
self.assertEqual(calendar.number_to_roman(2023), "MMXXIII")
上記の例とは異なるコードが表示される場合があります。Gemini Code Assist の基盤となるモデルは随時更新されるため、回答は常に同じとは限りません。別のコードセットが表示される場合は、ここに示されているコードをコピーして、この Codelab で示されるサンプルで続行するか、Gemini Code Assist から返された別の回答を試すかを選択できます。時間があれば、両方のプログラムを試すこともできます。Gemini Code Assist は、必要に応じて使用できるコーディング アシスタントです。
Gemini Chat ウィンドウの右上にある二重矢印をクリックして、単体テストコードを含む新しいファイルを作成するか、IDE を使用して新しいファイルを作成し、このラボで示したコードを貼り付けてください。そのウィンドウで Ctrl+S または CMD+S を押して保存し、保存したファイル calendar-unittest.py を呼び出します。
ターミナルに戻り、Ctrl+C キーを押して先ほど実行していたウェブサーバーを停止し、シェル プロンプトを表示します。次のコマンドを入力します。
python3 calendar-unittest.py
新しいテストを実行します
出力はありません。それは期待どおりではありませんでした。何も通知なく問題なく動作しましたか?確実に知りたいです。テストコードを含む Gemini Code Assist の回答を振り返ってください。コードの下に、テストケースの実行方法に関する詳細情報があります。
推奨されるコマンドを実行してみてください。
python -m unittest discover
マシンで python3
コマンドのエイリアスが python
に設定されていない場合、問題が発生する可能性があります。その場合は、次のコマンドを実行します。
python3 -m unittest discover
コマンドは実行されますが、Ran 0 tests in 0.000s
が返されます。このモジュールには複数のテストが含まれています。現在の状況
これが、コマンドの最後の単語、discover
です。どこから取得したか?Gemini Code Assist はテストコードが discover
または discover.py
という名前のファイルに保存されることを想定していましたが、それを実行する必要があることは指定していません。実際には calendar-unittest.py
にファイルを保存したため、次のコマンドを実行します。
python3 -m unittest calendar-unittest
次のような多くの出力が表示されます。
$ python3 -m unittest calendar-unittest
.F.FFFFFF
======================================================================
FAIL: test_convert_1990 (calendar-unittest.NumberToRomanTest)
----------------------------------------------------------------------
Traceback (most recent call last):
File "/home/charles_engelke/testing-with-duet-ai-codelab/calendar-unittest.py", line 28, in test_convert_1990
self.assertEqual(calendar.number_to_roman(1990), "MCMXC")
AssertionError: 'MDCCCCLXXXX' != 'MCMXC'
- MDCCCCLXXXX
+ MCMXC
最初の行には、合格したテストごとのピリオドと、不合格になった各テストの F
が表示されます。ほとんどのテストが失敗しています。その後、失敗したテストを個別に一覧表示し、想定される出力と実際の出力を表示します。これらのテストをどのような順序で実行したのかが少し不明確です。これは、ファイル内でのテストが表示される順序ではなく、テスト名のアルファベット順でした。そのため、test_convert_1
が最初に実行され、次に test_convert_1990
が実行され、次に test_convert_2023
というように実行されました。合格したテストケースは 1
と 2023
のみです。
このコードを初めて試したとき、24
が XXIIII
に変換されていることに気づきました。これは間違いではありませんが、IIII
を IV
に変換する一般的な形式ではありません。不合格となったテストはすべて、同様のケースに対するものです。この問題が初めて指摘されたとき、ラボからは「問題は間違っているわけではありません(多くの時計が 4
をローマ数字の IIII
と表記している点に留意)、今後の機能強化に残しています。」
想定どおりのテストケースを変更し、「実際には誤り」ではないことを認めて、答えを示せるか、「将来の機能強化」のタイミングだと受け止めることもできます。そのため、次のステップは、Gemini Code Assist を使用してコードを修正し、テストで想定されるより適切な回答を得ることです。
6. コードの改良
24
に対する XXIIII
のような応答は、より一般的な XXIV
ではなく、「間違っている」と見なされたことを思い出してください。今後の機能拡張を予定していますそれが今の未来です。「まったく間違いではない」質問に対する回答は依然として面倒です。
ローマ数字で数字を繰り返す場合の第一のルールは、連続した 4 つの同じ数字がある場合、その数字を 1 つの数字に置き換えてから、その次の上位数字に置き換えることです。したがって、XXIIII
は XXIV
に置き換える必要があります。同様に、XXXX
を XL
に変更し、CCCC
を CD
に変更する必要があります。
number_to_roman によって返される直前に、roman 変数の値をこのように変更する方法を Gemini Code Assist に尋ねます。
If the final value of roman has IIII in it, that should be replaced by IV. Similarly XXXX should be replaced by XL, and CCCC should become CD. How can I make those changes?
最後にコードを追加することをおすすめします。
これらの行をエディタにコピーして貼り付けるか入力し、どうなるか見てみましょう。
Gemini Code Assist に、最初の一連の置換を行った後に生じる可能性のあるケースに対応するための行が追加されました。たとえば、19 は XVIIII に、次に XVIV に、最後に正しい XIX に変換されます。
Gemini Code Assist によって役に立つ提案が生成された場合は、Tab キーを押して推奨事項を受け入れ、ファイルを保存してから、ウェブサーバーを再度実行します。それ以外の場合は、この例に示す行を手動で追加してファイルを保存します。難しい変換を試してみましょう。1999 年:
正解です。
今すぐテストを再実行します。どれも合格です。
このウェブ アプリケーションは、本番環境に移行する準備ができているようです。
7. Cloud Run にデプロイする
Cloud Run は、コンテナ化されたアプリケーションをインターネット上で実行します。Flash などの一般的なフレームワークを使用して記述されたアプリケーションの場合、gcloud run deploy
コマンドを使用すると、コンテナをデプロイする前にビルドできます。次のコマンドを実行します。
gcloud run deploy
ターミナルでの操作。ソースコードの場所を尋ねられたら、Enter キーを押して、提示された正しい場所を受け入れます。同様に、サービス名の入力を求められたら、Enter キーを押して提案を受け入れます。
gcloud は使用するプロジェクトを特定できないため、コマンドが失敗する可能性があります。その場合は、次のコマンドを実行します。
gcloud config set core/project <project-id>
は、プロジェクトの ID(名前と同じでも可)に置き換えます。次に、gcloud run deploy
コマンドを再実行します。
- このコマンドでは、特定の API が必要だが、まだ有効になっていないことが示されます。有効にするには「y」と入力します。
- リージョンを選択するように求められたら、都合の良いリージョンを選択します。
us-central1
に対応する数値を入力することは安全な選択です。 - プロンプトが表示されたら、「Y」と入力して続行します。
- この Cloud Run サービスに対する未認証の呼び出しを許可します。Cloud Run で使用される認証オプションは、サービスを呼び出すプログラムで使用するのに適しています。これはウェブサイトであるため、認証は使用しません。
Google Cloud がコンテナをビルドしてデプロイし、トラフィックをルーティングしてアクセス ポリシーを設定します。その後、ホームページへのリンクが表示されます。
このリンクからアプリケーションにアクセスできます。
数字を入力して Enter キーを押してください。
えっ!
これは自分のマシンで動作します。まだ完了していないのはなぜですか?
調べて、Gemini Code Assist に質問、
Why am I getting an internal server error on cloud run?
Gemini Code Assist は同様のログ ファイルを読み取ることができます。Gemini Code Assist に、自分でログを確認する方法を質問してみましょう。
それではやってみましょう。赤い !! が付いた行を探してください。エラーの指標になります。
その後に、ここに来るコールスタックに関する多くの詳細が続きます。
calendar.py ファイルを確認すると、number_to_roman という関数がすぐに見つかります。自分のマシンで動作するからこそ、正しいことがわかっています。Cloud Run ではどのような違いがあると考えられますか。
答えは難しいものです。Python3 には calendar という標準モジュールが含まれています。これは、number_to_roman 関数が定義されている calendar.py ファイルのようなものです。ローカルマシンで、Python は calendar というモジュールを検索すると、まずアプリケーション ディレクトリを検索します。Cloud Run の Python はまず標準モジュールを探してインポートしましたが、number_to_roman 関数は見つからなかったようです。
このような環境の違いは常に発生する可能性があります。幸いなことに、コンテナ化されたアプリケーションは環境を内部に格納するため、どこで実行しても同じ動作が期待できます。Cloud Run と同じコンテナ化されたアプリケーションをローカルで実行していたら、同じ問題が発生したはずです。
この問題を修正します。ローカルのカレンダー モジュールの名前を、標準のモジュール名ではない名前に変更する必要があります。calendar.py ファイルの名前を my_calendar.py に変更し、main.py と calendar-unittest.py の import calendar
行を import my_calendar
に変更します。最後に、行を変更します。
roman = calendar.number_to_roman(number)
たとえば
roman = my_calendar.number_to_roman(number)
ローカルで試し、テストを実行して、再デプロイします。
gcloud run deploy
動作するようになりました。
この URL を共有すると、ローマ数字の変換ツールを必要とするすべてのユーザーが使用できます。
8. 省略可: 見た目を整える
アプリケーションは正常に動作しており、ウェブ上の誰でもアクセスできるようになっています。でも、見た目は少しシンプル。皆に説明する前に、Gemini Code Assist に外観の改善を依頼してみましょう。
templates/index.html
ファイルを開きます。Gemini チャット ウィンドウで、次のように質問します。
Make this index.html file use material design.
現在のファイルに次のような内容を追加するというレスポンスが返されます。
<!DOCTYPE html>
<html>
<head>
<title>Roman Numerals</title>
<link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css">
<script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>
</head>
<body>
<h1 class="mdl-typography--title">Roman Numerals</h1>
<form action="/convert" method="post">
<div class="mdl-textfield mdl-js-textfield">
<input class="mdl-textfield__input" type="text" id="number" name="number" required />
<label class="mdl-textfield__label" for="number">Enter a number:</label>
</div>
<button class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored">
Convert!
</button>
</form>
</body>
</html>
このアイコンを使って提案されたコードをコピーし、index.html の既存のコンテンツを貼り付けます。ターミナルで python3 main.py
を実行し、リンクをクリックしてプレビュー ウィンドウを開きます。ページはややシンプルになりました。
必要に応じて、convert.html ファイルを使ってこの手順を繰り返すことができます。
Gemini Code Assist は多くの CSS を認識しており、さまざまな方法でアプリケーション ページのスタイル設定を行うことができます。これはほんの始まりにすぎません。
このアプリケーションを共有するため、忘れずに Cloud Run に再デプロイしてください。
gcloud run deploy
ローマ数字に変換する必要があるユーザーには、URL を渡すことができます。
9. 完了
お疲れさまでした。これで、Gemini Code Assist を使用して、アプリケーションにテストを追加し、エラーを修正し、機能を強化することができました。
構築したアプリケーションの使用が終了したら、Cloud コンソール ダッシュボードからアプリケーションを削除して、今後請求が発生しないようにできます。