الواجهة الأمامية هي ما يراه الزائر، والخلفية هي ما يشغّل الموقع فعلًا. شرح مبسط للفرق بينهما وللغات المستخدمة في كل جانب، ومتى تحتاج كلًا منهما.
الواجهة الأمامية هي كل ما يراه الزائر ويضغط عليه داخل المتصفح، والواجهة الخلفية هي المنطق وقاعدة البيانات التي تعمل على الخادم ولا يراها أحد. الموقع التعريفي البسيط قد يحتاج الأولى فقط، أما أي موقع يحفظ بيانات أو يعالج طلبات فيحتاج الاثنين معاً — وهذا وحده يفسر معظم الفروق بين عروض الأسعار التي تصلك.
ما الذي تشمله الواجهة الأمامية بالضبط؟
تشمل الواجهة الأمامية بناء الصفحة وتنسيقها وحركتها: HTML يحدد ترتيب العناصر، وCSS يتحكم في الشكل والألوان والتجاوب مع أحجام الشاشات، وJavaScript يضيف السلوك مثل القوائم المنسدلة والتحقق من صحة النموذج قبل إرساله. كل هذا يعمل داخل جهاز الزائر، ولهذا فإن ثقله يظهر مباشرة في سرعة الموقع. عندما تسمع أن «الموقع بطيء على الموبايل» فالسبب غالباً هنا: صور غير مضغوطة أو ملفات برمجية أكبر مما تحتاجه الصفحة فعلاً.
وما الذي يجري في الواجهة الخلفية؟
تعمل الواجهة الخلفية على الخادم وتتولى كل ما لا يصح أن يحدث في متصفح الزائر: التحقق من كلمة المرور، حفظ الطلب، خصم الكمية من المخزون، إرسال البريد، وتوليد الفاتورة. تُكتب بلغة خادم مثل PHP أو Python، ونحن نبنيها بإطار Laravel. القاعدة البسيطة: أي شيء يجب ألا يستطيع الزائر التلاعب به — سعر، رصيد، صلاحية — لا بد أن يُحسَم في الخلفية، لأن كل ما يصل إلى المتصفح قابل للتعديل من جهة الزائر.
لماذا يرفع وجود «باك إند» تكلفة المشروع؟
لأن الخلفية تحتاج تصميم بيانات واختبارات وحماية، لا مجرد صفحات. الصفحة الثابتة تُنجَز مرة وتُنشر، أما الوظيفة الخلفية فتحتاج تحديد ما تُخزنه وكيف يرتبط ببعضه، ثم معالجة الحالات الاستثنائية: ماذا لو انقطع الاتصال أثناء الدفع؟ ماذا لو ضغط المستخدم زر الإرسال مرتين؟ من له صلاحية حذف سجل؟ هذه الأسئلة هي التي تستهلك الوقت الحقيقي في المشروع، ولهذا فإن موقعاً من عشر صفحات ثابتة وموقعاً من ثلاث صفحات فيها نظام حجز قد يكون الثاني أغلى بكثير.
هل أحتاج لوحة تحكم أم يكفي موقع ثابت؟
تحتاج لوحة تحكم إن كنت ستغيّر المحتوى أكثر من مرة كل بضعة أشهر. المطعم الذي يعدّل قائمته، والعيادة التي تضيف أطباء، والمتجر الذي يغيّر الأسعار — كلهم يحتاجون لوحة، وإلا تحوّل كل تعديل صغير إلى طلب ورسوم وانتظار. أما موقع الحدث الواحد أو الصفحة التعريفية التي لن تتغير فالموقع الثابت أسرع وأرخص وأأمن. اسأل نفسك: كم مرة في السنة سأحتاج تغيير كلمة على هذا الموقع؟ الرقم هو ما يحسم الإجابة.
ما دور قاعدة البيانات وواجهات الربط؟
قاعدة البيانات هي ذاكرة الموقع المنظمة: جداول للمنتجات والطلبات والمستخدمين، وعلاقات تربطها ببعضها. تصميمها في البداية يحدد ما سيكون ممكناً لاحقاً، ولهذا فإن تعديل بنيتها بعد سنة من التشغيل أصعب وأغلى بكثير من ضبطها من البداية. أما واجهة الربط API فهي الطريق الذي يتحدث به موقعك مع نظام آخر — بوابة دفع، شركة شحن، نظام محاسبة، أو تطبيق موبايل. إن كنت تتوقع أي ربط مستقبلي فاذكره في نطاق العمل من اليوم الأول.
هل أحتاج مطوّرَين أم مطوّراً واحداً يجيد الجانبين؟
يعتمد على حجم المشروع لا على تفضيلك. المشروع الصغير أو المتوسط ينفّذه مطوّر يجيد الجانبين — يسمّى مطوّر متكامل — وهذا أسرع وأقل تكلفة لأنه لا يوجد تسليم بيني بين شخصين. أما المشروع الذي فيه واجهة معقدة أو نظام خلفي كبير فيستفيد من تخصص كل جانب لشخص، لأن العمق المطلوب في كل جانب يصعب أن يجتمع بنفس الدرجة في شخص واحد. المهم عملياً ليس عدد الأشخاص بل أن يكون هناك مسؤول واحد أمامك عن التسليم، وألا تجد نفسك وسيطاً بين مطوّرَين يحيل كل منهما المشكلة للآخر.
كيف أقرأ عرض سعر برمجي وأعرف ما ينقصه؟
ابحث في العرض عن أربعة أشياء قبل السعر نفسه: هل يذكر لوحة تحكم ومن يديرها؟ هل يذكر من يملك الكود بعد التسليم؟ هل يفصّل التكاملات المطلوبة بالاسم؟ هل يحدد مدة الدعم وما يشمله؟ العرض الذي يكتب «تصميم وبرمجة موقع» في سطر واحد بلا تفاصيل ليس عرضاً بل رقم. اطلب تقسيم العمل إلى مراحل بمخرجات محددة، فذلك وحده يكشف إن كان مقدّم العرض فهم مشروعك أم قدّر ثمنه بالحدس.
الخلاصة
الواجهة الأمامية تحدد كيف يبدو الموقع ويُستخدم، والخلفية تحدد ما يستطيع فعله وما يحفظه. حين تعرف أي الجانبين يحتاجه مشروعك تصبح قراءة أي عرض سعر أسهل بكثير. للتوسع في اللغات نفسها اقرأ أفضل لغة برمجة لتصميم المواقع.
عندك مشروع ومش عارف يحتاج باك إند ولا لأ؟ ابعتلنا وصف بسيط للي عايز الموقع يعمله وهنحدد لك نطاق العمل قبل أي كلام في السعر.