إنشاء هايكو حول منتجات Google باستخدام PaLM API وFlutter

1. قبل البدء

من أبرز الإنجازات في مجال تعلُّم الآلة (ML) هو الذكاء الاصطناعي التوليدي الذي يمكنه إنشاء صور ونصوص ومقاطع صوتية وحتى فيديوهات مذهلة استنادًا إلى نصوص بسيطة أو طلبات من المستخدمين. من خلال إطلاق PaLM API تحديدًا، تتيح Google للمطوّرين إنشاء فئات من التطبيقات التي تقدّم تجارب مستخدم رائعة تمّت إعادة تصميمها باستخدام تكنولوجيا PaLM.

في هذا الدرس التطبيقي حول الترميز، ستنشئ تطبيقًا يستخدم PaLM API لإنشاء مقاطع شعرية قصيرة استنادًا إلى أسماء منتجات Google. تستخدم أيضًا Flutter لإنشاء تطبيق من عدّة منصات يعرض قصائد الهايكو.

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

• معرفة أساسية بالنماذج اللغوية الكبيرة (LLM)، مثل كتابة الطلبات
• معرفة أساسية بتطوير تطبيقات Flutter باستخدام Dart

أهداف الدورة التعليمية

• كيفية استخدام PaLM API من Google
• كيفية إنشاء تطبيق Flutter متوافق مع عدّة منصات لعرض النتائج

المتطلبات

• حزمة تطوير البرامج (SDK) في Flutter
• محرّر نصوص، مثل Visual Studio Code (VS Code)
• إعداد VS Code لاستخدام Flutter وDart
• إعداد Android أو iOS لـ Flutter (بما في ذلك المحاكيات)
• إعداد الكمبيوتر المكتبي لتطبيق Flutter على Windows أو Linux أو macOS
• إعداد الويب لتطبيق Flutter
• مفتاح واجهة برمجة التطبيقات PaLM API

2. طريقة الإعداد

تنزيل الرمز الأوّلي

1. انتقِل إلى مستودع GitHub هذا.
2. انقر على الرمز > تنزيل ملف zip لتنزيل كل الرمز البرمجي لهذا الدرس التطبيقي حول الترميز.
3. فك ضغط ملف ZIP الذي تم تنزيله لفك حزمة المجلد الجذر codelabs-main. ما عليك سوى استخدام الدليل الفرعي haiku-generator الذي يحتوي على المجلدات التالية:

• المجلّدان step0 وstep3 اللذان يحتويان على الرمز الأولي الذي ستستند إليه في كل خطوة من خطوات هذا الدرس البرمجي.
• المجلد finished الذي يحتوي على الرمز المكتمل لنموذج التطبيق النهائي

تنزيل تبعيات المشروع

1. في VS Code، انقر على ملف > فتح مجلد > codelabs-main > haiku_generator > step0 > lib > main.dart.
2. إذا ظهر لك مربّع حوار في VS Code يطلب منك تنزيل الحِزم المطلوبة لتطبيق البداية، انقر على الحصول على الحِزم.

3. إذا لم يظهر لك مربّع حوار في VS Code يطلب منك تنزيل الحِزم المطلوبة لتطبيق البداية، افتح الوحدة الطرفية، ثم انتقِل إلى المجلد step0 ونفِّذ الأمر flutter pub get.

تشغيل التطبيق النموذجي

1. في VS Code، تأكَّد من إعداد "محاكي Android" أو "محاكي iOS" بشكل صحيح وظهورهما في شريط الحالة.

على سبيل المثال، إليك ما يظهر عند استخدام هاتف Pixel 5 مع "محاكي Android":

في ما يلي ما يظهر عند استخدام iPhone 13 مع iOS Simulator:

2. انقر على بدء تصحيح الأخطاء. يتم تشغيل التطبيق على "محاكي Android" أو "محاكي iOS".

استكشاف التطبيق الأوّلي

