استخدام Gemini Code Assist لاستكشاف وتحسين حلول Jump Start Solution في تلخيص الذكاء الاصطناعي

1. مقدمة

في هذا الدرس التطبيقي حول الترميز، سنلقي نظرة على حل Jump Start Solution، وهو "تلخيص الذكاء الاصطناعي" (AI) الحالي الذي يستخدم نماذج Vertex AI لتلخيص مستندات PDF التي تم تحميلها إلى Google Cloud Storage.

سنستخدم بعد ذلك Gemini Code Assist لتنفيذ ما يلي:

• تعرّف على رمز بايثون الذي تستند إليه دالة السحابة الإلكترونية التي تؤدي إلى استخراج النص من مستند PDF وتلخيصه وكتابة النتائج في BigQuery.
• سنعتمد على Gemini Code Assist خلال مراحل عملية الترقية لمساعدتك في كتابة وظائف جديدة. سنطور تطبيق ويب (تطبيق Python Flask) ونشغّل التطبيق محليًا للتحقّق من الرمز البرمجي الخاص بنا.
• بشكل اختياري، يمكننا أيضًا النظر في نشر هذا التطبيق على Cloud Run وتحسين تصميم (جماليات) تطبيق الويب باستخدام Material Design.

الإجراءات التي ستنفّذها

• سيتم نشر حلّ Jump Start Solution لتلخيص الذكاء الاصطناعي (AI) وبدء مسار العملية لفهم آلية عمله.
• بعد ذلك، سيكون عليك استخدام Cloud Shell IDE لتنزيل الرمز الحالي الخاص بالحلّ Jump Start Solution واستخدام Gemini Code Assist لفهمه.
• ستستخدم Gemini Code Assist Cloud Shell IDE لإنشاء رمز برمجي لوظيفة جديدة.

المعلومات التي ستطّلع عليها:

• طريقة عمل حلول Jump Start Solution لتلخيص الذكاء الاصطناعي (AI)
• كيفية استخدام Gemini Code Assist في العديد من مهام المطوّرين، مثل إنشاء الرموز البرمجية وإكمالها وتلخيص الرموز البرمجية

المتطلبات...

• متصفح الويب Chrome
• حساب Gmail
• مشروع على Google Cloud تم تفعيل الفوترة فيه
• تم تفعيل Gemini Code Assist لمشروعك على السحابة الإلكترونية

يستهدف هذا التمرين المعملي المطوّرين من جميع المستويات، بما في ذلك المبتدئين. على الرغم من أن نموذج التطبيق بلغة بايثون، فأنت لست بحاجة إلى أن تكون على دراية ببرمجة بايثون لفهم ما يحدث. سينصب تركيزنا على التعرّف على إمكانات Gemini Code Assist للمطوّرين.

2. ضبط إعدادات الجهاز

يتناول هذا القسم كل الإجراءات المطلوبة للبدء في هذا التمرين.

تفعيل "Gemini في Cloud" في مشروع Google Cloud

سنفعّل الآن "Gemini في Cloud" في مشروع Google Cloud. يُرجى اتّباع الخطوات التالية:

1. يُرجى زيارة https://console.cloud.google.com والتأكّد من اختيار مشروع Google Cloud الذي تريد استخدامه في هذا الدرس التطبيقي. انقر على رمز "فتح Gemini" الذي يظهر في أعلى يسار الشاشة.

2. ستفتح نافذة المحادثة في "Gemini في Cloud" على يسار وحدة التحكّم. انقر على الزر "تفعيل" كما هو موضّح أدناه. إذا لم يظهر الزر تفعيل وظهرت لك واجهة Chat بدلاً من ذلك، من المحتمل أنّك سبق وفعّلت "Gemini في Cloud" في المشروع ويمكنك الانتقال مباشرةً إلى الخطوة التالية.

3. بعد تفعيلها، يمكنك اختبار Gemini for Cloud من خلال طرح سؤال أو طلبَين عليه. يتم عرض بعض نماذج طلبات البحث، ولكن يمكنك تجربة طلب مثل What is Cloud Run?.

