ارتق بإنتاجية الترميز إلى المستوى التالي من خلال دمج ChatGPT مع VS Code.

يمكنك أن تكون رئيسًا لمهامك وتعزز إنتاجيتك عندما تتعلم الاستفادة من أدوات الذكاء الاصطناعي التي تخرج من مختبرات البحث يوميًا. يتميز VS Code بامتداد ChatGPT ليوفر لك بيئة تشفير تدعم OpenAI.

يمكنك الاستفادة من نموذج الترميز الواسع لـ ChatGPT لإكمال مشاريعك بشكل أكثر كفاءة وأسرع - داخل IDE مباشرةً. فيما يلي طرق مفيدة يمكنك من خلالها استخدام ChatGPT مع VS Code.

كيفية تثبيت امتداد ChatGPT واستخدامه في VS Code

عندما تبحث عن "ChatGPT" أو "Code GPT" في سوق ملحقات VS Code ، تظهر العديد من الامتدادات ذات الصلة. على عكس GitHub Copilot ، فهذه ليست رسميًا بشكل مباشر من OpenAI.

تعمل معظم امتدادات VS Code ChatGPT التي تم أخذ عينات منها بنفس الطريقة. لكننا سنلتزم ملحق ChatGPT الخاص بـ EasyCode لهذه المقالة ، لأنها مناسبة جدًا لإظهار حالات استخدام ChatGPT في VS Code. إنه يدعم GPT-4 و GPT-3.5 ، وله مستوى مجاني ، ولا يتطلب مفتاح API.

لتثبيت امتداد ChatGPT في VS Code:

  1. افتح VS Code وانقر فوق رمز الإعدادات في الجزء السفلي الأيسر من الشريط الجانبي الأيسر.
    2. instagram viewer
  2. اذهب إلى ملحقات.
  3. بدلاً من ذلك ، اضغط على Ctrl + Shift + X (Command + Shift + X لنظام التشغيل Mac) لفتح سوق الإضافات مباشرةً.
  4. اكتب "ChatGPT - EasyCode" في شريط البحث أعلى اليسار.
  5. انقر فوق الامتداد عندما ترى.
  6. أخيرًا ، انقر فوق ثَبَّتَ.
  7. سترى أيقونة الامتداد في الشريط الجانبي الأيسر بمجرد التثبيت.
  8. انقر فوق رمز الامتداد. انقر جرب بدون حساب. لكن لا تتردد في تسجيل الدخول إذا كان لديك حساب أو اشتراك لحساب جديد مع مزود الامتداد.

كيفية استخدام ملحق ChatGPT

  1. لاستخدام موجه مضمّن ، قم بتمييز الرمز الهدف وانقر فوقه بزر الماوس الأيمن. حدد أي من المطالبات المتاحة.
  2. لكتابة مطالبة مخصصة ، انقر بزر الماوس الأيمن على الرمز المميز وحدد Ask GPT. اكتب موجهك في مربع الدردشة في الجزء العلوي واضغط يدخل.

كيفية استخدام امتداد ChatGPT مع قاعدة التعليمات البرمجية الخاصة بك

إذا فتحت VS Code في دليل قاعدة التعليمات البرمجية وتريد أن يقوم ChatGPT بالوصول إلى الوحدات الأساسية:

  1. انقر فوق رمز الامتداد على الشريط الجانبي الأيسر. ثم تحقق من ملف اسأل Codebase صندوق.
  2. انسخ الكود المستهدف والصقه في مربع الدردشة.
  3. اكتب الموجه الخاص بك أسفل الرمز (اضغط تحول + أدخل) في مربع الدردشة.
  4. يضعط يدخل أو انقر فوق رمز الإرسال.

الآن دعنا نرى الطرق المختلفة لاستخدام ChatGPT في VS Code.

1. Refactor وتعديل التعليمات البرمجية

أثبت ChatGPT أنه مفيد في تعديل التعليمات البرمجية الإجرائية والوظيفية والموجهة للكائنات.

