خان المُبرمجين (علي فاضل)
535 subscribers
91 photos
9 videos
115 links
قناة أنشر فيها ما أتعلمه خلال عملي على مشاريعي الخاصة 👀
Download Telegram
ليس من الضروري أن تكون المساهمة شيفرة برمجية!

كنا نواجه مشكلة في موقع "الجامع" وهي تصنيف مواقع الفحص له على أنه موقع مشبوه ويحتوي على برمجيات ضارة، وأنشأت هذه المهمة لحل هذه المشكلة بعد الإطلاق:
https://github.com/ieasybooks/aljam3-web-app/issues/61

فساهم كل من سامح عمّار وأحمد نضال لحل المشكلة من خلال مراسلة المواقع المعنية كـ BitDefender و DrWeb وتوضيح المشكلة والحمدلله أزالت هذه المواقع الجامع من قاعدة بياناتها 🥳

تأثير هذا كان واضحا، فعلى سبيل المثال، لم أكن أستطيع تصفح الجامع من حاسوب الشركة بسبب وجوده في قواعد بيانات هذه المواقع، ولكن بعد حل المشكلة أصبح يفتح على حاسوب الشركة بدون مشاكل 🚀

يوجد الكثير من المهمات التي يمكنك المساعدة في تنفيذها على الجامع (بدون كتابة شيفرة برمجية واحدة)، اطلع عليها من هنا:
https://github.com/ieasybooks/aljam3-web-app/issues

كُن مساهما ولا تكن من المتفرجين 🤩
7
خلال القراءة في كتاب لغة Rust الرسمي وجدت قسمًا غريبا: "كلمات محجوزة للاستخدام المستقبلي"

كلنا يعرف الكلمات المحجوزة مثل كلمة def في Ruby و Python وكلمة class الموجودة في أغلب اللغات، ولكن هذه أول مرة أجد لغة برمجة تحجز بعض الكلمات دون أن تستخدمها تحسبًا للتطورات المستقبلية!

هذه قائمة بالكلمات المحجوزة غير المستخدمة:
abstract
become
box
do
final
gen
macro
override
priv
try
typeof
unsized
virtual
yield

المصدر:
https://rust-book.cs.brown.edu/appendix-01-keywords.html#keywords-reserved-for-future-use
2🤔1🌚1
تشعر بأن الكاتب يتحدّث عن لغة كلنا نعرفها 😂
😁71
سؤال آخر الليل:

إذا ضمّنت مقطعا من YouTube في موقعك، هل يمكنك منع الإعلانات عن المقطع كما تفعل إضافات المتصفح 🤔
3
للمهتمين بالترجمة، لدينا قائمة تتكون من 105 تصنيف من تصنيفات الكتب في موقع "الجامع"، تجدها هنا:
https://github.com/ieasybooks/aljam3-web-app/issues/92

نُحاول ترجمة هذه التصنيفات إلى اللغة الإنجليزية لتحسين واجهة اللغة الإنجليزية للناطقين بغير العربية.

إن كنت لا تعرف ما هو موقع الجامع؟ تعرّف عليه من هذا المقطع:
https://www.youtube.com/watch?v=JvFmqlbbg84

وجرّبه من خلال هذا الرابط:
https://aljam3.com

كُن مساهما ولا تكن من المتفرجين 🤩
3
من أيام بدأت في استخدام Claude Code لإنشاء تطبيق على أجهزة iOS و Android.

التطبيق يعتمد على Hotwire Native، فهو لا يتعامل مع APIs لإحضار البيانات من الـ Backend، ولا يوجد به الكثير من التعقيدات مقارنة بالتطبيقات التقليدية، ولكنه يحتوي على بعض الميزات الـ Native المكتوبة إما بـ Swift أو Kotlin.

في جانب iOS كان Claude Code سريعا في تطبيق المطلوب دون الحاجة لشرح كثير من التفاصيل، ولكن في المقابل عانيت معه في جانب Android، حتى أنني قررت تجربة Gemini CLI بدلا من Claude Code، ولكنه (Gemini CLI) كان أفشل منه (Claude Code).