سيقدّم لك "Gemini في Cloud" الإجابة عن سؤالك. يمكنك النقر على رمز في أعلى يسار الصفحة لإغلاق نافذة المحادثة على "Gemini في Cloud".

تفعيل Gemini Code Assist في بيئة Cloud Shell IDE

سنستخدم Cloud Shell IDE، وهي بيئة تطوير مستنِدة إلى Code OSS مُدار بالكامل، في بقية الدرس التطبيقي حول الترميز. نحتاج إلى تفعيل أداة Code Assist وضبطها في بيئة تطوير البرامج (IDE) في Cloud Shell، وتتوفّر الخطوات أدناه:

1. انتقِل إلى ide.cloud.google.com. قد يستغرق ظهور بيئة التطوير المتكاملة (IDE) بعض الوقت، لذا يُرجى الانتظار.
2. انقر على الزر Cloud Code - تسجيل الدخول في شريط مدى التقدّم السفلي كما هو موضَّح. عليك تفويض المكوّن الإضافي وفقًا للتعليمات. إذا ظهر لك "Cloud Code - no project" في شريط الحالة، اختَر ذلك ثم اختَر المشروع المحدّد على Google Cloud من قائمة المشاريع التي تخطّط للعمل فيها.

3. انقر على زر Gemini في أسفل يسار الشاشة كما هو موضّح واختَر المشروع الصحيح على Google Cloud للمرة الأخيرة. إذا طُلِب منك تفعيل واجهة Cloud AI Companion API، يُرجى إجراء ذلك والمتابعة.
4. بعد اختيار مشروعك على Google Cloud، تأكَّد من أنّه يمكنك رؤية ذلك في رسالة حالة رمز السحابة الإلكترونية في شريط الحالة وأنّ خدمة Code Assist مفعَّلة أيضًا على يسار الصفحة، في شريط الحالة كما هو موضَّح أدناه:

Gemini Code Assist جاهز للاستخدام

يتوفّر Gemini Code Assist أيضًا في برامج IDE المحلية، مثل Visual Studio Code أو JetBrains IntelliJ. وهي متوفِّرة أيضًا في Google Cloud Workstations. يركّز هذا الدرس التطبيقي حول الترميز على بيئة التطوير المتكاملة في Cloud Shell كوسيلة لتشجيع الجميع على استخدام البيئة نفسها، ولكن يمكنك تجربة الإعداد المفضّل لديك والاطّلاع على هذا الرابط للحصول على مزيد من التفاصيل.

اختياري: إذا لم يظهر Gemini في شريط الحالة في أسفل يسار الصفحة، عليك تفعيل Gemini في Cloud Code. قبل إجراء ذلك، تأكَّد من تفعيل Gemini في بيئة التطوير المتكاملة (IDE) من خلال الانتقال إلى إضافة Cloud Code ← الإعدادات ثم إدخال النص Gemini كما هو موضّح أدناه. تأكَّد من وضع علامة في مربّع الاختيار. يجب إعادة تحميل بيئة التطوير المتكاملة (IDE). يؤدي هذا الإجراء إلى تفعيل Gemini في Cloud Code، وسيظهر رمز Gemini في شريط الحالة في بيئة التطوير المتكاملة (IDE).

3- نشر حلّ Jump Start Solution لتلخيص الذكاء الاصطناعي

1. الانتقال إلى حلّ تلخيص المستندات المستنِد إلى الذكاء الاصطناعي التوليدي
2. انقر على "نشر"

• إذا لم يتم تفعيل الفوترة في مشروعك، عليك تفعيل الفوترة.
• اختَر us-central1 كمنطقة.
• انقر على "نشر".
• يمكن أن تستغرق هذه العملية مدة تصل إلى 15 دقيقة.
• لا تحتاج إلى إجراء أي تغييرات، ولكن يمكنك استكشاف نشر حل Jump Start Solution بالنقر على زر استكشاف هذا الحل في صفحة تفاصيل نشر الحل.

