DEV Community

Cover image for كيف يغير جوجل جيميني وفايبر كودينج تطوير الـ API
Yusuf Khalidd
Yusuf Khalidd

Posted on • Originally published at apidog.com

كيف يغير جوجل جيميني وفايبر كودينج تطوير الـ API

يعيد جوجل جيميني تشكيل طريقة بناء التطبيقات عبر "البرمجة البديهية" (vibe coding): تصف ما تريد باللغة الطبيعية، ثم تحصل على كود أولي قابل للتشغيل يمكنك مراجعته وتحسينه. بالنسبة لمطوري واجهات برمجة التطبيقات (API) ومهندسي الواجهة الخلفية، تصبح القيمة الحقيقية في تحويل النموذج الأولي إلى تطبيق موثوق: مراجعة الكود، اختبار التكاملات، والتحقق من نقاط النهاية قبل النشر.

جرّب Apidog اليوم

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

ما هي البرمجة البديهية؟ وكيف يجعل جوجل جيميني تطوير التطبيقات حواريًا

البرمجة البديهية تعني أن تبدأ من وصف واضح بدلًا من البدء بملفات ومجلدات وكود يدوي. تكتب مطالبة مثل:

أنشئ تطبيقًا لتحميل صورة، تطبيق فلاتر عليها، ثم حفظ النتيجة.
استخدم واجهة مستخدم بسيطة، ووفّر نقطة API لحفظ الصورة النهائية.
Enter fullscreen mode Exit fullscreen mode

بعد ذلك يمكن لـ Gemini توليد هيكل التطبيق، منطق الواجهة، وربط واجهات برمجة التطبيقات المناسبة بحسب الطلب. لكن سير العمل العملي لا ينتهي هنا؛ يجب أن تتعامل مع الناتج كنقطة بداية قابلة للمراجعة.

سير عمل عملي للبرمجة البديهية

  1. اكتب مطالبة محددة تتضمن الوظائف، اللغة، الإطار، وواجهات API المطلوبة.
  2. شغّل التطبيق الناتج محليًا أو داخل Google AI Studio.
  3. راجع الكود: المصادقة، معالجة الأخطاء، حدود الإدخال، ومفاتيح API.
  4. اختبر نقاط النهاية يدويًا أو باستخدام أداة اختبار API.
  5. حسّن المطالبة واطلب تعديلات صغيرة بدلًا من إعادة بناء التطبيق بالكامل.

الميزات الرئيسية للبرمجة البديهية مع Gemini

  • التطوير الحواري: تصف الميزة باللغة الطبيعية ثم تطلب تحسينات تدريجية.
  • التكامل متعدد الوسائط: يمكن التعامل مع نصوص وصور وفيديو بحسب النموذج والميزات المتاحة.
  • النماذج الأولية السريعة: مناسب لبناء نسخة أولية ثم تكرارها بسرعة.
  • التكامل مع واجهات API: يمكن لـ Gemini اقتراح أو ربط خدمات مناسبة بناءً على وصفك.

مثال مطالبة أكثر قابلية للتنفيذ:

أنشئ تطبيق React مع واجهة لتحميل صورة.
أضف زرًا لتطبيق فلتر grayscale.
أضف endpoint باسم POST /api/images/process يستقبل ملف الصورة ويعيد رابط النتيجة.
اكتب الكود مع معالجة أخطاء واضحة عند فشل التحميل أو تجاوز حجم الملف 5MB.
Enter fullscreen mode Exit fullscreen mode

بعد التوليد، راجع المخرجات واطلب تعديلات متابعة مثل:

أضف تحققًا من نوع الملف بحيث يقبل فقط image/png و image/jpeg.
أعد تنظيم كود API في ملف services/imageService.ts.
أضف رسائل خطأ واضحة للمستخدم.
Enter fullscreen mode Exit fullscreen mode

لا تعتمد على الكود المولّد كما هو. راجع الأمان، الأداء، التعامل مع المفاتيح السرية، والاعتمادات الخارجية.

صورة

نظرة داخل جوجل جيميني: البنية التقنية للبرمجة البديهية

يمكن التفكير في Gemini داخل سير عمل التطوير على أنه طبقات متتابعة:

  • معالجة المدخلات: يحلل المطالبة ويحوّلها إلى تمثيل دلالي.
  • الاستدلال على المتطلبات: يحدد المكونات المطلوبة: واجهة، API، حالة التطبيق، معالجة بيانات.
  • توليد المخرجات: ينتج كودًا، يقترح بنية ملفات، ويربط خدمات خارجية عند الحاجة.

