وداعاً لـ Ralph Loops: إطار عمل GSD الجديد لـ Claude Code

EEric Tech
Computing/SoftwareSmall Business/StartupsInternet Technology

Transcript

00:00:00إذا كنت تستخدم Claude Code لبناء تطبيقات الويب، فعليك تجربة GSD،
00:00:04وهو إطار عمل مفتوح المصدر للتطوير القائم على المواصفات، ويتخصص في تنسيق
00:00:08وكلاء فرعيين مختلفين لإكمال المشاريع وفقاً لمنهجية التطوير القائم على المواصفات.
00:00:12وعلى عكس أطر عمل التطوير التقليدية القائمة على المواصفات التي عرضناها في قناتنا،
00:00:15مثل Beemap Method وSpecKits وTaskmaster وغيرها الكثير، فإن جميع تلك الأطر التقليدية
00:00:20تضطر لاتباع قاعدة صارمة حيث يجب تنفيذ كل شيء داخل
00:00:24نافذة سياق واحدة فقط. على سبيل المثال، التخطيط والبحث والتطوير والتحقق،
00:00:29كل ذلك يجب أن يتم في نافذة سياق واحدة. لكن هذا يسبب مشكلة كبيرة،
00:00:33وهي تشتت السياق، مما يعني أنه كلما زاد استهلاك الرموز (tokens) في نافذة سياق واحدة،
00:00:38قلت الدقة. والحل يكمن في استخدام وكلاء فرعيين
00:00:42لتفويض مهام التخطيط والبحث والتطوير والتحقق، بحيث يكون لكل منها وكيلها الخاص،
00:00:47حيث يحصل كل وكيل فرعي على سياق جديد ونظيف لإكمال المهمة خطوة بخطوة.
00:00:51وهنا يعمل GSD كمنسق يدير هؤلاء الوكلاء الفرعيين وفقاً
00:00:55للتطوير القائم على المواصفات، عبر توجيه الذكاء الاصطناعي لتحويل الفكرة الخام إلى تطبيق
00:01:00جاهز للإنتاج بشكل تدريجي. وهذا يعني أننا سنستهلك رموزاً أكثر،
00:01:04لكن مستوى الدقة الذي سنحصل عليه سيكون أعلى بكثير
00:01:07مقارنة بوضع كل شيء في سياق واحد. لذا، سأشرح في هذا الفيديو
00:01:11بالضبط كيفية إعداد إطار عمل GSD على Claude Code من خلال توضيح
00:01:15كيفية تحويل فكرة ما والبناء فوق تطبيقاتك الحالية أو إنشاء تطبيقات جديدة،
00:01:19وكيفية صقل الفكرة التي تحاول بناءها باستخدام وكلاء البحث
00:01:23ووكلاء التخطيط المتوفرين. وبمجرد صياغة فكرتنا، يمكننا الانتقال إلى
00:01:27مرحلة التنفيذ حيث يوجد منفذ خاص لتنفيذ المهام مع وكلاء يعملون بالتوازي
00:01:32في نفس الوقت. وكل وكيل لديه نافذة سياق جديدة ويقوم بتوثيق (commit) كل مهمة
00:01:37ينجزها. كما أنه في كل مرة يكمل فيها مهمة، يقوم بتشغيل وكيل آخر
00:01:41للتحقق من المهمة مقابل الأهداف المحددة. والأهم من ذلك، بمجرد الانتهاء من
00:01:45مرحلة واحدة من المهمة، سأريكم بالضبط كيف يمكننا تكرار كل مرحلة
00:01:49لدينا مثل النقاش والتخطيط والتنفيذ والتحقق، خطوة بخطوة ودورة تلو الأخرى حتى ننجز
00:01:55المرحلة الرئيسية بالكامل وبشكل مستقل تماماً. هذا هو تقريباً ما سنغطيه
00:02:00في هذا الفيديو. وإذا كنتم مهتمين، فلنبدأ. حسناً، قبل أن نبدأ، إليكم
00:02:04مقدمة سريعة للمشتركين الجدد، اسمي إريك. قضيت سنوات كمهندس برمجيات أول
00:02:09في شركات مثل Amazon وAWS وMicrosoft. وقد أنشأت هذه القناة على يوتيوب لأشارك
00:02:15كل ما تعلمته خلال مسيرتي، من الذكاء الاصطناعي في البرمجة إلى الأتمتة والـ Web3 والتطوير المهني،
00:02:22وغيرها، وكلها مقدمة في دروس عملية يمكنك اتباعها فعلياً. لذا، إذا كنت مستعداً
00:02:27لتطوير مهاراتك، فاحرص على زيارة قناتي والضغط على زر الاشتراك. والآن،
00:02:32لنعد إلى الفيديو. حسناً، أول شيء سنفعله هو التوجه إلى
00:02:36مستودع (repository) GSD. هنا ترى التعليمات الدقيقة لتثبيت هذا الإطار على جهازك
00:02:40المحلي. سأقوم بنسخ هذا الأمر والعودة إلى واجهة الأوامر (terminal) الخاصة
00:02:44بمشروعي الحالي. وسأقوم بكتابة هذا الأمر لتثبيته في
00:02:49مشروعي المحلي. سأؤكد عملية التثبيت. وكما تلاحظون،
00:02:53علينا الاختيار بين استخدام Claude Code أو Open Code أو كليهما. سأختار خياراً واحداً
00:02:57حالياً وهو Claude Code لهذا العرض التوضيحي. ويسأل هنا: أين تود تثبيت
00:03:02هذا الإطار؟ أفضل تثبيته بشكل عام (globally) ليكون متاحاً لجميع المشاريع. حسناً.
00:03:07بعد الاختيار، ستلاحظ أن GSD يتضمن سطر حالة يعرض اسم النموذج،
00:03:12والمهمة الحالية، واستهلاك نافذة السياق. فهل نستخدم السطر الحالي أم
00:03:17نستبدله بسطر حالة GSD؟ في الواقع، لم أرَ سطر حالة GSD بعد.
00:03:22لذا سأختار الخيار الثاني هنا. ودعونا نلقي نظرة على شكل
00:03:26سطر حالة GSD. سأفتح جلسة Claude Code، وهنا يمكنك رؤية
00:03:31سطر الحالة الحالي الخاص بـ GSD. وبالطبع، إذا لم يعجبك هذا الإصدار
00:03:37وأردت استخدام إصداري الخاص، يمكنك مشاهدة الفيديو الخاص بي هنا، حيث
00:03:41أوضح فيه كيفية تخصيص سطر الحالة ليبدو بهذا الشكل تماماً. لكن بالطبع،
00:03:46إذا كنت تفضل الالتزام بسطر حالة GSD، فيمكنك المضي قدماً بهذا الخيار.
00:03:49ما سنفعله الآن، بمجرد تثبيت GSD، هو ببساطة كتابة GSD. وستلاحظ
00:03:54ظهور جميع الأوامر المخصصة هنا داخل واجهة أوامر Claude Code. حسناً.
00:03:58بعد تثبيت GSD، الخطوة التالية هي محاولة تهيئة مشروعنا.
00:04:02إذا كنت تبدأ مشروعاً جديداً، فستقوم ببساطة بكتابة GSD new projects. ولكن
00:04:06إذا كان لديك مشروع قائم بالفعل، فسنقوم بتشغيل هذا الأمر أولاً.
00:04:10وهو يقوم بتشغيل وكلاء فرعيين متعددين لتحليل التقنيات المستخدمة، والمعمارية، والاتفاقيات،
00:04:15والمخاوف البرمجية. ثم نستخدم هذا الأمر لفهم كامل الكود المصدري وطرح الأسئلة
00:04:20بناءً على ما تحاول إضافته والتخطيط لتصميم تطبيقنا. في هذه الحالة،
00:04:24سأقوم بتنفيذ هذا الأمر أولاً، لمحاولة رسم خريطة لكامل الكود المصدري. وهنا
00:04:28سترى أنه سيتم تشغيل أربعة وكلاء لرسم خرائط الكود بشكل متوازٍ، لمحاولة فهم
00:04:32كامل البيئة التقنية، والمعمارية، والاتفاقيات، وكل شيء، وتحليل كل جوانب
00:04:38تطبيقنا هنا. لذا، دعونا ننتظر قليلاً
00:04:42حتى ينتهي هؤلاء الوكلاء الذين يعملون بالتوازي من رسم الخريطة. حسناً.
00:04:46الآن انتهت عملية رسم الخريطة وتحليل الكود بالكامل. وما سأفعله
00:04:50هو إعادة ضبط جلسة Claude Code لأن نافذة السياق الحالية
00:04:54مستهلكة تقريباً إلى المنتصف. لذا سأنهي الجلسة ثم أقوم بمسح
00:04:59واجهة الأوامر وإعادة تشغيل جلسة Claude Code. هكذا نبدأ من الصفر الآن بعد
00:05:04رسم الخريطة، لكن لا تقلق لأن الخريطة محفوظة بالفعل في ملف الحالة.
00:05:09يمكنك رؤية مجلد dot planning، وستجد بداخله ملفات الكود المصدري.
00:05:13وهو يلخص كل ما لدينا في تطبيقاتنا، مثل المعمارية،
00:05:17والمخاوف البرمجية، والاتفاقيات، والتكاملات، وكل شيء مخزن
00:05:23داخل هذا المجلد، حتى لا نفقد تتبع الحالة الحالية لرسم الخرائط. حسناً.
00:05:28بمجرد الانتهاء من رسم خريطة الكود بالكامل، حان الوقت لتهيئة مشروعنا.
00:05:32ما سيحدث هو أنه سيطرح عليّ بعض الأسئلة الهامة
00:05:36لفهم فكرتي. ما هي الميزات الجديدة التي سنضيفها؟ وبعد ذلك
00:05:39سيقوم بتشغيل عدة وكلاء فرعيين بالتوازي للتحقيق في المجال الذي نحاول بناءه.
00:05:43كما سيساعدك في استخراج بعض المتطلبات بالإضافة إلى خارطة الطريق
00:05:47التي توضح المراحل التي نحتاجها لتحقيق ذلك. هذا ما سنفعله،
00:05:51سأقوم بنسخ هذا الأمر ولصقه هنا. وسيبدأ البرنامج
00:05:56في محاولة تهيئة مشروعنا الحالي. كما ترون، هذا مشروع قائم بالفعل (brown field)،
00:06:00يحتوي على كود مصدري وخريطة جاهزة للكود. ومستودع Git موجود،
00:06:05ولكن لا يوجد ملف تخطيط للمشروع بعد. لذا سيطرح سؤالاً: أرى أن لديك
00:06:10مشروعاً حالياً مع كود تم رسم خريطته. وبالنظر إلى ملف cloud MD، يمكنني فهم
00:06:14سياق العمل، ثم يسألني: ما الذي تريد مني بناءه تالياً؟ حسناً، لأن
00:06:18لدي ميزة في ذهني بالفعل نريد بناءها، وهي لوحة تحكم
00:06:23لنظام الإدارة، وهي عبارة عن ملف MD قصير قمت بصياغته باستخدام الذكاء الاصطناعي
00:06:29لبناء لوحة تحكم إدارية مبسطة، تكون عبارة عن علامة تبويب جديدة في الشريط الجانبي الحالي،
00:06:34وتوفر الأدوات الأساسية لإدارة المستخدمين ومعالجة مشكلات الدعم عند الإطلاق.
00:06:39ويمكنك رؤية بعض الميزات التي طلبتها وميزات المنتج الأدنى القابل للتطبيق (MVP)،
00:06:42ونماذج تجربة المستخدم وإطارات العمل وكل تلك التفاصيل الدقيقة.
00:06:47أوصيكم بشدة باستخدام الذكاء الاصطناعي، مثل Claude، للقيام بمراجعة
00:06:52للتطبيقات، ومحاولة صياغة خطة لما تحاول بناءه بالضبط،
00:06:56على الأقل تغييرات واجهة المستخدم، أو الميزات التي تريد تضمينها، ليكون لدينا
00:07:00خطة واضحة عما سيقوم Claude بتنفيذه. الآن،
00:07:04من الواضح أنني يمكنني أخذ هذه الخطة واجعل Claude ينفذها مباشرة، لكنني
00:07:08أريد أن يتولى GSD المهمة ويقوم ببعض الاستقصاء أو البحث، عبر تشغيل
00:07:13وكلاء فرعيين للبحث نيابة عنا وتقسيم هذه المهمة الكبيرة إلى مهام
00:07:20أصغر يسهل تنفيذها. في هذه الحالة، سأفتح واجهة الأوامر وأقول
00:07:25ببساطة إن هذا هو ما سنبنيه بالضبط. سأشير إلى هذا الملف
00:07:28هنا، وسأقول: أنا أخطط لبناء هذا تالياً. ثم سأضغط
00:07:33على إدخال وأدع GSD يساعدنا في عملية التخطيط.
00:07:40هنا تلاحظ أنه يقرأ قائمة المهام التي نتطلع لتنفيذها في هذا التطبيق.
00:07:44وسيبدأ بطرح أسئلة المستخدم ليطلب مني
00:07:48تأكيد المواصفات الدقيقة. يقول إن هذه المواصفات تشمل أربع ميزات،
00:07:52مثل قائمة المستخدمين، والاعتمادات، والمستويات، وانتحال الشخصية؛ فهل نبنيها
00:07:58كلها معاً أم نحدد أولويات لمجموعة منها في المرحلة الأولى؟ كما ترون، بدأ
00:08:02بتقسيم هذه الميزات الأربع الكبيرة إلى ميزات أصغر في البداية. سأقول
00:08:07له: حسناً، لنبدأ ببعض الميزات البسيطة مثل قائمة المستخدمين والاعتمادات. سأقول
00:08:11نعم، لنفعل ذلك. ثم يسأل: كيف تريد التحقق من عمل لوحة الإدارة بشكل صحيح؟
00:08:16حالياً، ولأن المشروع جديد جداً، أقوم غالباً بالاختبار اليدوي، لكن كما ترون
00:08:21هو يطلب تغطية اختبارية. مثل إجراء اختبارات التكامل، أو إضافة اختبارات
00:08:25لمسارات الـ API. وأيضاً اختبار التغطية الكاملة الذي يشمل اختبارات الوحدة،
00:08:30واختبارات التكامل، واختبارات النهاية إلى النهاية (E2E). سأركز على الاختبار اليدوي فقط
00:08:34في البداية، ولاحقاً يمكننا زيادة التغطية الاختبارية. لذا سأختار
00:08:38الاختبار اليدوي حالياً وأرسل الإجابة. دعونا نرى ماذا سيفعل
00:08:43GSD الآن. تلاحظون أنه سيستمر في طرح أسئلة بناءً على إجابتي.
00:08:46يسأل: متى تحتاج لوحة الإدارة لتكون جاهزة؟ لأن في تطبيقنا الحالي، لدي مستند
00:08:50من محلل الأعمال حول الجدول الزمني يذكر تاريخ 30 يناير كموعد للإطلاق الفعلي.
00:08:56لذا هو يسأل عما إذا كنت أريدها قبل إطلاق النسخة الثانية (v2)،
00:09:01أي في 30 يناير. سأجيب بنعم، أريدها بالتأكيد
00:09:05قبل 30 يناير. ثم يسأل عما إذا كنا نريد المضي قدماً في إنشاء ملف MD للمشروع.
00:09:10حسناً، ما زلت أريد الاستكشاف وطرح المزيد من الأسئلة. أحد الأسئلة
00:09:14التي سأطرحها هي محاولة معرفة الثغرات التي تنقصنا في مواصفاتنا
00:09:19وفي ما سنقوم به. تلاحظون أنه قام بتشغيل عدة وكلاء فرعيين للقيام
00:09:22بالبحث في جوانب الأمان وتجربة المستخدم وأفضل الممارسات، وكذلك الثغرات التقنية
00:09:28التي قد نكون أغفلناها في مواصفاتنا الحالية. هنا ترى الجدول الكامل
00:09:32الذي يغطي جميع الثغرات. على سبيل المثال، عدم وجود حماية (middleware) للإدارة،
00:09:37ونقص في ملفات تعريف الارتباط (cookies)، وأيضاً تحديد معدل الطلبات (rate limiting) يتم في الذاكرة فقط،
00:09:43وكذلك إجراءات الإدارة لحذف المستخدمين، ووظيفة التحقق من صلاحيات المدير معطلة للمستخدمين الآخرين.
00:09:49لذا نريد التأكد من معالجة تلك الثغرات في المشروع الذي سننفذه.
00:09:52وهنا ترى قائمة الإصلاحات التي يقترحها علينا للقيام بها.
00:09:57ما يمكننا فعله هو مراجعة هذا ومعرفة ما إذا كانت هذه الثغرات منطقية.
00:10:02وبمجرد التأكد، يمكننا المضي قدماً وإنشاء ملف MD للمشروع
00:10:06والبدء في التنفيذ. ستلاحظ أنه سيطرح عليّ بعض الأسئلة.
00:10:11لقد وجد البحث ثغرات أمنية حرجة، كيف تريد مني التعامل معها؟
00:10:15سأقول له: أصلح الثغرات الحرجة، وهذا هو اقتراحي.
00:10:20سأرسل هذا الطلب ليتأكد Claude Code من أن خطتنا ومواصفاتنا
00:10:24لا تفتقر لأي شيء قبل الانتقال لملف مشروع MD. عندما يصبح كل شيء جاهزاً،
00:10:29يمكننا الآن إنشاء ملف مشروع MD. سأقول نعم، لننتقل إلى
00:10:33ملف مشروع MD. وهنا سترى Claude Code ينشئ الملف
00:10:38لكامل المشروع. لننتظر قليلاً حتى ينتهي من ذلك تماماً. قبل
00:10:42أن ننتقل للقسم التالي، أود أن أشكر راعي فيديو اليوم: Testbrite.
00:10:46Testbrite هو وكيل ذكاء اصطناعي مصمم خصيصاً لاختبار البرمجيات. ومع إصدار
00:10:51Testbrite MCP، يمكنك استخدامه الآن مباشرة داخل بيئة التطوير الخاصة بك،
00:10:57سواء كانت Cursor أو Windsurf أو Claude Code وغيرها، وإعداده بسيط للغاية.
00:11:02ما يعجبني في Testbrite هو أنه لا يشغل الاختبارات عشوائياً، بل يقرأ أولاً
00:11:07كامل الكود المصدري ويفهم التوثيق ويتحقق من النتائج التي ينتجها وكلاء الذكاء الاصطناعي.
00:11:11ويقوم تلقائياً بإنشاء خطة اختبار من وثيقة متطلبات المنتج (PRD)،
00:11:16ويصمم حالات الاختبار، ويضمن التغطية المناسبة، وكل ذلك دون تدخل يدوي.
00:11:21ومن هناك، ينفذ الاختبارات ويرسل لك تقارير مفصلة توضح بدقة ما هو معطل
00:11:26وما يحتاج لاهتمامك. معظم وكلاء البرمجة اليوم تبلغ دقتهم حوالي 42%،
00:11:32ولكن مع Testbrite MCP، استطاعت الفرق رفع دقة تسليم الميزات حتى 93%.
00:11:38لذا إذا كنت مهتماً بتجربته، يمكنك مشاهدة الفيديو الذي صنعته عنه أو الضغط على الرابط في الوصف.
00:11:42لنعد للفيديو. حسناً، بعد الانتهاء من تحديد نطاق المشروع وإنشاء
00:11:47ملف MD للمشروع، ستظهر لنا خيارات وضع التشغيل. يمكننا استخدام
00:11:52وضع "YOLO" الذي يقوم بالموافقة التلقائية والتنفيذ المباشر،
00:11:56أو جعله أكثر تفاعلية، بحيث نؤكد التغييرات في كل مرة ينتهي فيها من خطوة
00:12:01قبل المضي قدماً. سأختار وضع YOLO هنا لأترك له حرية التصرف
00:12:04ليقوم بإكمال كل شيء بشكل تلقائي. سأضغط على إدخال لاختيار وضع YOLO.
00:12:09وهنا يسأل عن "العمق"، أي مدى دقة وتفصيل عملية التخطيط.
00:12:14إما تخطيط سريع للشحن السريع (3-5 مراحل)، مع خطة إلى 3 خطط لكل منها،
00:12:18أو الطريقة القياسية المتوازنة التي تتكون من 5 إلى 8 مراحل،
00:12:22وكل مرحلة قد تحتوي على 3 إلى 5 خطط. في هذه الحالة، سأختار
00:12:26الخيار القياسي، فهو أكثر توازناً، فنحن لا نسعى للشحن السريع جداً
00:12:30بل نبحث عن نطاق عمل متوازن. سأضغط على رقم 2.
00:12:34حسناً، سأقوم بإرسال الإجابة الآن. وكنتيجة لذلك،
00:12:38ستظهر لنا خيارات التنفيذ. فإما أن نقوم بتشغيل الخطط بشكل متوازٍ،
00:12:42مما يعني تنفيذ الخطط المستقلة في وقت واحد، أو تنفيذها بشكل متسلسل
00:12:46واحدة تلو الأخرى. توصيتي هي: إذا لم يكن الوقت مشكلة،
00:12:51فأنا أوصي بشدة بالتنفيذ المتسلسل، لأننا سنعالج كل خطة تلو الأخرى
00:12:57بدلاً من العمل المتوازي. لأنه في العمل المتوازي، إذا نفدت رصيدك من الرموز،
00:13:01قد تتعطل في منتصف مهمتين. بينما في التنفيذ المتسلسل، ستكتمل بعض المهام
00:13:06على الأقل. وحتى لو نفد الرصيد، يمكنك الانتظار أو العودة غداً
00:13:10بمجرد تجديد الرصيد لتكمل تنفيذ المهام واحدة تلو الأخرى.
00:13:14على الأقل لن يكون مشروعك نصف مكتمل في كل الخطط. لذا سأختار
00:13:18التنفيذ المتسلسل لأنني أريد السير خطوة بخطوة. وبالنسبة لتعقب Git،
00:13:22هل نقوم بتوثيق (commit) وثيقة التخطيط؟ نعم، أريد بالتأكيد
00:13:27الاحتفاظ بتتبع وثائق التخطيط في Git. سأوافق على ذلك أيضاً
00:13:31وأضغط على إرسال. حسناً. ثم طرح عليّ بعض الأسئلة الإضافية، مثل:
00:13:35هل تريد القيام بالبحث قبل التخطيط؟ قلت نعم لهذا أيضاً، والتحقق من أن الخطط
00:13:40ستحقق هدفك قبل التنفيذ. وقد وافقت على ذلك أيضاً. وبالنسبة للمدقق،
00:13:46أي التحقق من أن العمل يلبي المتطلبات بعد كل مرحلة، سأقول نعم
00:13:52لذلك أيضاً. وبالنسبة لتفضيل النموذج، سأختار النماذج الأكثر جودة.
00:13:58أي استخدام Opus للبحث وخارطة الطريق رغم تكلفتها العالية للتحليل الأعمق.
00:14:03ما حدث هنا هو أنه وضع كل تلك الإعدادات داخل ملف config.json.
00:14:07ويمكننا تعديل هذا الملف مستقبلاً لأي تغيير نريده. والآن،
00:14:12ودون إطالة الفيديو، سينتقل GSD إلى مرحلة البحث. وكما ترون،
00:14:16يقوم GSD بتشغيل مُركِّب البحث الذي سيبدأ أولاً بتشغيل عدة وكلاء فرعيين
00:14:21لإجراء البحث. وبمجرد اكتمال عملهم، سيقوم البرنامج
00:14:26بتجميع كل النتائج ومحاولة إنشاء تقرير بحثي خاص بنا
00:14:30بناءً على المشروع الذي نحاول تطويره. وبمجرد الموافقة على ذلك،
00:14:34ينتقل GSD لإنشاء خارطة طريق توضح بدقة ما سنقوم بفعله
00:14:39لهذا المشروع بالكامل خطوة بخطوة. حسناً، لقد قام الآن بإنشاء
00:14:43خارطة الطريق الكاملة المكونة من خمس مراحل، مع تحديد 36 متطلباً تغطي
00:14:49جميع متطلبات النسخة الأولى (V1). مثل قاعدة البيانات، والمخطط (schema)، والخلفية البرمجية،
00:14:54ثم تغطية تجربة المستخدم. ويسأل الآن: هل يبدو هيكل خارطة الطريق جيداً؟
00:14:59يمكنك مراجعته والتأكد من عدم وجود أي نقص. وإذا كان كل شيء على ما يرام،
00:15:03سأضغط على موافقة للبدء في إجراء التغييرات. حسناً، بمجرد تهيئة
00:15:08المشروع، سترى هنا ملفات المنتج الأدنى القابل للتطبيق التي تم إنشاؤها.
00:15:13كل ذلك داخل مجلد التخطيط، أليس كذلك؟ جميع المراحل الخمس والمتطلبات الـ 36 جاهزة للتنفيذ.
00:15:18الخطوة التالية، إذا كنا موافقين على ذلك، سنبدأ بالمرحلة الأولى،
00:15:21سنبدأ بها واحدة تلو الأخرى. وبمجرد إنشاء خطة للمرحلة الأولى،
00:15:25يمكنكم أن تروا هنا أننا أطلقنا عدة وكلاء فرعيين لإنشاء هذه الخطة للمرحلة الثانية،
00:15:29والثالثة، وكل ذلك في آن واحد. لذا يمكنكم الاستعانة بالوكلاء الفرعيين هنا للتوضيح،
00:15:34أو لإنشاء خطة لكل مرحلة لدينا. وبمجرد إنشاء المرحلة،
00:15:38ما يمكنك فعله الآن هو الانتقال مباشرة إلى التنفيذ. وكما ذكرنا سابقاً،
00:15:41نريد تشغيل هذا بالتتابع بسياق جديد، ولا أريده أن يتوقف عند
00:15:46إنهاء كل خطة ليطلب مني التحقق؛ بل أريده أن يكمل كل شيء بعد ذلك،
00:15:52ومن ثم يمكننا التحقق من كل شيء معاً. لا أريد التحقق عند كل مرحلة.
00:15:55بل أريد التحقق بعد اكتمال جميع المراحل. ما يمكنك فعله هنا هو إبلاغ
00:15:59نموذج Claude بذلك وتقول: حسناً، أريد تنفيذ مراحل GSD بالتتابع بسياق جديد.
00:16:03وهنا سيقوم تحديداً بتنفيذ كل مرحلة واحدة تلو الأخرى بسياق
00:16:08جلسة جديد لكل خطة. وبشكل أساسي، سترى أن ما سيحدث هو
00:16:13تشغيل وكلاء فرعيين جدد باستخدام منفذ GSD. وسيحصل كل وكيل هنا
00:16:18على سياق نظيف بحجم 200 ألف سياق، حتى لا يختلط الأمر مع الخطة السابقة التي أتمها الوكيل الآخر.
00:16:23وبعد ذلك، سيقوم بتنفيذ الـ 13 خطة بالكامل بشكل
00:16:27ذاتي باستخدام GSD. لدينا مخطط قاعدة البيانات، والخلفية البرمجية، وواجهة المستخدم، وإدارة الرصيد،
00:16:34وأيضاً عارض سجل التدقيق. سيتم تنفيذ كل شيء واحداً تلو الآخر.
00:16:39وهنا سأقوم بمسح السياق وتجاوز الأذونات وتنفيذها واحدة تلو الأخرى. حسناً،
00:16:44يمكنكم رؤية أنه سيبدأ بتنفيذ المرحلة الأولى للوحة تحكم المسؤول.
00:16:48دعونا ننتظر قليلاً حتى يكتمل التنفيذ بالكامل. حسناً، بعد تنفيذ جميع
00:16:53المراحل باستخدام GSD، إليكم كيف تبدو النتيجة. هنا، كما ترون،
00:16:57أنا في تبويب المسؤول، وهنا نحن في تبويب إدارة المستخدمين. حيث يمكننا عرض جميع المستخدمين
00:17:03الموجودين في منصاتنا الحالية. يمكنني أيضاً البحث عن مستخدم معين، فمثلاً لو كتبت
00:17:07"test"، سترون النتيجة الأولى تظهر هنا مباشرة. ولو قمت
00:17:12بحذف هذا، فستظهر القائمة كاملة مرة أخرى كما ترون. يمكنني أيضاً التصفية
00:17:17حسب الفئات. فمثلاً من هم الأشخاص الذين يستخدمون الفئات المجانية؟ يمكنني رؤية ذلك،
00:17:21ورؤية استخدام الرصيد، وتاريخ آخر تسجيل دخول، وأيضاً تعديل الرصيد.
00:17:25يمكنني عرض تفاصيل الحساب كما ترون هنا، أو يمكنني أيضاً
00:17:29تعديل الرصيد من هنا. يمكنني مساعدة المستخدمين في تعديل العمليات،
00:17:33وتحديد الرصيد، ووضع حدود مخصصة للرصيد، وكذلك
00:17:38الاستخدام الصحيح مع ذكر السبب. وفي سجل التدقيق، يمكننا تتبع ذلك.
00:17:42على سبيل المثال، لنختر جميع الفئات، وحالياً أنا مسجل دخول بهذا المستخدم
00:17:48هنا المعين كمسؤول. لنضغط هنا ونحاول تعديل الرصيد،
00:17:52لنفترض أنني سأزيد مبلغ الرصيد بمقدار 50 نقطة مثلاً.
00:17:57من الرصيد الحالي وهو 510 نقاط إلى 560 نقطة. وكل ما علينا فعله
00:18:03هنا في الأسفل هو إضافة السبب. سأكتب "test" مثلاً،
00:18:07وسأقوم بتطبيق التعديل. لاحظوا ما حدث، لقد ظهر
00:18:11إشعار يوضح أن الرصيد زاد من 510 إلى 560، كما تم تفعيل
00:18:17إعادة التحديث لهذا المكون. ويمكنكم رؤية ذلك منعكساً في الجدول أيضاً،
00:18:21من 510 إلى 560، وهو الرصيد الحالي لدينا. إذاً، يمكننا التأكد من أن هذه الميزة
00:18:27تعمل تماماً. يمكننا أيضاً الاطلاع على قسم تحليلات المسؤول، حيث نرى
00:18:31التحليلات لكل شيء في تطبيقاتنا. يمكنكم معرفة تاريخ آخر
00:18:36تحديث، وجميع الإحصائيات مثل إجمالي المستخدمين، والمستخدمين المشتركين،
00:18:40والفئات المختلفة، واستخدام الرصيد، وأكثر المستخدمين نشاطاً. كما يمكننا
00:18:46رؤية سجلات التدقيق، مما يعني أن جميع الأحداث والإجراءات التي اتخذناها
00:18:51لتعديل رصيد المستخدمين، يمكننا رؤيتها هنا مباشرة في
00:18:55سجل التدقيق. مثلاً: تعديل الرصيد، مزامنة الرصيد، ومن هم المستخدمون المستهدفون،
00:19:00وتفاصيل ما قمنا به. يمكننا رؤية كل ذلك في مسار سجل التدقيق. وبشكل عام،
00:19:05هكذا يمكنك استخدام GSD لاتباع مسار التطوير لإكمال
00:19:09ميزة معينة. إذا أعجبكم هذا الفيديو، يرجى الضغط على زر الإعجاب. وبالطبع،
00:19:13إذا كنتم تتساءلون كيف جعلت هذا المكون يعيد التحديث بعد تطبيق الرصيد
00:19:16دون الحاجة لتحديث الصفحة، فالإجابة المختصرة هي أنني استخدمت Zustand،
00:19:21وهي أداة لإدارة الحالة لتركيز حالة تطبيقنا بالكامل، بحيث أنه
00:19:26كلما تم تحديث جزء من المكون، يتم تفعيل التحديث أيضاً في حالته الحالية.
00:19:30لذا إذا كنتم مهتمين بكيفية إضافة إدارة الحالة هذه في تطبيقاتكم
00:19:34الحالية، فإنني أنصحكم بشدة بمشاهدة هذه الدورة التدريبية التي تستغرق سبع ساعات،
00:19:38والتي شرحت فيها كيفية بناء تطبيق NestJS متكامل وجاهز للإنتاج، وقابل للتوسع خطوة بخطوة.
00:19:44ختاماً، إذا استفدتم من هذا الفيديو، فلا تنسوا الإعجاب به.
00:19:47واشتركوا في القناة لأنني سأشارك مستقبلاً جميع الدروس والتقنيات التي
00:19:51يمكنكم استخدامها لبناء تطبيقات جاهزة للإنتاج باستخدام الذكاء الاصطناعي،
00:19:55بناء تطبيقات احترافية تماماً مثل هذا. شكراً لكم، وأراكم في الفيديو القادم.