4. التحدّث إلى Gemini

سنبدأ بتعلّم كيفية الدردشة مع Gemini. يتوفّر Gemini كمساعد محادثة في Cloud Shell IDE كجزء من إضافة Cloud Code في VS Code. يمكنك إبراز هذه المعلومات من خلال النقر على زر Gemini في شريط التنقّل الأيمن. ابحث عن رمز Gemini في شريط أدوات التنقّل الأيمن وانقر عليه.

سيؤدي هذا الإجراء إلى ظهور لوحة Chat: GeminiI في بيئة IDE عبر Cloud Shell، ويمكنك الدردشة مع Gemini للحصول على المساعدة في Google Cloud.

لنستخدم لوحة المحادثة في Gemini لإدخال طلب والاطّلاع على الردّ من Gemini. أدخِل الطلب التالي:

What is Cloud Run? 

من المفترض أن يردّ Gemini مع تضمين تفاصيل حول Cloud Run. المطالبات هي أسئلة أو عبارات تصف المساعدة التي تحتاجها. يمكن أن تتضمّن الطلبات سياقًا من الرمز البرمجي الحالي الذي تحلله Google Cloud لتقديم ردود أكثر فائدة أو اكتمالاً. لمزيد من المعلومات حول كتابة الطلبات لإنشاء ردود جيدة، يُرجى الاطّلاع على المقالة كتابة طلبات أفضل لـ Gemini في Google Cloud.

يمكنك تجربة نماذج الطلبات التالية أو أي سؤال خاص بك لطرح أسئلة حول Google Cloud:

• 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?

لاحظ رمز المهملات في الأعلى، وهذه هي طريقتك لإعادة ضبط سياق سجلّ محادثات Code Assist. يُرجى العِلم أيضًا أنّ هذه المحادثة مرتبطة بالملفات التي تعمل عليها في بيئة التطوير المتكاملة.

5- تنزيل دالة Jump Start Solution Cloud في رمز السحابة الإلكترونية

لنفترض أنّك تستخدم محرِّر Cloud Shell، اتّبِع الخطوات التالية:

• انقر على رمز السحابة الإلكترونية .
• ملاحظة: قد تحتاج إلى إجراء خطوة أو خطوتَين بناءً على حجم الشاشة.

أو

• انقر على "وظائف السحابة الإلكترونية".
• سجِّل الدخول أو فوِّض حسابك إذا طُلب منك ذلك.
• انقر على دالة webhook.
• انقر على الرمز "التنزيل إلى مساحة عمل جديدة" .
• 
• استخدِم الردّ التلقائي على الويب 1 كاسم مساحة العمل (يجب أن يكون الاسم التلقائي) أو أي اسم آخر وانقر على "حسنًا".
• سيؤدي هذا إلى فتح الرمز في بيئة التطوير المتكاملة في Cloud Shell.

6- مراجعة المشروع الحالي

يتم توضيح حل Jump Start هذا أدناه:

راجِع مسار الانتقال من وظيفة "تحميل PDF" إلى Cloud Storage. دالة السحابة الإلكترونية التي سيتم استدعاؤها إذا تم تحميل ملف PDF في ملف main.py

انقر على هذا الملف. نقطة الدخول لدالة السحابة الإلكترونية هي دالة entrypoint، التي تستدعي في النهاية الوظيفة cloud_event_entrypoint التي تستخرج النص من ملف PDF، ثم تستدعي summarization_entrypoint التي تستخدم نماذج Vertex AI لتلخيص النتائج وكتابتها في GCS وBigQuery على التوالي.

حدِّد كل الرموز في ملف main.py أو أي مقتطف رمز محدّد. انقر على Gemini Chat وأدخِل الطلب التالي: Explain this.

من المفترض أن يوفر لك هذا تفسيرًا للتعليمة البرمجية.

7. تنفيذ عملية تشغيل نموذجية

وفقًا للرسم البياني للبنية، سنحمّل ملفًا إلى حزمة <PROJECT_ID>_uploads من أجل استدعاء دالة السحابة الإلكترونية.

