Di lab ini, Anda akan menggunakan Gemini Code Assist, yakni kolaborator pengembangan aplikasi berteknologi AI untuk Google Cloud, guna menjelaskan, menguji, mendokumentasikan, dan meningkatkan kualitas aplikasi.
Anda akan menggunakan Cloud Workstations untuk membuat lingkungan pengembangan yang menggunakan Code OSS sebagai lingkungan pengembangan terintegrasi (IDE).
Lab ini ditujukan bagi para developer aplikasi di semua tingkat pengalaman. Anda tidak perlu memiliki pengalaman terkait pengembangan aplikasi cloud.
Catatan: Sebagai teknologi tahap awal, Gemini dapat menghasilkan output yang seolah masuk akal tetapi mengandung fakta yang salah. Sebaiknya validasi semua output dari Gemini sebelum Anda menggunakannya. Untuk informasi lebih lanjut, lihat Gemini untuk Google Cloud dan responsible AI.
Tujuan
Di lab ini, Anda akan mempelajari cara melakukan tugas-tugas berikut:
Membuat lingkungan pengembangan aplikasi berbasis cloud menggunakan Cloud Workstations.
Menggunakan Gemini Code Assist untuk menjelaskan kode.
Membuat pengujian unit dengan Gemini Code Assist.
Memasukkan perintah ke Gemini untuk meningkatkan kualitas tampilan aplikasi.
Menggunakan Gemini Code Assist untuk membuat kode lebih mudah dibaca.
Menggunakan Gemini Code Assist untuk menambahkan komentar ke kode, dalam bahasa Inggris atau bahasa lainnya.
Penyiapan
Untuk setiap lab, Anda akan memperoleh project Google Cloud baru serta serangkaian resource selama jangka waktu tertentu, tanpa biaya.
Login ke Qwiklabs menggunakan jendela samaran.
Perhatikan waktu akses lab (misalnya, 1:15:00), dan pastikan Anda dapat menyelesaikannya dalam waktu tersebut.
Tidak ada fitur jeda. Bila perlu, Anda dapat memulai ulang lab, tetapi Anda harus memulai dari awal.
Jika sudah siap, klik Start lab.
Catat kredensial lab (Nama pengguna dan Sandi) Anda. Anda akan menggunakannya untuk login ke Google Cloud Console.
Klik Open Google Console.
Klik Use another account, lalu salin/tempel kredensial lab ini ke perintah yang muncul.
Jika menggunakan kredensial lain, Anda akan menerima pesan error atau dikenai biaya.
Setujui ketentuan dan lewati halaman resource pemulihan.
Mengaktifkan Cloud Shell
Cloud Shell adalah mesin virtual dengan beberapa alat pengembangan. Mesin virtual ini menawarkan direktori beranda persisten berkapasitas 5 GB dan berjalan di Google Cloud. Cloud Shell memberikan akses command line ke resource Google Cloud Anda. gcloud adalah alat command line untuk Google Cloud. Fitur ini sudah terinstal di Cloud Shell dan mendukung penyelesaian tab.
Di Google Cloud Console, pada panel navigasi, klik Activate Cloud Shell ().
Klik Continue.
Perlu waktu beberapa saat untuk menyediakan dan menghubungkan ke lingkungan. Setelah terhubung, Anda juga diautentikasi, dan project ditetapkan ke PROJECT_ID Anda. Contoh:
Untuk memverifikasi tujuan, klik Periksa progres saya.
Mengaktifkan API terkait dan menetapkan peran IAM
Tugas 2. Membuat Cloud Workstation
Lab ini menggunakan bantuan Gemini untuk mengembangkan aplikasi dengan plugin Cloud Code untuk IDE Cloud Workstations. Cloud Workstations adalah lingkungan pengembangan terintegrasi yang terkelola sepenuhnya yang mencakup integrasi native dengan Gemini.
Dalam tugas ini, Anda akan mengonfigurasi dan menyediakan lingkungan Cloud Workstation, lalu mengaktifkan plugin Cloud Code untuk Gemini.
Melihat cluster workstation
Satu cluster workstation bernama my-cluster telah dibuat sebelumnya untuk lab ini. Cluster ini digunakan untuk mengonfigurasi dan membuat workstation.
Untuk membuka halaman Workstations, di kolom judul Konsol Google Cloud, ketik Cloud Workstations di kolom Search, lalu klik Cloud Workstations.
Jika Cloud Workstations tidak disematkan (), di Navigation menu (), klik Pin ().
Di Panel navigasi, klik Cluster management.
Periksa Status cluster. Jika status cluster masih Reconciling atau Updating, refresh secara berkala dan tunggu hingga statusnya berubah menjadi Ready sebelum berlanjut ke langkah berikutnya.
Membuat konfigurasi dan workstation
Untuk membuat konfigurasi workstation dan workstation, jalankan perintah berikut di Cloud Shell:
Setelah dibuat, workstation tersebut akan tercantum di bagian My workstations dengan status Stopped.
Untuk memulai workstation, klik Start.
Setelah workstation mulai berjalan, statusnya akan berubah menjadi Starting. Tunggu hingga statusnya berubah menjadi Running yang menunjukkan bahwa workstation ini siap digunakan.
Meluncurkan IDE
Agar berfungsi dengan benar, beberapa ekstensi memerlukan cookie pihak ketiga untuk diaktifkan di browser Anda.
Untuk mengaktifkan cookie pihak ketiga di Chrome, di menu Chrome, klik Setelan.
Di kotak penelusuran, ketik Cookie pihak ketiga.
Klik setelan Cookie pihak ketiga, lalu pilih Izinkan cookie pihak ketiga.
Catatan: Jika Anda ingin memulihkan browser ke setelannya saat ini setelah lab selesai, catat setelan asli untuk cookie pihak ketiga.
Untuk meluncurkan IDE Code OSS di workstation, dari halaman Workstations di Konsol Google Cloud, klik Launch.
IDE akan terbuka di tab browser lain.
Untuk memverifikasi tujuan, klik Periksa progres saya.
Membuat dan memulai Cloud Workstation
Tugas 3. Mengupdate ekstensi Cloud Code untuk mengaktifkan Gemini
Dalam tugas ini, Anda akan mengaktifkan Gemini di Cloud Code untuk IDE workstation Anda.
Menghubungkan ke Google Cloud
Untuk terhubung ke Google Cloud di workstation, jalankan langkah-langkah ini:
Untuk meluncurkan alur Cloud Code - Sign In, klik Cloud Code - Sign in di status bar di bagian bawah jendela, lalu buka link yang ditampilkan di terminal di browser Anda.
Jika Anda diminta untuk mengonfirmasi dibukanya situs eksternal, klik Open.
Pilih akun untuk melanjutkan langkah ke Gemini Code Assist, lalu klik Sign in.
Kode verifikasi Anda akan ditampilkan di tab browser.
Catatan: Anda kemungkinan akan melihat peringatan bahwa Anda menjalankan perintah gcloud auth login. Proses ini normal. IDE menjalankan perintah ini untuk Anda.
Klik Copy.
Kembali ke IDE, di terminal, di bagian yang bertuliskan Enter authorization code, tempelkan kode.
Jika Anda diminta untuk menyetujui penyalinan dari papan klip, klik Allow.
Tekan Enter, lalu tunggu hingga status bar menampilkan Cloud Code - No Project.
Anda kini terhubung ke Google Cloud.
Mengaktifkan Gemini di Cloud Code
Guna mengaktifkan Gemini di Cloud Code untuk IDE workstation Anda, jalankan langkah-langkah berikut:
Di IDE workstation Anda, klik menu (), lalu buka File > Preferences > Settings.
Di Search settings, masukkan Gemini.
Di tab User pada dialog Settings, pilih Extensions > Gemini Code Assist.
Di halaman setelan Cloud Code, untuk Geminicodeassist: Project, masukkan project ID Google Cloud .
Untuk memilih project untuk Cloud Code, klik Cloud Code - No Project di status bar di bagian bawah jendela. Selanjutnya, pilih opsi Select a Google Cloud project dan pilih .
Project ID kini akan terlihat di status bar. Sekarang Gemini siap digunakan.
Tugas 4. Mendownload, memeriksa, dan menjalankan aplikasi Flask Python
Kode untuk sebuah aplikasi Flask Python telah disimpankan untuk Anda di bucket Cloud Storage.
Dalam tugas ini, Anda akan mendownload, memeriksa, dan menjalankan aplikasi Flask Python di IDE. Gemini Code Assist akan menjelaskan kode.
Login ke terminal
Dari menu IDE (), pilih Terminal > New Terminal.
Di terminal, jalankan perintah berikut:
gcloud auth login
Buka link yang ditampilkan di terminal di browser Anda.
Pilih akun untuk melanjutkan langkah ke Login ke Google Cloud SDK, lalu klik Continue.
Terakhir, klik Allow di jendela yang menampilkan prompt Google Cloud SDK wants to access your Google Account.
Kode verifikasi Anda akan ditampilkan di tab browser.
Catatan: Anda kemungkinan akan melihat peringatan bahwa Anda menjalankan perintah gcloud auth login. Proses ini normal. IDE menjalankan perintah ini untuk Anda.
Klik Copy.
Kembali ke IDE dan tempel kode di terminal, di bagian yang bertuliskan Enter the verification code provided in your browser, lalu tekan Enter.
Sesi terminal Anda kini telah login ke Google Cloud.
Menginstal lingkungan virtual python
Untuk menginstal Python secara lokal di lingkungan virtual, jalankan perintah berikut:
Kode telah disalin ke subdirektori bernama codeassist-demo.
Di panel aktivitas IDE, klik Explorer (), lalu klik Open Folder.
Di dialog Open Folder, klik codeassist-demo, lalu klik OK.
Struktur direktori akan ditampilkan.
Memeriksa kode
Pilih main.py.
File Python akan terbuka di jendela editor.
Di panel aktivitas IDE, klik Gemini Code Assist ().
Gemini Code Assist adalah kolaborator berteknologi AI yang membantu tugas pengembangan aplikasi.
Di panel Gemini Code Assist, ketik perintah berikut, lalu klik Send ():
Explain this
Perintah adalah pertanyaan atau pernyataan yang menjelaskan bantuan yang Anda butuhkan. Perintah dapat menyertakan konteks dari kode yang sudah ada yang dianalisis Google Cloud untuk memberikan respons yang lebih bermanfaat atau lengkap. Untuk mengetahui informasi selengkapnya tentang cara menulis perintah agar dapat menghasilkan respons baik, baca artikel Menulis perintah yang lebih baik untuk Gemini untuk Google Cloud.
Gemini akan menjelaskan kode di main.py. Responsnya mungkin akan menjelaskan bagian berikut:
Dependensi
Penyiapan aplikasi
Rute
Eksekusi aplikasi
Jika Anda memilih kode, perintah yang sama akan membuat Gemini Code Assist hanya menjelaskan kode yang dipilih.
Catatan: Status histori percakapan hanya disimpan di memori dan akan terhapus saat Anda beralih ke ruang kerja lain atau menutup IDE. Gemini tidak akan menggunakan perintah Anda atau responsnya sebagai data untuk melatih modelnya. Untuk mengetahui informasi selengkapnya, baca artikel Cara Gemini untuk Google Cloud menggunakan data Anda.
Di editor, pilih app.route dan definisi fungsi untuk rute POST /convert, klik bohlam (), lalu klik Gemini: Explain this.
Gemini akan menjelaskan kode yang dipilih secara mendetail.
Menjalankan aplikasi
Jika terminal telah ditutup, dari menu IDE (), pilih Terminal > New Terminal.
Di terminal SSH, jalankan perintah berikut:
cd ~/codeassist-demo
source ~/env/bin/activate
python3 main.py
Perintah ini akan menampilkan error yang menyatakan bahwa tidak ada modul bernama flask. Anda dapat menggunakan Gemini Code Assist untuk membantu memahami masalah tersebut.
Di panel chat Gemini Code Assist, ketik perintah berikut:
How do you install Python requirements?
Gemini Code Assist kemungkinan akan menyebutkan bahwa Anda dapat menggunakan penginstal paket pip dan file requirements.txt untuk menginstal persyaratan Python.
Di panel aktivitas IDE, klik Explorer (), lalu klik requirements.txt.
Flask dan versi yang diperlukan akan tercantum dalam file requirements.txt.
Di terminal, jalankan perintah berikut:
pip install -r requirements.txt
Flask kini telah diinstal.
Di terminal, jalankan perintah berikut:
python3 main.py
Sebuah dialog akan menunjukkan bahwa layanan yang diproses di port 8080 kini tersedia untuk pratinjau web.
Klik Open Preview, lalu klik Open.
Aplikasi web Roman Numerals akan terbuka di tab baru.
Di kotak angka, masukkan 123, lalu klik Convert.
Angka yang ditampilkan adalah CXXIII. C adalah 100, X adalah 10, dan I adalah 1. Hasil ini sepertinya sudah benar.
Klik Return to home page, kemudian masukkan 45, lalu klik Convert.
Angka yang ditampilkan adalah XXXXV. Secara teknis, angka ini benar secara matematis (4 kali 10, ditambah 5). Namun, dalam penulisan angka Romawi, angka 40 biasanya ditulis sebagai XL (50 dikurangi 10), sehingga penulisan angka Romawi yang lebih umum adalah XLV.
Hal ini akan dibahas lebih lanjut nanti.
Di panel aktivitas IDE, klik Explorer (), lalu klik calendar.py.
Fungsi number_to_roman akan mengonversi angka menjadi angka Romawi.
Untuk memverifikasi tujuan, klik Periksa progres saya.
Menyalin kode dan menjalankan aplikasi Flask Python
Tugas 5. Menambahkan pengujian unit
Dalam tugas ini, Anda akan menggunakan Gemini Code Assist untuk membuat pengujian unit untuk kode Anda.
Di panel aktivitas IDE, klik Gemini Code Assist (), lalu masukkan perintah berikut:
Create unit tests for a fixed version of number_to_roman
Gemini Code Assist akan mengenali kode di tab terbuka untuk calendar.py. Kode contoh yang diberikan akan mirip dengan kode berikut:
import unittest
import calendar
class TestNumberToRoman(unittest.TestCase):
def test_basic_conversions(self):
self.assertEqual(calendar.number_to_roman(1), "I")
self.assertEqual(calendar.number_to_roman(5), "V")
self.assertEqual(calendar.number_to_roman(10), "X")
self.assertEqual(calendar.number_to_roman(50), "L")
self.assertEqual(calendar.number_to_roman(100), "C")
self.assertEqual(calendar.number_to_roman(500), "D")
self.assertEqual(calendar.number_to_roman(1000), "M")
def test_combinations(self):
self.assertEqual(calendar.number_to_roman(4), "IV")
self.assertEqual(calendar.number_to_roman(9), "IX")
self.assertEqual(calendar.number_to_roman(14), "XIV")
self.assertEqual(calendar.number_to_roman(40), "XL")
self.assertEqual(calendar.number_to_roman(90), "XC")
self.assertEqual(calendar.number_to_roman(400), "CD")
self.assertEqual(calendar.number_to_roman(900), "CM")
self.assertEqual(calendar.number_to_roman(1994), "MCMXCIV")
self.assertEqual(calendar.number_to_roman(3888), "MMMDCCCLXXXVIII")
def test_edge_cases(self):
self.assertEqual(calendar.number_to_roman(0), "") # Should handle zero
self.assertRaises(TypeError, calendar.number_to_roman, "abc") # Should handle invalid input
def test_large_numbers(self):
self.assertEqual(calendar.number_to_roman(3000), "MMM")
self.assertEqual(calendar.number_to_roman(3999), "MMMCMXCIX")
if __name__ == '__main__':
unittest.main()
Catatan: Gemini mungkin akan membuat pengujian unit yang lulus berdasarkan implementasi kode Anda saat ini, bukan berdasarkan standar penulisan angka Romawi yang benar. Untuk keperluan lab ini, Anda akan menggunakan versi pengujian unit yang benar.
Untuk menghentikan aplikasi yang berjalan, tekan CTRL + C di terminal.
Untuk membuat pengujian unit untuk fungsi convert, di terminal, jalankan perintah berikut:
Untuk menjalankan pengujian, jalankan perintah berikut di terminal:
cd ~/codeassist-demo
python3 test_calendar.py
Pengujian akan gagal:
======================================================================
ERROR: test_edge_cases (__main__.TestNumberToRoman.test_edge_cases)
----------------------------------------------------------------------
Traceback (most recent call last):
File "/home/user/codeassist-demo/test_calendar.py", line 28, in test_edge_cases
self.assertRaises(TypeError, calendar.number_to_roman, "abc") # Should handle invalid input
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
File "/usr/lib/python3.12/unittest/case.py", line 778, in assertRaises
return context.handle('assertRaises', args, kwargs)
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
File "/usr/lib/python3.12/unittest/case.py", line 238, in handle
callable_obj(*args, **kwargs)
File "/home/user/codeassist-demo/calendar.py", line 16, in number_to_roman
number = int(number)
^^^^^^^^^^^
ValueError: invalid literal for int() with base 10: 'abc'
======================================================================
FAIL: test_combinations (__main__.TestNumberToRoman.test_combinations)
----------------------------------------------------------------------
Traceback (most recent call last):
File "/home/user/codeassist-demo/test_calendar.py", line 16, in test_combinations
self.assertEqual(calendar.number_to_roman(4), "IV")
AssertionError: 'IIII' != 'IV'
- IIII
+ IV
======================================================================
FAIL: test_large_numbers (__main__.TestNumberToRoman.test_large_numbers)
----------------------------------------------------------------------
Traceback (most recent call last):
File "/home/user/codeassist-demo/test_calendar.py", line 33, in test_large_numbers
self.assertEqual(calendar.number_to_roman(3999), "MMMCMXCIX")
AssertionError: 'MMMDCCCCLXXXXVIIII' != 'MMMCMXCIX'
- MMMDCCCCLXXXXVIIII
+ MMMCMXCIX
----------------------------------------------------------------------
Ran 4 tests in 0.004s
FAILED (failures=2, errors=1)
Kegagalan yang terjadi adalah:
abc tidak ditangani dengan benar.
4 menghasilkan IIII, padahal seharusnya IV.
3999 menghasilkan MMMDCCCCLXXXXVIIII, padahal seharusnya MMMCMXCIX.
Dalam tiap fungsi pengujian, error pertama yang ditemukan akan menyebabkan fungsi berhenti.
Catatan: Hasil Anda mungkin akan berbeda jika kode pengujian Anda berbeda.
Untuk memverifikasi tujuan, klik Periksa progres saya.
Membuat pengujian unit untuk fungsi convert
Tugas 6. Memperbaiki kode dan membuatnya lebih mudah dibaca
Dalam tugas ini, Anda akan menggunakan Gemini Code Assist untuk memperbaiki kode dan membuatnya lebih mudah dibaca.
Di panel aktivitas IDE, klik Explorer (), lalu klik calendar.py.
Di panel aktivitas IDE, klik Gemini Code Assist (), lalu masukkan perintah berikut:
Make my code more readable and fix any errors
Gemini Code Assist akan menghasilkan kode yang lebih mudah dibaca, dan kemungkinan akan memperbaiki masalah yang ada. Berikut contohnya:
def number_to_roman(number):
"""Converts an integer to its Roman numeral equivalent.
Args:
number: An integer between 0 and 3999.
Returns:
A string representing the Roman numeral equivalent of the number.
Returns an empty string if the input is 0.
Raises TypeError if the input is not an integer or is out of range.
"""
try:
number = int(number)
except ValueError:
raise TypeError("Input must be an integer.")
if not 0 <= number <= 3999:
raise TypeError("Input must be between 0 and 3999.")
if number == 0:
return ""
roman_map = { 1000: 'M', 900: 'CM', 500: 'D', 400: 'CD', 100: 'C', 90: 'XC',
50: 'L', 40: 'XL', 10: 'X', 9: 'IX', 5: 'V', 4: 'IV', 1: 'I'}
result = ""
for value, numeral in roman_map.items():
while number >= value:
result += numeral
number -= value
return result
Gemini Code Assist juga menjelaskan perubahan yang telah dilakukan:
Key improvements:
1. Error Handling: Added TypeError for non-integer input and values outside the range 0-3999. This makes the function more robust.
2. Docstring: A clear docstring explains the function's purpose, arguments, return value, and error handling. This significantly improves readability and maintainability.
3. Efficiency and Correctness: Uses a roman_map dictionary and a more efficient algorithm to construct the Roman numeral. This handles subtractive notation (like "IV" for 4, "IX" for 9, etc.) correctly. The previous version had issues with these cases and was less efficient.
4. Zero Handling: Explicitly handles the case where the input number is 0, returning an empty string as expected.
5. Clarity: The code is now more concise and easier to understand. The logic is clearer and the variable names are more descriptive.
This revised version addresses the limitations and errors of the original implementation and adheres to best practices for Python code. It's more robust, readable, and efficient.
Dalam contoh ini, Gemini Code Assist memberikan algoritma yang membuat kode lebih mudah dibaca, sekaligus memperbaiki masalah dalam kode asli.
Untuk membandingkan kode di file yang baru, di panel kode dalam Gemini Code Assist, klik Diff with Open File ().
Untuk menerima perubahan, klik Accept. Kode yang diperbarui akan diterima.
Di terminal SSH, jalankan perintah berikut:
cd ~/codeassist-demo
python3 test_calendar.py
Jika pengujian tidak lulus, coba jalankan pengujian beberapa kali untuk memastikan pengujian tidak menggunakan versi modul kalender yang di-cache.
Jika Gemini belum memperbaiki masalah angka Romawi, beberapa pengujian akan gagal. Jika hal ini terjadi, Anda dapat memperbaiki sendiri kode tersebut hingga pengujian berhasil, atau Anda dapat mengganti calendar.py dengan versi yang sudah diketahui berfungsi dengan baik.
Jika beberapa pengujian gagal, untuk memperbaiki kode dan menjalankan kembali pengujian unit, jalankan perintah berikut:
cat > ~/codeassist-demo/calendar.py <<EOF
def number_to_roman(number):
"""Converts an integer to its Roman numeral equivalent.
Args:
number: An integer between 0 and 3999.
Returns:
A string representing the Roman numeral equivalent of the number.
Returns an empty string if the input is 0.
Raises TypeError if the input is not an integer or is out of range.
"""
try:
number = int(number)
except ValueError:
raise TypeError("Input must be an integer.")
if not 0 <= number <= 3999:
raise TypeError("Input must be between 0 and 3999.")
if number == 0:
return ""
roman_map = { 1000: 'M', 900: 'CM', 500: 'D', 400: 'CD', 100: 'C', 90: 'XC',
50: 'L', 40: 'XL', 10: 'X', 9: 'IX', 5: 'V', 4: 'IV', 1: 'I'}
result = ""
for value, numeral in roman_map.items():
while number >= value:
result += numeral
number -= value
return result
EOF
cd ~/codeassist-demo
python3 test_calendar.py
Pengujian seharusnya berhasil sekarang.
Untuk memverifikasi tujuan, klik Periksa progres saya.
Memperbarui calendar.py untuk memperbaiki masalah dalam kode aslinya
Tugas 7. Meningkatkan keterbacaan kode bagi yang bukan penutur asli bahasa Inggris
Jika Anda bukan penutur asli bahasa Inggris yang mengandalkan aplikasi penerjemahan, Anda dapat menggunakan Gemini Code Assist untuk membuat komentar dalam bahasa lain.
Dalam tugas ini, Anda akan menggunakan Gemini Code Assist untuk menambahkan komentar ke kode, termasuk dalam bahasa lain.
Di panel aktivitas IDE, klik Explorer (), lalu klik main.py.
Di panel aktivitas IDE, klik Gemini Code Assist (), lalu masukkan perintah berikut:
Add comments to main.py
Gemini Code Assist akan menambahkan komentar yang membantu menjelaskan kode:
import os # Import the os module for environment variables
from flask import Flask, render_template, request # Import Flask framework components
import calendar # Import the calendar module for Roman numeral conversion
# Create a Flask app instance
app = Flask(__name__)
# Define a route for the home page
@app.route("/", methods=["GET"])
def home_page():
# Render the index.html template
return render_template("index.html")
# Define a route for the conversion endpoint
@app.route("/convert", methods=["POST"])
def convert():
# Get the number from the form data
number = request.form["number"]
# Convert the number to Roman numerals using the calendar module
roman = calendar.number_to_roman(number)
# Render the convert.html template with the number and its Roman numeral equivalent
return render_template("convert.html", number=number, roman=roman)
# Run the Flask app if this script is executed directly
if __name__ == "__main__":
# Run the app in debug mode, listening on all interfaces (0.0.0.0)
# and using the port specified in the environment variable PORT or defaulting to 8080
app.run(debug=True, host="0.0.0.0", port=int(os.environ.get("PORT", 8080)))
Namun, bagaimana jika bahasa Inggris bukan bahasa pertama Anda?
Di panel Gemini Code Assist, masukkan perintah berikut:
Add Spanish comments to main.py
Gemini Code Assist dapat memberikan komentar dalam berbagai bahasa untuk membantu meningkatkan keterbacaan kode.
Untuk memverifikasi bahwa hanya komentar yang ditambahkan, di panel kode dalam Gemini Code Assist, klik Diff with Open File ().
Pembaruan akan dibandingkan dengan kode sebelumnya:
Untuk menolak perubahan, klik Decline.
Tugas 8. Membuat tampilan aplikasi jadi lebih menarik
Gemini Code Assist juga dapat membantu Anda membuat tampilan aplikasi menjadi lebih menarik.
Dalam tugas ini, Anda akan menggunakan Gemini Code Assist untuk meningkatkan kualitas desain visual aplikasi Anda.
Di terminal, jalankan perintah berikut:
cd ~/codeassist-demo
python3 main.py
Sebuah dialog akan menunjukkan bahwa layanan yang diproses di port 8080 kini tersedia untuk pratinjau web.
Klik Open Preview, lalu klik Open.
Aplikasi web Roman Numerals akan terbuka di tab baru.
Di panel aktivitas IDE, klik Explorer (), lalu pilih templates/index.html.
Template HTML untuk aplikasi ini sangat sederhana.
Di panel aktivitas IDE, klik Gemini Code Assist (), lalu masukkan perintah berikut:
Make this HTML template look better
Gemini Code Assist akan memperbarui kode untuk membuat tampilan halaman entri aplikasi jadi lebih menarik.
Untuk menerima perubahan, di panel kode dalam Gemini Code Assist, klik Diff with Open File (), lalu klik Accept.
Kembali ke tab browser aplikasi Roman Numerals, lalu klik Refresh.
Aplikasi akan terlihat lebih bagus. Dalam contoh ini, dialog diposisikan di tengah halaman dan ada penambahan warna.
Catatan: Perubahan yang dilakukan oleh Gemini Code Assist mungkin akan terlihat berbeda bagi Anda.
Di panel aktivitas IDE, klik Explorer (), lalu klik templates/convert.html.
Di panel aktivitas IDE, klik Gemini Code Assist (), lalu masukkan perintah berikut:
Make the convert.html template look similar to the index.html template
Gemini Code Assist akan memperbarui template hasil agar selaras dengan template indeks.
Untuk menerima perubahan, di panel kode dalam Gemini Code Assist, klik Diff with Open File (), lalu klik Accept.
Kembali ke tab browser aplikasi Roman Numerals, masukkan 45, lalu klik Enter.
Halaman hasil baru akan selaras dengan gaya halaman indeks:
Untuk memverifikasi tujuan, klik Periksa progres saya.
Menggunakan Gemini Code Assist untuk meningkatkan kualitas desain visual aplikasi Anda
Mengakhiri lab Anda
Setelah Anda menyelesaikan lab, klik Akhiri Lab. Qwiklabs menghapus resource yang telah Anda gunakan dan menghapus akun.
Anda akan diberi kesempatan untuk menilai pengalaman menggunakan lab. Pilih jumlah bintang yang sesuai, ketik komentar, lalu klik Submit.
Makna jumlah bintang:
1 bintang = Sangat tidak puas
2 bintang = Tidak puas
3 bintang = Netral
4 bintang = Puas
5 bintang = Sangat puas
Anda dapat menutup kotak dialog jika tidak ingin memberikan masukan.
Untuk masukan, saran, atau koreksi, gunakan tab Dukungan.
Selamat!
Di lab ini, Anda telah mempelajari cara:
Membuat lingkungan pengembangan aplikasi berbasis cloud menggunakan Cloud Workstations.
Menggunakan Gemini Code Assist untuk menjelaskan kode.
Membuat pengujian unit dengan Gemini Code Assist.
Memasukkan perintah ke Gemini untuk meningkatkan kualitas tampilan aplikasi.
Menggunakan Gemini Code Assist untuk membuat kode lebih mudah dibaca.
Menggunakan Gemini Code Assist untuk menambahkan komentar ke kode, dalam bahasa Inggris atau bahasa lainnya.
Hak cipta 2024 Google LLC. Semua hak dilindungi undang-undang. Google dan logo Google adalah merek dagang dari Google LLC. Semua nama perusahaan dan produk lain mungkin adalah merek dagang masing-masing perusahaan yang bersangkutan.
Lab membuat project dan resource Google Cloud untuk jangka waktu tertentu
Lab memiliki batas waktu dan tidak memiliki fitur jeda. Jika lab diakhiri, Anda harus memulainya lagi dari awal.
Di kiri atas layar, klik Start lab untuk memulai
Gunakan penjelajahan rahasia
Salin Nama Pengguna dan Sandi yang diberikan untuk lab tersebut
Klik Open console dalam mode pribadi
Login ke Konsol
Login menggunakan kredensial lab Anda. Menggunakan kredensial lain mungkin menyebabkan error atau dikenai biaya.
Setujui persyaratan, dan lewati halaman resource pemulihan
Jangan klik End lab kecuali jika Anda sudah menyelesaikan lab atau ingin mengulanginya, karena tindakan ini akan menghapus pekerjaan Anda dan menghapus project
Konten ini tidak tersedia untuk saat ini
Kami akan memberi tahu Anda melalui email saat konten tersedia
Bagus!
Kami akan menghubungi Anda melalui email saat konten tersedia
Satu lab dalam satu waktu
Konfirmasi untuk mengakhiri semua lab yang ada dan memulai lab ini
Gunakan penjelajahan rahasia untuk menjalankan lab
Gunakan jendela Samaran atau browser pribadi untuk menjalankan lab ini. Langkah ini akan mencegah konflik antara akun pribadi Anda dan akun Siswa yang dapat menyebabkan tagihan ekstra pada akun pribadi Anda.
Di lab ini, Anda akan mengembangkan aplikasi menggunakan bantuan dari Gemini di sebuah IDE.