Key Takeaway

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

Highlights

مقدمة عن إطار عمل GSD (Get Stuff Done) كأداة مفتوحة المصدر مصممة لتعزيز قدرات Claude Code في تطوير البرمجيات.

حل مشكلة "تشتت السياق" (Context Drift) من خلال توزيع المهام على وكلاء فرعيين (Sub-agents) بدلاً من العمل في نافذة سياق واحدة.

شرح آلية عمل المنسق في GSD الذي يدير عمليات البحث والتخطيط والتنفيذ والتحقق بشكل مستقل ومنظم.

خطوات تثبيت الإطار وإعداده محلياً مع خيارات تخصيص سطر الحالة لمراقبة استهلاك الرموز (tokens) وحالة المهام.

استخدام الذكاء الاصطناعي لرسم خريطة كاملة للكود المصدري (Code Mapping) لفهم المعمارية والتقنيات المستخدمة قبل البدء بالتعديل.

عرض عملي لبناء لوحة تحكم إدارية (Admin Dashboard) متكاملة تشمل إدارة المستخدمين وسجلات التدقيق باستخدام التنفيذ المتسلسل.

أهمية استخدام أدوات إدارة الحالة مثل Zustand لضمان تحديث واجهة المستخدم فورياً وتوفير تجربة مستخدم سلسة.