في هذه اللحظة قررت العودة إلى Claude Code وشرح التفاصيل بدقة، فطلبت منه بداية أن يستكشف المشروع، ثم سألته: "هل لاحظت وجود الميزة الفلانية؟"، فأجاب بنعم مع بعض التفاصيل، فطلبت منه تعديل هذه الميزة تحديدا، ثم بدأت بطلب أمور بسيطة ومحددة خطوة بخطوة توصلني إلى الهدف المطلوب.

كانت النتيجة مبهرة، ما كان يُعاني في تنفيذه خلال ساعات أنجزه في أقل من نصف ساعة بعد تغيير أسلوب التعامل وطريقة طلب تنفيذ المهمات.

الدرس المستفاد بالنسبة لي أن النماذج تختلف مدى جودة تعاملها مع التقنيات المختلفة، فإن كان النموذج يتعامل مع iOS بسرعة وسلاسة، فإنه يحتاج إلى الدقة والتبسيط عند التعامل مع Android.

والسلام عليكم 👋🏻
3👍3🔥3
اضطررت لتغيير لغة جهازي الشخصي من العربية إلى الإنجليزية لأن Android Studio لا يعمل بشكل جيد إذا كانت لغة الجهاز عربية 🥲

معلومة تعلمتها بالطريقة الصعبة...
6😁1
📢 مبادرة "رِباط التقنية" تعاون بين القنوات التقنية العربية 🔗

حرصًا على دعم المحتوى العربي في مجالات التقنية، نعلن عن تعاون مشترك بين مجموعة من القنوات العربية التقنية على تيليغرام، بهدف تبادل المعرفة، ونشر الفائدة، وتعزيز وصول المحتوى الجاد والمفيد لكل المهتمين بالتقنية.

وقد جُمعت هذه القنوات في قائمة واحدة، تيسيرًا للمتابعة ودعمًا للجهود المستقلّة في نشر العلم والمعرفة:

📄 رابط قائمة القنوات المشاركة:
https://t.me/addlist/Gg-LFze5N89mMTJk

نؤمن أن التعاون خير سبيل للرقيّ، وأنّ دعمكم هو أساس استمرار هذه المبادرات.
تابع، وانشر، وكن جزءًا من هذا الحراك التقني العربي.

🔹للانضمام إلى المبادرة، يُرجى التواصل:
👉 @alzaanad

#رباط_التقنية
#قنوات_تقنية_عربي
8
ودخلت الخيل الأزهر - محمد جلال كشك - صفحة 93

https://aljam3.com/ar/13909/33244/93
3
لمن يبحث عن مستقلِّين لتنفيذ المشاريع في كافة المجالات، هذا الموقع يربطك بمستقلين من غزة:

https://taqat-gaza.com/ar
11
مساهمة جديدة على "الجامع" 🚀

كما تعلم (أو ستعلم بعد كلمات قليلة) أن الجامع بُنِيَ باستخدام Ruby on Rails، والتي تأتي بصفحات أخطاء "بسيطة" إلى حد ما (موضّحة في الصورة الأولى)، ولكن أردنا إنشاء صفحات أخطاء جديدة بتصميم أفضل لتحسين تجربة المستخدم عند مواجهة أي خطأ (ونتمنى ألّا يواجه أحدٌ أي خطأ).

لذا أنشأت هذه المهمة:
https://github.com/ieasybooks/aljam3-web-app/issues/45

وظلّت مفتوحةً نحو شهرٍ، حتى جاء صاحب هذا الحساب على GitHub (منشنوه لو تعرفوه 🥲):
https://github.com/0xSm0ky

وقدّم طلب تعديل على المشروع:
https://github.com/ieasybooks/aljam3-web-app/pull/85

صمَّم صفحات جديدة باستخدام HTML و TailwindCSS دون الحاجة للتعامل مع Ruby أو Ruby on Rails!

