يجب أن تستخدم superpowers!

نشرت منذ ثلاثة أيام عن superpowers و superpowers-ruby واكتشفت أنني لا أستغلها بالكامل وذلك خلال إنشاء صفحة لمبادرة الكتب المُيسّرة:
https://ieasybooks.com

بدأت التخطيط مع Claude Code من خلال إعطائه تفاصيل الهوية البصرية لمبادرة الكتب المُيسّرة (الألوان والشعار والخطوط وغيرها) وكل مستودعات مشاريع المبادرة.

تفاجأت بعد أن انتهى من "التفكير" أنه أنشأ خادمًا محليًّا على localhost:59100 وأضاف إلى الصفحة الرئيسية 3 اقتراحات لشكل الصفحة الرئيسية وطلب مني الاطلاع عليها والاختيار منها!

ظننت أنها ميزة جديدة من Claude Code، ولكن اكتشفت بعد ذلك أنها ميزة من superpowers موجودة في Skill اسمها brainstorming واسم هذه الميزة Visual Companion.

فتحت الصفحة ووجدت 3 اقتراحات بالفعل (ليس المنتج النهائي، إنما مجرد مسودَّات للتصميم)، فطلبت منه تغيير الفكرة واستخدام أسلوب آخر للتصميم، فأعطاني 3 اقتراحات أخرى على نفس الصفحة، ثم أكملنا العمل بنفس هذا الأسلوب، أنا أشرح وهو يُنشئ مجموعة من الاقتراحات، ثم نتفق على الشكل النهائي.

ببساطة، تُفعِّل هذه الميزة خادم Node.js محلي، ثم تُنشئ مجموعة من الاقتراحات (Mockups/Concepts)، ثم يعرضها الخادم في الصفحة الرئيسية ويسمح لك باختيار واحد من هذه الاقتراحات.

بعد الاختيار، يمكنك أن تُخبر Claude Code أنك اخترت المقترح المناسب، أو تطلب منه إنشاء مقترحات أخرى، وتستمر عملية التطوير.

الصورة المرفقة كانت لمجموعة من الاقتراحات لقسم الاحصائيات في موقع مبادرة الكتب المُيسّرة واخترت المقترح الثالث 😁

ميزة ممتازة لمشاهدة التصاميم قبل تنفيذها مع أدوات البرمجة بالذكاء الاصطناعي (Claude Code أو غيره) أنصح بتجربتها.

والسلام عليكم 👋🏻

لا يختلف Codex عن Claude Code كثيرًا..

بدأت منذ ثلاثة أسابيع في استخدام Codex باشتراك 20$ و Claude Code باشتراك 100$ في نفس الوقت للعمل على مهمات متشابهة وأحيانا للعمل على نفس المهمة.

والنتيجة التي توصلت إليها أن Codex ليس أقل من Claude Code وأن GPT 5.4 ليس أسوأ من Opus 4.6، بل أن Codex باشتراك 20$ يعطيك كمية Tokens أكثر بكثير من اشتراك 20$ في Claude Code وقد تكفيك لأسبوع كامل في حال الاستخدام المنضبط وعدم الإهدار.

يبدو أنني سأنتقل من Claude Code إلى Codex بالكامل قريبًا 😁

هل تعرف كم عمر اعتماديات مشروعك؟

وجدت من فترة مكتبة (أو فكرة) تُسمَّى libyear وهي تعمل كالتالي:

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

كلما ارتفع هذا الرقم (عمر الاعتماديات) زاد القلق نوعًا ما 🤓 وكلما نقص فهذا يعني أن مشروعك في "ريعان شبابه".

كنت أُحدِّث الاعتماديات في MilkStraw AI البارحة في Ruby و JS (حدَّثت Ruby نفسها إلى 4.0.2 🎉) وحسبت الـ libyear للغتين فوجدت أننا متأخرون 4.7 سنة في اعتماديات Ruby و 45.48 سنة في JS، رغم أنني حدَّثت الاعتماديات لآخر نسخة (واضح سبب كرهي لـ JS 😂).

سبب هذا الرقم الكبير في JS هو تأخر المطوِّرين في تحديث اعتماديات مكتباتهم نفسها.

فمثلًا، مكتبة tar موجودة في ملف yarn.lock وهي ليست اعتماديةً مباشرةً لمشروعنا، فأضافت 0.04 إلى مجموع الـ libyear الخاص بنا (كمية الاعتماديات غير المباشرة في JS مُرعبة 😂).