كيف يتعامل Gemini مع التطبيقات المعتمدة على واجهات API

عند طلب تطبيق يعتمد على واجهة API، ركّز على جعل المطالبة قابلة للاختبار. بدلًا من كتابة:

أنشئ تطبيق دردشة ذكي.
Enter fullscreen mode Exit fullscreen mode

اكتب:

أنشئ تطبيق دردشة بواجهة React.
أضف endpoint باسم POST /api/chat.
يستقبل JSON بالشكل:
{
  "message": "string"
}
ويعيد:
{
  "reply": "string"
}
أضف معالجة أخطاء عند غياب message أو فشل استدعاء الخدمة الخارجية.
Enter fullscreen mode Exit fullscreen mode

هذا يجعل الناتج أسهل في الاختبار والتوثيق. بعد ذلك يمكنك استخدام Apidog للتحقق من endpoint مثل:

POST /api/chat
Content-Type: application/json

{
  "message": "اقترح أفكارًا لتصميم حديقة صغيرة"
}
Enter fullscreen mode Exit fullscreen mode

وتتأكد من أن الاستجابة تتبع الشكل المتوقع:

{
  "reply": "يمكنك استخدام نباتات عمودية وإضاءة جانبية ومسار حجري صغير..."
}
Enter fullscreen mode Exit fullscreen mode

بالنسبة للتكاملات المتخصصة أو واجهات API المخصصة، ستحتاج غالبًا إلى اختبار مستقل خارج واجهة Gemini. هنا يصبح اختبار نقاط النهاية، الحالات الحدّية، والسيناريوهات الفاشلة خطوة أساسية قبل النشر.

البدء: البرمجة البديهية في Google AI Studio

لبناء تطبيق مدعوم بواجهة API باستخدام Gemini في Google AI Studio، اتبع الخطوات التالية:

  1. سجّل الدخول: افتح Google AI Studio وانتقل إلى تبويب Build.
  2. اختر النموذج: استخدم Gemini 2.5 Flash للتكرار السريع، أو Pro عندما تحتاج إلى استدلال أعمق.
  3. فعّل الميزات المطلوبة: مثل أدوات الصور أو الفيديو إن كانت جزءًا من التطبيق.
  4. اكتب مطالبة دقيقة: حدّد إطار العمل، نقاط النهاية، شكل البيانات، وسلوك الأخطاء.
  5. شغّل النسخة الأولية: اختبر التطبيق الناتج داخل المحرر.
  6. راجع الكود: لا تقبل الناتج النهائي قبل فهم بنية الملفات والمنطق.
  7. اختبر API خارجيًا: استخدم أداة مثل Apidog لمحاكاة الطلبات والتحقق من الاستجابات.

مثال مطالبة لبناء تطبيق يعتمد على API:

أنشئ تطبيقًا لتصميم الحدائق باستخدام React و Node.js.
الواجهة تحتوي على مربع نص لوصف الحديقة وزر "توليد اقتراح".
أضف endpoint باسم POST /api/garden-design.
الطلب:
{
  "space": "small | medium | large",
  "style": "modern | classic | natural",
  "notes": "string"
}
الاستجابة:
{
  "summary": "string",
  "plants": ["string"],
  "layoutTips": ["string"]
}
أضف validation للمدخلات ورسائل خطأ واضحة.
Enter fullscreen mode Exit fullscreen mode

بعد توليد التطبيق، اختبر الطلبات التالية:

{
  "space": "small",
  "style": "modern",
  "notes": "أريد تصميمًا قليل الصيانة مع إضاءة"
}
Enter fullscreen mode Exit fullscreen mode

ثم اختبر حالة خطأ:

{
  "space": "huge",
  "style": "modern"
}
Enter fullscreen mode Exit fullscreen mode

يجب أن تتأكد أن التطبيق يعيد خطأ واضحًا بدلًا من فشل غير مفهوم.

صورة

يساعدك المعرض المدمج على استكشاف مشاريع جاهزة وإعادة مزجها، لكنه ليس بديلًا عن مراجعة الكود واختبار التكاملات.

خطوة بخطوة: بناء تطبيقك الأول باستخدام البرمجة البديهية وGemini

لنأخذ مثالًا عمليًا: مصمم مشاهد تفاعلي يمكنه إدخال كائن داخل صورة مشهد.

1. ابدأ بمطالبة واضحة 

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

استخدم واجهة بسيطة.
أضف حالات loading و error.
افصل منطق استدعاء API في ملف مستقل.
Enter fullscreen mode Exit fullscreen mode

