اسمي تايلر نيكرسون ، وأنا طالب صاعد في معهد وورسيستر للفنون التطبيقية في ووستر ، ماساتشوستس. خلال الأشهر الثلاثة الماضية ، كان من دواعي سروري أن أكون متدربًا في edX أعمل مع فريق التجارة الإلكترونية. يطور فريق التجارة الإلكترونية أدوات تُستخدم لإدارة الدورات التدريبية التي تحقق الدخل والمحافظة عليها بشكل أفضل ، مثل تلك التي تحمل شهادات تم التحقق منها.
خلال فترة تدريبي ، أصبحت على دراية بعدد كبير من الأطر والمكتبات التي لم تكن معروفة لي من قبل (لا سيما Django و BackboneJS). بينما ساعدت في بناء العديد من الميزات الجديدة الرائعة هنا ، أود أن أستغل هذا الوقت لمناقشة منتج مبتكر نوعًا ما ظهر مؤخرًا من فريق التجارة الإلكترونية: أداة إدارة الدورة التدريبية. سأتطرق أيضًا إلى أعمال التصميم والتصميم التي دخلت في الأداة ، حيث إنها تتضمن عملًا رائدًا يتضمن استخدام edX لأنماط ومكونات UX عبر الأنظمة الأساسية.
أداة إدارة الدورة التدريبية
في الأسابيع القليلة الماضية من تدريبي ، تم تعييني لإنشاء الصفحات الأولى لما سيصبح أداة إدارة الدورة التدريبية ، وهي بوابة لمديري المشاريع (PMs) لإنشاء وتحرير منتجات الدورة التدريبية المدفوعة ، مثل الشهادات التي تم التحقق منها ، والتعليم المهني ، ومقاعد الائتمان. قبل وجود الأداة ، تم إجراء هذه التغييرات باستخدام لوحة إدارة Django ، وهي أداة غير بديهية وموجهة للمطورين ليست سوى واجهة للمستخدم. توفر أداة إدارة الدورة التدريبية واجهة سهلة الاستخدام ومبسطة للمساعدة في أتمتة عملية إضافة منتجات الدورة التدريبية.
تشرفت بكوني أول مطور يعمل على تطوير الأداة عرض القائمة الأولية يسرد الدورات المتاحة للعرض والتحرير. في مراحله الأولى ، كان عرض القائمة يتألف من DataTable فقط ، ومربع تصفية ، وزر "إضافة دورة تدريبية جديدة" غير وظيفي. الأداة لا تملك حتى القدرة على عرض تفاصيل إضافية للدورات المدرجة.
يستخدم عرض القائمة تنسيق ملحق jQuery داتا تابلز لتوفير طريقة ديناميكية وقوية لفرز بيانات الجدول وتصفيتها. ومع ذلك ، فإن العنصر الأقل وضوحًا في هذه الصفحة هو العمل المكثف الذي تم القيام به في بناء أوراق الأنماط الخاصة بها. تعد أداة إدارة الدورة التدريبية أول خدمة من خدمات edX تعرض امتداد مكتبة أنماط UX، مجموعة من الأنماط ومكونات واجهة المستخدم التي صممها فريق تجربة المستخدم في edX. لا تزال مكتبة الأنماط عملاً قيد التقدم ، ونتيجة لذلك ، فإنها تفتقد العديد من المكونات الأساسية مثل أشرطة التنقل والقوائم. في الإصدارات القديمة من أداة إدارة الدورة التدريبية ، إطار عمل Bootstrap في Twitter تم استخدامه "لملء" هذه الفجوات. ميزة أخرى مفقودة في مكتبة الأنماط هي نمطية ، أو القدرة على "توصيل وتشغيل" المكتبة في منصات أخرى دون تعديل كبير. نتيجة لذلك ، ثبت أن تضمين مكتبة الأنماط في أداة إدارة الدورة التدريبية يمثل تحديًا إلى حد ما.
نمذجة مكتبة الأنماط
عند بدء العمل على أداة إدارة الدورة التدريبية لأول مرة ، يجب اتباع الخطوات التالية من أجل استخدام مكتبة الأنماط على موقع ويب:
- استنساخ مستودع Git "ux-pattern-library" على جهازك المحلي
- قم بتثبيت تبعيات Bower الخاصة بالمكتبة
- انسخ المستودع إلى دليل موقع الويب الخاص بك
- قم بتضمين main-ltr.scss أو ترجمة وتضمين main-ltr.css في ملف HTML الرئيسي الخاص بك
من الناحية المثالية ، إذا كان هذا سيتبع النهج التقليدي لتبعيات الواجهة الأمامية ، فيجب تكثيف هذه الخطوات إلى ما يلي:
- قم بتثبيت مكتبة الأنماط باعتبارها تبعية Bower باستخدام المحطة
- قم بتضمين main-ltr.scss أو main-ltr.css في ملف HTML الخاص بك
إن تكثيف هذه الخطوات عملية طويلة وطموحة إلى حد ما. نظرًا للإطار الزمني القصير الذي كان علينا فيه تطوير هذه الأداة ، فقد أخذت على عاتقي إضافتها الحد الأدنى من دعم التوصيل والتشغيل لمكتبة الأنماط ، إلى الحد الذي تتطلب الخطوات الثلاث التالية فقط:
- قم بتثبيت مكتبة الأنماط باعتبارها تبعية Bower باستخدام المحطة
- انسخ main-ltr.scss في مكان آخر وعدِّل مسارات التبعية الخاصة بها
- قم بتضمين main-ltr.scss في ملف HTML وقم بتجميعه في وقت التشغيل
على الرغم من أنه ليس مثاليًا ، فقد نجح هذا النهج في أغراض أداة إدارة الدورة التدريبية ، وتمكنت مكتبة الأنماط من الجلوس بشكل جيد جنبًا إلى جنب مع Bootstrap. قرب نهاية فترة التدريب الداخلي ، كنت قادرًا على مناقشة وحدة مكتبة الأنماط مع فريق UX ، مما يجعل عدة اقتراحات حول كيفية تكامل مكتبة الأنماط بشكل أفضل مع Bower.
المنتج النهائي!
اليوم ، تطورت أداة إدارة الدورة التدريبية لتصبح منتجًا أكثر نضجًا ، مكتملًا بوظائف إنشاء وتحرير وعرض تفصيلي للدورات التدريبية. يدعم DataTable الآن ترقيم الصفحات ، ويسمح لك حتى بتحديد عدد الدورات التدريبية المراد إدراجها في كل صفحة.
في الماضي ، أشعر بالفخر لكوني أول مطور يعمل على هذه الأداة. أنا فخور بالعمل الذي قمت به في edX. لقد علمتني التجربة الكاملة لكوني متدربًا في edX ، الكثير ، ليس فقط من حيث المهارات ، ولكن أيضًا من حيث التعاون الجماعي والتخطيط. تدربت الصيف الماضي في شركة ناشئة أخرى في مرآب لتصليح السيارات. كان زميلي في العمل (وفقط) هما الرئيس التنفيذي وقائد البرمجة. في edX ، كنت قادرًا على العمل مع فريق متكامل ومتفاني كان منفتحًا على اقتراحاتي وملاحظاتي. علمني القيام بذلك كيفية المساهمة في ديناميكية المجموعة وكيفية فهم عمليات التطوير للفرق الأكبر. أود أن أشكر كلينتون بلاكبيرن ، وزاك روكويل ، وأماندا ناني ، وجميع زملائي المتدربين على جعل هذا الصيف رائعًا ، وآمل أن أساهم في منصة Open edX مرة أخرى في المستقبل القريب.