على سبيل المثال ، باستخدام هذا الامتداد ، طلبنا من ChatGPT إعادة تشكيل الكود الخاطئ أدناه ، وهي دالة Python لإنشاء قاموس عشوائي وإضافة "Buy" إلى كل قيمة.

defجعل ديكت(n: str، ** kwargs)-> ديكت:
 البعض: ديكت
ل مفتاح القيمة في kwargs.items ():
 بعض = n +" "+ القيمة
يعود بعض
newDict = makeDict ("يشتري"، item1 ="دفتر GPT"، item2 ="برنامج Java التعليمي"، item3 ="دليل التنزه")

لقد نجح في إنتاج الكود الصحيح الذي يعطي الناتج المتوقع ، مع أسباب مفصلة للتعديل:

علاوة على ذلك ، يمكنك استخدام ملف اطلب متابعة مربع لإخبار ChtGPT بتحويل الكود إلى فئة وإظهار كيفية إنشاء مثيل له:

الشفرة التي تم إنشاؤها أعلاه هي أكثر نمطية وقابلة لإعادة الاستخدام.

2. تصحيح التعليمات البرمجية الخاصة بك

إذا ألقى الرمز الخاص بك بخطأ أو لم يعمل كما ينبغي ، فإن مطالبة ChatGPT بتصحيحه مباشرة داخل VS Code يوفر الوقت.

على الرغم من عدم وجود مطالبة مضمنة لتصحيح الأخطاء ، يمكنك استخدام ملف اسأل GPT خيار لإنشاء موجه مخصص لتصحيح التعليمات البرمجية الخاصة بك.

طلبنا من امتداد ChatGPT تصحيح أخطاء الكود الذي استخدمناه سابقًا. لم يقتصر الأمر على التصحيح. شرحت ذلك وأنتجت الصحيحة ، بما في ذلك ناتجها المتوقع.

3. اكتب الرمز الخاص بك بلغة أخرى

قد ترغب في كتابة برنامج بلغة معينة بجانب لغتك الأساسية. يمكنك كتابة التعليمات البرمجية بلغتك الأساسية واطلب من ChatGPT إعادة كتابتها بلغة البرمجة المختارة.

ومع ذلك ، قد يتطلب الرمز الذي تم إنشاؤه القليل من المدخلات البشرية ، حيث قد يفشل ChatGPT في توفير رمز محوّل يعمل بشكل كامل في بعض الحالات.

على سبيل المثال ، قمنا بتحويل كود Python التالي إلى مكافئته C باستخدام امتداد VS Code ChatGPT:

يمكنك تحقيق ذلك عن طريق النقر بزر الماوس الأيمن على الرمز المميز واختيار ملف اسأل GPT خيار.

هنا موجهنا في VS Code:

على الرغم من أنه قام بإنشاء مكافئ C مرتين قبل الحصول عليه بشكل صحيح ، إلا أن الكود النهائي يعمل.

4. قم بإنشاء مكون الواجهة الأمامية لواجهة برمجة التطبيقات الخاصة بك

إذا كنت قد كتبت واجهة برمجة تطبيقات بنقاط نهاية مختلفة ، فيمكنك أن تطلب من امتداد ChatGPT توفير مكون الواجهة الأمامية لاستهلاكه باستخدام إطار عمل معين. قد يكون هذا هو React أو Vue أو Angular.

على سبيل المثال ، استخدمنا الامتداد لإنشاء مكون React لإنشاء جدول اجتماع بناءً على نقطة نهاية API تم إنشاؤها باستخدام Python FastAPI:

كما فعلت أعلاه ، قد ترغب في التحقق من اسأل Codebase مربع إذا كنت تتعامل مع قاعدة رمز كبيرة.

بعد الرجوع إلى قاعدة الشفرة الخاصة بنا ، قدم امتداد VS Code ChatGPT مكون React مفيدًا لاستخدام نقطة النهاية المتوفرة:

5. اشرح الكتل البرمجية

