خان المُبرمجين (علي فاضل)
538 subscribers
91 photos
9 videos
115 links
قناة أنشر فيها ما أتعلمه خلال عملي على مشاريعي الخاصة 👀
Download Telegram
إذا كنت مهتمًّا بالذكاء الاصطناعي وتريد المساهمة في مشروع دعوي، فدونك هذه المهمة التي نحتاج لمن يقوم بها على أكمل وجه:
https://github.com/ieasybooks/aljam3-web-app/issues/47

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

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

في انتظارك يا باغِيَ الخير 😎✌️
13
أُولى المساهمات في مشروع "الجامع" دُمِجت البارحة ووصلت إلى مستخدمي الموقع بالفعل 🎉

جزى الله خيرا كلًّا من عبدالرحمن حيدر وسيف وليد على مبادرتهما لإنجاز مهمتين من المهمات المتلعقة بمشروع الجامع:
- https://github.com/ieasybooks/aljam3-web-app/pull/66
- https://github.com/ieasybooks/aljam3-web-app/pull/67

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

كُن مساهما ولا تكن من المتفرجين 🚀
8
كان عندي بعض الوقت البارحة، فقررت تثبيت Arch Linux وتجربة Omarchy، وكانت تجربة ممتازة كبداية، ولكن أحتاج لاستخدامه بشكل أكبر وتكوين تصوّر أفضل عنه، خصوصا أنه يستخدم Vim افتراضيًّا وأنا أستطيع الخروج من Vim فقط 😆

يمكنك الوصول إلى موقع Omarchy من هنا:
https://omarchy.org

وهذا المستودع الخاص به:
https://github.com/basecamp/omarchy

وهو عبارة عن طريقة لتهيئة وتخصيص Arch Linux مع واجهة Hyprland يمكن تثبيتها من خلال تنفيذ أمر واحد بعد تثبيت Arch Linux من إنشاء DHH:
wget -qO- https://omarchy.org/install | bash



الشعور غريب، فلا توجد أي أيقونات على سطح المكتب وتحتاج لاستخدام لوحة المفاتيح لتصل إلى أي برنامج داخل النظام.

بعض اختيارات DHH تحتاج للمراجعة والتخصيص بشكل أكبر، فهو يستخدم Hey.com افتراضيًّا مع وجود Spotify و ChatGPT كاختصارات في لوحة المفاتيح، ولكن في المجمل كان النظام سلسًا ويستحق التجربة والانتقال إليه وترك أجهزة Apple 😁

أحاول تسجيل مقطع أجرّب فيه النظام بشكل أفضل وأستخدم Vim عليه خلال الأيام القادمة بإذن الله.

والسلام عليكم 👋🏻
4
من لطائف إطار عمل Ruby on Rails وجود مكتبة لكل شيء تقريبا، وهذا سلاح ذو حدّين.

خلال تصفّحي لـ GitHub، وجدت هذه المكتبة route_translator:
https://github.com/enriclluelles/route_translator

هدفها ببساطة ترجمة الـ Routes في مشروعك، فمثلا منصة قبيلة لديها مسار (Route) لعرض المنشورات يبدأ بـ /posts/ ويليه مُعرّف المنشور.

باستخدام route_translator يمكن لقبيلة (إذا كانت مكتوبة باستخدام Ruby on Rails 😜) ترجمة هذا المسار إلى /المنشورات/ و /posts/ بمجرد إضافة بعض الأسطر إلى المشروع.

ليست كثرة المكتبات هي الأمر الإيجابي في حد ذاته، وإنما جودتها أيضًا. فغالبًا المكتبات في Ruby on Rails تكون جودتها عالية ويستمر المُطوّر في المحافظة عليها وتحسينها لسنوات طويلة بمساعدة المجتمع.

السلبية في هذا الأمر هي التساهل في إضافة الاعتماديات لأبسط الأمور، بدلاً من كتابة الشيفرة المطلوبة للمهام البسيطة، لذلك يجب الحذر عند التعامل مع بيئة Ruby on Rails.

والسلام عليكم 👋🏻
2🔥1
تنبيه: شاهد هذا المقطع باستخدام HaramBlur رجاءً
https://haramblur.com