يمكنك التأكد من الـ libyear الخاص بمشروعك في أغلب اللغات المشهورة من خلال المكتبات الموجودة في هذا الرابط:
https://libyear.com

كما يمكنك إضافة الـ libyear كخطوة من خطوات الـ CI الخاص بمشروعك للمحافظة عليه تحت رقم معيَّن (100 سنة مثلًا).

حافظ على شباب مشروعك، والسلام عليكم 👋🏻

AI..

مغامرات فاشلة 🥲

يستغرق تشغيل كامل الـ CI في MilkStraw AI على حاسبي الشخصي (MacBook Pro - M3 Pro) 90 ثانية تقريبًا وهو يقوم بتسع مهام منفصلة، منها:
- التأكد من تنسيق الشيفرة البرمجية
- التأكد من عدم وجود أي مكتبات تحتاج إلى تحديث بسبب الثغرات الأمنية
- التأكد من صحة حالات الاختبار وتغطيتها لكامل الشيفرة البرمجية
وغيرها..

تستغرق مهمة حالات الاختبار أكثر من ثلث الوقت بقليل (35 ثانية تقريبًا)، فقررت محاولة تسريعها 🙂

منذ أيام، قرأت عن مكتبة TestProf وهي تهتم بتحديد مسببات البطء في حالات الاختبار ومعالجتها، فبدأت العمل مع Claude Code لتحسين وقت تنفيذ حالات اختبارنا (تذكر، هي 35 ثانية فقط في الأساس).

صرفت 4 أو 5 ساعات من وقتي في هذا الأمر، وفي النهاية توصَّلت لنتيجة واحدة: لا يمكن التحسين أكثر من ذلك.

وعندما راجعت نفسي وتفكَّرت قليلًا، وجدت أن 90 ثانية للـ CI بالكامل و 35 ثانية لحالات الاختبار لم تكن تحتاج إلى تحسين في الأساس، إذا أخذنا في الاعتبار أن مراجعة BugBot مثلا تستغرق 7 إلى 10 دقائق!

يوجد لدينا 2300 اختبار تقريبًا، تحتوي على أكثر من 6450 توكيد (Assertion)؛ لذا فإن انتهائها في 35 ثانية كان أمرًا ممتازًا في الأساس.

لذلك عزيزي القارئ، لا تكن مثل علي، ولا تحاول تحسين ما هو حسن بالفعل، واهتم بالأمور الأكثر إفادة لك ولجهة عملك، وفكِّر مليًّا قبل أن تستهويك المكتبات الجديدة 😁

والسلام عليكم 👋🏻

ولهذا السبب أوقفنا مراجعات Claude في MilkStraw AI 😂

حاول بناء الحلول المناسبة لمشكلتك.

نستخدم في MilkStraw AI مكتبة GoodJob لمعالجة البيانات وتنفيذ المهام في الخلفية (كمثال، إرسال رسائل البريد الإلكتروني).

المكتبة ممتازة وتعمل بكفاءة ولكن ينقصها شيء واحد: إمكانية إنشاء Workflows متكاملة تعتمد على Directed Acyclic Graph (DAG).

بحثنا سريعًا عن حل لتنظيم سير هذه المهام، فلم نجد ما يناسب بيئة عملنا التي تشترط:
- الاعتماد على قاعدة بيانات PostgreSQL فقط.
- عدم الاعتماد على Redis.

فكان الحل في إنشاء مكتبة جديدة لإنجاز هذا الأمر وسميتها GoodPipeline 😂

خلال التطوير، لاحظت وجود بطء في مكتبة GoodJob وهذا يجعل إنشاء Workflows فيها الكثير من المهام المبدئية أو الجذرية (المهام التي يبدأ منها الـ Workflow) بطيئًا نسبيًّا.

ففتحت مستودع مكتبة GoodJob وشغَّلت Claude Code وبدأنا العمل لتحسين هذا البطء 🤓 وكانت النتيجة في هذا التعديل

قلّص هذا التعديل مدة إنشاء الـ Workflows من 3 دقائق ونصف تقريبًا إلى أقل من دقيقة! التعديل متاح الآن ومفيد لجميع مستخدمي المكتبة.

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

وأخيرًا، تذكر دائمًا الإفصاح عند استخدام أدوات الذكاء الاصطناعي في مساهماتك البرمجية 🙂

والسلام عليكم 👋🏻

يُعالج نموذج Gemini اللغة العربية بطريقة غريبة!

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