قبِلتُ التعديل، ثم أضفت عليه تحسينات بسيطة لنقل الصفحات من مجرد ملفات HTML في مجلد public إلى داخل التطبيق نفسه لنستفيد من الترجمة التلقائية للصفحات والتصميم العام للموقع:
https://github.com/ieasybooks/aljam3-web-app/pull/91

وهنا أُعيد التأكيد، لا يجب أن تكون المساهمة في Ruby on Rails، فقط اقرأ المهمات المطلوبة وستجد ما يمكنك المساهمة فيه بإذن الله 😎
6👍2
مساهمة جديدة على "الجامع"، ولكن بأسلوب مختلف 🚀

بدأ الأخ مصطفى مرزوق في المساهمة على موقع الجامع من خلال شيء بسيط للغاية: التبليغ عن الأخطاء واقتراح التحسينات من خلال إنشاء مهمات على مستودع المشروع في GitHub!

فتح الأخ 9 مهمات منها:
- https://github.com/ieasybooks/aljam3-web-app/issues/106
- https://github.com/ieasybooks/aljam3-web-app/issues/108
- https://github.com/ieasybooks/aljam3-web-app/issues/110

ما دفعني للعمل على حل المشاكل وإضافة التحسينات المقترحة، رغم معرفتي المسبقة ببعضها ولكن لم أعطها الأولوية الكافية 😁 (الكسل)

بعد إنشاءه لكل هذه المهمات وفهمه للمشروع بشكل أفضل، ساهم في تنفيذ مهمة منها:
https://github.com/ieasybooks/aljam3-web-app/issues/110

من خلال هذا التعديل:
https://github.com/ieasybooks/aljam3-web-app/pull/119

فجزاه الله خيرا

وهذا يثبت ما أكرره، أنك تستطيع المساهمة ولو بالقليل، وبمرور الوقت يُصبح هذا القليل كثيرا بإذن الله، وما السيل إلا اجتماع النقط 😎
7
خان المُبرمجين (علي فاضل)
Photo
خلال العمل على تطبيقات الهاتف لموقع "الجامع"، اكتشفت أن النسخة الرابعة من TailwindCSS تحتاج إلى إصدارات مُعيّنة من المتصفحات حسب موقعهم الرسمي:
- Chrome 111 (أُصدر في 03/2023)
- Safari 16.4 (أُصدر في 03/2023)
- Firefox 128 (أُصدر في 07/2024)

مما يعني أن الموقع لن يعمل بكفاءة على المتصفحات القديمة!

تذكرت حينها ميزة جديدة أُضيفت إلى إطار عمل Ruby on Rails في نسخته 7.2 وهي ميزة allow_browsers.

تسمح لك هذه الميزة بتحديد أقل إصدارات المتصفحات التي يدعمها موقعك بإضافة سطر واحد في المتحكّم الرئيسي للموقع كما هو موضّح في الصورة الأولى.

في حال استخدام المستخدم لمتصفح بإصدار أقدم من الإصدارات المحددة، ستظهر له صفحة تخبره بأن متصفحه قديم ويحتاج إلى التحديث كما هو موضّح في الصورة الثانية.

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

إذا أردت القراءة أكثر عن هذه الميزة في Ruby on Rails يمكنك الاطلاع على هذه الروابط:
- https://edgeapi.rubyonrails.org/classes/ActionController/AllowBrowser/ClassMethods.html
- https://blog.saeloun.com/2024/03/18/rails-7-2-adds-allow-browser-to-set-minimum-versions

والسلام عليكم 👋🏻
4
نُعلن اليوم عن تطبيق الجامع للهاتف المحمول 🚀

يمكنك تحميل التطبيق لأنظمة Android و iOS من خلال الروابط التالية:
- Google Play
- App Gallery
- App Store

حمّل التطبيق وشاركنا تجربتك لنعمل على تحسينه 😎✌🏻

رابط موقع الجامع:
https://aljam3.com

شارك مع أصدقائك لتعم الفائدة 🤩
10🔥1👨‍💻1
خان المُبرمجين (علي فاضل)
Photo
كيف صنعنا تطبيقات الهاتف لموقع الجامع؟
https://aljam3.com