في تطبيق البداية، لاحظ ما يلي:

• واجهة المستخدم بسيطة جدًا.
• تتضمّن الصفحة قائمة منسدلة تتيح للمستخدمين اختيار منتج معيّن من Google.
• بعد أن ينقر المستخدمون على الزر إنشاء قصيدة هايكو، يرسل تطبيق Flutter الطلب المضمّن إلى نقطة نهاية PaLM API، التي تنشئ قصائد هايكو.
• يعرض التطبيق قصائد الهايكو التي تم إنشاؤها في أداة النص بعد تلقّي ردّ. ومع ذلك، إذا اخترت إنشاء قصيدة هايكو، لن يحدث أي شيء لأنّ التطبيق لا يمكنه التواصل مع واجهة برمجة التطبيقات PaLM API بعد.

3- إعداد إمكانية الوصول إلى PaLM API

يجب توفّر مفتاح واجهة برمجة تطبيقات لاستخدام PaLM API. في وقت نشر هذا الدرس العملي، كانت واجهة برمجة التطبيقات PaLM API لا تزال في مرحلة المعاينة الخاصة.

• لإعداد إذن الوصول إلى PaLM API، اتّبِع المستندات لإنشاء مفتاح واجهة برمجة التطبيقات، ثم سجِّل المفتاح لاستخدامه لاحقًا في هذا الدرس التطبيقي حول الترميز.

4. إضافة قائمة بمنتجات Google

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

لإضافة قائمة بمنتجات Google إلى التطبيق، اتّبِع الخطوات التالية:

1. في VS Code، انتقِل إلى الملف step1/lib/data/repositories/product_repository_impl.dart.
2. في نص الدالة getAllProducts()، أضِف المتغير التالي الذي يخزّن مصفوفة من أسماء منتجات Google:

product_repository_impl .dart

var productData = [
  {'productName': 'Google Search'},
  {'productName': 'YouTube'},
  {'productName': 'Android'},
  {'productName': 'Google Maps'},
  {'productName': 'Gmail'}
];

5- إرسال الطلب إلى PaLM API وفك ترميز الرد

يتم دمج اسم المنتج الذي اختاره المستخدم مع نموذج الطلب التالي:

Context: You are an awesome haiku writer. 
Message content: Write a cool haiku about {product name}.

لإرسال هذا الطلب إلى نقطة نهاية PaLM API لإنشاء قصيدة هايكو، اتّبِع الخطوات التالية:

1. في VS Code، انتقِل إلى الملف step2/lib/data/repositories/poem_repository_impl.dart.
2. في نص الدالة getPoems()، أضِف الرمز التالي:

poem_repository_impl.dart

// TODO: Replace YOUR_API_KEY with your API key.
var apiKey = 'YOUR_API_KEY';
const haikuCount = 5;

final url = Uri.parse(
   'https://generativelanguage.googleapis.com/v1beta2/models/chat-bison-001:generateMessage?key=$apiKey');
final headers = {'Content-Type': 'application/json'};
final body = jsonEncode({
 "prompt": {
   "context": "You are an awesome haiku writer.",
   "examples": [
     {
       "input": {"content": "Write a haiku about Google Photos."},
       "output": {
         "content":
             "Google Photos, my friend\nA journey of a lifetime\nCaptured in pixels"
       }
     }
   ],
   "messages": [
     {"content": "Write a cool haiku for $productName"}
   ]
 },
 "candidate_count": haikuCount,
 "temperature": 1,
});

try {
 final response = await http.post(url, headers: headers, body: body);
 if (response.statusCode == 200) {
   final decodedResponse = json.decode(response.body);
   String haikus = 'Here are $haikuCount haikus about $productName:\n\n';
   for (var i = 0; i < haikuCount; i++) {
     haikus += '${i + 1}.\n';
     haikus += decodedResponse['candidates'][i]['content'] + '\n\n';
   }
   return haikus;
 } else {
   return 'Request failed with status: ${response.statusCode}.\n\n${response.body}';
 }
} catch (error) {
 throw Exception('Error sending POST request: $error');
}