Timeline

مقدمة عن GSD ومشكلة تشتت السياق

يبدأ الفيديو بتعريف GSD كإطار عمل متطور يتجاوز الأساليب التقليدية مثل Beemap وSpecKits عبر اعتماد منهجية التطوير القائم على المواصفات. يشرح المحاضر بوضوح مشكلة تشتت السياق التي تحدث عند حشر التخطيط والبحث والتطوير في نافذة واحدة، مما يؤدي لضعف الدقة. يطرح GSD حلاً جذرياً يتمثل في تفويض المهام لوكلاء فرعيين يحصل كل منهم على سياق جديد ونظيف تماماً. تكمن أهمية هذه المرحلة في فهم كيف يحول GSD الأفكار الخام إلى تطبيقات جاهزة للإنتاج بشكل تدريجي وممنهج. يركز هذا القسم على أن استهلاك رموز أكثر يقابله الحصول على جودة برمجية أعلى بكثير.

التعريف بالمؤلف وعملية التثبيت الأولية

يقدم إريك نفسه كمهندس برمجيات سابق في شركات تقنية كبرى مثل Amazon وMicrosoft، مما يضفي مصداقية عالية على الشرح. ينتقل الفيديو إلى الجانب العملي عبر استعراض مستودع GSD وتوضيح أوامر التثبيت عبر واجهة الأوامر (terminal). يخير الإطار المستخدم بين Claude Code أو Open Code، مع نصيحة بتثبيته بشكل عام (Global) لسهولة الوصول إليه في كافة المشاريع. يتم تسليط الضوء على ميزة سطر الحالة (Status Bar) الذي يوفر معلومات حيوية عن استهلاك السياق والمهمة الحالية. يختتم هذا الجزء بعرض كيفية تخصيص واجهة المستخدم لتناسب تفضيلات المطور الشخصية.