2. اطلب من Gemini توضيح البنية

بعد التوليد، اطلب:

اشرح بنية الملفات.
حدد أين يتم استدعاء API.
حدد أين يمكنني إضافة التحقق من حجم الصورة ونوعها.
Enter fullscreen mode Exit fullscreen mode

3. أضف قيودًا قابلة للاختبار 

أضف validation بحيث لا يتجاوز حجم الصورة 10MB.
اقبل فقط PNG و JPEG.
أعد رسالة خطأ واضحة عند فشل التوليد.
Enter fullscreen mode Exit fullscreen mode

4. اختبر الطلبات الناتجة

إذا أنشأ Gemini endpoint مثل:

POST /api/scene/generate
Enter fullscreen mode Exit fullscreen mode

فوثّق شكل الطلب:

{
  "sceneImageUrl": "https://example.com/room.png",
  "objectImageUrl": "https://example.com/chair.png",
  "position": {
    "x": 120,
    "y": 260
  }
}
Enter fullscreen mode Exit fullscreen mode

وشكل الاستجابة:

{
  "generatedImageUrl": "https://example.com/result.png",
  "status": "completed"
}
Enter fullscreen mode Exit fullscreen mode

ثم اختبر الحالات الفاشلة: صورة غير مدعومة، رابط مكسور، إحداثيات ناقصة، أو فشل الخدمة الخارجية.

صورة

5. استخدم التحسينات التكرارية

بدلًا من مطالبة كبيرة واحدة، استخدم تعديلات صغيرة:

غيّر لون زر التوليد إلى الأزرق.
أضف animation بسيطة أثناء التحميل.
أضف زرًا لإعادة المحاولة عند فشل الطلب.
Enter fullscreen mode Exit fullscreen mode

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

تقنيات متقدمة: وضع التعليق التوضيحي، معرض التطبيقات، والتعامل مع واجهات API

وضع التعليق التوضيحي لتعديلات واجهة المستخدم

يمكنك تحديد عنصر في الواجهة وطلب تعديل مباشر مثل:

حرّك هذه الصورة من اليسار إلى المنتصف خلال 300ms.
اجعل الزر غير مفعل أثناء تنفيذ الطلب.
أظهر رسالة خطأ أسفل حقل الإدخال عند وجود قيمة غير صالحة.
Enter fullscreen mode Exit fullscreen mode

يحوّل Gemini هذه التوجيهات إلى تغييرات في الكود، لكن راجع دائمًا النتيجة: هل استخدم الحالة بشكل صحيح؟ هل أضاف الأنماط في المكان المناسب؟ هل أثّر على مكونات أخرى؟

صورة

معرض التطبيقات للتعلم وإعادة المزج

استخدم معرض التطبيقات كنقطة بداية:

  • انسخ فكرة واجهة أو تدفق مستخدم.
  • اطلب من Gemini شرح الكود قبل تعديله.
  • أعد مزج ميزة واحدة في كل مرة.
  • اختبر كل تعديل قبل الانتقال للتعديل التالي.

حصص واجهة برمجة التطبيقات والتكامل

عند استخدام واجهات API خارجية، انتبه إلى:

  • مفاتيح API وعدم تضمينها في كود الواجهة الأمامية.
  • حدود الحصص ومعدلات الطلبات.
  • معالجة فشل الشبكة.
  • إعادة المحاولة عند الأخطاء المؤقتة.
  • تسجيل الأخطاء بدون تسريب بيانات حساسة.

مثال بسيط لفصل استدعاء API في JavaScript:

export async function generateGardenDesign(payload) {
  const response = await fetch("/api/garden-design", {
    method: "POST",
    headers: {
      "Content-Type": "application/json"
    },
    body: JSON.stringify(payload)
  });

  if (!response.ok) {
    const errorBody = await response.json().catch(() => ({}));
    throw new Error(errorBody.message || "فشل توليد التصميم");
  }

  return response.json();
}
Enter fullscreen mode Exit fullscreen mode

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

Apidog + جوجل جيميني: تبسيط اختبار واجهة برمجة التطبيقات لتطبيقات البرمجة البديهية

يتفوق Apidog في تصميم واجهات API، محاكاتها، اختبارها، وتصحيح أخطائها. عند استخدام Gemini لتوليد تطبيق سريع، يمكنك استخدام Apidog لتحويل التكاملات من "تبدو صحيحة" إلى "تم اختبارها".

صورة

