1. Pengantar
Di lab ini, Anda akan menggunakan Gemini Code Assist, kolaborator yang didukung AI di Google Cloud, untuk menambahkan pengujian ke aplikasi web Python yang ada, serta menemukan dan memperbaiki error dalam aplikasi tersebut yang diekspos oleh pengujian. Anda kemudian akan menggunakan Code Assist untuk membuat pengujian fungsi baru dan membuat kode agar lulus pengujian tersebut dan memperluas aplikasi.
Yang akan Anda lakukan ...
- Anda akan menggunakan Cloud Shell Editor untuk mendownload kode aplikasi Web yang sudah ada.
- Anda akan menggunakan Chat Bantuan Kode Gemini di Cloud Shell Editor untuk mengajukan pertanyaan umum tentang Google Cloud.
- Anda akan menggunakan bantuan kode Inline Gemini Code Assist di Cloud Shell Editor untuk membuat pengujian bagi aplikasi, menjalankan pengujian, dan menemukan serta memperbaiki error, kemudian memperluas fungsi aplikasi.
Yang akan Anda pelajari ...
- Cara menggunakan Gemini Code Assist untuk beberapa tugas developer seperti pembuatan pengujian dan pembuatan kode.
- Cara menggunakan Gemini Code Assist untuk mempelajari Google Cloud.
Yang Anda butuhkan ...
- Browser web Chrome
- Akun Gmail
- Project Cloud dengan penagihan diaktifkan
- Gemini Code Assist diaktifkan untuk Project Cloud Anda
Lab ini ditujukan bagi developer dari semua level, termasuk para pemula. Meskipun aplikasi contoh menggunakan bahasa Python, Anda tidak perlu familier dengan pemrograman Python untuk memahami apa yang terjadi. Fokus kami adalah memahami kemampuan Gemini Code Assist untuk developer.
2. Penyiapan
Anda seharusnya sudah memiliki Project Cloud dengan penagihan yang diaktifkan untuk digunakan pada lab ini. Sekarang kita akan mengaktifkan Gemini API di Project Google Cloud. Ikuti langkah-langkah berikut:
- Buka https://console.cloud.google.com dan pastikan Anda telah memilih Project Google Cloud yang akan digunakan untuk lab ini. Klik ikon Gemini yang Anda lihat di kanan atas.
- Jendela konsol Gemini untuk Cloud akan terbuka di sisi kanan konsol. Klik tombol Enable jika ditunjukkan di bawah. Jika tidak melihat tombol Aktifkan dan melihat antarmuka Chat, berarti Anda telah mengaktifkan Gemini untuk Cloud untuk project tersebut dan Anda dapat langsung melanjutkan ke langkah berikutnya.
- Setelah diaktifkan, Anda dapat menguji Gemini dengan meminta satu atau dua kueri. Beberapa contoh kueri ditampilkan, tetapi Anda dapat mencoba Apa itu Cloud Run?
Code Assist akan menanggapi dengan jawaban atas pertanyaan Anda. Anda dapat mengklik ikon 
di sudut kanan atas untuk menutup jendela chat Code Assist.
Aktifkan Gemini di Cloud Shell Editor
Gemini Code Assist tersedia dan berperilaku serupa di beberapa IDE populer. Anda akan menggunakan Editor Google Cloud Shell, yang berjalan sepenuhnya di browser web, dalam codelab ini. Anda harus mengaktifkan dan mengonfigurasi Gemini di Cloud Shell Editor dan langkah-langkahnya diberikan di bawah ini:
- Luncurkan Cloud Shell melalui ikon yang ditunjukkan di bawah. Mungkin perlu waktu satu atau dua menit untuk memulai instance Cloud Shell.
- Klik tombol Editor atau Open Editor (sebagaimana kasusnya) dan tunggu hingga Cloud Shell Editor muncul. Jika Anda melihat tombol Try the new editor, klik tombol tersebut.
- Klik tombol Cloud Code - Sign in di status bar bawah seperti yang ditunjukkan. Otorisasi plugin seperti yang ditunjukkan. Jika Anda melihat "Cloud Code - no project" di status bar, pilih opsi tersebut, lalu pilih Project Google Cloud tertentu dari daftar project yang akan dikerjakan.
- Jika tidak melihat ikon Gemini pada status bar di kanan bawah, Anda harus mengaktifkannya di Cloud Code. Sebelum melakukannya, pastikan Gemini (sebelumnya dikenal sebagai Duet AI untuk Developer) sudah diaktifkan di IDE dengan membuka Ekstensi Cloud Code → Settings, lalu masukkan teks Duet AI: Enable seperti yang ditunjukkan di bawah. Pastikan kotak centang sudah dipilih. Anda harus memuat ulang IDE. Langkah ini akan mengaktifkan Gemini di Cloud Code, dan status bar Gemini akan muncul di IDE Anda.
- Klik tombol Gemini di pojok kanan bawah seperti yang ditunjukkan dan pilih project Google Cloud yang tepat untuk project mana kami mengaktifkan Cloud AI Companion API.
- Setelah memilih project Google Cloud, pastikan Anda dapat melihatnya di pesan status Cloud Code di status bar dan Anda juga telah mengaktifkan Gemini di sebelah kanan, di status bar seperti yang ditunjukkan di bawah ini:
Gemini Code Assist siap digunakan
3. Mendownload dan memeriksa aplikasi
Di jendela terminal, jalankan perintah untuk meng-clone repositori dengan kode awal, lalu ubah ke direktori baru (jika jendela terminal tidak lagi terbuka, klik tombol Terminal atau Open Terminal untuk memulihkannya):
git clone https://github.com/GoogleCloudPlatform/testing-with-duet-ai-codelab.git
cd testing-with-duet-ai-codelab
Buka main.py di editor, lalu buka jendela Gemini Chat dengan mengklik ikon chat Gemini di sisi kiri editor. Jendela Gemini Chat ini berada di dalam IDE dan memiliki kode di IDE yang tersedia sebagai konteks untuk diskusi. Masukkan perintah Jelaskan ini dan lihat jawabannya:
Anda dapat men-scroll jendela chat ini untuk melihat seluruh jawaban. Penjelasannya menyatakan bahwa kita dapat menjalankan program ini secara lokal dengan perintah python3 main.py di jendela terminal.
4. Dijalankan secara lokal
Ubah ke direktori repositori dengan cd ~/testing-with-duet-ai-codelab jika diperlukan, dan masukkan perintah python3 main.py di jendela terminal:
Klik tautan http://127.0.0.1:8080 untuk membuka tab browser baru ke beranda aplikasi:
Aplikasi berjalan "secara lokal". Sebenarnya, Editor Cloud Shell telah melakukan sedikit keajaiban di sini. Aplikasi berjalan di Cloud Shell, bukan di komputer Anda sendiri. Saat Anda mengklik link tersebut, tab akan terbuka bukan ke alamat lokal sebenarnya http://127.0.0.1:8080, tetapi ke server proxy yang disiapkan hanya untuk tujuan ini oleh Cloud Shell. Efeknya sama seperti jika Anda benar-benar menjalankannya secara lokal.
Coba, yuk. Masukkan 25 lalu tekan Convert!
Benar, 25 adalah XXV dalam Angka Romawi! Anda harus selesai di sini.
Mungkin coba cek beberapa angka lagi. 25 berhasil, bagaimana dengan 24?
Mungkin kita sedikit terburu-buru untuk berpikir semuanya baik-baik saja. Apakah XXIIII adalah konversi yang benar untuk 24? Bukankah XXIV?
Dapat disimpulkan bahwa XXIIII benar, tetapi ini bukan yang biasanya diharapkan orang. Karena tidak benar-benar salah (perhatikan bahwa banyak jam menunjukkan 4 sebagai Angka Romawi IIII) biarkan masalah tersebut untuk peningkatan di masa mendatang.
Bagaimana kalau mencoba angka negatif? Tidak ada? Tidak ada cara untuk mewakili angka-angka itu dalam Angka Romawi. Tampaknya tidak ada yang kembali kepada pengguna, yang sepertinya error perlu ditangani.
Pengujian dapat membantu menemukan dan menghilangkan error, dan Gemini Code Assist dapat membantu kita menulis dan menggunakan pengujian.
5. Menambahkan Pengujian
Kembali ke jendela Gemini Chat, dan tanyakan
How can I test the number_to_roman function?
Baca responsnya, yang harus mencakup diskusi modul unittest dan modul pytest.
Anda mungkin ingin Gemini Code Assist benar-benar menulis pengujian ini untuk Anda. Buka calendar.py, tempat kode konversi sebenarnya berada, di editor, kembali ke jendela Chat Gemini, lalu minta lagi
How can I test the number_to_roman function?
Responsnya kini lebih spesifik, bahkan saat menyertakan modul unittest yang dapat Anda salin atau masukkan ke dalam file baru:
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")
Anda mungkin melihat kode yang berbeda dari contoh di atas. Model dasar Gemini Code Assist diperbarui dari waktu ke waktu, sehingga jawabannya tidak akan selalu sama. Jika melihat kumpulan kode yang berbeda, sekarang Anda dapat memilih apakah akan melanjutkan contoh yang ditampilkan dalam codelab ini dengan menyalin kode yang ditampilkan di sini, atau Anda dapat mencoba jawaban alternatif yang diberikan Gemini Code Assist kepada Anda. Jika Anda punya waktu, Anda bahkan dapat mencoba kedua jalur. Gemini Code Assist adalah asisten coding yang dapat Anda gunakan sesuai kebutuhan.
Klik panah runcing ganda di pojok kanan atas jendela Gemini Chat untuk membuat file baru yang berisi kode pengujian unit, atau gunakan IDE untuk membuat file baru dan tempelkan kode yang ditampilkan di lab ini. Tekan CTRL-S atau CMD-S di jendela tersebut untuk menyimpannya, lalu panggil file yang disimpan calendar-unittest.py.
Kembali ke terminal dan tekan CTRL-C untuk menghentikan server web yang Anda tinggalkan sebelumnya berjalan, dan mendapatkan {i>prompt<i} {i>shell<i}. Masukkan perintah
python3 calendar-unittest.py
untuk menjalankan pengujian baru.
Tidak ada output. Hal itu tidak sesuai dengan harapan. Apakah semuanya lewat diam-diam? Anda pasti ingin mengetahuinya. Lihat kembali jawaban dari Gemini Code Assist yang menyertakan kode pengujian. Di bawah kode terdapat informasi selengkapnya tentang cara menjalankan kasus pengujian:
Coba jalankan perintah yang direkomendasikan:
python -m unittest discover
Anda mungkin mengalami masalah jika komputer Anda tidak memberi alias dari perintah python3 ke python, yang dalam hal ini menjalankan:
python3 -m unittest discover
Perintah berjalan, tetapi menampilkan Ran 0 tests in 0.000s. Modul ini memiliki beberapa pengujian di dalamnya. Apa yang terjadi???
Ini adalah kata terakhir dalam perintah, discover. Dari mana asalnya? Tampaknya, Gemini Code Assist mengharapkan kode pengujian disimpan dalam file bernama discover atau discover.py, tetapi tidak menentukan itulah yang harus Anda lakukan. Karena Anda benar-benar menyimpan file tersebut di calendar-unittest.py, coba jalankan perintah:
python3 -m unittest calendar-unittest
Sekarang Anda melihat banyak output, dimulai dengan sesuatu seperti ini:
$ 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
Baris pertama menunjukkan periode untuk setiap pengujian yang lulus, dan F untuk setiap pengujian yang gagal. Sebagian besar pengujian gagal. Kemudian, kode ini akan mencantumkan pengujian yang gagal satu per satu, yang menunjukkan output yang diharapkan dan output yang sebenarnya. Tidak jelas urutan pelaksanaan pengujian ini. Pengujian ini diurutkan menurut abjad berdasarkan nama pengujian, bukan urutan kemunculan pengujian di file. Jadi, test_convert_1 berjalan terlebih dahulu, lalu test_convert_1990, lalu test_convert_2023, dan seterusnya. Hanya kasus pengujian untuk 1 dan 2023 yang lulus.
Saat pertama kali mencoba kode ini, Anda melihat bahwa kode tersebut mengonversi 24 menjadi XXIIII, yang tidak sepenuhnya salah, tetapi bukan bentuk umum tempat IIII dikonversi menjadi IV. Semua pengujian yang gagal adalah untuk kasus yang serupa. Ketika masalah ini pertama kali dicatat, lab mengatakan, "Karena tidak benar-benar salah (perhatikan bahwa banyak jam menunjukkan 4 sebagai Angka Romawi IIII) tinggalkan masalah tersebut untuk peningkatan di masa mendatang."
Anda dapat mengubah kasus pengujian agar mengharapkan dan menerima jawaban "tidak benar-benar salah" yang diberikan kode, atau menerima bahwa sudah waktunya untuk melakukan "peningkatan mendatang". Jadi, langkah Anda selanjutnya adalah memperbaiki kodenya, dengan bantuan Gemini Code Assist, untuk memberikan jawaban yang lebih dapat diterima yang diharapkan oleh pengujian tersebut.
6. Meningkatkan kode
Ingat bahwa respons seperti XXIIII untuk 24, bukan XXIV yang lebih umum, dianggap "tidak benar-benar salah" dan ditunda untuk peningkatan pada masa mendatang. Masa depan itu adalah sekarang. Jawaban yang "tidak terlalu salah" itu masih menjengkelkan.
Aturan pertama untuk digit berulang dalam Angka Romawi adalah: setiap kali Anda memiliki empat digit yang identik berturut-turut, mereka harus diganti dengan salah satu digit diikuti dengan digit berikutnya yang lebih tinggi. Jadi, XXIIII harus diganti dengan XXIV. Demikian pula, XXXX harus diubah menjadi XL, dan CCCC harus menjadi CD.
Minta Gemini Code Assist bagaimana mengubah nilai variabel romawi dengan cara ini tepat sebelum ditampilkan oleh number_to_romawi:
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?
Sebaiknya tambahkan beberapa kode di akhir:
Salin/tempel atau ketik baris tersebut di editor, lalu lihat apa yang terjadi:
Gemini Code Assist telah menambahkan lebih banyak baris untuk menangani kasus yang dapat Anda alami setelah melakukan serangkaian substitusi pertama. Misalnya, 19 akan dikonversi menjadi XVIIII, lalu ke XVIV, dan akhirnya ke XIX yang benar.
Jika Gemini Code Assist membuat saran yang tampaknya berguna, tekan Tab untuk menerima rekomendasi, simpan file, dan jalankan server web lagi. Jika tidak, tambahkan baris yang ditampilkan dalam contoh di sini secara manual, lalu simpan file tersebut. Cobalah konversi yang sulit: 1999:
Tepat sekali!
Jalankan kembali pengujian sekarang. Mereka semua lolos!
Aplikasi web tampaknya siap untuk diproduksi.
7. Men-deploy ke Cloud Run
Cloud Run akan menjalankan aplikasi dalam container di Internet untuk Anda. Untuk aplikasi yang ditulis menggunakan framework umum, seperti Flash, perintah gcloud run deploy bahkan akan membuat container tersebut sebelum Anda men-deploy-nya. Jalankan perintah:
gcloud run deploy
Di terminal. Saat ditanya lokasi kode sumber, tekan Enter untuk menerima lokasi yang benar yang disarankan. Demikian pula, saat diminta memasukkan nama layanan, tekan Enter untuk menerima saran.
Perintah ini mungkin gagal karena gcloud tidak dapat menentukan project mana yang akan digunakan. Jika demikian, jalankan perintah:
gcloud config set core/project <project-id>
dengan gcloud run deploy.
- Perintah tersebut akan meminta Anda mengetahui bahwa API tertentu diperlukan dan belum diaktifkan. Masukkan y untuk mengaktifkannya.
- Saat diminta untuk memilih wilayah, pilih salah satu yang sesuai bagi Anda. Memasukkan angka yang sesuai dengan
us-central1adalah pilihan yang aman. - Saat diminta, tekan Y untuk melanjutkan.
- Anda akan mengizinkan pemanggilan unauthenticated untuk layanan Cloud Run ini. Opsi autentikasi yang digunakan oleh Cloud Run cocok untuk digunakan oleh program yang memanggil layanan. Karena ini adalah situs web, Anda tidak akan menggunakan otentikasi.
Google Cloud akan membangun container, men-deploy-nya, mengarahkan traffic ke container tersebut, serta menetapkan kebijakan akses, lalu menampilkan link ke halaman beranda:
Anda bisa membuka link itu dan mengakses aplikasi Anda.
Masukkan angka dan tekan Enter, dan tada!
Apa?!
Berhasil di komputer Anda! Mengapa proses ini tidak selesai?
Cari tahu. Minta Bantuan Kode Gemini,
Why am I getting an internal server error on cloud run?
Tampaknya, Gemini Code Assist dapat membaca file log, yang mengatakan hal yang serupa. Mari kita tanyakan pada Gemini Code Assist bagaimana Anda dapat melihat log Anda sendiri:
Harap buat kunci tersebut. Cari baris dengan indikator error berwarna merah !!, seperti di bawah ini:
Yang diikuti oleh banyak baris detail tentang stack panggilan yang sampai di sini, tetapi kemudian ada:
Saat melihat file calendar.py, Anda melihat fungsi number_to_roman di sana. Dan Anda tahu bahwa itu benar karena berfungsi di komputer Anda. Apa yang dapat berbeda di Cloud Run?
Jawabannya rumit. Ada modul standar yang disertakan dengan Python3 yang disebut calendar, sama seperti file calendar.py yang ditetapkan oleh fungsi number_to_roman. Di komputer lokal Anda, saat mencari modul yang disebut kalender, Python menelusuri direktori aplikasi Anda terlebih dahulu. Tampaknya, Python di Cloud Run mencari modul standar terlebih dahulu, mengimpornya, dan tidak menemukan fungsi number_to_roman.
Perbedaan lingkungan semacam ini selalu mungkin terjadi. Untungnya, saat aplikasi berada dalam container, aplikasi tersebut akan membawa lingkungannya di dalamnya. Jadi, di mana pun Anda menjalankannya, Anda dapat mengharapkan perilaku yang sama. Jika Anda telah menjalankan aplikasi dalam container yang sama secara lokal dengan Cloud Run, Anda akan mengalami masalah yang sama.
Perbaiki masalah ini. Anda perlu mengubah nama modul kalender lokal menjadi nama yang juga bukan nama modul standar. Ganti nama file calendar.py menjadi my_calendar.py, lalu ubah baris import calendar di main.py dan calendar-unittest.py menjadi import my_calendar. Terakhir, ubah garis
roman = calendar.number_to_roman(number)
hingga
roman = my_calendar.number_to_roman(number)
Cobalah secara lokal, jalankan pengujian, lalu deploy ulang:
gcloud run deploy
Dan sekarang cara ini berfungsi:
Anda dapat membagikan URL ini, dan semua orang yang membutuhkan alat konversi Angka Romawi dapat menggunakan URL Anda.
8. Opsional: Buat terlihat lebih bagus
Aplikasi Anda berjalan dengan baik dan dapat diakses oleh siapa saja di web. Tapi, tampilannya sedikit polos. Sebelum memberi tahu semua orang tentang fitur ini, mintalah Gemini Code Assist untuk meningkatkan kualitas tampilannya.
Buka file templates/index.html. Di jendela chat Gemini, tanyakan:
Make this index.html file use material design.
Responsnya adalah melakukan penambahan ke file saat ini, sehingga menghasilkan sesuatu yang mirip dengan berikut ini:
<!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>
Gunakan ikon untuk menyalin kode yang disarankan dan menempel konten index.html yang ada. Di terminal, jalankan python3 main.py, lalu klik link untuk membuka jendela pratinjau. Halaman kini menjadi sedikit lebih polos:
Anda dapat mengulanginya dengan file convert.html jika ingin.
Gemini Code Assist mengetahui cukup banyak CSS, dan Anda dapat menggunakannya untuk membantu menata gaya halaman aplikasi dalam berbagai cara. Ini hanya permulaan.
Karena Anda ingin membagikan aplikasi ini, jangan lupa untuk men-deploy ulang aplikasi tersebut ke Cloud Run:
gcloud run deploy
Anda dapat meneruskan URL kepada orang-orang yang perlu melakukan konversi ke Angka Romawi.
9. Selamat!
Selamat - Anda telah berhasil menggunakan Gemini Code Assist untuk menambahkan pengujian ke aplikasi, memperbaiki error di dalamnya, dan menambahkan fungsi yang ditingkatkan.
Setelah selesai menggunakan aplikasi yang dibangun, Anda dapat menghapusnya dari dasbor konsol cloud untuk menghentikan tagihan yang mungkin dikenakan di masa mendatang.