رسم خريطة الكود وتهيئة المشروع

تتناول هذه المرحلة كيفية تهيئة مشروع جديد أو قائم باستخدام أوامر GSD المخصصة لتحليل بنية التطبيق. يقوم أربعة وكلاء فرعيين بالعمل بالتوازي لرسم خريطة شاملة للكود المصدري تشمل المعمارية والاتفاقيات البرمجية والتكاملات. يتم تخزين هذه البيانات في مجلد خاص يسمى (dot planning) لضمان عدم فقدان الحالة عند إعادة تشغيل الجلسات. يوضح الفيديو أهمية هذه الخطوة في بناء قاعدة معرفية للذكاء الاصطناعي تمكنه من فهم البيئة التقنية قبل اقتراح أي تغييرات. يضمن هذا النهج أن تكون الإضافات الجديدة متوافقة تماماً مع الكود الحالي دون إحداث تضاربات.

التخطيط الاستراتيجي وتحليل الثغرات

يركز هذا القسم على تحويل فكرة "لوحة تحكم الإدارة" إلى مواصفات تقنية دقيقة عبر حوار تفاعلي مع Claude. يطرح GSD أسئلة ذكية لتحديد أولويات الميزات، مثل قائمة المستخدمين والاعتمادات، ويستفسر عن طرق التحقق المفضلة كالاختبار اليدوي. تبرز قوة الإطار في تشغيل وكلاء بحث لاستكشاف الثغرات الأمنية والتقنية المحتملة في الخطة المقترحة قبل البدء بالتنفيذ. يتم استعراض جدول شامل يوضح مخاطر مثل نقص حماية الإدارة (Middleware) أو مشاكل في ملفات تعريف الارتباط. ينتهي القسم بإعداد ملف المشروع (Project MD) الذي يعتبر المرجع النهائي لجميع خطوات التطوير القادمة.

