مرحبا بكم في واجهة واجهة المستخدم ويب واجهة المستخدم والأدوات: Bootstrap 4.
أنا سعيد لأنك قررت الانضمام إلى هذه الدورة
للتعرف على إطار واجهة المستخدم ويب الأكثر شعبية: Bootstrap.
سنلقي نظرة على جوانب مختلفة من Bootstrap.
من خلال عدة أمثلة، سوف تتعلم من خلال القيام بتمارين كجزء من هذه الدورة.
دعونا ننظر إلى بعض التفاصيل بعد ذلك.
قبل أن تبدأ هذه الدورة،
يرجى التأكد من أن لديك خلفية كافية
لتتمكن من النجاح في هذه الدورة.
يجب أن يكون لديك معرفة جيدة بـ HTML و
CSS و JavaScript قبل بدء الدورة.
من وجهة نظري، يتكون تصميم وتطوير المواقع من جانبين:
الأول هو تصميم الموقع وصفحة الويب،
والثاني هو البناء الفعلي ونشر صفحة الويب نفسها.
من منظور التصميم،
ما أعنيه هو تصميم واجهة المستخدم وتجربة المستخدم،
التصميم المرئي، النماذج الأولية،
عناصر الألوان
والرسومات والرسوم المتحركة التي قد تكون ذات أهمية.
في هذا التخصص، نحن لا ننظر إلى هذا الجانب من تطوير الويب.
بدلا من ذلك، نحن ننظر إلى هذا الجانب الثاني،
وهو تطوير وبناء
ونشر مواقع الويب وصفحات الويب، وذلك باستخدام تقنيات
مثل أطر واجهة المستخدم الأمامية على شبكة الإنترنت مثل Bootstrap،
وربما إطار جافا سكريبت مثل Angular أو مكتبة مثل React
و hybrid mobile لتصميم
تطبيقات الجوال وكذلك التطوير من جانب الخادم باستخدام Node و
Express و MongoDB، المكدس الرئيسي بمزيد من التفصيل.
إذا كنت تبحث في التخصص،
والتفكير في الجانب تصميم الموقع،
ثم قد ترغب في إعادة التفكير مرة أخرى.
يركز هذا التخصص على
بناء ونشر موقع الويب وصفحات الويب،
وهو معرفة تقنية بحتة حول استخدام HTML،
CSS، والمهارات القائمة على جافا سكريبت لتطوير الموقع الفعلي.
ربما كنت أتساءل أيضا عن ما هو المقصود من تطوير شبكة الإنترنت كومة كاملة.
سنلقي نظرة على مزيد من التفاصيل حول تطوير الويب المكدس الكامل في الدرس التالي. على
وجه الخصوص، إذا كنت تبحث في كيفية
وضع هذه الدورة في السياق العام لتطوير شبكة الإنترنت المكدس الكامل،
في هذه الدورة، ونحن نتعامل مع تطوير واجهة المستخدم الأمامية على شبكة الإنترنت. على
وجه الخصوص، إطار واجهة المستخدم Bootstrap 4.
سننظر في الجوانب المتبقية من
تطوير الويب الكامل في بقية هذا التخصص.
هذه الدورة تبحث في Bootstrap بتفصيل كبير.
سننظر أيضًا في تصميم الويب المتجاوب وكيف يدعم Bootstrap
تصميم الويب المتجاوب من خلال نظام Bootstrap Grid.
سنلقي نظرة على المكونات المستندة إلى CSS وجافا سكريبت في Bootstrap وكيف
يمكنك الاستفادة منها في بناء موقع الويب الخاص بك وصفحات الويب الخاصة بك.
على طول الطريق، سنتعرف على تطوير الويب هذا باستخدام سطر الأوامر.
لذلك سوف نتعلم الكثير من أدوات الويب التي
تعتمد على سطر الأوامر والنظام البيئي Node.js.
سنقوم بمراجعة Git بإيجاز،
وإضافة Node.js وننظر إلى الأدوات القائمة على Noje.js بما في ذلك المتسابقين المهام مثل Grunt و Gulp.
يتم تنظيم هذه الدورة، في حد ذاتها، في وحدات كاملة.
كل وحدة تقريبا المقابلة لمدة أسبوع واحد من العمل.
في الوحدة الأولى،
سنحصل على عرض الصورة الكبيرة لتطوير الويب المكدس الكامل،
ثم ستحصل على مقدمة سريعة لـ Git و Node.js.
ثم سنعرفك على Bootstrap ثم نراجع نظام Bootstrap Grid.
هذا سيقودك إلى المهمة الأولى في هذه الدورة.
الوحدة الثانية تتعامل مع مكونات CSS Bootstrap.
سنلقي نظرة على تصميم شريط التنقل Bootstrap
وكيف يمكننا الاستفادة منه لدعم التنقل.
سننظر في إدخال المستخدم من خلال
الأزرار والنماذج ثم سننظر في كيفية عرض المحتوى باستخدام الجداول والبطاقات.
ثم سننظر في كيفية تضمين الصور والوسائط في صفحة الويب الخاصة بنا باستخدام الصور والصور
المصغرة وكائنات الوسائط.
وبعد ذلك، أخيرا، ننظر في كيفية تنبيه المستخدمين باستخدام العلامات
والتنبيهات وأشرطة التقدم.
هذا يجب أن يقودك إلى مهمتك الثانية
الوحدة الثالثة تتعامل مع مكونات جافا سكريبت Bootstrap.
سننظر في عرض الصورة الكبيرة
لكيفية عمل مكونات جافا سكريبت Bootstrap، وسنراجع علامات
التبويب والحبوب والملاحة المبوبة،
ثم سننظر في كيفية استخدام الانهيار والأكورديون لإظهار وإخفاء المحتوى.
وبعد ذلك سنلقي نظرة على استخدام تلميحات الأدوات،
popovers وشروط للكشف عن المحتوى ليتم عرضه في صفحتك.
ثم سنلقي نظرة على مكون دائري،
والذي يسمح لك بعرض المعلومات المنزلقة على صفحة الويب الخاصة بك.
هذا يجب أن يقودك إلى المهمة الثالثة في هذه الدورة.
تتعامل الوحدة الأخيرة مع Bootstrap و jQuery وأدوات التطوير المختلفة.
سننظر، على وجه الخصوص، في كيفية تفاعل Bootstrap و jQuery وكيف يمكنك
كتابة شفرة jQuery و JavaScript للتحكم في مكون JavaScript Bootstrap الخاص بك.
نحن ننظر إلى الطرق المختلفة التي تدعمها مكونات جافا سكريبت Bootstrap،
والتي يمكن الاستفادة منها
لكتابة شفرة جافا سكريبت للتحكم في سلوك هذه المكونات.
ثم سنراجع لغة المعالجة المسبقة لـ CSS مثل LESS و Sass.
ثم، وأخيرا، سوف ننظر في كيفية بناء ونشر موقعنا على الانترنت
باستخدام البرامج النصية الآلية الوقائية الوطنية أو المتسابقين المهام مثل Grunt و Gulp.
هذا يجب أن يأخذك على طول الطريق إلى المهمة النهائية في هذه الدورة.
آمل أن يكون لديك الكثير من المرح القيام
بأجزاء مختلفة من هذه الدورة، وأيضا التمتع التدريبات التي سوف
تواجهها في كل مرحلة التي تمكنك من
فهم أفضل جوانب مختلفة من إطار واجهة المستخدم على شبكة الإنترنت Bootstrap.