ما هو ال Bootstrap

- ال Bootstrap هو عبارة عن مجموعة من اكواد ال CSS الجاهزة (مكتبة اكواد) وأيضا مكونات جاهزة للموقع مثل navbar جاهز.

- مثال علي ذلك :
يوجد داخل ملف ال bootstrap ؛ هذا ال class الذي يُسمي btn ؛و class اخر يُسمي btn-primary ويكون بداخل ال class مجموعة الاكواد التي بالأسفل

 
.btn {
  display: inline-block;
  font-weight: 400;
  color: #212529;
  text-align: center;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: .375rem .75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: .25rem;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out
}
 
 
.btn-primary {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff
}

وعندما نُريد استخدام ال btn و btn-primary فإننا لا نحتاج الي كتابة الاكواد التي بداخلهم
مثال علي ذلك:

 
 <span class="btn btn-primary">test code</span>

وبالتالي فإنك لا تحتاج الي كتابة اكواد ال CSS من الصفر

مميزات ال Bootstrap؟
لماذا نستخدم ال Bootstrap؟

ال Bootstrap سهل الاستخدام وسريع التعلم.
سرعة تنفيذ الجزء الخاص بال front-end لان مش هتكتب اكواد CSS من الصفر
ال Bootstrap هي مكتبة اكواد مفتوحة المصدر (open source) بمعني أنك يُمكن قراءة وتعديل الاكواد الموجودة داخل ال Bootstrap.
ال bootstrap يستخدم خاصية ال grid system وال media query التي تجعل الموقع responsive بمعني انه سوف يعمل علي جميع احجام الشاشات المختلفة بدون مشاكل مثل الموبايل في حالة حجم الشاشات الصغيرة او شاشات الكمبيوتر في حالة حجم الشاشات الكبيرة
المواقع التي تستخدم ال bootstrap تعمل على جميع المتصفحات بدون أي مشاكل ولكن الإصدار الخامس لل bootstrap لا يدعم متصفح internet explorer الي أصلا مفيش حد بيستخدمه 😊 .
الموقع الخاص بال bootstrap يحتوي على شرح تفصيلي لكيفية استخدام هذه المكتبة.

ما هي عيوب ال Bootstrap؟

ال bootstrap تحتوي علي عدد كبير من الاكواد (مكتبة اكواد) واكواد كتير يعني سرعة الموقع هتكون اقل
ستحتاج لكتابة اكواد CSS لكي يُصبح الموقع الخاص بك مختلف في التصميم عن باقي المواقع التي سوف تستخدم ال bootstrap بدون أي اكواد اضافية.

من الاخر يعني

⚠ لازم تحترف ال CSS عشان تبقي مُحترف في ال bootstrap

لو هتشتغل كــ front-end developer في شركة؛ فمعظم الشركات تعمل بالــ البوتستراب وبالتالي يجب ان تتعلمه.
لو عاوز تصمم الموقع في أسرع وقت عشان عندك موعد نهائي لتسليم المشروع استخدم ال bootstrap
لو انت full-stack developer استخدم ال bootstrap عشان تركز اكتر على ال backend development للموقع
لو العميل مش هيقدرك في الفلوس استخدم ال bootstrap وانجز العمل يا صاحبي (في حالة انك فري لانسر)
لو عاوز تعمل موقع وتتحكم بشكل كامل في تصميم وشكل الموقع يبقى استخدم ال CSS بدون أي مكتبات.
من الأخر يعني هتتعلم البوتستراب 😂

بدائل البوتستراب

- أولا يجب معرفة ان البوتستراب هي مكتبة واحدة من بين العديد من المكتبات ولكن البوتستراب أشهرهم

- و أشهر المكتبات الأخري هي:
Tailwind, Foundation, Materialize .....الخ

ما هو ال CSS Sass

ما هو ال sass

- Sass هو اختصار ل syntactically awesome style sheets
- وهي باختصار عبارة عن طريقة لكتابة لغة CSS غير الطريقة العادية المعروفة لكتابة ال CSS

متي نتعلم ونستخدم ال css sass ؟

- عندما يطلب سوق العمل هذه المهارة او الشركة التي سوف تعمل لديها تحتاج الي ال CSS SASS من الاخر يعني 😊

- ودا كورس عربي لتعلم ال CSS Sass للمهندس أسامة صاحب قناة الزيرو

ما هو ال Bootstrap