"إذا أراد العامل أن يؤدي عمله بشكل جيد، فعليه أولاً أن يشحذ أدواته." - كونفوشيوس، "مختارات كونفوشيوس. لو لينجونج"
الصفحة الأمامية > برمجة > أسبوع Hacktoberfest يتعمق في مساهمات التعليمات البرمجية

أسبوع Hacktoberfest يتعمق في مساهمات التعليمات البرمجية

تم النشر بتاريخ 2024-11-01
تصفح:763

Hacktoberfest Week Diving Deeper into Code Contributions

تحياتي للجميع! كيف تسير الأمور بالنسبة لك في Hacktoberfest هذا العام؟ أنا شخصياً أستمتع به حقًا حتى الآن. لقد دخلنا الآن الأسبوع الثاني من شهر أكتوبر، مما يعني أن الوقت قد حان لطلب السحب الثاني (PR) من بين الأربعة المطلوبة لإكمال التحدي. هذا الأسبوع، قررت أن أدفع نفسي إلى أبعد من ذلك من خلال المساهمة في قاعدة التعليمات البرمجية للمشروع بدلاً من التركيز فقط على الوثائق، كما فعلت في الأسبوع الأول.

خلاصة الأسبوع الأول

في أول علاقات عامة لي في Hacktoberfest، عملت على تحسين وثائق المشروع. كمبتدئ، أردت تسهيل العملية بمهام أصغر يمكن التحكم فيها. ومع ذلك، في هذا الأسبوع الثاني، قررت القيام بشيء أكثر تقنية: المساهمة في مشروع GitExplorer.

نظرة عامة على المشروع: GitExplorer

GitExplorer هو تطبيق ويب يعمل على تبسيط عملية اكتشاف واستكشاف أفضل مستودعات GitHub. يسمح للمستخدمين بتصفية المستودعات بناءً على لغات البرمجة والموضوعات ومعايير الفرز الأخرى. في حين أن واجهة المستخدم لا تزال قيد التطوير، فإن المشروع يوفر فرصة تعليمية قيمة للمساهمين، وخاصة المبتدئين. تم وضع علامة على العديد من الإصدارات الموجودة في المستودع على أنها "إصدار أول جيد"، مما يجعله مكانًا رائعًا للبدء.

لمساهمتي، اخترت تنفيذ ميزة التنقل التي تعمل على تحسين تجربة المستخدم عند تصفح المستودعات.

تحديد المشكلة

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

خلال فترة عملي في المشروع، كان أحد الجوانب التي برزت (وليس بطريقة جيدة) هو الطريقة التي تم بها تنظيم قاعدة التعليمات البرمجية. يحتوي المشروع على كل المنطق مكتوبًا في ملف script.js واحد، والذي قد يصبح من الصعب الحفاظ عليه مع نمو المشروع. على الرغم من أنني لم أرغب في إجراء تغييرات كبيرة في هذا العلاقات العامة - نظرًا لأنه ركز فقط على أزرار ترقيم الصفحات - فإنني أخطط لاقتراح إعادة هيكلة بنية التعليمات البرمجية في إصدار مستقبلي.

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

ميزة جديدة: ترقيم الصفحات المحسن

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

تطبيق

قيود واجهة برمجة تطبيقات GitHub:

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

تغييرات الكود:

  • لقد قدمت قسم

    جديد في script.js لترقيم الصفحات. هذا سمح لي بإضافة بعض أنماط CSS لتحسين جماليات الأزرار وتجربة المستخدم.
  • تم تغليف المنطق الأساسي لترقيم الصفحات في وظيفتين جديدتين:

    • إنشاء زر ()
    • تصيير الصفحة () قامت هذه الوظائف بإنشاء أزرار ترقيم الصفحات ديناميكيًا استنادًا إلى الصفحات المتاحة والأنماط المطبقة لتعطيل زر الصفحة الحالية، مما يمنع المستخدمين من إعادة النقر فوقه عن طريق الخطأ. أضفت أيضًا تأثيرات التمرير إلى الأزرار للحصول على مظهر أكثر أناقة.
  • تحسينات CSS:

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

    خاتمة

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

    شكرًا على القراءة، وأتطلع إلى مشاركة المزيد حول رحلتي في Hacktoberfest!

بيان الافراج تم إعادة إنتاج هذه المقالة على: https://dev.to/anhchienvu/hacktoberfest-week-2-diving-deeper-into-code-contributions-12g1?1 إذا كان هناك أي انتهاك، يرجى الاتصال بـ [email protected] للحذف هو - هي
أحدث البرنامج التعليمي أكثر>

تنصل: جميع الموارد المقدمة هي جزئيًا من الإنترنت. إذا كان هناك أي انتهاك لحقوق الطبع والنشر الخاصة بك أو الحقوق والمصالح الأخرى، فيرجى توضيح الأسباب التفصيلية وتقديم دليل على حقوق الطبع والنشر أو الحقوق والمصالح ثم إرسالها إلى البريد الإلكتروني: [email protected]. سوف نتعامل مع الأمر لك في أقرب وقت ممكن.

Copyright© 2022 湘ICP备2022001581号-3