أكتب له عادةً:
Review this LinkedIn post for Arabic writing and grammar issues:
{content}

لكنني بدأت ألاحظ ملاحظاتٍ غريبة، مثل: كتبتَ "تُسمَّي" ويجب أن تكتب "تُسمَّى"، وعندما أعود لما كتبت، أجد أنني استخدمتُ الألف المقصورة "ى" بالفعل ولم أستخدم الياء "ي"!

أو ملاحظات من نوع: كتبتَ الكلمة (س) بهمزة قطع ويجب أن تكتبها بهمزة وصل، فأعود للكلمة فأجدها مكتوبةً بهمزة وصلٍ أساسًا!

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

يمكنكم مراجعة المحادثة بيني وبين Gemini عبر هذا الرابط:
https://gemini.google.com/share/71e4b417afd8

هل لاحظتم شيئًا شبيهًا؟

من أكثر الأشياء التي ساعدتني في البرمجة باستخدام Claude Code أو Codex أو غيرهما، هي مراجعة النتيجة النهائية بواسطة أكثر من Sub-agent ومعالجة الأخطاء إن وُجدت.

على سبيل المثال: بعد الانتهاء من العمل على ميزة جديدة، وقبل دمج التعديلات وطلب المراجعة البشرية، أطلب من Claude Code التالي:

Use 3 sub-agents and review the changes with fresh eyes.

من ميزات هذه الطريقة:
• استهلاك أقل للـ Tokens: لأن الـ Sub-agents تستخدم نماذج أصغر غالباً (مثل Haiku أو Sonnet).
• التصويت: فإذا اتفق أكثر من Sub-agent على نفس المشكلة، فهذا يعطيك ثقة أكبر بوجود خطأ حقيقي.
• الحيادية: مراجعة بدون سياق مسبق، مما يقلل من احتمالية "التحيز" للنتائج السابقة.

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

والسلام عليكم 👋🏻

لا تثق في تقييمات النماذج يا صديقي 🙂

https://www.youtube.com/watch?v=Oq5e_8zvick

إذا كنت من مستخدمي مكتبة GoodJob، أنصحك باستخدام المكتبة من GitHub مباشرة (main branch) قبل صدور الإصدار القادم لأن الـ Dashboard الخاصة بالمكتبة أصبحت أسرع مئات (أو آلاف) المرات بعد آخر 3 تعديلات أجريتها عليها 🤓 🎉

لا تنسى تعديل قاعدة بياناتك من خلال تشغيل bin/rails g good_job:update لتستفيد من كل التحسينات 🚀

سأنشر مقالًا خلال الأيام القادمة أشرح فيه التعديلات وما أجرته من تحسينات على سرعة الـ Dashboard الخاصة بالمكتبة بإذن الله.

نمط جديد في Claude Code لحمايتك من --dangerously-skip-permissions 😂

نصيحة: لا تُضيِّع وقتك في إعداد بيئة العمل!

كنت أحتاج إلى إعداد بيئة الـ Terminal من جديد: oh-my-zsh وإضافاته و Starship و zoxide و fzf وغيرها... ولم أكن أرغب في إضاعة ساعات في قراءة الوثائق وتعديل ملفات الإعدادات 😅

لذلك طلبتُ من Claude Code أن يتولى الأمر نيابةً عني، وبعد دقائق حصلت على:
- واجهة Starship تعرض معلومات Git و Ruby و Node
- اقتراحات تلقائية أثناء الكتابة
- بحث سريع ومرن في سجل الأوامر
- أمر ls مع الأيقونات وحالة Git
- أمر cat مع تلوين الشيفرة البرمجية
- أمر z ذكي يتعلَّم المجلدات التي أستخدمها كثيرًا

وكل ذلك:
- دون أن ألمس ملف إعدادات واحدًا بنفسي
- ودون أن أقرأ أي وثائق
- ودون أن أضيع وقتي في التجربة والخطأ 🚀

هذا في نظري هو المعنى الحقيقي لـ "Vibe Coding"؛ فالأمر لا يقتصر على كتابة الشيفرة البرمجية بمساعدة الذكاء الاصطناعي، بل يشمل أيضًا التخلُّص من كل المهام المملة والمتكررة في الإعداد والتجهيز، والتفرُّغ لما هو أهم.

وطبعًا، هذه النصيحة ليست موجَّهة لمن يستمتع أصلًا بقضاء الساعات في تخصيص النظام وضبط كل تفصيلة فيه 😄

والسلام عليكم 👋🏻

