كيف تعمل المواقع الإلكترونية؟

تمارا محمد حسين/ ملهم – هل فكرتَ من قبل ما الذي يحدث عندما تكتب شيئاً ما هنا؟ وما العمليات التي تحدث في الخفاء قبل أن تظهر لك نتائج البحث؟

[siteorigin_widget class=”SiteOrigin_Widget_Image_Widget”][/siteorigin_widget]

في البداية وقبل الخوض في التفاصيل عليك التعرّف على كل من الـ server والـ client.

الخادم (server):

– جهاز ذو إمكانيات عالية أبرزها القدرة على الاتصال بالإنترنت بسرعة فائقة ومصدر كهرباء مستمر.

– يحتوي على جميع الموارد.

العميل (client):

– أجهزة لاستخدامات شخصية مثل الهواتف والحواسيب المحمولة.

والآن بعد أن ميّزت ما هو الـ server وما هو الـ client، دعنا نشرح ما يسمّى بـ Web Request Response Cycle.

ما يحدث هو أنّك أنت كـعميل (Client) عندما تضع عنوان لموقع إلكتروني أو تبحث عن موضوع معيّن فأنت تطلب من الخادم (Server) أن يعطيك نتائج عن ما تبحث عنه (Request) فسيستجيب لك ويقوم بإجراء بحث والعودة لك بنتائج حول ما بحثت عنه (Response).

[siteorigin_widget class=”SiteOrigin_Widget_Image_Widget”][/siteorigin_widget]

في صورة أوضح:

[siteorigin_widget class=”SiteOrigin_Widget_Image_Widget”][/siteorigin_widget]

بشكل مبسّط، Web Request Response Cycle، هو المبدأ الذي تعمل به المواقع الإلكترونية (الطلب والإستجابة) ولتوضيح الصورة أكثر دعنا نأخذ المثال التالي:

لنفرض أنّ ال client هو الزبون وال server هو ال reception الذي يستمع لطلب الزبون في المطعم، ثمّ يقوم الreception بإرسال هذا الطلب إلى المطبخ، فيصبح ال reception هو ال client والمطبخ هو ال server، في هذه الحالة تم إرسال request من الزبون إلى ال reception ثمّ من الreception إلى المطبخ، وعندما يُصبح الطلب جاهز يبعثه المطبخ إلى ال reception وال reception إلى الزبون وهذا هو ال response أي الاستجابة لطلب الزبون.

الجدير بالذكر أنّ ال server دائماً جاهز وعلى استعداد لاستقبال طلب ال client أو ال clients حيث أنه يستطيع استقبال طلبات من أكثر من عميل.

https://www.the8log.com/%d9%85%d9%8a%d8%b2%d8%a7%d8%aa-%d8%ac%d8%af%d9%8a%d8%af%d8%a9-%d9%84%d9%86%d8%b8%d8%a7%d9%85-ios-15-%d9%84%d9%86-%d8%aa%d8%aa%d9%88%d9%81%d8%b1-%d9%81%d9%8a-%d9%87%d9%88%d8%a7%d8%aa%d9%81-%d8%a2%d9%8a/

https://www.the8log.com/%d8%ac%d9%88%d8%ac%d9%84-%d8%aa%d8%b7%d9%84%d9%82-%d8%aa%d8%ad%d8%af%d9%8a%d8%ab%d8%a7%d8%aa-%d8%b9%d9%84%d9%89-%d8%aa%d8%b7%d8%a8%d9%8a%d9%82-%d8%a7%d9%84%d8%aa%d8%b1%d8%ac%d9%85%d8%a9-%d8%b9%d8%a8/

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

Jordan Programmers/ ملهم – كل تقنية أو لغة برمجية جديدة تتعلمها ضمن مجالك هي سلاح تستخدمه في هذه المعركة، وأقدم لك مدخل للحصول على سلاح جديد، على ما يبدو أنه قنبلة 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. المرحلة المتقدمة من CSS
[siteorigin_widget class=”SiteOrigin_Widget_Image_Widget”][/siteorigin_widget]

إليك قائمة ببعض المصادر المساعدة في التعلم

Brad Hussy

CodeAcademy

SASS Officail Guide

Elzero Web School

The Net Ninja

https://www.the8log.com/%d8%a7%d9%84%d8%a8%d9%8a%d8%a7%d9%86%d8%a7%d8%aa-%d8%a7%d9%84%d8%b6%d8%ae%d9%85%d8%a9-%d9%88%d8%a7%d9%84%d8%b0%d9%83%d8%a7%d8%a1-%d8%a7%d9%84%d8%a7%d8%b5%d8%b7%d9%86%d8%a7%d8%b9%d9%8a-%d8%aa%d8%b9/

https://www.the8log.com/%d8%ae%d8%b7%d9%88%d8%a7%d8%aa-%d8%aa%d8%b4%d8%ba%d9%8a%d9%84-%d9%88%d9%8a%d9%86%d8%af%d9%88%d8%b2-11-%d8%b9%d9%84%d9%89-imac/

رأيك بهمنا

رأيك يهمنا

رأيك يهمنا

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
غير راض راض تماماً
* الرجاء تقييم السؤال

رأيك يهمنا

رأيك يهمنا

* الرجاء الاختيار من أعلاه
* الرجاء عدم ترك الصندوق فارغ

رأيك يهمنا

ما مدى سهولة تعاملك مع موقع أمنية الإلكتروني؟ حيث أن 1 صعب جدا و 5 سهل جدا

  • 1
  • 2
  • 3
  • 4
  • 5
غير راض راض تماماً
* الرجاء تقييم السؤال

رأيك يهمنا

رأيك يهمنا

* الرجاء الاختيار من أعلاه
* الرجاء عدم ترك الصندوق فارغ

رأيك يهمنا




شكرا لك على ملاحظاتك

سوف تساعدنا أفكارك في تقديم أفضل خدمة.

اغلق