لقد قمنا ببعض التغييرات هنا !

اسمح لنا أن نعرفك على موقع نقرة بحلته الجديدة ! اختر القسم من القائمة لنوضح لك ما الذي حدث !

تنمية المحتوى العربي

الآن , أصبح تركيزنا الأكبر في نقرة على صناعة المحتوى وتعميمه , نعمل بشكل يومي لتوفير مقالات ذات جودة عالية من مصادر موثوقة لتحسين واقع الانترنت العربي, نحن في مهمة - كما الجميع - لتنمية التواجد العربي على الانترنت

لماذا ؟

قمنا ببحث بسيط , و وجدنا نتائج مخيفة ! يتحدث اللغة العربية ما يقارب 310 مليون شخص في حين أن المحتوى العربي لا يزيد عن 0.7% من محتوى الانترنت العام , و نصف هذا المحتوى محتوى غير هادف و أدنى من الجودة الحقيقية للمجتمع العربي , لذا كان لابد لأحدنا أن يتقدم في مسيرة لتحسين واقع الانترنت العربي .

خدمة سؤال و جواب

ملتزمون بدعمنا لجميع خدماتنا السابقة , لا تزال خدمة سؤال و جواب فعالة كما كانت من قبل , الفرق الوحيد هو انتقالها الى رابط فرعي على الموقع

لا تزال هذه الخدمة محل اهتمامنا كما هي محل اهتمام الكثير من مستخدمي الموقع , يمكنكم زيارة موقع خدمة سؤال و جواب من هنا , كل شيئ سيعمل كما كان في الماضي

qa.naqrah.net

ماذا عن حسابي ؟

كل شيئ تماماً كما تركته ! لا يوجد أي تغييرات في حسابات المستخدمين نهائياً

يمكنك تسجيل الدخول , تسجيل الخروج , تعديل بيانات الحساب , الاشتراك بالقائمة البريدية تماماً كما كنت تفعل سابقاً

حسابك الشخصي

تحديث السياسات

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

سياسة الخصوصية و شروط الاستخدام

الخطوات التالية

الآن , بعد أن تعرفت على التحديثات الحاصلة في الموقع , سننتقل للخطوة التالية

نستطيع توفير مقالات مخصصة لك و تتمحور حول اهتماماتك , نحتاج منك أن تعرفنا باهتماماتك! سنفعل ذلك في الصفحة التالية ...

اختيار الاهتمامات
  • تنمية المحتوى العربي
  • خدمة سؤال و جواب
  • ماذا عن حسابي ؟
  • تحديث السياسات
  • الخطوة التالية

ما هي SASS ? وكيف أتعلمها واتعامل معها ؟

ما هي SASS ? وكيف أتعلمها واتعامل معها ؟

عالم التصميم وبالأخص عالم تصميم الويب هو من أشد العوالم تنافسية وقسوة , لنعترف بذلك قبل أن نبدأ في المقال...

لا أعتقد أن هناك من يشاركني رأيي الخاص بأن الدخول في مهنة جديدة هي بمثابة السفر الى الحدود السوفيتية - الألمانية في ذروة الحرب العالمية الثانية , لكن من وجهة نظري الشخصية أرى أن دخولك الى مهنة جديدة أو حتى هواية جديدة هي بمثابة حرب بينك وبين نفسك أو بينك وبين المنافسين , والطريقة الوحيدة للفوز بهذه المعركة هي امتلاكك للأسلحة الحديثة والمتطورة,  ومن جهة برمجية فان كل تقنية أو لغة برمجية جديدة تتعلمها ضمن مجالك هي سلاح تستخدمه في هذه المعركة , وأقدم لك مدخل للحصول على سلاح جديد , على ما يبدو أنه قنبلة CSS الذرية .

ماهي SASS ؟

SASS (Syntactically Awesome Style Sheets) هي عبارة عن محرك أو معالج CSS , يقوم فعلياً باضافة خواص برمجية الى لغة الهيكلة CSS ومعروف عن لغات الهيكلة افتقارها للخواص البرمجية , باستخدامك ل SASS سيمكنك القيام بالعمليات البرمجية ضمن ملف CSS العادي , أو تقريباً ضمنه , تضيف SASS الى أكوادك امكانيات هائلة كالمتغيرات و الجمل الشرطية وأترك لك مهمة تخيل ما يمكنك تحقيقه وانجازه بهذه الميزات , أو حتى كمية الوقت الذي ستوفره باستخدامك ل SASS

SASS ليست لغة برمجية , قد يبدو الأمر كذلك عند التعامل معها لكنها في الواقع هي عبارة عن محرك مبني بلغة Ruby , لا يتطلب سيرفر للعمل لكن تشغيله على جهازك سيحتاج منك بعض الأدوات سنقدمها لك خلال هذه المقالة , وقد يبدو الأمر صعباً للوهلة الأولى , لكن بعد امضائك وقت بسيط في التعامل مع SASS ستقع في حبها بشكل سريع وستجد أن التطور الذي تقدمه هذه التقنية الى حياتك المهنية لا يوصف ! لنأخذ السرعة في التصميم على سبيل المثال , هل تعلم أن التصميم باستخدام SASS اسرع بنسبة 40% تقريباً من التصميم بأسلوب CSS التقليدي ؟ 

