إنشاء مساعد في مجال الترميز باستخدام الذكاء الاصطناعي (AI) باستخدام برنامج Pipet Code Agent

يمكن أن تكون كتابة الرموز مُرضية ومرضية في الوقت نفسه، ولكن تحويل الرمز من العمل إلى ممثلة للزملاء غالبًا ما يكون عملاً روتينيًا. تساعدك نماذج الذكاء الاصطناعي التوليدي في إضافة تعليقات على الرموز البرمجية والعثور على الأخطاء قبل أن يجريها المراجعون، بالإضافة إلى تنفيذ مجموعة من المهام الأخرى لتسهيل سير عمل عملية الترميز.

يوضِّح لك هذا البرنامج التعليمي كيفية توسيع Pipet Code Agent، وهو أداة مساعدة بشأن الرموز مستندة إلى الذكاء الاصطناعي (AI) أنشأها فريق علاقات مطوّري الذكاء الاصطناعي في Google. هذا المشروع مفتوح المصدر هو إضافة لـ Visual Studio Code (VS Code) يساعدك في الاهتمام ببعض مهام الترميز المهمة ولكنها أقل متعة، مثل التعليق على التعليمات البرمجية الخاصة بك والعثور على الأخطاء واقتراح تحسينات. ترسِل الإضافة طلبات المساعدة في الترميز إلى Gemini API وتدمج الردود في نافذة تعديل الرموز.

يمكنك تعديل Pipet لجعل هذه الدوال الحالية تعمل بشكل أفضل بالنسبة لك، أو إنشاء أوامر جديدة لدعم سير عمل التطوير بشكل أفضل.

للحصول على نظرة عامة في فيديو حول المشروع وكيفية تمديده، بما في ذلك إحصاءات من المسؤولين عن إنشائه، يمكنك مشاهدة مقالة AI Code Assistant - Build with Google AI. خلاف ذلك، يمكنك البدء في تمديد المشروع باتباع الإرشادات أدناه.

إعداد المشروع

ترشدك هذه التعليمات خلال إعداد مشروع وكيل كود Pipet للتطوير والاختبار. وتتمثل الخطوات العامة في تثبيت بعض البرامج المطلوبة، وإعداد بعض متغيرات البيئة، ونسخ المشروع من مستودع التعليمات البرمجية وتشغيل عملية تثبيت التكوين.

تثبيت المتطلبات الأساسية

يعمل مشروع Pipet Code Agent كامتداد لـ Visual Studio Code، ويستخدم Node.js وأداة npm لإدارة الحزم وتشغيل التطبيق. تعليمات التثبيت التالية مخصَّصة لجهاز مضيف يعمل بنظام التشغيل Linux.

لتثبيت البرنامج المطلوب:

  1. ثبِّت Visual Studio Code من أجل منصتك.
  2. يمكنك تثبيت node وnpm من خلال اتّباع تعليمات التثبيت منصتك.

نسخ المشروع وإعداده

نزِّل رمز المشروع واستخدِم أمر التثبيت npm لتنزيل التبعيات المطلوبة وإعداد المشروع. تحتاج إلى برنامج git للتحكم في المصدر لاسترداد رمز المصدر للمشروع.

لتنزيل رمز المشروع وتهيئته:

  1. استنسِخ مستودع git باستخدام الأمر التالي.
    git clone https://github.com/google/generative-ai-docs
  2. يمكنك اختياريًا ضبط مستودع git المحلي لاستخدام عمليات الدفع المتفرقة، وبذلك يكون لديك الملفات الخاصة بمشروع وكيل المستندات فقط. 
    cd generative-ai-docs/
git sparse-checkout init --cone
git sparse-checkout set examples/gemini/node/pipet-code-agent/
  3. انتقِل إلى الدليل الجذري لمشروع وكيل رمز Pipet. 
    cd generative-ai-docs/examples/gemini/node/pipet-code-agent/
  4. شغِّل الأمر install لتنزيل الاعتماديات وإعداد المشروع: 
    npm install

إعداد الإضافة واختبارها

يجب أن تكون قادرًا الآن على اختبار التثبيت عن طريق تشغيل Pipet Code Agent كإضافة تطوير في VS Code على جهازك. يفتح الاختبار نافذة منفصلة لـ مضيف تطوير الإضافات في VS Code حيث تتوفّر الإضافة الجديدة. في هذه النافذة الجديدة، يمكنك ضبط مفتاح واجهة برمجة التطبيقات الذي تستخدمه الإضافة للوصول إلى Google Gemini API.

تشغيل وكيل رمز Pipet في نافذة مضيف تطوير الإضافات الشكل 1. نافذة مضيف تطوير إضافة رمز VS مع أوامر إضافة Pipet.