كنت أشاهد هذا المقطع من قناة Veritasium:
https://www.youtube.com/watch?v=fG8SwAFQFuU

فتذكرت حديث الرسول صلى الله عليه وسلم عن أبي ذر الغفاري أنه سأل رسول الله صلى الله عليه وسلم عن الكرسي فقال رسول الله صلى الله عليه وسلم: "والذي نفسي بيده ما السماوات السبع والأرضون السبع عند الكرسي إلا كحلقة ملقاة بأرض فلاة، وإن فضل العرش على الكرسي كفضل الفلاة على تلك الحلقة" [إسناده ضعيف].

فسبحان الخالق وما أعظم خلقه، وما أصغرنا وما أجرأنا..

ادعم HaramBlur، الرابط في الأعلى ☝️
7
"لا يمكن بناء واجهات مستخدم تفاعلية باستخدام Ruby on Rails"

هذه الجملة مستفزة إلى حد ما، فإطار العمل يدعم التفاعلية بشكل كبير وكافٍ في أغلب الحالات من خلال StimulusJS، ولكن لنُسلّم بهذه الجملة ونبحث عن حلول تستخدم مكتبات وأُطر العمل المخصصة لواجهات المستخدم كـ React و Vue و Svelte اتِّباعًا للـ "Trend".

الحل الأول يكمن في استخدامك لـ InertiaJS وهو عبارة عن Protocol أُنشئ بداية في مجتمع إطار عمل Laravel ودُعم بعد ذلك في إطار عمل Rails.

يسمح لك InertiaJS ببناء واجهات تفاعلية باستخدام React أو Vue أو Svelte داخل مشروعك المعتمد على Ruby on Rails دون الحاجة لبناء APIs والتعامل مع بيانات JSON بشكل مباشر.

كما هو موضّح في الصور المُرفقة، نُجهّز البيانات في الـ Controller ونرسلها للواجهة المكتوبة باستخدام React (أو غيرها) من خلال استخدام render inertia و props.

وفي الواجهة نستخدم React كأي مشروع React طبيعي، ولكن دون الحاجة لبناء APIs مخصصة والتعامل مع بيانات JSON يدويا في واجهة المستخدم، فكل شيء يُعالج من خلال InertiaJS حتى في التنقّل بين الصفحات وعرض المكوّنات (Components).

الموقع الرسمي لـ InertiaJS:
https://inertiajs.com

موقع InertiaJS لـ Ruby on Rails:
https://inertia-rails.dev

هذا الحل الأول، ولكنه يُجبرك على استخدام InertiaJS في كل صفحات الموقع والانتقال من الصفحات المكتوبة بـ React (أو غيرها) والصفحات التي لا تعتمد على إطار العمل لن يكون سلسًا.

الحل الثاني TurboMount يسمح لك ببناء أجزاء محددة من الصفحة باستخدام React أو Vue أو Svelte بدلًا من بناء الواجهات بالكامل باستخدام هذه المكتبات وأُطر العمل.

هذا الحل مناسب لمن يحتاج للتفاعلية في جزء محدد من المشروع كالـ Dashboards.

مشروع TurboMount:
https://github.com/skryukov/turbo-mount

هذه من أفضل الحلول الموجودة الآن لاستخدام مكتبات وأُطر العمل المخصصة لواجهات المستخدم مع Ruby on Rails، حاول الاطلاع عليها واستخدامها وبناء ما تحلم به من واجهات 😁

والسلام عليكم 👋🏻
2
مساهمة جديدة في "الجامع" 🚀!

جزى الله خيرا الأخ سعيد الزين على مساهمته في إضافة ميزة إظهار وإخفاء التشكيل عند تصفّح الكتب:
https://github.com/ieasybooks/aljam3-web-app/pull/70

حساب الأخ على GitHub:
https://github.com/Said-MZ

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

كُن مساهما ولا تكن من المتفرجين 🤩
9
من الاكتشافات اللطيفة في الفترة الماضية مكتبة Lookbook المخصصة لاختبار ومعاينة مكوّنات وواجهات مشروعك القائم على Ruby on Rails، يمكنك الاطلاع على المكتبة من هنا:
https://lookbook.build