عرض منصة Testbrite وخيارات التنفيذ

يتوقف المحاضر لتقديم Testbrite كأداة مدعومة بالذكاء الاصطناعي متخصصة في أتمتة اختبارات البرمجيات وتحسين دقة تسليم الميزات. بعد ذلك، يعود لـ GSD لمناقشة أوضاع التشغيل المختلفة مثل وضع "YOLO" للموافقة التلقائية أو الوضع التفاعلي للتحكم الدقيق. يتم شرح الفرق بين التنفيذ المتوازي والمتسلسل، مع توصية قوية بالخيار المتسلسل لتجنب مشاكل نفاد رصيد الرموز وضمان استمرارية العمل. يختار المستخدم النماذج الأكثر جودة مثل Opus للبحث المعمق لضمان أفضل تحليل للمتطلبات الـ 36 المحددة. توضح هذه الفقرة كيف يتم ضبط إعدادات المشروع في ملف json لتخصيص تجربة التطوير بالكامل.

مرحلة التنفيذ الفعلي وبناء الميزات

ينتقل الفيديو إلى مرحلة العمل الجاد حيث يبدأ GSD في تنفيذ مراحل خارطة الطريق الخمسة واحدة تلو الأخرى. يتم تشغيل وكلاء فرعيين بسياق نظيف (200k tokens) لكل خطة لضمان عدم تداخل البيانات والحفاظ على دقة برمجية عالية. يشمل التنفيذ بناء مخطط قاعدة البيانات، وبرمجة الخلفية (Backend)، وتصميم واجهة المستخدم، وإضافة سجلات التدقيق. يراقب المطور العملية وهي تتم بشكل ذاتي بالكامل، مما يبرز كفاءة Claude Code عند دمجه مع إطار GSD. يشدد هذا الجزء على أن الفصل بين المهام هو السر الحقيقي وراء نجاح التطبيقات المعقدة المبنية بالذكاء الاصطناعي.

استعراض النتيجة النهائية والتحقق من الميزات

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

Community Posts

View all posts