Men-deploy Aplikasi Web Node.js Genkit AI Generatif secara otomatis dari Kontrol Versi ke Cloud Run

1. Ringkasan

Men-deploy aplikasi web untuk pertama kalinya bisa menjadi pengalaman yang menegangkan. Bahkan setelah deployment pertama, jika prosesnya terlalu banyak pekerjaan, Anda mungkin menghindari deployment versi baru aplikasi. Dengan deployment berkelanjutan, Anda dapat men-deploy perubahan aplikasi secara otomatis dengan mudah.

Di lab ini, Anda akan menulis aplikasi web dan mengonfigurasi Cloud Run untuk men-deploy aplikasi secara otomatis saat perubahan dilakukan pada kode sumber aplikasi. Kemudian, Anda mengubah aplikasi dan men-deploy-nya lagi.

Yang akan Anda pelajari

• Menulis aplikasi web dengan Cloud Shell Editor
• Menyimpan kode aplikasi di GitHub
• Men-deploy aplikasi Anda ke Cloud Run secara otomatis

• Menambahkan AI generatif ke aplikasi Anda menggunakan Genkit
• Mengelola perintah LLM menggunakan library dotprompt

2. Prasyarat

1. Jika belum memiliki Akun Google, Anda harus membuat Akun Google.
   • Gunakan akun pribadi, bukan akun kantor atau sekolah. Akun kerja dan sekolah mungkin memiliki batasan yang mencegah Anda mengaktifkan API yang diperlukan untuk lab ini.
2. Jika belum memiliki akun GitHub, Anda harus membuat akun GitHub
   • Gunakan akun GitHub yang ada jika Anda memilikinya. GitHub cenderung memblokir akun baru sebagai spam.
   • Konfigurasikan autentikasi dua faktor di akun GitHub Anda untuk mengurangi kemungkinan akun Anda ditandai sebagai spam.

3. Penyiapan project

1. Login ke Konsol Google Cloud.
2. Aktifkan penagihan di Konsol Cloud.
   • Menyelesaikan lab ini akan menghabiskan biaya kurang dari $1 USD untuk resource Cloud.
   • Anda dapat mengikuti langkah-langkah di akhir lab ini untuk menghapus resource guna menghindari tagihan lebih lanjut.
   • Pengguna baru memenuhi syarat untuk Uji Coba Gratis senilai$300 USD.
   • Menghadiri acara AI Generatif untuk Developer? Kredit sebesar$1 USD mungkin tersedia.
3. Buat project baru atau pilih untuk menggunakan kembali project yang ada.

4. Membuka Cloud Shell Editor

1. Buka Cloud Shell Editor
2. Jika terminal tidak muncul di bagian bawah layar, buka:
   • Klik menu tiga garis
   • Klik Terminal
   • Klik New Terminal
3. Di terminal, tetapkan project Anda dengan perintah ini:
   • Format:

     gcloud config set project [PROJECT_ID]
     

   • Contoh:

     gcloud config set project lab-project-id-example
     

   • Jika Anda tidak dapat mengingat project ID:
     • Anda dapat mencantumkan semua project ID dengan:

       gcloud projects list | awk '/PROJECT_ID/{print $2}'
       

     
4. Jika diminta untuk memberikan otorisasi, klik Authorize untuk melanjutkan.
5. Anda akan melihat pesan ini:

   Updated property [core/project].
   

   Jika Anda melihat WARNING dan ditanya Do you want to continue (Y/N)?, berarti Anda mungkin salah memasukkan project ID. Tekan N, tekan Enter, lalu coba jalankan kembali perintah gcloud config set project.

5. Mengaktifkan API

Di terminal, aktifkan API:

gcloud services enable \
  run.googleapis.com \
  cloudbuild.googleapis.com \
  aiplatform.googleapis.com

Pemrosesan perintah ini mungkin memerlukan waktu beberapa menit, tetapi pada akhirnya akan menampilkan pesan berhasil seperti ini:

Operation "operations/acf.p2-73d90d00-47ee-447a-b600" finished successfully.

6. Mengonfigurasi Git

1. Tetapkan email pengguna git global Anda:

   git config --global user.email "[e-mail]"
   

