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

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

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

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

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

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

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

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

يتم تشغيل مشروع Pipet Code Agent كامتداد لـ Microsoft Visual Studio الرمز البرمجي واستخداماته سيؤدي استخدام 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 Code Agent.
    cd generative-ai-docs/examples/gemini/node/pipet-code-agent/
    
  4. شغِّل أمر التثبيت لتنزيل التبعيات وإعداد المشروع:
    npm install
    

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

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

يعمل وكيل رمز Pipet في نافذة "مضيف تطوير الإضافات" الشكل 1. نافذة مضيف تطوير إضافة رمز VS باستخدام الممر أوامر الإضافات.

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

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

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

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

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

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

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

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

  1. ابدأ تشغيل تطبيق VS Code.
  2. في رمز VS، أنشِئ نافذة جديدة عن طريق اختيار File (ملف) >" نافذة جديدة:
  3. افتح مشروع وكيل Pipet Code من خلال تحديد File (ملف) >" افتح المجلد، واختَر المجلد 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، اختَر أي رمز في نافذة المحرر.
  3. افتح لوحة الأوامر عن طريق تحديد عرض > لوحة الأوامر:
  4. في "لوحة الأوامر"، اكتب Pipet ثم اختَر الأداة: راجِع المحدد البرمجية.

إنشاء أمر جديد

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

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

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

لإنشاء أمر يوصي بأسماء الدوال:

  1. إنشاء نسخة من ملف pipet-code-agent/src/comment.ts يسمى name.ts في الدليل src/.
  2. في رمز VS، افتح ملف 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 لاستدعاء الأمر الجديد.

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

  1. في رمز VS، افتح ملف 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، افتح ملف 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 حيث عدّلت رمز الإضافة.

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

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

مراجع إضافية

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

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

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