كما هو موضّح في الصورة، تستطيع إضافة معاينات لكل مكوّنات نظام واجهة المستخدم مع إمكانية إضافة أكثر من معاينة لكل مكوّن لاختبار الحالات المختلفة للمكوّن، كما هو الحال مع Book Card و Contact Form في الصورة.

المكتبة تدعم ViewComponent و Phlex وحتى ActionView partials، كما أن طريقة تثبيتها واستخدامها سهلة ومباشرة، فقط اقرأ التوثيق من موقعهم الرسمي.

أضفت معاينات لكل مكوّنات واجهة "الجامع" لتسهيل تطوير الواجهة على إخواننا المصممين إن أرادوا المساهمة 😁

يمكنك الوصول إليها (بعد تجهيز بيئة التطوير كما هو موضّح في توثيق المستودع) من خلال التوجّه إلى:
localhost:3000/lookbook

رابط مستودع الجامع:
https://github.com/ieasybooks/aljam3-web-app

والسلام عليكم 👋🏻
3
الترتيب الثاني في قائمة الأعلى تأثيرا على منصة قبيلة 🥳

إن كنت لا تدري، فقبيلة نشرت قائمة بأعلى 100 شخص تأثيرا على المنصة، تصفحها من هنا:
https://qabilah.com/posts/6goSgU--jio

وإن كنت لا تدري ما هي قبيلة (عارٌ عليك)، فهذا رابط الدعوة الخاص بي:
https://qabilah.com/waiting-list/y57zPDQcrq8

سجّل في قبيلة واكسبها، ولا تخسر LinkedIn (مقولة مسروقة 😂)
12
أقل من 100 سطر لإضافة ميزة البحث خلال الكتابة في صفحة المؤلفين ضمن موقع "الجامع"!

أضفت قبل قليل ميزة البحث خلال الكتابة في قائمة المؤلفين الموجودة في موقع الجامع مع إمكانية ترقيم الصفحات (Pagination) من خلال تعديل أقل من 100 سطر برمجي، تتضمن واجهة المستخدم والمُتحّكم (Controller) وشيفرة JavaScript بسيطة لتحديث واجهة المستخدم تلقائيًّا خلال الكتابة.

يمكنك الاطلاع على التعديل من هنا:
https://github.com/ieasybooks/aljam3-web-app/commit/0c92bebf4a8b1df208cc9019c11d1f4d4a80abaf

(التعديل يتضمن أكثر من 100 سطر، ولكن الباقي مختص بحالات الاختبار 😁)

ويمكنك تجربة التعديل من خلال صفحة قائمة المؤلفين في الموقع من هنا:
https://aljam3.com/authors

كان هذا ممكنا -بعد توفيق الله سبحانه- بفضل Ruby on Rails ومكتبة Turbo والتي تُمكّنك من تحديث الصفحة باستخدام Morphing للحفاظ على حالة بعض العناصر في الصفحة كمربعات الإدخال ومكان المستخدم في الصفحة حتى خلال التحديث.

ما هو الـ Morphing؟ هذا أمر شرحُه يطول ولكن ببساطة مُخِلّة هو أقل عدد من العمليات التي تحتاج لإجراءها لتحويل الصفحة الحالية إلى الصفحة الراجعة من الخادم، دون تحديث الصفحة بالكامل.

حان الآن وقت إضافة نفس الأمر في باقي صفحات الموقع من خلال الميزة الأقوى، النسخ واللصق 😂🚀

والسلام عليكم 👋🏻
3
دخلت لتجربة Replit في أحد المشاريع، فوجدت هذه الـ Apps (كما يُسمّونها) من 8 سنوات 😂
3👀1
بدأت التخطيط لمشروع جديد خلال الأسابيع الماضية، فبدأت في تجهيز تصوّرٍ لقاعدة البيانات، وخلال البحث وجدت هذا الموقع اللطيف:
https://dbdiagram.io

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

الرسم تفاعليٌّ جدا ويوضّح لك العلاقات بين الجداول بشكل ممتاز.

بعد إضافة الجداول التي أحتاجها مبدئيًّا (32 جدولا) والتأكد من أن العلاقات بينها صحيحة ومراجعتها مع أحد الأصدقاء، أعطيت الشيفرة المُعبّرة عن تصميم قاعدة البيانات إلى Claude 4 Sonnet وطلبت منه إنشاء الـ Models والـ Migrations اللازمة لإنجاز هذا التصميم في مشروع Ruby on Rails.