استبدِل السلسلة YOUR_API_KEY بمفتاح واجهة برمجة التطبيقات الذي حصلت عليه سابقًا.

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

ملاحظة: يعمل الحقل examples في الحمولة كمرجع ويخبر واجهة برمجة التطبيقات بكيفية إنشاء نص مشابه. يُعرف هذا غالبًا باسم التعلم داخل السياق. يمكنك تقديم أمثلة متعددة.

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

6. تشغيل التطبيق على الأنظمة الأساسية للأجهزة الجوّالة

1. في VS Code، اضبط جهاز الاختبار على جهاز Android أو iOS.
2. انقر على بدء تصحيح الأخطاء، ثم انتظِر حتى يتم تحميل التطبيق.
3. اختَر منتجًا من القائمة المنسدلة، ثم انقر على إنشاء قصيدة هايكو. يعرض التطبيق قصيدة هايكو عن المنتج المحدّد.

7. تشغيل التطبيق على منصات أجهزة الكمبيوتر

بالإضافة إلى Android وiOS، يتوافق Flutter أيضًا مع أنظمة التشغيل على أجهزة الكمبيوتر، بما في ذلك Linux وmacOS وWindows.

تشغيل التطبيق على Linux

1. في VS Code، اضبط الجهاز المستهدف على Linux (linux-x64).
2. انقر على بدء تصحيح الأخطاء، ثم انتظِر حتى يتم تحميل التطبيق.
3. اختَر منتجًا من القائمة المنسدلة، ثم انقر على إنشاء قصيدة هايكو.

تشغيل التطبيق على جهاز macOS

في نظام التشغيل macOS، عليك إعداد الأذونات المناسبة لأنّ التطبيق يرسل طلبات HTTP إلى الخلفية. لمزيد من المعلومات، يُرجى الاطّلاع على الاستحقاقات وApp Sandbox.

لتشغيل التطبيق على نظام التشغيل macOS، اتّبِع الخطوات التالية:

1. في الملفَين step3/macos/Runner/DebugProfile.entitlements وstep3/macos/Runner/Release.entitlements، أضِف الرمز التالي:

DebugProfile.entitlements | Release.entitlements

<key>com.apple.security.network.client</key>
<true/>

2. في VS Code، اضبط الجهاز المستهدف على macOS (darwin) .
3. انقر على بدء تصحيح الأخطاء، ثم انتظِر حتى يتم تحميل التطبيق.
4. اختَر منتجًا من القائمة المنسدلة، ثم انقر على إنشاء قصيدة هايكو.

تشغيل التطبيق على Windows

1. في VS Code، اضبط الجهاز المستهدف على Windows (windows-x64).
2. انقر على بدء تصحيح الأخطاء ثم انتظِر حتى يتم تحميل التطبيق.
3. اختَر منتجًا من القائمة المنسدلة، ثم انقر على إنشاء قصيدة هايكو.

8. تشغيل التطبيق على منصة الويب

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

لتشغيل التطبيق على منصة الويب، اتّبِع الخطوات التالية:

1. في VS Code، اضبط الجهاز المستهدف على Chrome (web-javascript).
2. انقر على بدء تصحيح الأخطاء، ثم انتظِر إلى أن يتم تحميل التطبيق في Google Chrome.
3. اختَر منتجًا من القائمة المنسدلة، ثم انقر على إنشاء قصيدة هايكو.

9- تهانينا

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

مزيد من المعلومات

• ‫PaLM API وMakerSuite: طريقة سهلة لبدء إنشاء نماذج أولية وتطوير تطبيقات الذكاء الاصطناعي التوليدي
• الذكاء الاصطناعي التوليدي من Google
• Flutter