تعرف على جديد Bootstrap 4

بعد تطوير عام كامل على النسخة الجديدة من Bootstrap تم اصدار اول نسخة alpha في يوم 19 من الشهر August  بسنة 2015 لتحمل العديد من التطويرات الجذرية والتي لايمكن حصرها بمقالة واحدة ولكن سنركز على اهم التغيرات والتطورات بهذا المقال 

من أهم التطويرات

تغيير بنية التطوير من Less إلى Sass 

 تم تغيير بنية التطوير لبناء اكواد css في Bootstrap من Less إلى Sass مما جعل بناء الأكواد أسرع وأفضل من السابق ويعود الفضل إلى Libsass ومجتمع Sass الضخم والمتزايد باستمرار مما يفتح ابواب جديدة في تطوير مكتبات Bootstrap 

تحسين النظام الشبكي  Grid System

 تم إضافة نظام شبكي Grid System مخصص لإستهداف أجهزة الموبايل بشكل أفضل وتم عمل تحسينات على المسميات المستخدمة عند العمل مع النظام الشبكي Grid System 

أيضا تم دعم flexbox للنظام الشبكي Grid System وبكل سهولة عن طريق تغيير متغير واحد داخل ملف

 _variables.scss

تقريبا بالسطر رقم 46 ستجد المتغير 

$enable-flex:               false !default;

قم بتغيير القيمة من false إلى true وبعدها أعد بناء ملفات css عن طريق Sass لتحصل على نظام شبكي Grid System يعتمد على flexbox بدون تغيير كود واحد بملفات css الخاصة بـ Bootstrap

حذف wells, thumbnails, and panels وإستبدالهم بـ cards

Cards تعتبر احد أهم عناصر Bootstrap الجديدة ولكن عملها مألوف وخاصة انها تقوم بعمل كل من wells, thumbnails, and panels ولكن بشكل أفضل ومرونة أكبر 

تم تطوير وتجميع كل HTML resets العامة في Module جديد بإسم Reboot

تم تطوير Reboot على Normalize.css و إضافة جميع css التي تتحكم بشكل عناصر HTML العامة مثل الجداول والقوائم و النصوص و النماذج وغيرها من عناصر HTML وايضا تم اضافة العديد من الامكانيات التي يعتمد عليها Bootstarp لبناء بقية مكوناته عليها ليصبح لديك اكواد موحدة وعمل مرتب ومنسق وامكانيات أفضل للتطوير بالمستقبل حيث أن Normalize يدعم فقط بعض عناصر HTML بينما تم تطوير Reboot ليدعم المزيد من الخصائص والإعدادات الإفتراضية لعناصر HTML المستخدمة في Bootstrap ليعطيك شكل موحد ومنسق بجميع المتصفحات بشكل إفتراضي عند بناء مشاريعك حتى لو لم ترغب باستخدام جميع مميزات الإطار عند بناء تصاميم موقعك

نظام إعدادات جديد 

تم استبدال النظام القديم بنظام جديد ومرن يعتمد على متغيرات Sass تستطيع وبكل سهولة التلاعب والتعديل على اي من إعدادات الإطار بتغيير قيم المتغيرات الموجودة داخل الملف 

 _variables.scss

ثم إعادة بناء ملفات Bootstrap لتحصل على ماتريد

مثال على بعض الإعدادات 

$enable-rounded:            true !default;
$enable-shadows:            false !default;
$enable-gradients:          false !default;
$enable-transitions:        false !default;

كل ماعليك هو تغيير قيم Boolean من true الى false او العكس لتحصل على ماتريد ولاتنسى يجب ان تقوم باعادة بناء الملفات بواسطة Sass لتحصل على ملفات جديدة وتحتوي على تعديلاتك 

التخلي عن دعم متصفحات IE8

بالتخلي عن دعم متصفح IE8 وماقبله يسمح للإطار بالتطور واستخدام جميع امكانيات CSS الحديثة بدون المزيد من تعديلات على ملفات CSS لدعم هذا المتصفح في حالة استخدامه حيث انه لايدعم امكانيات CSS الجديدة اذا كنت ترغب بدعم هذا المتصفح بمشاريعك عليك باستخدام Bootstrap 3 

استبدال Pixels بوحدات rem و em

تم استبدال Pixels بوحدات rem و em للتحكم بالاحجام مما يجعل النصوص اكثر استجابة ولتسهيل التحكم بجميع المكونات بكل مرونة 

إعادة كتابة جميع إضافات JavaScript 

تم إعادة كتابة جميع الإضافات لدعم تحديثات JavaScript الجديدة لتكون متوافقة مع ES6-ECMAScript 6 وتحتوي جميع التحسينات الجديدة 

تحسين tooltips and popovers

تم تحسين عمل tooltips and popovers وكله بفضل أداة تسمى Tether

تحسين المستندات 

بالسابق كانت مستندات Bootstrap تعتبر من افضل المستندات لشرح الإطار وطرق التعامل معه وبالنسخه الجديدة تم تحسينه بشكل كامل حيث تم إعادة كتابة جميع المستندات بواسطة Markdown و استخدام العديد من الإضافات لتبسيط عرض الأمثله من الأكواد و طرق عملها وتم إضافة خاصية البحث لتسهيل الوصول لأي معلومة بالمستندات وتم تبسيط طريقة التنقل بين صفحات المستندات وجعل التنقل بالقائمة التي باليمين لسهولة الوصول وتقسيم المستندات بشكل مرتب وأنيق 

والكثير من الإضافات والتحسينات 

لايمكن حصر التعديلات والتطويرات بمقال واحد حيث تم اضافة العديد من الأدوات التي تساعدك بالعمل مع النماذج والمحاذاة حيث تم اضافة العديد من الكلاسات للتحكم بـ margin و padding و Custom form controls وكثير من utility classes الأخرى حيث انه وصل عدد مرات التعديل على GitHub الى 1100 طلب تعديل و تم التعديل على 120,000 سطر من اكواد Bootstrap ومازال التطوير مستمر حتى الآن 

خطة التطوير

سيتم اعتماد هذه الخطة بالإصدارات القادمة قبل إصدار النسخة النهائية

• عدد قليل من نسخ alpha 
• وبعدها نسختين beta حيث لن يتم اضافة اي مميزات جديد ويتم التركيز على إختبار النسخ فقط
• وبعدها نسختين RC والتركيز ايضا على إختبار النسخ وقرب موعد صدور النسخه النهائية
• إصدار النسخة النهائية والجاهزة لمرحلة الإنتاج والإستخدام من قبل جميع المطورين بمشاريعهم

دعم نسخة Bootstrap 3

عندما تم اصدار النسخة 3 من Bootstrap تم التخلي عن تطوير ودعم Bootstrap النسخة 2 مما تسبب بكثير من المشاكل للمطورين الذين يرغبون باستمرار استخدام النسخة القديمة ولكن لن يتم تكرار نفس الخطأ مع إصدار Bootstrap 4 حيث انه سوف يستمر دعم و حل مشاكل Bootstrap 3 الخطيرة و تحسين المستندات و سوف يستمر استضافة وتقديم مستندات النسخة القديمة من Bootstrap 3 للمستخدمين 

يمكنك مشاهدة مستندات النسخة الجديدة وتحميلها من هنا

>>>> Bootstrap4 <<<<

كلمات دليلية: