الفرق بين تطوير الواجهة الأمامية وتطوير الواجهة الخلفية

تتكون مواقع الويب من جزأين: Front-End الجوانب المرئية لمواقع الويب بحيث يتفاعل المستخدمون معها ، وBack-End والتي تشتمل على الجوانب الغير مرئي الذي يجعل الواجهة الأمامية ممكنة. قد يبدو الفرق بين تطوير الواجهة الأمامية والخلفية مربكًا ، نظرًا لأوجه التشابه بينهما في جعل مواقع الويب تعمل بشكل صحيح.

يعمل مطورو Full-Sack مع جميع أجزاء موقع الويب ويستخدمون مهارات Front-End وBack-End.

استمر في القراءة لمعرفة المزيد حول تطوير Front-End مقابل تطوير Back-End ، بما في ذلك المهارات الأساسية المطلوبة لكلا المجالين.

تطوير الواجهة الامامية (Front-End)

يُطلق على جزء موقع الويب الذي يتفاعل معه المستخدم مباشرةً اسم الواجهة الأمامية. يشار إليه أيضًا باسم “Client Side” في التطبيقات.

يتضمن الجوانب المرئية بحيث يتفاعل المستخدمون معها مثل: ألوان وأنماط النص ، والصور ، والرسوم البيانية والجداول ، والأزرار ، والألوان ، وقائمة التنقل. HTML و CSS و JavaScript هي اللغات المستخدمة لتطوير الواجهة الأمامية.

يتم تنفيذ هيكل وتصميم وسلوك ومحتوى كل شيء يتم رؤيته على شاشات المتصفح عند فتح مواقع الويب أو تطبيقات الويب أو تطبيقات الأجهزة المحمولة بواسطة مطوري الFront-End ويتعين على مطوري Front-End أيضًا التأكد من أن موقع الويب يبدو جيدًا على جميع الأجهزة (الهواتف والأجهزة اللوحية وشاشات الكمبيوتر). وهذا ما يسمى تصميم الويب سريع الاستجابة (Responsive Design).

الأدوات المطلوبة لتصبح مطور Front-end

HTML: لغة HTML هي لغة توصيفية لإنشاء صفحات الويب وتطبيقات الويب، وترمز إلى Hypertext Markup Language (أي لغة النص الفائق). تُستخدَم مع لغة CSS و JavaScript لإنشاء صفحات ويب تفاعلية.

CSS: لغة CSS أو صفحات الأنماط (الانسيابية أو المتعاقبة أو المتسلسلة) بالانجليزية: Cascading Style Sheets هي لغة تنسيقية تُستخدَم لوصف التمثيل البصري لمستند ما مكتوب بلغة هيكلية، مثل صفحات HTML أو مستندات XML بما في ذلك ملفات SVG. تُستعمَل عادةً مع لغتَي HTML و JavaScript لإنشاء صفحات وتطبيقات ويب ذات تنسيق جذّاب وواجهات سهلة الاستخدام.

JavaScript:  تُستخدَم لغة JavaScript لإنشاء صفحات ويب تفاعلية، ولتوفير تطبيقات ويب بما في ذلك الألعاب؛ وهي مُستعمَلة من أغلبية المواقع، وتدعمها جميع المتصفحات تقريبًا دن الحاجة إلى إضافات خارجية.

أطر عمل CSS والمكتبات والمعالجات: تم إنشاء هذه الأدوات للمساعدة في تسريع عملية التطوير. بدلاً من كتابة جميع اكواد CSS ، يمكنك استخدام اطر عمل CSS مثل (Bootstrap أو Materialize).

تسمح لك معالجات CSS الأولية مثل Sass و Less بإضافة منطق وادوات إلى CSS الخاص بك. هذه الأدوات تجعل CSS الخاص بك نظيفًا وسهل العمل معه.

تطوير الواجهة الخلفية (Back-End)

يشير تطوير الواجهة الخلفية إلى جزء الذي لا يراه المستخدم. يركز مطورو الواجهة الخلفية على منطق الموقع ، وإنشاء الخوادم ، والعمل مع قواعد البيانات و API (واجهات برمجة التطبيقات).

الواجهات الخلفية، التي تسمى أيضًا جانب الخادم (Server Side) هو الجزء المسؤول عن البنية التحتية للموقع، وكل ما يخص البيانات والتعامل مع قواعد البيانات والخدمات الخاصة بالموقع والجزء الخاص بالحماية وكل ما يتعلق بالنظام وما يحدث خلف الكواليس.

الأدوات المطلوبة لتصبح مطور الواجهة الخلفية (Back-End)

لغة برمجة خاصة بتطوير Back-end: بعض اللغات التي يمكنك استخدامها لتطوير الواجهة الخلفية (Java و Python و Node و PHP). ليس من الضروري تعلم كل هذه اللغات ، ولكن بدلاً من ذلك ، ركز على إحداها فقط.

قواعد البيانات Databases: من المهم لمطور الواجهة الخلفية معرفة كيفية العمل مع قواعد البيانات. قاعدة البيانات في مواقع الويب هي مكان لتخزين وتنظيم بيانات مشروعك. هناك العديد من أنواع قواعد البيانات التي يجب تعلمها ولكن إليك بعض الخيارات الشائعة (SQL، MySQL، MongoDB).

ما هو تطوير Full-Stack

مطور Full-Stack هو شخص يعمل مع كل من الواجهة الأمامية والخلفية لتطبيق الويب. الواجهة الأمامية مسؤولة عن الشكل والمظهر المرئي للموقع ، بينما الواجهة الخلفية مسؤولة عن منطق وراء الكواليس والبنية التحتية للموقع.

شكرا لك على القراءة أتمنى أن المقال قد أفادك وإذا كان لديك أي أسئلة، يمكنك طرحها في التعليقات ، وسأجيب عنها.