مساعدة في مشروع

السؤال يطلب منك اختيار أي من معالجات CSS ترغب في استخدامها في مشروعك؟

ولذلك إذا تعلمت sass من قبل فيمكنك إختيار Sass فهو الخيار الأكثر شيوعًا والموصى به أو يمكنك إختيار التقنية التي تريدها .
 

و less و stylus ماهم؟

بتاريخ 1 دقيقة مضت قال Hxfhf Ucicic:

و less و stylus ماهم؟

Less و Stylus هما، مثل Sass/SCSS، معالجات CSS أيضاً

تلك معالجات لأكواد CSS  أو بالإنجليزية CSS Preprocessors، وبشكل بسيط جدًا تخيل أنك تبني منزل من خلال قطع Lego، فلغة CSS العادية توفر القطع الأساسية، أما معالجات CSS المسبقة Sass و Less و Stylus توفر قوالب وأدوات سحرية لتجميع تلك القطع بشكل أسرع وأكثر تنظيمًا.

في النهاية، كل ما تبنيه من خلال تلك الأدوات السحرية يتم تحويله أو بالأدق ترجمته إلى قطع ليغو عادية بمعنى أكواد CSS عادية لكي يفهمها متصفح الويب.

ومن خلالها ستتمكن من استخدام ميزات ليست موجودة في لغة CSS مثل المتغيرات لتخزين الألوان والخطوط والأحجام، والتداخل  لكتابة الأنماط المتداخلة بشكل يشبه HTML.

وأيضًا Mixins لإنشاء كود قابل لإعادة الاستخدام، والدوال لإجراء عمليات حسابية أو معالجة للألوان، كذلك تقسيم الملفات لتقسيم كود CSS إلى ملفات صغيرة ومنظمة.

و Sass اختصار لـ Syntactically Awesome Style Sheets هو أشهر وأقدم معالج CSS، وله صيغتان للكتابة هما SCSS و Sass  ولكن SCSS  هي الصيغة الأكثر استخدامًا اليوم، وأي كود CSS عادي هو كود SCSS صالح، بالتالي الانتقال إليها سهلاً جدًا، ويستخدم الأقواس {} والفاصلة المنقوطة ; تماماً مثل CSS.

$primary-color: #3498db;

nav {
  background-color: $primary-color;
  ul {
    list-style: none;
    li {
      display: inline-block;
      a {
        color: white;
        &:hover {
          color: darken($primary-color, 10%);
        }
      }
    }
  }
}

بينما Sass  لا يستخدم الأقواس أو الفواصل المنقوطة، ويعتمد على المسافات البادئة مثل لغة بايثون، وتلك الصيغة أقل استخدامًا الآن.

وبخصوص Less فهو يشبه SCSS إلى حد كبير في طريقة الكتابة، فهو أيضًا يستخدم الأقواس والفاصلة المنقوطة، وكان منافس قوي لـ Sass لفترة طويلة، واشتهر لأنه كان أساس تصميم مكتبة Bootstrap 3.

و Stylus هو الأكثر مرونة من بينهم لكوه يمنحك حرية كاملة في طريقة الكتابة، مثل CSS/SCSS تمامًا من خلال الأقواس والفواصل المنقوطة أو بدونها تمامًا مثل صيغة Sass أو مزيج بين الاثنين.

لذا ما يتم استخدامه حاليًا هو Sass وستجده في الواقع العملي في معظم الشركات والمطورين والمشاريع مفتوحة المصدر مثل Bootstrap 5.