تأكَّد من توفّر نموذج ملف PDF جاهز لتحميله والذي تريد تلخيصه.

• انتقِل إلى Google Cloud Storage في Cloud Console.
• انتقِل إلى الحزمة <PROJECT_ID>_uploads. انقر على الرابط تحميل الملفات وحمِّل نموذجًا بتنسيق PDF.

إذا لم يكن لديك نموذج ملف PDF، فيمكنك استخدام أحد النماذج التي أنشأناها. من Cloud Shell، شغِّل الأمر التالي:

gsutil cp \
    gs://arxiv-dataset/arxiv/cmp-lg/pdf/9410/9410009v1.pdf \
    gs://<PROJECT_ID>_uploads/

بعد تحميل الملف بنجاح، سيتم استدعاء وظيفة السحابة الإلكترونية webhook وستلخص النص الموجود في المستند. ستتم كتابة المخرجات في مجموعة بيانات BigQuery باسم summary_dataset وفي جدول summary_table.

يمكنك إجراء طلب بحث عن الجدول للاطّلاع على نتائج الملخّص.

8. إنشاء عميل تطبيق ويب للتطبيق

العملية أعلاه هي عملية يدوية خطوة بخطوة لتحميل ملف PDF الذي نريد تلخيصه. ماذا عن إنشاء واجهة أمامية على الويب للتطبيق؟

متطلبات الواجهة الأمامية للويب بسيطة:

1. هو نموذج HTML أساسي يتيح لنا اختيار الملف وتحميله، ويجب تلخيصه.
2. عند إجراء عملية التحميل بنجاح، يجب كتابة الملف في حزمة <PROJECT_ID>_uploads لكي تعمل باقي الوظائف كما هي.

سنستخدم Python وإطار عمل Flask لتطبيقات الويب لإنشاء هذه الأداة بمساعدة Duet AI.

لنبدأ سنفترض أنّه لا تزال لديك مساحة العمل نفسها مفتوحة في بيئة التطوير المتكاملة في Cloud Shell.

إغلاق جميع الملفات وإرسال الطلب التالي في نافذة Gemini Chat:

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.

ومن المفترض أن ينتج عن ذلك التعليمة البرمجية على النحو التالي:

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)

احفظ الرمز أعلاه باسم app.py في جذر مساحة عمل IDE.

نريد تشغيل التطبيق على المنفذ 8080 واستخدام عنوان المضيف 0.0.0.0، لذا يُرجى الطلب من Gemini تعديل عبارة app.run.

أدخِل الطلب التالي:

Modify the app.py to run on port 8080 and host address 0.0.0.0

من المفترض أن تظهر التعليمة البرمجية على النحو التالي الآن:

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)

بعد ذلك، نودّ إنشاء index.html أيضًا. أدخِل الطلب التالي في نافذة Gemini Chat:

Provide the index.html file

ويجب أن يزودك بالرمز البرمجي كما هو موضح أدناه في index.html.

<!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 إخبارنا بمكان حفظ ملف index.html. أدخِل الطلب التالي:

Since this is using the render_template framework, where should this file be saved?

يجب أن تقدم إجابة مشابهة لما يلي:

تابع وأنشئ مجلدًا باسم "قوالب" في المجلد الجذر واحفظ ملف index.html فيه.

يجب معالجة بعض الاستثناءات في ملف app.py في حال تعذّر حفظ الملف في حزمة Google Cloud Storage. يُرجى إبقاء ملف app.py مفتوحًا وتقديم الطلب التالي في نافذة Gemini Chat.

modify the app.py to have exception handling in the upload() function. The success or failure should be returned to the index page.

من المفترض أن يضيف ذلك الآن إلى معالجة الاستثناءات كما هو موضّح أدناه:

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)

ونظرًا لأننا نحتاج إلى عرض رسالة الخطأ في index.html، نحتاج إلى تعديل ذلك أيضًا. لنطلب من Gemini تنفيذ هذا الإجراء من خلال الطلب أدناه:

