مقدمة
توزع فرق كثيرة عمل الويب بين مختصين منفصلين للواجهة الأمامية والواجهة الخلفية، فتتعطل الميزات عند التسليم بين الفريقين، وتبتعد واجهات البرمجة عن الشاشات التي تستدعيها، ويبقى الإصدار معتمدا على خطوات يدوية. يسد تطوير تطبيقات الويب المتكاملة هذه الفجوة حين يبني مطور واحد الواجهة وواجهة البرمجة وطبقة البيانات وخط النشر معا. تدرب هذه الدورة من كور كونسبت المطورين على بناء واجهات React وواجهات برمجة باستخدام Node.js وExpress ونماذج بيانات علائقية، ثم إضافة المصادقة والاختبارات الآلية والنشر في حاويات عبر خط تكامل مستمر. وينشر المشاركون تطبيقا متكاملا في المشروع الختامي.
أهداف الدورة
- تقسيم تطبيق الويب إلى طبقات الواجهة الأمامية وواجهة البرمجة وقاعدة البيانات العلائقية وإعداد مستودع Git بسير عمل للفروع وطلبات الدمج
- بناء واجهات React من المكونات والخصائص والحالة والخطافات Hooks مع التوجيه في المتصفح والنماذج وجلب البيانات عبر Fetch API
- تصميم نقاط نهاية REST وتنفيذها في Node.js بمسارات Express والبرمجيات الوسيطة ومعالجة الأخطاء المركزية
- نمذجة البيانات العلائقية واستعلامها عبر أداة ORM مع ترحيلات المخطط والربط بين الجداول وتقسيم النتائج والمعاملات
- تطبيق المصادقة بالجلسات أو رموز JSON Web Token وتغطية التطبيق باختبارات الوحدات وواجهات البرمجة والاختبارات من طرف إلى طرف
- تغليف التطبيق في حاويات ونشره على منصة سحابية عبر خط تكامل مستمر تطبيقا ختاميا يعمل فعليا
الفئة المستهدفة
- مطورو الواجهات الأمامية الذين يبنون واجهات المتصفح ويحتاجون إلى كتابة واجهات البرمجة وطبقات البيانات خلفها
- مطورو الواجهات الخلفية الذين يصونون شيفرة الخادم وقواعد البيانات ويحتاجون إلى بناء واجهات حديثة قائمة على المكونات
- مبرمجو الويب المسؤولون عن مواقع قديمة تبنى صفحاتها على الخادم وينتقلون إلى حزم تطبيقات مبنية على JavaScript
- مهندسو البرمجيات في فرق تقنية المعلومات الداخلية الذين يبنون تطبيقات ويب تشغيلية من البداية حتى النشر
- أعضاء الفرق التقنية الذين يراجعون الشيفرة وطلبات الدمج في جانبي العميل والخادم من منتج الويب
محاور الدورة
اليوم 1: منصة الويب الحديثة وJavaScript ومعمارية التطبيق المتكامل
- طبقات المعمارية المتكاملة: الواجهة الأمامية والخلفية وقاعدة البيانات العلائقية في حزمة PERN
- بنية HTML الدلالية وتخطيط CSS المتجاوب باستخدام Flexbox وGrid
- وحدات JavaScript القياسية ES Modules: التصدير المسمى والافتراضي والاستيراد والاستيراد الديناميكي
- البرمجة غير المتزامنة في JavaScript بالوعود Promises وAsync/Await وFetch API
- إعداد مستودع Git وفروع الميزات وسير عمل طلبات الدمج
اليوم 2: مكونات React وإدارة الحالة والتوجيه في المتصفح
- مكونات React وصيغة JSX والخصائص Props لبناء أجزاء واجهة قابلة لإعادة الاستخدام
- الحالة بالخطاف useState وقواعد الخطافات ورفع الحالة إلى المكون الأب
- الآثار الجانبية وتحميل البيانات البعيدة بالخطاف useEffect
- التوجيه في المتصفح: المسارات المتداخلة ومعاملات المسار والصفحات المحمية
- النماذج المتحكم بها والتحقق من المدخلات في المتصفح وحالات التحميل والخطأ
اليوم 3: تصميم واجهات REST والواجهة الخلفية في Node.js وExpress والبيانات العلائقية
- قيود REST وتصميم نقاط النهاية حول الموارد بطرق HTTP ورموز الحالة
- مسارات Express وسلسلة البرمجيات الوسيطة ومعالجة الأخطاء المركزية في Node.js
- نمذجة البيانات العلائقية: الكيانات والمفاتيح الأساسية والأجنبية وعلاقات واحد إلى متعدد ومتعدد إلى متعدد
- نماذج ORM وترحيلات المخطط وبيانات التهيئة الأولية لقاعدة PostgreSQL
- الربط بين الجداول في SQL وتقسيم النتائج والتصفية والمعاملات عبر أداة ORM
اليوم 4: المصادقة والاختبار الآلي وعادات البرمجة الآمنة
- جلسات الخادم مقابل رموز JSON Web Token: المطالبات والتوقيع وانتهاء الصلاحية والتجديد
- مسار تسجيل الدخول وتجزئة كلمات المرور وفحص الأدوار في برمجيات Express الوسيطة
- عادات البرمجة الآمنة: التحقق من المدخلات وأسرار البيئة وإعدادات CORS
- اختبارات الوحدات لمكونات React ودوال JavaScript باستخدام مشغل اختبارات
- اختبارات تكامل واجهات البرمجة والاختبارات من طرف إلى طرف في المتصفح لمسارات المستخدم الحرجة
اليوم 5: النشر بالحاويات وخط التكامل المستمر والتطبيق الختامي
- ملف Dockerfile وإعداد حاويات متعددة للواجهة الأمامية وواجهة البرمجة وقاعدة البيانات
- مراحل خط التكامل المستمر: فحص الأسلوب والاختبار والبناء مع كل طلب دمج
- الإصدار على منصة سحابية: متغيرات البيئة وقاعدة البيانات المدارة وسجلات التطبيق
- مختبر: بناء التطبيق الختامي المتكامل في أزواج انطلاقا من قائمة ميزات
- نشر التطبيق الختامي وعرض الشيفرة ومراجعتها مع الزملاء
المهارات التي ستكتسبها
- تطوير مكونات React
- تصميم نقاط نهاية REST
- بناء برمجيات Express الوسيطة
- نمذجة المخططات العلائقية
- كتابة استعلامات ORM
- المصادقة بالرموز والجلسات
- كتابة الاختبارات الآلية
- الإصدار بالحاويات والتكامل المستمر
لماذا تحضر هذه الدورة
- العودة بتطبيق ختامي متكامل منشور مع مستودع Git وحزمة اختبارات وخط تكامل مستمر نقطة انطلاق قابلة لإعادة الاستخدام
- تسليم الميزات من البداية حتى النشر دون انتظار التسليم بين فرق الواجهة الأمامية والخلفية والتشغيل
- كتابة شيفرة حقيقية وتصحيحها في مختبرات يومية على حاسوب المشارك بدلا من متابعة شرائح العرض
- مقارنة خيارات الحزم التقنية وممارسات الفرق مع مطورين من البنوك والتجزئة والخدمات الحكومية وشركات التقنية
الخاتمة
يقوم تطوير الويب المتكامل على وصل الطبقات حتى تتوافق الشاشة ونقطة النهاية والجدول والإصدار. تبدأ الدورة بلغة HTML وCSS ووحدات JavaScript وGit، ثم مكونات React والحالة والتوجيه، فتصميم REST وبرمجيات Express الوسيطة والبيانات العلائقية عبر أداة ORM. وتضيف بعدها المصادقة وعادات البرمجة الآمنة والاختبارات الآلية، وتختتم بالحاويات وخط التكامل المستمر وتطبيق ختامي متكامل ينشر على منصة سحابية.
