1. Giriş
Bu codelab'de, Google Cloud Storage'a yüklenen PDF belgelerini özetlemek için Vertex AI modellerini kullanan mevcut bir Jump Start Çözümü olan AI Özetleme'yi inceleyeceğiz.
Ardından Gemini Code Assist'i şu amaçlarla kullanacağız:
- PDF belgesindeki metni ayıklama, özetleme ve sonuçları BigQuery'ye yazma işlemlerini yapan Cloud Functions işlevini destekleyen Python kodunu anlayın.
- Yeni işlevler yazmanıza yardımcı olması için süreç boyunca Gemini Code Assist'in yardımını alacağız. Bir web uygulaması (Python Flask Uygulaması) geliştirecek ve kodumuzu doğrulamak için uygulamayı yerel olarak çalıştıracağız.
- İsteğe bağlı olarak, bu uygulamayı Cloud Run'a dağıtmayı da inceleyebilir ve Materyal Tasarım kullanarak web uygulamasının tasarımını (estetiğini) iyileştirebiliriz.
Yapacağınız işlemler
- AI Özetleme Hızlı Başlangıç Çözümü'nü dağıtacak ve işleyiş şeklini anlamak için süreç akışını tetikleyeceksiniz.
- Ardından, Jump Start Çözümü'nün mevcut kodunu indirmek için Cloud Shell IDE'yi kullanacak ve kodu anlamak için Gemini Code Assist'i kullanacaksınız.
- Yeni bir işlev için kod oluşturmak amacıyla Gemini Code Assist Cloud Shell IDE'yi kullanacaksınız.
Öğrenecekleriniz...
- AI Özetleme Jump Start Çözümü'nün işleyiş şekli.
- Gemini Code Assist; kod oluşturma, kod tamamlama ve kod özetleme gibi çeşitli geliştirici görevleri için nasıl kullanılır?
Gerekenler
- Chrome web tarayıcısı
- Gmail hesabı
- Faturalandırmanın etkin olduğu bir Cloud projesi
- Cloud projeniz için Gemini Code Assist etkinleştirildi
Bu laboratuvar, yeni başlayanlar da dahil olmak üzere her seviyeden geliştiriciye yöneliktir. Örnek uygulama Python dilinde olsa da, neler olduğunu anlamak için Python programlamasına aşina olmanız gerekmez. Gemini Code Assist'in geliştiricilere yönelik özelliklerini öğrenmeye odaklanacağız.
2. Kurulum
Bu bölümde, bu laboratuvara başlamak için yapmanız gereken tüm işlemler ele alınmaktadır.
Google Cloud projesinde Cloud için Gemini'ı etkinleştirme
Artık Google Cloud projemizde Cloud için Gemini'ı etkinleştireceğiz. Aşağıda verilen adımları uygulayın:
- https://console.cloud.google.com adresini ziyaret edip bu laboratuvarda çalışmayı planladığınız Google Cloud projesini seçtiğinizden emin olun. Sağ üstte gördüğünüz Gemini'ı aç simgesini tıklayın.
- Cloud için Gemini sohbet penceresi, konsolun sağ tarafında açılır. Aşağıda gösterildiği gibi Etkinleştir düğmesini tıklayın. Etkinleştir düğmesini görmüyorsanız bunun yerine bir Chat arayüzü gösteriliyorsa büyük olasılıkla söz konusu projede Cloud için Gemini'ı etkinleştirmişsinizdir. Doğrudan sonraki adıma geçebilirsiniz.
- Etkinleştirildikten sonra Cloud için Gemini'ı birkaç sorgu sorarak test edebilirsiniz. Birkaç örnek sorgu gösteriliyor ancak
What is Cloud Run?
gibi bir sorgu deneyebilirsiniz
Cloud için Gemini, sorunuzun yanıtını verecek. Cloud için Gemini sohbet penceresini kapatmak için sağ üst köşedeki simgesini tıklayabilirsiniz.
Cloud Shell IDE'de Gemini Code Assist'i etkinleştirme
Codelab'in geri kalanında, tümüyle yönetilen Code OSS tabanlı bir geliştirme ortamı olan Cloud Shell IDE'yi kullanacağız. Cloud Shell IDE'de Code Assist'i etkinleştirip yapılandırmamız gerekir. Gerekli adımlar aşağıda verilmiştir:
- ide.cloud.google.com adresini ziyaret edin. IDE'nin görünmesi biraz zaman alabilir, bu yüzden lütfen sabırlı olun.
- Gösterilen durum çubuğunda Cloud Code - Oturum aç düğmesini tıklayın. Talimatlara göre eklentiyi yetkilendirin. Durum çubuğunda "Cloud Code - proje yok" ifadesini görüyorsanız bunu seçin ve ardından, üzerinde çalışmayı planladığınız projeler listesinden ilgili Google Cloud projesini seçin.
- Gösterildiği gibi sağ alt köşedeki Gemini düğmesini tıklayın ve doğru Google Cloud projesi için son bir kez daha seçim yapın. Cloud AI Companion API'yi etkinleştirmeniz istenirse lütfen bunu yapın ve devam edin.
- Google Cloud projenizi seçtikten sonra, durum çubuğundaki Cloud Code durum mesajında bunu gördüğünüzden ve sağdaki durum çubuğunda Code Assist'in etkin olduğundan emin olun:
Gemini Code Assist kullanıma hazır.
İsteğe bağlı: Sağ alttaki durum çubuğunda Gemini'ı görmüyorsanız Cloud Code'da Gemini'ı etkinleştirmeniz gerekir. Bu işlemi gerçekleştirmeden önce, Cloud Code Uzantısı → Ayarlar'a gidip Gemini'ın IDE'de etkinleştirildiğinden emin olun. Ardından, aşağıda gösterildiği gibi Gemini metnini girin. Onay kutusunun işaretli olduğundan emin olun. IDE'nizi yeniden yüklemeniz gerekir.Bu işlem, Cloud Code'da Gemini'ı etkinleştirir ve durum çubuğundaki Gemini simgesi IDE'nizde görünür.
3. AI Özetleme Hızlı Başlangıç Çözümünü Dağıtma
- Üretken yapay zeka doküman özetleme çözümü'ne gidin
- Dağıt'ı tıklayın
- Projenizde faturalandırma etkin değilse faturalandırmayı etkinleştirin.
- Bölge olarak us-central1'i seçin.
- Dağıt'ı tıklayın.
- Bu işlem 15 dakika kadar sürebilir.
- Herhangi bir değişiklik yapmanız gerekmez. Ancak çözüm dağıtımıyla ilgili ayrıntılar sayfasındaki BU ÇÖZÜMÜ KEŞFEDİN düğmesini tıklayarak Jump Start Çözümü dağıtımını inceleyebilirsiniz.
4. Gemini ile sohbet et
İlk olarak Gemini ile nasıl sohbet edeceğinizi öğreneceğiz. Gemini, VS Code'daki Cloud Code uzantısının bir parçası olarak Cloud Shell IDE'de sohbet asistanı olarak kullanılabilir. Sol gezinme çubuğundaki Gemini düğmesini tıklayarak bu sayfayı görüntüleyebilirsiniz. Sol gezinme araç çubuğunda Gemini simgesini bulup tıklayın.
Bunu yaptığınızda Cloud Shell IDE'de Chat: GeminiI bölmesi açılır ve Google Cloud'da yardım almak için Gemini ile sohbet edebilirsiniz.
İstem girmek ve Gemini'daki yanıtı görüntülemek için Gemini sohbet panelini kullanmamıza izin verin. Aşağıdaki istemi girin:
What is Cloud Run?
Gemini, yanıt vererek Cloud Run ile ilgili ayrıntıları paylaşmalıdır. İstemler, ihtiyacınız olan yardımı açıklayan sorular veya ifadelerdir. İstemler, Google Cloud'un daha faydalı veya eksiksiz yanıtlar sağlamak için analiz ettiği mevcut koddaki bağlamı içerebilir. İyi yanıtlar oluşturmak için istem yazma hakkında daha fazla bilgi edinmek istiyorsanız Google Cloud'da Gemini için daha iyi istem yazma başlıklı makaleyi inceleyin.
Google Cloud hakkında soru sormak için aşağıdaki örnek istemleri veya kendi istemlerinizi deneyin:
What is the difference between Cloud Run and Cloud Functions?
What services are available on Google Cloud to run containerized workloads?
What are the best practices to optimize costs while working with Google Cloud Storage?
Üstteki çöp kutusu simgesine dikkat edin. Bu şekilde, Code Assist sohbet geçmişinin bağlamını sıfırlayabilirsiniz. Ayrıca, bu sohbet etkileşiminin IDE'de üzerinde çalıştığınız dosyaların bağlamına bağlı olduğunu unutmayın.
5. Cloud Code'da Jump Start Çözümü Cloud Functions işlevini indirin
Cloud Shell Editor'da olduğunuzu varsayarsak aşağıdaki adımları uygulayın:
- Cloud Code'u
tıklayın
- Not: Ekranınızın boyutuna bağlı olarak, bu işlem bir veya iki adım sürebilir.
veya
- Cloud Functions'ı tıklayın.
- İstenirse giriş yapın veya hesabınızı yetkilendirin.
- Webhook işlevini tıklayın.
- Yeni çalışma alanına indir simgesini
tıklayın.
- Çalışma alanı adı olarak webhook-1'i kullanın (varsayılan olmalıdır) veya başka bir ad kullanın ve Tamam'ı tıklayın.
- Bu işlem, kodu Cloud Shell IDE'de açar.
6. Mevcut projeyi gözden geçirme
Bu Jump Start çözümü aşağıda gösterilmiştir:
PDF yükleme işlevinden Cloud Storage'a akışı inceleyin. PDF dosyası yüklenirse çağrılacak Cloud Functions işlevi main.py
dosyasında sağlanmış.
İlgili dosyayı tıklayın. Cloud işlevinin giriş noktası entrypoint
işlevidir. Bu işlev sonunda cloud_event_entrypoint
işlevini çağırarak PDF'den metni çıkarır, ardından summarization_entrypoint
işlevini çağırır. summarization_entrypoint
işlevi, Vertex AI Modellerini kullanarak sonuçları sırasıyla GCS ve BigQuery'ye özetleyip yazar.
main.py
dosyasındaki tüm kodu veya belirli bir kod snippet'ini vurgulayın. Gemini Chat'i tıklayın ve şu istemi verin: Explain this
.
Bu size kodla ilgili bir açıklama sağlayacaktır.
7. Örnek çalıştırma yürütme
Mimari şemasına göre, Cloud Functions işlevinin çağrılması için <PROJECT_ID>_uploads paketine bir dosya yükleyeceğiz.
Yükleyebileceğiniz ve özetlemek istediğiniz örnek bir PDF'nizin hazır olduğundan emin olun.
- Cloud Console'da Google Cloud Storage'a gidin.
- <PROJECT_ID>_uploads paketine gidin. DOSYALARI YÜKLE bağlantısını tıklayın ve örnek bir PDF yükleyin.
Örnek PDF dosyanız yoksa oluşturduğumuz örneklerden birini kullanabilirsiniz. Cloud Shell'den aşağıdaki komutu çalıştırın:
gsutil cp \
gs://arxiv-dataset/arxiv/cmp-lg/pdf/9410/9410009v1.pdf \
gs://<PROJECT_ID>_uploads/
Dosya başarıyla yüklendikten sonra webhook
Cloud Functions işlevi çağrılır ve dokümanda bulunan metni özetler. Çıkış, summary_dataset
adlı bir BigQuery veri kümesine ve summary_table
tablosuna yazılır.
Özetin sonuçlarını görmek için tabloyu sorgulayın.
8. Uygulama için web uygulaması istemcisi oluşturma
Yukarıdaki süreç, özetlenmesini istediğimiz PDF'nin yüklenmesi için manuel olarak yapılan adım adım bir işlemdir. Uygulama için web kullanıcı arabirimi oluşturmaya ne dersiniz?
Web kullanıcı arabirimi gereksinimleri basittir:
- Özetlenmesi gereken, dosyayı seçip yüklememize olanak tanıyan temel bir HTML formu.
- Yükleme işlemi başarılı olduğunda dosya <PROJECT_ID>_uploads paketine yazılmalıdır. Böylece, işlevselliklerin geri kalanı olduğu gibi çalışır.
Duet AI'a destek olmak amacıyla, web uygulamaları için bu geliştirmede Python ve Flask çerçevesini kullanacağız.
Haydi başlayalım. Cloud Shell IDE'de hâlâ aynı çalışma alanının açık olduğunu varsayacağız.
Tüm dosyaları kapatın ve Gemini Chat penceresinde şu istemi girin:
Write a Python Flask application that has a couple of routes:
The root route / should serve the index.html page using the render_template framework. The /upload route should accept a file being uploaded and write that file to a Cloud Storage bucket.
İdeal olarak bu işlem, kodu aşağıdaki gibi üretir:
from flask import Flask, render_template, request, redirect, url_for
from google.cloud import storage
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/upload', methods=['POST'])
def upload():
file = request.files['file']
filename = file.filename
bucket = storage.Client().bucket('your-bucket-name')
blob = bucket.blob(filename)
blob.upload_from_string(
file.read(),
content_type=file.content_type
)
return redirect(url_for('index'))
if __name__ == '__main__':
app.run(debug=True)
Yukarıdaki kodu, IDE çalışma alanının kök konumuna app.py olarak kaydedin.
Uygulamanın bağlantı noktası 8080'de çalışmasını ve 0.0.0.0 ana makine adresini kullanmasını isteriz. Bu yüzden Gemini'dan app.run ifadesini değiştirmesini isteyelim.
Şu istemi verin:
Modify the app.py to run on port 8080 and host address 0.0.0.0
Kodunuz şu şekilde görünmelidir:
from flask import Flask, render_template, request, redirect, url_for
from google.cloud import storage
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/upload', methods=['POST'])
def upload():
file = request.files['file']
filename = file.filename
bucket = storage.Client().bucket('your-bucket-name')
blob = bucket.blob(filename)
blob.upload_from_string(
file.read(),
content_type=file.content_type
)
return redirect(url_for('index'))
if __name__ == '__main__':
app.run(debug=True, host='0.0.0.0', port=8080)
Şimdi, index.html dosyasının da oluşturulmasını istiyoruz. Gemini Chat penceresinde şu istemi verin:
Provide the index.html file
index.html için aşağıda verilen kodu sağlar.
<!DOCTYPE html>
<html>
<head>
<title>File Upload</title>
</head>
<body>
<h1>File Upload</h1>
<form action="/upload" method="post" enctype="multipart/form-data">
<input type="file" name="file">
<input type="submit" value="Upload">
</form>
</body>
</html>
Gemini'dan index.html
dosyasının nereye kaydedileceğini bize bildirmesini isteyebiliriz. Şu istemi verin:
Since this is using the render_template framework, where should this file be saved?
Aşağıdakine benzer bir yanıt vermelidir:
Kök klasörde şablonlar adlı bir klasör oluşturup index.html dosyasını buraya kaydedin.
Dosyanın Google Cloud Storage paketine kaydedilemediği durumda app.py dosyasında bazı istisna işlemlerinin yapılmasını istiyoruz. app.py dosyasını açık bırakıp Gemini Chat penceresinde şu istemi açın.
modify the app.py to have exception handling in the upload() function. The success or failure should be returned to the index page.
Bu işlemin ardından aşağıda gösterildiği gibi bazı istisna işlemeler eklenebilir:
from flask import Flask, render_template, request, redirect, url_for
from google.cloud import storage
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/upload', methods=['POST'])
def upload():
try:
file = request.files['file']
filename = file.filename
bucket = storage.Client().bucket('your-bucket-name')
blob = bucket.blob(filename)
blob.upload_from_string(
file.read(),
content_type=file.content_type
)
return redirect(url_for('index'))
except Exception as e:
return render_template('index.html', error=str(e))
if __name__ == '__main__':
app.run(debug=True, host='0.0.0.0', port=8080)
Hata mesajını index.html içinde görüntülememiz gerektiğinden, bu mesajı da değiştirmemiz gerekiyor. Aşağıdaki istem aracılığıyla Gemini'dan bunu yapmasını isteyelim:
update the index.html to display the error message
Bu işlem, aşağıda gösterildiği gibi güncellenmiş bir index.html dosyası sağlamalıdır:
<!DOCTYPE html>
<html>
<head>
<title>File Upload</title>
</head>
<body>
<h1>File Upload</h1>
{% if error %}
<p style="color: red;">{{ error }}</p>
{% endif %}
<form action="/upload" method="post" enctype="multipart/form-data">
<input type="file" name="file">
<input type="submit" value="Upload">
</form>
</body>
</html>
Yukarıdaki adımların her birinde, değişiklikleri sırasıyla app.py
ve index.html
dosyasına kaydettiğinizden emin olun.
app.py
doğru paket adına sahip olmadığından Gemini'a bu bilgileri verip değişiklikleri yapmasını isteyebiliriz. Ayrıca, storage.Client()
örneği için proje kimliğini sağlamamız gerekir. Bu nedenle, Gemini Chat penceresinde aşağıdaki birkaç istemi girin (<PROJECT_ID>
yerine Google Cloud proje kimliğinizi yazın) ve değişiklikleri uygulayın:
İstem 1
My bucket name is gemini-for-devs-demo_uploads, please change the code to use that.
İstem 2
My project id is gemini-for-devs-demo, please change the storage.Client() to use that.
Son app.py
dosyası aşağıdaki gibi görünür (proje kimliğim aşağıda gösterilmektedir, ancak ideal olarak üzerinde çalıştığınız ve yukarıdaki istemde verdiğiniz dosya olmalıdır):
from flask import Flask, render_template, request, redirect, url_for
from google.cloud import storage
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/upload', methods=['POST'])
def upload():
try:
file = request.files['file']
filename = file.filename
bucket = storage.Client(project='gcp-experiments-349209').bucket('gcp-experiments-349209_uploads')
blob = bucket.blob(filename)
blob.upload_from_string(
file.read(),
content_type=file.content_type
)
return redirect(url_for('index'))
except Exception as e:
return render_template('index.html', error=str(e))
if __name__ == '__main__':
app.run(debug=True, host='0.0.0.0', port=8080)
9. Web uygulamasını yerel olarak çalıştırma
requirements.txt dosyasında tanımlanan bağımlılıklarla bir Python ortamı oluşturun. Cloud Shell IDE'de aşağıda gösterildiği gibi Komut Paleti'ne gidin:
Python: Create Environment
yazın, ardından (venv), ardından Python 3.x yorumlayıcısı ve requirements.txt
dosyasını kullanarak Sanal Ortam oluşturma adımlarını uygulayın. Bu işlem, gerekli ortamı oluşturur.
Terminal'i aşağıda gösterildiği gibi şimdi başlatın:
Terminalde aşağıdaki komutu verin:
python app.py
Flask uygulaması başlatılır ve şuna benzer bir sonuç görürsünüz:
(.venv) romin@cloudshell:~/webhook-2 (gcp-experiments-349209)$ python app.py
* Serving Flask app 'app'
* Debug mode: on
WARNING: This is a development server. Do not use it in a production deployment. Use a production WSGI server instead.
* Running on all addresses (0.0.0.0)
* Running on http://127.0.0.1:8080
* Running on http://10.88.0.3:8080
Press CTRL+C to quit
* Restarting with watchdog (inotify)
* Debugger is active!
* Debugger PIN: 989-296-833
http://127.0.0.1:8080 URL'sini ziyaret ettiğinizde index.html
sayfası gösterilecektir.
Yerel makinenizden bir dosya yüklediğinizde dosyanın başarıyla işlenmesi gerekir.
Özeti, laboratuvarın önceki bölümlerinde gördüğümüz BigQuery veri kümesi ve tablosuna giderek kontrol edebilirsiniz. Alternatif olarak Cloud Storage paketine (<PROJECT_ID>_output) göz atabilirsiniz.
10. (İsteğe bağlı) Open Exploration - Cloud Run'a dağıtma
- Uygulamayı Cloud Run'a dağıtabilirsiniz.
- Gemini Code Assist'e aşağıdaki istemle soru sorun (Yukarıdaki istemin birkaç varyasyonunu denemeniz gerekebilir):
I don't want to build a container image but deploy directly from source. What is the gcloud command for that?
11. (İsteğe Bağlı) Explorations'ı Açın - CSS Stilleri Ekleme
- Gemini Code Assist ve düzenleyici asistanını kullanarak uygulamanıza CSS stilleri ekleyin ve işiniz bittiğinde uygulamayı tekrar dağıtın.
index.html
dosyasını açın ve Gemini Chat'te şu istemi verin:Can you apply material design styles to this index.html?
- Kodu kontrol edin ve çalışıp çalışmadığını kontrol edin.
12. Tebrikler!
Tebrikler. Gemini Code Assist'in kod oluşturma, kod tamamlama ve kod özetleme konularına nasıl yardımcı olabileceğini ve Google Cloud hakkındaki sorularınızın yanıtlarını öğrenmenize nasıl yardımcı olabileceğini anlamak için örnek bir projede başarıyla çalıştınız.