2. Tetapkan nama pengguna git global Anda:

   git config --global user.name "Your Name"
   

3. Tetapkan cabang default git global Anda ke main:

   git config --global init.defaultBranch main
   

7. Tuliskan kode Anda

Untuk menulis aplikasi di Node.js:

1. Buka direktori utama:

   cd ~
   

2. Buat direktori codelab-genai:

   mkdir codelab-genai
   

3. Buka direktori codelab-genai:

   cd codelab-genai
   

4. Buat file index.js:

   touch index.js
   

5. Buat file package.json:

   npm init es6 -y
   

6. Tambahkan express sebagai dependensi

   npm install express
   

7. Menambahkan file .gitignore untuk mencegah commit node_modules

   echo node_modules/ >> .gitignore
   

8. Buka file index.js di Cloud Shell Editor:

   cloudshell edit index.js
   

   File kosong kini akan muncul di bagian atas layar. Di sinilah Anda dapat mengedit file index.js ini.
9. Salin kode berikut dan tempelkan ke dalam file index.js yang terbuka:

   import express from 'express';
   
   const app = express();
   app.get('/', async (req, res) => {
       res.send('Hello world!');
   });
   
   const port = process.env.PORT || 8080;
   app.listen(port, () => {
       console.log(`codelab-genai: listening on port ${port}`);
   });
   

   Setelah beberapa detik, Editor Cloud Shell akan otomatis menyimpan kode Anda. Kode ini merespons permintaan http dengan sapaan "Halo dunia!".

Kode awal untuk aplikasi Anda sudah selesai dan siap disimpan dalam kontrol versi.

8. Membuat repositori

1. Kembali ke terminal Cloud Shell di bagian bawah layar.
2. Pastikan Anda masih berada di direktori yang benar:

   cd ~/codelab-genai
   

3. Lakukan inisialisasi repositori git Anda

   git init -b main
   

4. Login ke GitHub CLI

   gh auth login
   

   Tekan Enter untuk menerima opsi default dan ikuti petunjuk di alat GitHub CLI, termasuk:
   1. Akun mana yang ingin Anda gunakan untuk login? GitHub.com
   2. Apa protokol pilihan Anda untuk operasi Git di host ini? HTTPS
   3. Mengautentikasi Git dengan kredensial GitHub Anda? Y (Lewati jika opsi ini tidak muncul.)
   4. Bagaimana Anda ingin mengautentikasi GitHub CLI? Login with a web browser
   5. Menyalin kode sekali pakai
   6. Buka https://github.com/login/device
   7. Tempelkan kode sekali pakai Anda
   8. Klik Beri otorisasi GitHub
   9. Selesaikan login Anda
5. Pastikan Anda sudah login:

   gh api user -q ".login"
   

   Jika Anda berhasil login, tindakan ini akan menampilkan nama pengguna GitHub Anda.
6. Buat variabel GITHUB_USERNAME

   GITHUB_USERNAME=$(gh api user -q ".login")
   

7. Pastikan Anda telah membuat variabel lingkungan:

   echo ${GITHUB_USERNAME}
   

   Jika Anda berhasil membuat variabel, tindakan ini akan menampilkan nama pengguna GitHub Anda.
8. Buat repositori GitHub kosong bernama codelab-genai:

   gh repo create codelab-genai --private
   

   Jika Anda menerima error:

   GraphQL: Name already exists on this account (createRepository)
   

   Berarti Anda sudah memiliki repositori bernama codelab-genai. Anda memiliki dua opsi untuk melanjutkan tutorial ini:
   • Menghapus repositori GitHub yang ada
   • Buat repositori dengan nama yang berbeda dan jangan lupa untuk mengubahnya dalam perintah berikut.
9. Tambahkan repositori codelab-genai sebagai origin jarak jauh:

   git remote add origin https://github.com/${GITHUB_USERNAME}/codelab-genai
   

9. Membagikan kode

1. Pastikan Anda berada di direktori yang benar:

   cd ~/codelab-genai
   

2. Tambahkan semua file dalam direktori saat ini ke commit ini:

   git add .
   

3. Buat commit pertama:

   git commit -m "add http server"
   

4. Kirim commit Anda ke cabang main dari repositori origin:

   git push -u origin main
   

