eidx00

مقدمة : مفهوم هندسة الويب الجزء الأول

9 ردود في هذا الموضوع

بسم الله الرحمن الرحيم

الحمد لله والصلاة والسلام على سيدنا محمد وعلى آله وصحبه أجمعين وبعد ..السلام عليكم ورحمة الله وبركاته.

ماهي هندسة الويب ؟

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

عندما نسمع كلمة "هندسة" فإن أول ما يتبادر إلى ذهن الواحد منا هو التخطيط والتنظيم أو الترتيب وهذا بالمفهوم العام ولكن عندما نقول "هندسة الويب", عندها فنحن نقصد التنظيم والترتيب ولكن هذه المره ترتيب وتنظيم بناء مواقع الويب أو بجملة أخرى هو أنه كيف نبني موقع ويب بطريقة مرتبة تسهل علينا نقطتين مهمتين وهي :

١- سهولة تطوير الموقع بدون تعديل كل شئ في الموقع أي إضافة اشياء جديدة بدون أن تتأثر الأشياء الموجودة في الموقع بالإضافات الجديدة .

٢- سهولة صيانة الموقع وقت حدوث المشاكل .

ماهي صفحة الويب ؟

صفحة الويب هي عبارة عن صفحة مكونة من ثلاثة طبقات (Layers) كالتالي :

2096e.png

١- Content Layer : أو طبقة المحتويات والمقصود بالمحتويات أي المحتويات الخاصة بالصفحة والمسؤل عن إنشاء هذه الطبقة هو HTML وللتوضيح اكثر فإنه لا يمكنك بناء منزل بدون مخطط او خريطة ولهذا فإن مسؤلية HTML هي بناء المخطط حيث ان HTML تساعدك في ترتيب العناصر على الصفحة وذلك انك تضع مثلاً جدول في الأعلى و نص عريض على الشمال وصورة في الأسفل وهذا الشئ يعتبر ترتيب للعناصر على الصفحة وليس تصميم كما يعتقد العديد فأنت فقط تضع التخطيط للصفحة وهذه هي المسؤلية الحقيقية لـ HTML .

٢- Presentation Layer : أو طبقة العرض والمقصود بالعرض هنا التصميم أي كيف ستظهر صفحة الويب للمستخدم والمسؤل عن إنشاء هذه الطبقة هو CSS وبكلام أخر أي هي التزيين أو التجميل فبعد الإنتهاء من بناء منزل فإن وضع الألوان وتزيين المنزل هي المرحلة الثانية بعد التخطيط له وبناءه ولهذا السبب تأتي مسؤلية CSS هنا حيث أنها تقوم بوضع قناع على صفحة HTML لتزيين التخطيط الذي تم بنائه بواسطة HTML .

٣- Behavior Layer : أو طبقة التفاعل وتترجم أحياناً السلوك والمقصود بشكل عام هو كيف تجعل الصفحة تفاعلية او تتخاطب مع المستخدم والمسؤل عن إنشاء هذه الطبقة هو لغة JavaScript وبإختصار شديد هو أن JavaScript هي كالروح بالنسبة للجسد أو بكلام أخر هو كيف تجعل الصفحة تتحدث والمقصود بكلمة "تتحدث" هو أي كيف تتخاطب مع المستخدم ولكي أسهل عليك الأمر أقول لك أن JavaScript تمكن صفحة الويب من التحدث مع المستخدم وذلك عن طريق معرفة ما يقوم به المستخدم على صفحة الويب حيث تقوم بالرد على طلبات المستخدم وأخذ مدخلاته خلال الصفحة أي بكلام أخر أيضاً أريدك أن تفهم أن JavaScript هي شخص وليست لغة وعندها عندما تتكلم مع شخص فأنت تسأل ويجيب عليك ويسألك وتجيب عليه ! .

وبعد أن أستعرضنا الطبقات الثلاثة لصفحة الويب عندها أقول لك أن بناء صفحة الويب يبدأ من الطبقة الخاصة بلغة HTML والسبب هو أنها هي طبقة التخطيط فلا يوجد منزل بدون خريطة وبعد ذلك تأتي طبقة التصميم CSS ثم طبقة التفاعل JavaScript ويجب أن يكون بناء الموقع بهذا الترتيب لأنه في حالة تم فقد التصميم لأي سبب كان فإن التخطيط يكون سليم فأحياناً بعض المستعرضات يكون عليها بعض القيود فتجدها لا تتعامل مع جافاسكربت اويتم تعطيل جافاسكربت عندها مظهر الموقع بـ HTML معروف لديك مسبقاً إن تم فقد التصميم أو تم تعطيل جافاسكربت.

تم تعديل بواسطه عبدالله عيد
7

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

السلام عليكم و رحمة الله و بركاته...

استاذي عبد الله , اشكرك على سلسلة الدروس هذه و ان شاء الله انا من متابعين ...

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

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

هذه الصورة من احد الكتب تعبر عن وضع لغة قديما و حديثا ...

قديم,,

post-63216-047434900 1279145739_thumb.pn

حديثا ..

post-63216-026443000 1279145776_thumb.pn

تم تعديل بواسطه ahmad123
0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

صورة جميلة ومعبرة وشكراً لك وجزاك الله خيراً على التعقيب

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

بارك الله

مفاهيم مهمة

تحياااااااتي

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

ديما باهرنى باسلوبك تحياتى!

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

بارك الله فيك على المقدمة الرائعة و التي بينت لنا فيها

الطبقات الثلاث للموقع

html

css

javascripte

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

مقدمة جميلة وشرح رائع ....

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

  • يستعرض القسم حالياً   0 members

    لا يوجد أعضاء مسجلين يشاهدون هذه الصفحة .