أعطاني في المقابل 32 أمرا لإنشاء الـ Models و 28 أمرا لإنشاء الـ Migrations اللازمة لإضافة Indexes وغيرها من التعديلات.

وجدت أن طريقة العمل هذه ألطف من طريقة عملي التقليدية في مشاريعي الجانبية، فكنت دائما أبدأ بإنشاء ما أحتاجه من الـ Models وأُضيف الباقي مع مرور الوقت واستمرار التطوير.

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

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

والسلام عليكم 👋🏻
👍41👏1
هل جرّبت Mise من قبل؟
https://mise.jdx.dev

منذ سنتين كنت مقتنعا باستخدام DevContainers كبيئة تطوير أساسية في كل مشاريعي، ونشرت عن هذا بعض المنشورات وسجّلت تجربتي في طريقة استخدامه ومميزاته وعيوبه، يمكنك الرجوع إليها من هنا:
https://www.youtube.com/watch?v=S3EPbM7Eh28

وكنت أناقش أحد الأصدقاء باستمرار عن فائدة الـ DevContainers وكم هي جميلة وهو ينصحني بتجربة Mise.

في مشروعي الأخير "الجامع" قررت استخدام Mise والاستغناء عن الـ DevContainers (وليس Docker) وكانت التجربة مختلفة تماما!

تستطيع من خلال Mise إدارة اعتماديات المشروع وإصداراتها مثل لغة البرمجة والأدوات الجانبية التي تحتاجها في تطوير مشروعك.

أما الخدمات مثل قاعدة البيانات الرئيسية وقاعدة بيانات التخزين المؤقت (Caching) ومحرك البحث، يمكنك الاعتماد على Docker في ذلك لأن تجربتي في تثبيت هذه الخدمات من خلال Mise لم تكن لطيفة 😂

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

أعمل الآن على نقل كل مشاريعي من DevContainers إلى Mise وبدأت هذا الأمر من خلال إنشاء قالب لمشاريع Ruby on Rails يستخدم Mise، يمكنك الاطلاع عليه من هنا:
https://github.com/ieasybooks/ruby-on-rails-template

ونعود ونسأل، هل جربت Mise من قبل؟ شاركنا تجربتك.

والسلام عليكم 👋🏻
3
وعليكم السلام ورحمة الله وبركاته،

جربت خلال الأيام الماضية Lovable و Replit و Firebase Studio لتصميم صفحة تعرض منتجات مبادرة الكتب المُيسّرة وبعض الإحصائيات. حاولت كتابة التفاصيل في الـ Prompt وجرّبت أكثر من تجربة على كل منصة منها، ولكن لم تكن النتائج مرضية.

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

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

بالنسبة لي كان Firebase Studio الأكثر استخداما لأنه مجاني، ثم Replit لأن الحصة المجانية كبيرة مقارنة مع Lovable (إذا استبعدنا أمر الحصة اليومية في Lovable). مدة تفكير Replit كانت الأطول، مقارنة مع Firebase Studio كان الأسرع في التنفيذ.

من مميزات Replit تقديم حلول متكاملة لقاعدة البيانات والمستخدمين وغيرها في المنصة نفسها ووجود ملف replit.md والذي يحتوي على تفاصيل مشروعك، لم ألحظ وجود شيء مشابه في باقي المنصات.

أرى أن الشيفرة البرمجية الناتجة عن هذه المنصات تحتاج لمراجعة من مختص قبل استخدامها (إذا أردت استخدامها خارج المنصة نفسها)، فكمية الاعتماديات المستخدمة في المشاريع كبيرة، وإصدارات بعضها كان قديما، فمثلا Firebase Studio كان يستخدم TailwindCSS الإصدار الثالث.

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

والسلام عليكم 👋🏻
👍31
ليس من الضروري أن تكون المساهمة شيفرة برمجية!

كنا نواجه مشكلة في موقع "الجامع" وهي تصنيف مواقع الفحص له على أنه موقع مشبوه ويحتوي على برمجيات ضارة، وأنشأت هذه المهمة لحل هذه المشكلة بعد الإطلاق:
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