update the index.html to display the error message

ومن المفترض أن يؤدي ذلك إلى ظهور ملف index.html محدَّث كما هو موضّح أدناه:

<!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>

تأكَّد من أنّك تحفظ التغييرات في كل من الخطوات أعلاه في app.py وindex.html على التوالي.

لا تتضمّن السمة app.py اسم الحزمة الصحيح، وبالتالي يمكننا تقديم هذه المعلومات إلى Gemini وطلب إجراء التغييرات منها. بالإضافة إلى ذلك، يجب تقديم رقم تعريف المشروع لمثيل storage.Client(). لذلك، أرسِل الطلبَين التاليَين (استبدِل <PROJECT_ID> برقم تعريف مشروع Google Cloud الخاص بك) في نافذة Gemini Chat وادمج التغييرات:

المطالبة 1

My bucket name is gemini-for-devs-demo_uploads, please change the code to use that.

المطالبة 2

My project id is gemini-for-devs-demo, please change the storage.Client() to use that.

يبدو ملف app.py النهائي كما يلي (رقم تعريف مشروعي أدناه، ولكن من المفترض أن يكون هو الملف الذي تعمل عليه والذي تم تقديمه في الطلب أعلاه):

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. تشغيل تطبيق الويب محليًا

أنشِئ بيئة Python باستخدام الاعتماديات المحدّدة في ملف requirements.txt. انتقل إلى لوحة الأوامر في بيئة Cloud Shell IDE كما هو موضح أدناه:

اكتب Python: Create Environment ثم اتّبِع الخطوات لإنشاء بيئة افتراضية باستخدام (venv)، ثم أداة تفسير بلغة Python 3.x وملف requirements.txt. سيؤدي هذا إلى إنشاء البيئة المطلوبة.

شغِّل تطبيق Terminal الآن، كما هو موضَّح أدناه:

أدخِل الأمر التالي في الوحدة الطرفية:

python app.py

يُفترض أن يتم تشغيل تطبيق Flask ومن المفترض أن يظهر لك على النحو التالي:

(.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

انتقِل إلى عنوان URL http://127.0.0.1:8080 ومن المفترض أن يعرض صفحة index.html.

حمّل ملفًا من جهازك المحلي ومن المفترض أن تتم معالجته بنجاح.

يمكنك التحقق من التلخيص بالانتقال إلى مجموعة بيانات BigQuery والجدول الذي رأيناه سابقًا في التمرين المعملي. بدلاً من ذلك، يمكنك الاطلاع على حزمة Cloud Storage (&lt;PROJECT_ID&gt;_output).

10. (اختياري) فتح الاستكشاف - النشر إلى تشغيل السحابة الإلكترونية

• يمكنك نشر التطبيق في Cloud Run.
• يمكنك توجيه الطلب التالي إلى Gemini Code Assist: (قد تحتاج إلى تجربة عدة صيغ مختلفة من الطلب أعلاه):

I don't want to build a container image but deploy directly from source. What is the gcloud command for that?

11. (اختياري) فتح أداة "الاستكشاف" - إضافة أنماط CSS

• بإمكانك استخدام Gemini Code Assist ومساعد المحرر لإضافة أنماط CSS إلى تطبيقك وإعادة تفعيل التطبيق بعد اكتمال العملية.
• افتح ملف index.html وأرسِل الطلب التالي في Gemini Chat: Can you apply material design styles to this index.html?
• تحقَّق من الرمز وتأكَّد من أنّه يعمل.

12. تهانينا!

تهانينا، لقد عملت بنجاح مع Gemini Code Assist في نموذج مشروع لفهم كيفية مساعدتك في إنشاء الرموز وإكمالها وتلخيص الرموز ومساعدتك في الحصول على إجابات عن الأسئلة حول Google Cloud.

13. المستندات المرجعية

• صفحة Gemini Code Asssit الرئيسية
• استخدام Gemini في المساعدة والتطوير المستنِدَين إلى الذكاء الاصطناعي - المستندات
• حالات الاستخدام في Gemini