Anda dapat menjalankan perintah ini dan membuka URL yang dihasilkan untuk melihat kode aplikasi di GitHub:

echo -e "\n\nTo see your code, visit this URL:\n \
    https://github.com/${GITHUB_USERNAME}/codelab-genai/blob/main/index.js \n\n"

10. Menyiapkan deployment otomatis

1. Biarkan tab Cloud Shell Editor tetap terbuka. Kita akan kembali ke tab ini nanti.
2. Di tab baru, buka halaman Cloud Run
3. Pilih Project Google Cloud yang benar di konsol
4. Klik HUBUNGKAN REPOSITORI
5. Klik SIAPAKAN DENGAN CLOUD BUILD
   1. Pilih GitHub sebagai Penyedia Repositori
      • Jika Anda tidak login ke akun GitHub di browser, login dengan kredensial Anda.
   2. Klik Autentikasi, lalu klik Lanjutkan.
   3. Setelah login, Anda akan melihat pesan di halaman Cloud Run yang menyatakan Aplikasi GitHub tidak diinstal di repositori apa pun.
   4. Klik tombol INSTALL GOOGLE CLOUD BUILD.
      • Di halaman Penyiapan Penginstalan, pilih Hanya pilih repositori dan pilih repositori codelab-genai yang Anda buat melalui CLI.
      • Klik Instal
      • Catatan: Jika Anda memiliki banyak repositori GitHub, proses ini dapat memerlukan waktu beberapa menit untuk dimuat.
   5. Pilih your-user-name/codelab-genai sebagai Repositori
      • Jika repositori tidak ada, klik link Manage Connected Repositories.
   6. Biarkan Cabang sebagai ^main$
   7. Klik Go, Node.js, Python, Java, .NET Core, Ruby, atau PHP melalui buildpack Google Cloud
      • Biarkan kolom lainnya (Build context directory, Entrypoint, dan Function target) apa adanya.
   8. Klik Simpan
6. Scroll ke bawah ke Autentikasi
7. Klik Izinkan pemanggilan yang tidak diautentikasi
8. Klik BUAT

Setelah build selesai (yang akan memerlukan waktu beberapa menit), jalankan perintah ini dan buka URL yang dihasilkan untuk melihat aplikasi yang sedang berjalan:

echo -e "\n\nOnce the build finishes, visit your live application:\n \
    "$( \
        gcloud run services list | \
        grep codelab-genai | \
        awk '/URL/{print $2}' | \
        head -1 \
    )" \n\n"

11. Mengubah kode

Kembali ke Cloud Shell Editor

Jika masih membuka Cloud Shell Editor, Anda dapat melewati langkah-langkah ini.

1. Buka Cloud Shell Editor
2. Jika terminal tidak muncul di bagian bawah layar, buka:
   • Klik menu tiga garis
   • Klik Terminal
   • Klik New Terminal
3. Di terminal, tetapkan project Anda dengan perintah ini:
   • Format:

     gcloud config set project [PROJECT_ID]
     

   • Contoh:

     gcloud config set project lab-project-id-example
     

   • Jika Anda tidak dapat mengingat project ID:
     • Anda dapat mencantumkan semua project ID dengan:

       gcloud projects list | awk '/PROJECT_ID/{print $2}'
       

     
4. Jika diminta untuk memberikan otorisasi, klik Authorize untuk melanjutkan.
5. Anda akan melihat pesan ini:

   Updated property [core/project].
   

   Jika Anda melihat WARNING dan ditanya Do you want to continue (Y/N)?, berarti Anda mungkin salah memasukkan project ID. Tekan N, tekan Enter, lalu coba jalankan kembali perintah gcloud config set project.

Menambahkan Vertex AI ke aplikasi Anda

1. Kembali ke terminal Cloud Shell di bagian bawah layar.
2. Pastikan Anda masih berada di direktori yang benar:

   cd ~/codelab-genai
   

3. Instal Node.js Genkit SDK:

   npm install @genkit-ai/ai
   

4. Instal Node.js Genkit SDK untuk Vertex AI:

   npm install @genkit-ai/vertexai
   

5. Instal Node.js Google Auth SDK:

   npm install google-auth-library
   