مثال عملي على سير العمل

  1. ولّد التطبيق باستخدام Gemini

    • اطلب endpoints واضحة.
    • اطلب شكل request و response.
    • اطلب معالجة أخطاء.

  2. استخرج مواصفات API

    • إذا أنشأ Gemini مواصفات OpenAPI، استوردها في Apidog.
    • إذا لم ينشئها، اطلب منه توليدها: 
أنشئ مواصفات OpenAPI 3.0 لهذا endpoint:
POST /api/garden-design
مع مخطط الطلب والاستجابة وحالات الخطأ.
Enter fullscreen mode Exit fullscreen mode

  1. اختبر endpoint الأساسي

    • أرسل طلبًا صالحًا.
    • تحقق من status code.
    • تحقق من شكل JSON.
    • تحقق من زمن الاستجابة.

  2. اختبر الحالات الحدّية

    • حقول ناقصة.
    • قيم غير مدعومة.
    • payload كبير.
    • فشل الخدمة الخارجية.
    • مفتاح API غير صالح.

  3. استخدم Mock Server عند الحاجة

    • إذا كانت الخدمة الخارجية غير جاهزة، أنشئ استجابة وهمية.
    • اربط واجهة التطبيق بالاستجابة الوهمية.
    • أكمل تطوير الواجهة دون انتظار التكامل النهائي.

  4. سلسلة الاستدعاءات

    • في التطبيقات متعددة الخطوات، اختبر تسلسل الطلبات.
    • مثال: رفع صورة → توليد نتيجة → حفظ النتيجة → جلب السجل.

مثال لحالة اختبار:

POST /api/garden-design
Content-Type: application/json
Enter fullscreen mode Exit fullscreen mode 
{
  "space": "small",
  "style": "natural",
  "notes": "أريد نباتات مناسبة للشرفة"
}
Enter fullscreen mode Exit fullscreen mode

استجابة متوقعة:

{
  "summary": "تصميم طبيعي مناسب لشرفة صغيرة",
  "plants": ["لافندر", "نعناع", "ريحان"],
  "layoutTips": ["استخدم رفوفًا عمودية", "ضع النباتات العطرية قرب مصدر الضوء"]
}
Enter fullscreen mode Exit fullscreen mode

من خلال دمج Apidog في سير عمل Gemini، تحصل على طبقة تحقق عملية قبل النشر، وتقلل المفاجآت الناتجة عن كود مولّد لم يتم اختباره جيدًا.

أفضل الممارسات للبرمجة البديهية مع جوجل جيميني

  • اكتب مطالبات محددة: اذكر الإطار، اللغة، endpoints، شكل البيانات، وسلوك الأخطاء.
  • اطلب بنية واضحة: اجعل Gemini يفصل منطق API عن الواجهة.
  • راجع الكود قبل تشغيله في الإنتاج: خصوصًا المصادقة، المفاتيح، وعمليات الملفات.
  • اختبر بزيادات صغيرة: لا تبنِ كل شيء في مطالبة واحدة.
  • وثّق المطالبات المهمة: احتفظ بسجل للتغييرات حتى تستطيع إعادة إنتاج النتائج.
  • اختبر واجهات API خارجيًا: استخدم Apidog للتحقق من الطلبات، الاستجابات، والحالات الفاشلة.
  • راقب الحصص والمفاتيح: لا تترك مفاتيح API داخل كود العميل.
  • لا تتنازل عن ملكية الكود: الذكاء الاصطناعي يسرّع البداية، لكنه لا يعفيك من الفهم والمراجعة.

تطلعات مستقبلية: مستقبل البرمجة البديهية وتطوير واجهات API

تجعل أدوات مثل جوجل جيميني بناء النماذج الأولية أسرع، خصوصًا للتطبيقات التي تعتمد على واجهات API وتجارب متعددة الوسائط. لكن القيمة الحقيقية تظهر عندما تجمع بين التوليد السريع والانضباط الهندسي: مراجعة، اختبار، توثيق، ومراقبة.

بالنسبة للفرق التي تبني تطبيقات تعتمد على API، يمكن أن يكون سير العمل العملي كالتالي:

  1. استخدم Gemini لتوليد النموذج الأولي.
  2. اطلب مواصفات API واضحة.
  3. اختبر endpoints في Apidog.
  4. أصلح الأخطاء وكرر المطالبات.
  5. انقل الكود إلى بيئة تطوير منظمة.
  6. أضف اختبارات وتحققًا قبل النشر.

بهذا الأسلوب، تصبح البرمجة البديهية وسيلة لتسريع التطوير، لا بديلًا عن الممارسات الهندسية الجيدة.

Top comments (0)