لضبط الإعداد واختباره:

  1. ابدأ تشغيل تطبيق VS Code.
  2. في رمز VS، أنشئ نافذة جديدة عن طريق اختيار ملف > نافذة جديدة.
  3. افتح مشروع Pipet Code Agent عن طريق اختيار ملف > فتح مجلد، واختيار المجلد pipet-code-agent/.
  4. افتح ملف pipet-code-agent/package.json.
  5. شغِّل الإضافة في وضع تصحيح الأخطاء من خلال اختيار تشغيل > بدء تصحيح الأخطاء. تفتح هذه الخطوة نافذة منفصلة لمضيف تطوير الإضافات في رمز VS Code.
  6. افتح إعدادات VS Code من خلال اختيار الرمز > الإعدادات > الإعدادات.
  7. احصل على مفتاح واجهة برمجة تطبيقات Google Gemini من الموقع الإلكتروني لمطوّري الذكاء الاصطناعي التوليدي وانسخ سلسلة المفتاح.
  8. اضبط مفتاح واجهة برمجة التطبيقات كإعدادات ضبط. في الحقل إعدادات البحث، اكتب pipet، ثم اختَر علامة التبويب المستخدم وفي Google > Gemini: Api Key (مفتاح واجهة برمجة التطبيقات)، انقر على الرابط Edit in settings.json (تعديل في settings.json) وأضِف مفتاح واجهة برمجة التطبيقات Gemini API: 
    "google.gemini.apiKey": "your-api-key-here"
  9. احفظ التغييرات في ملف settings.json وأغلق علامات تبويب الإعدادات.

لاختبار أوامر الإضافات:

  1. في نافذة مضيف تطوير الإضافات في VS Code، اختَر أي رمز في نافذة المحرّر.
  2. افتح لوحة الأوامر عن طريق اختيار عرض > لوحة الأوامر.
  3. في "لوحة الأوامر"، اكتب Pipet واختَر أحد الطلبات التي تبدأ بهذه البادئة.

تعديل الأمر الحالي

تعديل الأوامر المتوفّرة في Pipet Code Agent هو أبسط طريقة لتغيير سلوك الإضافة وإمكاناتها. يستخدم كل من أمرَي التعليق والمراجعة نهجًا لتقديم طلب بضع لقطات مع أمثلة للرموز البرمجية والتعليقات المرتبطة بهذا الرمز، بالإضافة إلى بعض التعليمات العامة حول نموذج الذكاء الاصطناعي التوليدي. إنّ معلومات السياق الفوري هذه توجّه نموذج Gemini التوليدي لتكوين رد. من خلال تغيير تعليمات المطالبة أو الأمثلة أو كليهما في التعليق أو أمر المراجعة، يمكنك تغيير سلوك كل أمر من الأوامر الحالية.

توضّح هذه المجموعة من التعليمات كيفية تعديل الأمر review.ts من خلال تغيير نص الأمر.

للاستعداد لتعديل الأمر review.ts، اتّبِع الخطوات التالية:

  1. ابدأ تشغيل تطبيق VS Code.
  2. في رمز VS، أنشئ نافذة جديدة عن طريق اختيار ملف > نافذة جديدة.
  3. افتح مشروع Pipet Code Agent عن طريق اختيار ملف > فتح مجلد، واختيار المجلد pipet-code-agent/.
  4. افتح ملف pipet-code-agent/src/review.ts.

لتعديل طريقة عمل الأمر review.ts:

  1. في ملف review.ts، غيِّر بداية الثابت PROMPT إلى تعليمات مختلفة. 
    const PROMPT = '
Write review comments for following code, identifying bugs and ways to improve code quality. Examples of bugs are syntax errors or typos, out of memory errors, and boundary value errors. Examples of improving code quality are reducing complexity of code, eliminating duplicate code, and ensuring other developers
are able to understand the code.
${CODE_LABEL}
...
  2. يمكنك اختياريًا إضافة مثال آخر في ملف review.ts إلى قائمة الرموز وأمثلة مراجعة الرموز. 
    ...
${REVIEW_LABEL}
There are duplicate lines of code in this control structure.
${CODE_LABEL}
const fixed_value = 128;
${REVIEW_LABEL}
Make sure constant names are in all capitals (FIXED_VALUE) for clarity.
';
  3. احفظ التغييرات في ملف review.ts.

لاختبار الأمر المعدّل:

  1. في نافذة مشروع إضافة VS Code Pipet، أعِد تشغيل برنامج تصحيح الأخطاء من خلال اختيار تشغيل > إعادة تشغيل تصحيح الأخطاء.
  2. في نافذة مضيف تطوير الإضافات في VS Code، اختَر أي رمز في نافذة المحرّر.
  3. افتح لوحة الأوامر عن طريق اختيار عرض > لوحة الأوامر.
  4. في "لوحة الأوامر"، اكتب Pipet واختَر الأمر Pipet: مراجعة الرمز البرمجي المحدّد.

إنشاء طلب جديد

يمكنك تمديد Pipet من خلال إنشاء أوامر جديدة تؤدي مهامًا جديدة تمامًا باستخدام Gemini API. يكون كل ملف أوامر (comment.ts وreview.ts) مستقلاً في الغالب، ويتضمّن رمزًا برمجيًا لجمع النصوص من المحرِّر النشط، وإنشاء طلب، والاتصال بواجهة برمجة تطبيقات Gemini، وإرسال طلب، والتعامل مع الردّ.

وكيل رمز Pipet مع عرض دالة التحديد الشكل 2. أمر جديد لتوصية اسم الدالة في نافذة Development Host في VS.

توضّح هذه المجموعة من التعليمات كيفية إنشاء طلب جديد باستخدام رمز أحد الطلبات الحالية، وهو comment.ts، كنموذج.

لإنشاء أمر يقترح أسماء للدوال:

  1. أنشئ نسخة من الملف pipet-code-agent/src/comment.ts الذي يحمل الاسم name.ts في دليل src/.
  2. في VS Code، افتح ملف src/name.ts.
  3. يمكنك تغيير تعليمات الطلب في ملف name.ts من خلال تعديل قيمة PROMPT. 
    // Provide instructions for the AI generative model
const PROMPT = `Recommend a name for this function. Explain your
reasoning in 3 sentences or less:`;
  4. غيِّر اسم دالة الأمر ورسالة المعلومات الخاصة بها. 
    export async function generateName() {
  vscode.window.showInformationMessage('Generating function name...');
  5. عدِّل رمز تجميع الطلب ليتضمن فقط القيمة PROMPT والنص الذي تم اختياره في المحرِّر. 
      // Build the full prompt using the template.
  const fullPrompt = `${PROMPT}
"
${selectedCode}
"
`;
  6. تغيير مخرجات الاستجابة لوصف ما يتم إنشاؤها. 
        // update prefix to describe output
    let commentIntro = padding + commentPrefix + "Recommended name: (generated)\n";
    editBuilder.insert(selection.start, commentIntro);
    editBuilder.insert(selection.start, pyComment);
  7. احفظ التغييرات في ملف review.ts.

دمج الأمر الجديد

بعد إكمال التعليمة البرمجية للأمر الجديد، تحتاج إلى دمجه مع بقية الإضافة. يمكنك تحديث ملفَّي extension.ts وpackage.json لجعل جزء الأمر الجديد من الإضافة، وتفعيل VS Code لاستدعاء الأمر الجديد.

لدمج الأمر name مع رمز الإضافة:

  1. في VS Code، افتح ملف pipet-code-agent/src/extension.ts.
  2. أضِف ملف الرمز الجديد إلى الإضافة من خلال إضافة عبارة استيراد جديدة. 
    import { generateName } from './name';
  3. سجِّل الأمر الجديد عن طريق إضافة الرمز التالي إلى الدالة activate(). 
    export function activate(context: vscode.ExtensionContext) {
    ...
    vscode.commands.registerCommand('pipet-code-agent.nameFunction', generateName);
}
  4. احفظ التغييرات في ملف extension.ts.

لدمج الأمر name مع حزمة الإضافة:

  1. في VS Code، افتح ملف pipet-code-agent/package.json.
  2. أضِف الأمر الجديد إلى قسم commands في ملف الحزمة. 
      "contributes": {
    "commands": [
      ...
      {
        "command": "pipet-code-agent.nameFunction",
        "title": "Pipet: Name the selected function."
      }
    ],
  3. احفظ التغييرات في ملف package.json.

اختبار الأمر الجديد

بعد الانتهاء من ترميز الأمر ودمجه مع الإضافة، يمكنك اختباره. لا يتوفر الأمر الجديد إلا في نافذة مضيف تطوير الإضافات في رمز VS، وليس في نافذة VS Code التي عدَّلت فيها رمز الإضافة.

لاختبار الأمر المعدّل:

  1. في نافذة مشروع إضافة VS Code Pipet، أعِد تشغيل برنامج تصحيح الأخطاء من خلال اختيار تشغيل > تصحيح أخطاء إعادة التشغيل، الذي يؤدي إلى إعادة تشغيل نافذة مضيف تطوير الإضافات منفصلة.
  2. في نافذة مضيف تطوير الإضافات في VS Code، اختَر بعض الرموز في نافذة المحرّر.
  3. افتح لوحة الأوامر عن طريق اختيار عرض > لوحة الأوامر.
  4. في "لوحة الأوامر"، اكتب Pipet واختَر الأمر Pipet: تسمية الدالة المحدّدة.

مراجع إضافية

لمزيد من المعلومات حول مشروع Pipet Code Agent، يمكنك الاطّلاع على مستودع الرموز. إذا كنت بحاجة إلى المساعدة في إنشاء التطبيق أو كنت تبحث عن متعاونين للمطوّرين، يمكنك مراجعة خادم Google Developers Community Discord.

تطبيقات الإنتاج

إذا كنت تخطِّط لنشر وكيل المستندات لعدد كبير من المستخدمين، يُرجى العِلم أنّ استخدامك لواجهة Google Gemini API قد يخضع لقيود على معدّل الاستخدام وقيود الاستخدام الأخرى. إذا كنت تفكر في إنشاء تطبيق إنتاج باستخدام واجهة برمجة تطبيقات Gemini مثل docs Agent، راجِع خدمات Google Cloud Vertex AI لزيادة قابلية توسّع تطبيقك وموثوقيته.