6. Buka kembali index.js di Cloud Shell Editor

   cloudshell edit ~/codelab-genai/index.js
   

7. Ganti kode dalam file index.js dengan:

   import express from 'express';
   const app = express();
   
   import { generate } from '@genkit-ai/ai';
   import { gemini15Flash, vertexAI } from '@genkit-ai/vertexai';
   
   import { GoogleAuth } from 'google-auth-library';
   const auth = new GoogleAuth();
   
   app.get('/', async (req, res) => {
       const project = await auth.getProjectId();
   
       const animal = req.query.animal || 'dog';
       const prompt = `Give me 10 fun facts about ${animal}. Return this as html without backticks.`
       const result = await generate({
           plugins: [
               vertexAI({ projectId: project, location: 'us-central1' }),
           ],
           model: gemini15Flash,
           prompt,
       });
       const html = result.text;
       res.send(html);
   });
   
   const port = process.env.PORT || 8080;
   app.listen(port, () => {
       console.log(`codelab-genai: listening on port ${port}`);
   });
   

12. Deploy ulang

1. Pastikan Anda masih berada di direktori yang benar di Cloud Shell:

   cd ~/codelab-genai
   

2. Jalankan perintah ini untuk melakukan commit versi baru aplikasi ke repositori git lokal Anda:

   git add .
   git commit -m "add latest changes"
   

3. Kirim perubahan ke GitHub:

   git push
   

4. Setelah build selesai, jalankan perintah ini dan buka aplikasi yang di-deploy:

   echo -e "\n\nOnce the build finishes, visit your live application:\n \
       "$( \
           gcloud run services list | \
           grep codelab-genai | \
           awk '/URL/{print $2}' | \
           head -1 \
       )" \n\n"
   

Mungkin perlu waktu beberapa menit hingga build selesai sebelum Anda dapat melihat perubahan.

Anda dapat melihat histori semua revisi di sini: https://console.cloud.google.com/run/detail/us-central1/codelab-genai/revisions

13. (Opsional) Mengaudit penggunaan Vertex AI

Seperti layanan Google Cloud lainnya, Anda dapat mengaudit operasi Vertex AI. Log audit membantu Anda menjawab pertanyaan, "Siapa yang melakukan apa, di mana, dan kapan?". Log audit administratif untuk Vertex AI diaktifkan secara default. Untuk mengaudit permintaan guna membuat konten, Anda harus mengaktifkan log audit Akses Data:

Log audit data dapat menimbulkan biaya tambahan.

1. Di konsol Google Cloud, buka halaman Log Audit:
   Buka Log Audit
   Jika Anda menggunakan kotak penelusuran untuk menemukan halaman ini, pilih hasil yang subjudulnya adalah IAM & Admin.
2. Pastikan project Google Cloud yang ada adalah tempat Anda membuat aplikasi Cloud Run.
3. Di tabel Data Access audit logs configuration, temukan Vertex AI API yang dipilih dari kolom Service.
4. Di tab Log Types, pilih jenis log audit Akses Data Admin read dan Data read.
5. Klik Simpan.

Setelah mengaktifkannya, Anda akan dapat melihat log audit untuk setiap pemanggilan aplikasi. Untuk melihat log audit dengan detail pemanggilan, lakukan hal berikut:

1. Kembali ke aplikasi yang di-deploy dan muat ulang halaman untuk memicu log.
2. Di konsol Google Cloud, buka halaman Log Explorer:
   Buka Log Explorer
   
3. Di jendela kueri, ketik:

   LOG_ID("cloudaudit.googleapis.com%2Fdata_access")
   protoPayload.serviceName="aiplatform.googleapis.com"
   

4. Klik Run query.

Log audit merekam penggunaan Vertex AI API, tetapi tidak memungkinkan Anda mengamati data terkait beban kerja seperti perintah atau detail respons.

14. (Opsional) Meningkatkan visibilitas beban kerja AI Anda

Log audit tidak merekam informasi terkait beban kerja. Untuk meningkatkan visibilitas beban kerja, Anda harus mencatat informasi ini secara eksplisit. Anda dapat menggunakan framework logging favorit untuk melakukannya. Langkah-langkah berikut menunjukkan cara melakukannya menggunakan mekanisme logging Node.js native.