أدوات مثل Claude Code قادرة على كتابة اختبارات لا تختبر شيئًا!

منذ أسبوعين، كنت أراجع اختبارات كتبها Claude Code في مشروع جديد أعمل عليه.

الاختبارات تعمل والشيفرة البرمجية "مُغطاة" بالكامل، كل شيء يبدو ممتازًا... حتى لاحظتُ أن 14 اختبارًا يحتوي كل منها على سطر واحد فقط:
assert_response :success

هذا الاختبار ينجح طالما أن المتحكم (Controller) أعاد استجابة 200. بمعنى آخر: لو حذفتُ ملف العرض (View) بالكامل، سينجح الاختبار دون أي مشكلة 🙂

هذه الاختبارات:
- لم تُثبت أن الـ View أظهر أي محتوى
- لم تُثبت أن الواجهة تتعامل بالشكل الصحيح عند غياب البيانات
- لم تُثبت أن تبديل اللغة قد غيّر وسم html[lang]
لم تُثبت أي شيء!

"الذكاء" لم يكذب؛ فقد أنجز المطلوب حرفيًّا ("اكتب اختبارات لهذه الصفحة")، وتأكَّدَ أن نسبة التغطية (Code Coverage) ممتازة.

النصيحة:
- اطلب من هذه الأدوات اختبار سلوك البرنامج بشكل صريح (Behavioral Testing)
- راجع المكتوب.. ثم راجع المكتوب.. ثم راجع المكتوب!
- حاول استخدام تقنيات مثل Mutation Testing لكشف الاختبارات الضعيفة

هل وقعتم في فخٍّ مشابه من قبل؟

والسلام عليكم 👋🏻

مقالة لطيفة موجودة في متصفحي من أشهر، قرأتها قبل قليل:
https://www.planetearthandbeyond.co/p/amazon-just-proved-ai-isnt-the-answer

معظم أدوات الذكاء الاصطناعي لا تستطيع قراءة موقعك!

إذا كان موقعك مبنيًا بتقنيات تستخدم Client-Side Rendering (مثل React أو Vue بدون SSR)، فأدوات الذكاء الاصطناعي مثل ChatGPT و Claude وغيرها ترى موقعك فارغًا تمامًا! 🙂

السبب بسيط: هذه الأدوات لا تُشغِّل JavaScript، وإنما تكتفي بجلب الـ HTML الأوَّلي للصفحة فقط.

في تطبيقات الصفحة الواحدة (SPA)، هذا الـ HTML ليس إلا:
<div id="root"></div>
<script src="/bundle.js"></script>
(أو شيئًا شبيهًا)

لا محتوى ولا عناوين ولا نصوص ولا حتى Meta Tags!

قرأتُ مقالًا حلَّل أكثر من 500 مليون طلب من GPTBot ولم بجد أي دليل على تشغيل JavaScript، ولا مرة واحدة.

المفارقة الجميلة:
- تطبيق Rails بسيط عمره 15 سنة؟ يعمل مع الـ Agents بشكل ممتاز 🚀
- تطبيق Django مع Templates؟ يعمل بدون أي تعديل
- Laravel مع Blade؟ يعمل كذلك
- SPA حديث مبني بأحدث إصدارات React بدون SSR؟ غير مرئي للذكاء الاصطناعي تمامًا!

قضينا سنوات في تعقيد الواجهات، وفصل التطبيق إلى طبقتين (Frontend/Backend)، وإضافة طبقات من Bundlers و Hydration و State Management لنكتشف أن الحلول "المملة" للـ Server-Side Rendering هي الأنسب لعصر الـ Agents 😄

لستُ ضد تطبيقات الصفحة الواحدة، فلها استخداماتها الصحيحة (لوحات التحكم والتطبيقات التفاعلية بشكل كبير وغيرها)، لكن لمواقع المحتوى والتوثيق والمنتجات والتسويق؟ كل يوم يمر يجعل SSR خيارًا أفضل.

الحلول إن كان موقعك يعاني من هذه المشكلة (من الأسوأ إلى الأفضل):
- انتقل إلى Next.js أو Nuxt أو SvelteKit مع SSR
- استخدم Static Site Generation إذا كان المحتوى ثابتًا
- أو عُد إلى Rails أو Django 🙂

والسلام عليكم 👋🏻

عانيت اليوم مع مساحة التخزين في حاسبي الـ Mac، فوجدت هذه الأداة:
https://github.com/tw93/Mole

وفَّرَت لي 100 جيجا تقريبًا 🎉