كما تعلم عزيزي القارئ (أو ستعلم بعد كلمات قليلة) أن موقع الجامع بُنِيَ باستخدام Ruby on Rails، وهو إطار عمل لإنشاء المواقع وليس تطبيقات الهاتف، كالأُطُر الأخرى مثل Django و Laravel (ولكنه أفضل 😂 -أمزح فلا تنزعج 😁-).

سنة 2020 ظهرت لأول مرة فكرة Turbo Native (ثم أُعيد تسميتها إلى Hotwire Native)، وهي طريقة لبناء تطبيقات الهاتف بناء على موقعك المبني باستخدام Ruby on Rails، ثم انتشرت الفكرة إلى أُطُر عمل أخرى كـ Django (إذا لم يخب ظني).

الفكرة ببساطة تعتمد على استخدام Ruby on Rails -في نسخته السابعة ثم الثامنة- إطار عمل Hotwire وهو إطار عمل لواجهات المستخدم يعتمد على ثلاثة أجزاء:

- مكتبة Turbo لإدارة التحديثات الجزئية للصفحات من الخادم والتنقل بين الصفحات بتجربة مستخدم تشبه تجربة تطبيقات الصفحة الواحدة (SPA).
- مكتبة Stimulus لإدارة التفاعل في الصفحة كفتح القوائم وإنشاء المكوّنات التفاعلية وغيرها (نُسخة قليلة الدسم من أُطُر عمل واجهة المستخدم المُعقّدة).
- مكتبات Native، موضوع هذا المنشور.

من خلال مكتبات Native لأنظمة Android و iOS يمكنك بناء تطبيق للهاتف وعرض صفحات موقعك من الخادم مباشرة على WebView، ومكتبات Native تُسهّل عملية التواصل بين الـ WebView وجزء الـ Native من التطبيق.

فمثلا، يمكنك التحكّم في شكل عرض الصفحة داخل التطبيق من خلال استخدام دالة hotwire_native_app? عند بناء الصفحة على الخادم، من خلالها يمكنك إخفاء وعرض وتعديل التصميم ليتماشى مع متطلبات تطبيقات الهاتف.

أيضًا، تستطيع بناء مميزات تستخدم الـ Native APIs للهاتف كميزة تحميل الملفات وأزرار المشاركة ووصولا إلى بناء صفحات كاملة من خلال الـ Native Code والتنقّل بينها وبين الـ WebView بسهولة.

مثلا في الجامع لدينا 66 استخداما للدوال التالية:
- hotwire_native_app?
- android_native_app?
- ios_native_app?

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

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

ويبقى السؤال، هل التطبيقات في أفضل حالاتها؟ الجواب ببساطة: "لا"، لأنني لا أمتلك أي خبرة تقريبا في بناء تطبيقات الهاتف، فكنت أستخدم التقنية بشكل بدائي وبمساعدة Claude Code، ولكن لمن يمتلكون الخبرة، فالأمر سيكون مختلفًا بكل تأكيد.

ختامًا، إذا أردت المساعدة وكنت من إخواننا المصممين، فنريد تحسين صور التطبيق على المتاجر فهي مجرد Screenshots حاليا 😁

يمكنك إلقاء نظرة عليها من هنا:
- https://play.google.com/store/apps/details?id=com.ieasybooks.aljam3
- https://apps.apple.com/jo/app/%D8%A7%D9%84%D8%AC%D8%A7%D9%85%D8%B9-%D9%85%D9%83%D8%AA%D8%A8%D8%A9/id6749810366

والسلام عليكم 👋🏻
9
بدأت مخرجات مؤتمر RailsWorld 2025 تطل علينا مع إطلاق Lexxy، محرر النصوص الجديد لإطار عمل Ruby on Rails بديل المحرر القديم Trix:

https://dev.37signals.com/announcing-lexxy-a-new-rich-text-editor-for-rails

القادم أجمل 😍
2