1. Buka kembali index.js di Cloud Shell Editor

   cloudshell edit ~/codelab-genai/index.js
   

2. Setelah panggilan ke await generativeModel.generateContent(prompt) (baris 19), tambahkan baris berikut:

       console.log(JSON.stringify({
           severity: 'DEBUG',
           message: 'Content is generated',
           prompt: prompt,
           response: resp.response,
       }));
   

   Kode ini menulis ke informasi stdout tentang konten yang dihasilkan menggunakan format logging terstruktur. Agen logging di Cloud Run mengambil output yang dicetak ke stdout dan menulis format ini ke Cloud Logging.
3. Buka kembali Cloud Shell dan ketik perintah berikut untuk memastikan Anda berada di direktori yang benar:

   cd ~/codelab-genai
   

4. Lakukan commit perubahan:

   git commit -am "observe generated content"
   

5. Kirim perubahan ke GitHub untuk memicu deployment ulang versi yang diubah:

   git push
   

Setelah versi baru di-deploy, Anda dapat mengamati informasi debug tentang panggilan ke Vertex AI.

Untuk melihat log aplikasi, lakukan hal berikut:

1. Di konsol Google Cloud, buka halaman Log Explorer:
   Buka Log Explorer
   
2. Di jendela kueri, ketik:

   LOG_ID("run.googleapis.com%2Fstdout")
   severity=DEBUG
   

3. Klik Run query.

Hasil kueri menampilkan log dengan perintah dan respons Vertex AI, termasuk "rating keamanan" yang dapat digunakan untuk memantau praktik keamanan

Berhati-hatilah saat mencatat perintah ke dalam log karena perintah tersebut dapat berisi informasi sensitif yang tidak dimaksudkan untuk diamati. Anda dapat menyamarkan atau mengaburkan informasi ini. Lihat dokumentasi DLP untuk mengetahui detail selengkapnya.

15. (Opsional) Membersihkan

Meskipun Cloud Run tidak mengenakan biaya saat layanannya tidak digunakan, Anda mungkin tetap ditagih atas penyimpanan image container di Artifact Registry. Anda dapat menghapus project Cloud untuk menghindari tagihan. Menghapus project Cloud akan menghentikan penagihan untuk semua resource yang digunakan dalam project tersebut.

Jika mau, hapus project:

gcloud projects delete $GOOGLE_CLOUD_PROJECT

Anda juga dapat menghapus resource yang tidak diperlukan dari disk cloudshell. Anda dapat:

1. Hapus direktori project codelab:

   rm -rf ~/codelab-genai
   

2. Peringatan! Tindakan ini tidak dapat diurungkan. Jika ingin menghapus semua yang ada di Cloud Shell untuk mengosongkan ruang, Anda dapat menghapus seluruh direktori beranda. Pastikan semua yang ingin Anda simpan disimpan di tempat lain.

   sudo rm -rf $HOME
   

16. Selamat

Dalam lab ini, Anda telah menulis aplikasi web dan mengonfigurasi Cloud Run untuk men-deploy aplikasi secara otomatis saat perubahan dilakukan pada kode sumber aplikasi. Kemudian, Anda mengubah aplikasi dan men-deploy-nya lagi.

Jika menyukai lab ini, Anda dapat mencobanya lagi dalam bahasa atau framework coding lain:

• Python
• Node.js
• Go
• Java
• Angular
• Next.js

Jika Anda tertarik untuk diikutsertakan dalam studi riset pengalaman pengguna (UX) guna meningkatkan kualitas produk yang Anda gunakan saat ini, daftar di sini.

Berikut beberapa opsi untuk melanjutkan pembelajaran Anda:

• Dokumen: Gunakan Firebase GenKit sebagai abstraksi model fleksibel yang memudahkan integrasi API model apa pun dan penggunaan model yang dikelola komunitas.
• Codelab: Cara men-deploy aplikasi chat yang didukung gemini di Cloud Run
• Cara menggunakan panggilan fungsi Gemini dengan Cloud Run
• Cara menggunakan Cloud Run Jobs Video Intelligence API untuk memproses Video adegan demi adegan
• Workshop on demand: Pengenalan Google Kubernetes Engine