يقدم Brad Hussy فيديو بسيط يقارن فيه الفرق بين التصميم بالطريقتين , سترى في نهاية الفيديو أن الصفحة نفسها يتم تصميمها ب 12 دقيقة باستخدام CSS اما SASS فيمكنك انهائها ب 8 دقائق فقط ! قد لا يبدو أمر ال 4 دقائق مهماً للغاية لكن لو قارنا بين الطريقتين بمشروع كامل ستجد ان SASS ستوفر لك ساعات من العمل يمكنك استغلالها بطرق أخرى ...

لم علي استخدام SASS في مشاريعي ؟

كما شاهدتم في الفيديو السابق , تتميز SASS بالسرعة والسهولة , وربما الأمر الأهم هو المرونة والتنظيم الذي ستجلبه معها لمشروعك , ما يميز SASS هو مميزاتها البرمجية العالية , لنأخذ مثالاً خاصية الأقسام , تمكنك هذه الخاصية الرائعة من تنظيم تصميمات مشروعك ضمن أقسام مميزة واستدعائها جميعها ضمن ملف SASS واحد ومن ثم تحويلها الى CSS , بهذه الطريقة لن تضطر للبحث ضمن صفحة هائلة تحتوي جميع أكوادك عن السطر الذي يجعل لون النصوص أخضر , فهنا لدينا ميزة السرعة وأيضاً ميزة التنظيم , وكما ذكرنا في مقال سابق عن أهم الخطوات لتصبح مبرمج أفضل فان الرغية في التطور هي حاجة انسانية غريزية , SASS تعتبر المرحلة المتقدمة من CSS . لنوضح الأمر أكثر عبر ذكر الفوائد كنقاط منفصلة ...

1- السرعة في انجاز المهام

2- التنظيم و سهولة التعديل

3- السرعة في انجاز المهام

4- المرحلة المتقدمة من CSS

 

ما الذي أحتاجه للبدء ؟ 

تكمن فكرة SASS في المعالجة , صفحات HTML الأساسية لا تستطيع قراءة ملفات SASS وتنفيذها , لذا عليك أن تقوم بمعالجتها قبل النشر ولفعل ذلك ستحتاج الى التالي 

1- روبي يمكنك تنصيب روبي من الموقع الرسمي كأي برنامج عادي , نحتاج الى روبي لكون معالج SASS مبني عليها 

2- SASS طبعاً عليك تنصيب SASS على جهازك , يتم ذلك بسهولة عبر سطر الأوامر بكتابة الكود التالي , لكن عليك التأكد انه روبي تم تنصيبه بشكل صحيح والا سيواجهك خطاً

gem install sass

3- محرر أكواد يمكنك استخدام أي محرر أكواد يناسبك , ليس مهماً كالعادة 

4- خيالك  ابدأ الان تخيل تصميمك الجديد , لقد تم تنصيب SASS بنجاح على جهازك ...

ما هي الخطوة التالية ؟ 

بعد أن تم تثبيت SASS على جهازك  يمكنك الآن الشروع في العمل بشكل طبيبعي , ولكتابة أول ملف SASS يمكنك البدء بالخطوات التالية

1- انشاء ملف style.sass وكتابة الكود التالي فيه

body
    background : red

2- معالجة الكود وتحويله ل CSS

توجه الى سطر الأوامر , واذهب الى المجلد الموجود فيه ملف style.sass عن طريق عبارة cd ثم اكتب الكود التالي

 

sass --watch style.sass:style.css

 

الآن مع كل مرة تقوم فيها بحفظ الملف أو تحديثه , سيتم معالجة ملف style.sass واضافة النتيجة الى ملف style.css الموجود في نفس المجلد , وفي حال عدم وجوده سيتم انشائه تلقائياً

3- لا تحب سطر الأوامر ؟ اليك الحل

يمكنك استخدام برامج بواجهات بصرية لمعالجة SASS لكن لا تتوقع مني أن أدعم هذه الفكرة , النتيجة واحدة تماماً , لكن أجد ان سطر الأوامر أسرع وأسهل , أما عن البرامج المفيدة في هذه المهمة فيوجد CodeKit , Koala

ما الفرق بين SASS , LESS , SCSS ؟ 

SASS - SCSS 

لا يوجد فرق ! كلاهما نفس اللغة ونفس المحرك الفرق الوحيد يمكن في طريقة الكتابة , ف SCSS التي ترمز الى Sassy CSS يوجد بها أقواس وسيميكولن , ربما لتكون مقاربة أكثر لطريقة كتابة CSS الأصلية , أما SASS فلا يوجد بها ذلك 

LESS - SASS

كل واحد فيهما محرك منفصل عن الآخر , لا تستحوذ LESS على نسبة كبيرة من المستخدمين مقارنة ب SASS 

اذاً , كيف أتعلم SASS ؟ 

براد هاسي في دورة SASS 

هل ترى هذا الشاب هنا ؟ من وجهة نظري هو مدخلك الأفضل لعالم SASS , صديقنا في الأعلى هو  Brad Hussy مصمم ومبرمج ويب على ما يبدو , ولديه دورات تعليمية متنوعة في مجالات الويب ويتمتع بطريقة القاء ممتعة وبسيطة , لذا ننصحك البدء في التعلم من عنده , عدا عن ذلك , اليك قائمة ببعض المصادر المساعدة في التعلم

Brad Hussy

CodeAcademy

SASS Officail Guid

Elzero Web School

The Net Ninja