خان المُبرمجين (علي فاضل)
737 subscribers
178 photos
18 videos
1 file
173 links
قناة أنشر فيها ما أتعلمه خلال عملي على مشاريعي الخاصة 👀
Download Telegram
خان المُبرمجين (علي فاضل)
Photo
مغامرات فاشلة 🥲

يستغرق تشغيل كامل الـ 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 ثانية كان أمرًا ممتازًا في الأساس.

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

والسلام عليكم 👋🏻
8
This media is not supported in your browser
VIEW IN TELEGRAM
ولهذا السبب أوقفنا مراجعات Claude في MilkStraw AI 😂
🤣41
خان المُبرمجين (علي فاضل)
Photo
حاول بناء الحلول المناسبة لمشكلتك.

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

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

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

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

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

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

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

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

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

والسلام عليكم 👋🏻
👏124🔥1
يُعالج نموذج Gemini اللغة العربية بطريقة غريبة!

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

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

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

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

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

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

هل لاحظتم شيئًا شبيهًا؟
3👍1
من أكثر الأشياء التي ساعدتني في البرمجة باستخدام 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 على نفس المشكلة، فهذا يعطيك ثقة أكبر بوجود خطأ حقيقي.
• الحيادية: مراجعة بدون سياق مسبق، مما يقلل من احتمالية "التحيز" للنتائج السابقة.

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

والسلام عليكم 👋🏻
111👍1
لا تثق في تقييمات النماذج يا صديقي 🙂

https://www.youtube.com/watch?v=Oq5e_8zvick
إذا كنت من مستخدمي مكتبة GoodJob، أنصحك باستخدام المكتبة من GitHub مباشرة (main branch) قبل صدور الإصدار القادم لأن الـ Dashboard الخاصة بالمكتبة أصبحت أسرع مئات (أو آلاف) المرات بعد آخر 3 تعديلات أجريتها عليها 🤓 🎉

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

سأنشر مقالًا خلال الأيام القادمة أشرح فيه التعديلات وما أجرته من تحسينات على سرعة الـ Dashboard الخاصة بالمكتبة بإذن الله.
🔥31
نمط جديد في Claude Code لحمايتك من --dangerously-skip-permissions 😂
1
نصيحة: لا تُضيِّع وقتك في إعداد بيئة العمل!

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

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

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

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

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

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

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

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

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

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

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

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

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

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

إذا كان موقعك مبنيًا بتقنيات تستخدم 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 🙂

والسلام عليكم 👋🏻
3
مقال ممتع من PlanetScale عن أنواع الـ Multi-tenancy يُفضِّل استخدام قاعدة بيانات واحدة و Schema واحدة مع عمود tenant_id (أو user_id أو غيره) بدلًا من استخدام Schema لكل Tenant أو قاعدة بيانات منفصلة بالكامل لكل Tenant

https://planetscale.com/blog/approaches-to-tenancy-in-postgres
3
كنت أُخطط لإضافة ميزة جديدة إلى MilkStraw AI مع Claude Code ونموذج Opus 4.7

بعد الحديث لأكثر من ساعة، كتب الأخ خطةً من ألف سطر، وخلال مراجعتي وجدت أنه يستقبل في الـ API مصفوفة (Array) من خلال الـ Query Params كما في المثال الأول في الصورة

استقبال مصفوفة بهذا الشكل في الـ Query Params غير صحيح في Ruby on Rails، لأن Rails ستأخذ القيمة الأخيرة فقط في عين الاعتبار وتُسقط باقي القيَم

الطريقة الصحيحة مُوَضَّحة في المثال الثاني والذي يستخدم أقواسًا مربعةً `[]`مع اسم الـ Query Param، وبهذه الطريقة Rails تفهم أنها تتعامل مع مصفوفة

كُن حذرًا عند التخطيط، حتى مع النموذج "الأقوى" في العالم 🤓

وكالعادة، أتقن التقنيات التي تستخدمها
4👍2
Media is too big
VIEW IN TELEGRAM
خدعوك فقالوا: المكتبات وأُطر العمل مثل React و Vue وغيرها هي السبيل الوحيد 😪

هذا الفيديو يعرض مُكوِّنًا (Component) في أحد المشاريع التي أعمل عليها حاليًّا.

- يدعم كل ميزات الـ Sonner الشهير في React
- يدعم إرسال التنبيهات من الخادم مباشرة أو من المتصفح
- يدعم البقاء في الصفحة حتى عند تنقل المستخدم بين صفحات الموقع (رغم انه Server-side rendered)

كل ذلك وأكثر في أقل من 350 سطرًا من JS بدون أي اعتماديات 🙂

لا أجد أي سبب لاستخدام هذه المكتبات والأُطر في الكثير من المشاريع إلا في حالات استثنائية جدًّا..

تعقيد تطوير المواقع وفصل الـ Frontend عن الـ Backend ما هو إلا "أكذوبة" سوَّقتها بعض الشركات العملاقة ويدفع ثمنها المطورون الأفراد والشركات الصغيرة والمتوسطة.
👎5🤔31🌚1
جمعتكم مباركة

الزميل Matz - مُنشِئ لغة Ruby - بدأ مشروعًا جديدًا باسم Spinel لإنشاء ملفات تنفيذية أصيلة ومستقلة (Standalone Native Executables) للغة Ruby 🚀

https://github.com/matz/spinel

ذكر Matz في أكثر من لقاء - حسب ما أذكر - أنه لن يقبل بشيئين في اللغة:
- Typing
- Compilation

يبدو أنه تنازل عن الثانية، ويبدو كذلك أنه يستخدم Claude Code 😂
🤣31
خان المُبرمجين (علي فاضل)
Photo
استخرجت القواعد من الكتب بدلًا من تلخيصها!

منذ فترة، بدأت قراءة كتاب Polished Ruby Programming، والكتاب ممتع جدًّا.
كنت أقول في نفسي عند نهاية كل قسم أو فصل: "يوجد الكثير من القواعد المفيدة لاستخراجها!"

دائمًا ما أتذكر القواعد الموجودة في نهاية كتاب Clean Code من Uncle Bob - عليه من الله ما يستحق - وبغض النظر عن اتفاقك أو اختلافك مع الأفكار الموجودة في الكتاب، ففكرة وجود قواعد ثابتة وواضحة في نهايته ممتازة ومفيدة جدًّا.

قررت تجربة استخدام Claude Code في استخراج قواعد مشابهة لقواعد Clean Code ولكن من كتاب Polished Ruby Programming، وكانت النتيجة مبهرة!

حجم الكتاب 400 صفحة تقريبًا، وهو متوفر لدي بصيغة PDF و ePub، فطرحت الفكرة على Claude Code وبدأنا التخطيط لاستخراج قواعد واضحة ومدعومة بمراجع من الكتاب نفسه.

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

لذا قررت إنشاء Skill (ملف Markdown 😁) تُعيد تنفيذ نفس العملية على أي كتاب أقرأه، وجرَّبتها مع Codex على كتاب قرأته سابقًا اسمه The Complete Guide to Rails Performance وكانت النتيجة شبيهة بسابقتها.

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

نشرت القواعد المُستخرجة وهذه الـ Skill في مستودع على GitHub سمَّيته ruby-rules.

والسلام عليكم 👋🏻
9👏4