افترض أنك حصلت على جزء من التعليمات البرمجية من Stack Overflow أو مستودع GitHub. يمكنك أن تطلب من امتداد ChatGPT في VS Code لشرح كيفية عمله من أجل فهم أفضل. يساعدك هذا في تصحيح مثل هذا الرمز بسهولة إذا ظهرت أخطاء بسبب تغييرات الكود في المستقبل.

في حالة الاستخدام هذه ، طلبنا من امتداد ChatGPT شرح الكود التالي ؛ فئة بايثون للتحقق من عناوين البريد الإلكتروني للمستخدمين.

ولدت الاستجابة التالية:

6. إنشاء قوالب HTML للتطبيق الخاص بك

باستخدام امتداد ChatGPT في VS Code ، يمكنك إنشاء قالب HTML (مثل حقول الإدخال) من البداية - باستخدام مربع الدردشة الملحق مباشرةً. على سبيل المثال ، يمكنك إخباره بإنشاء قالب HTML لتسجيل المستخدم.

ولكن ماذا لو كنت تكتب تطبيقًا يعرض البيانات إلى HTML مباشرة (ليس SPA) وتريد نموذجًا خاصًا بالمشروع؟ يمكنك استخدام امتداد ChatGPT في VS Code لإنشاء قوالب HTML تعرض بيانات الواجهة الخلفية للمستخدمين.

على سبيل المثال ، إذا كنت تستخدم ملف إطار عمل قائم على معمارية MVT مثل Django، يمكنك استخدام الامتداد لتزوير قوالب HTML لطرق عرض Django الخاصة بك.

مرة أخرى ، بالنسبة لهذا النوع من حالات الاستخدام ، قد ترغب في النقر فوق ملف اسأل Codebase مربع الاختيار لـ ChatGPT للوصول إلى قاعدة الرموز الخاصة بك.

7. وحدة اختبار الكود الخاص بك

بقدر أهمية اختبار الوحدة ، يمكن أن يكون مستهلكًا للوقت. يمكنك الاستفادة من امتداد VS Code ChatGPT لإنشاء اختبارات وحدة للرمز الخاص بك وتوفير وقت التطوير الثمين.

على الرغم من أن ملحق ChatGPT يحتوي على مطالبة مضمنة لإنشاء اختبارات الوحدة ، فقد ترغب في كتابة موجه مخصص باستخدام اسأل Codebase خيار للخصوصية ونتيجة أفضل.

طلبنا من ChatGPT كتابة اختبار وحدة لنقطة نهاية التسجيل التي تم إنشاؤها باستخدام Python FastAPI:

أخذ عينات من قاعدة الكود بكفاءة لإنشاء اختبار الوحدة المطلوبة:

8. البحث عن الثغرات الأمنية المحتملة

على الرغم من أنه قد لا يوفر تحليلًا أمنيًا مفصلاً ، إلا أن امتداد VS Code ChatGPT يمكن أن يكون أداة مفيدة بسرعة تحقق من وجود ثغرات أمنية في تطبيقك رمز قاعدة ويوفر لك الوقت في المسح يدويًا.

للسماح لـ ChatGPT بمسح قاعدة الرموز الخاصة بك ، استخدم ملف اسأل Codebase الخيار (انقر فوق رمز الامتداد وتحقق من ملف اسأل Codebase صندوق).

إذا كنت تقامر عادة في طريقك حول بعض الملفات القديمة أو ميزات VS Code الجديدة، لا تتردد في السؤال عن طريقك حول IDE من امتداد ChatGPT.

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

أو يمكنك طرح سؤال أكثر تقنية ، مثل كيفية فتح VS Code من سطر الأوامر.

10. كتابة الوثائق مباشرة من رمز VS

يمكنك كتابة وثائق مفصلة لجزء من التعليمات البرمجية مباشرة من VS Code بسهولة باستخدام امتداد ChatGPT.

على سبيل المثال ، إليك توثيق تفصيلي لوظيفة إنشاء ارتباط Zoom (بتنسيق HTML) التي أنشأناها باستخدام امتداد VS Code ChatGPT:

كود فعال مع ChatGPT في VS Code

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