📱

Get Our Mobile App

Take your business learning on the go!

Download on the App StoreGet it on Google Play

lecture(Html Form)

Razan M.Alshobaki1:04:33

Transcription

اليوم حناذ موضوع جديد هو الـ فورم في اتش تي ام ال. تمام، حكينا أي صفحة ويب لازم يكون فيها فورم. ايش هذا الفورم؟ ها مثال عندكم هذا الفورم. هذا عبارة عن فورم بنحكي عنه فورم تعبئة. هذا الفورم بيتكون من مجموعة من حقول الإدخال، مجموعة من الأزرار، مجموعة من العناوين، كل شي موجود في هذا الفورم. برضه بتصير في اتش تي ام ال، حنشوفه تمام.

أول حاجة عشان أعمل فورم، قبل ما نبدأ بالفورم، صحيح، بدنا نحكي على عنصرين من عناصر الاتش تي ام ال ما حكيناهم، هم عنصر الديف وعنصر السبان، لأنه اليوم حنستخدم الفورم. مين بيعرف ايش الفرق بين الديف وإيش السبان؟ سمعتوا فيهم هدول الطقات؟ التاج الأول اسمه ديف، والتاج الثاني اسمه سبان. وهدول من التاجات اللي كثير بنستخدمهم في الموقع.

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

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

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

هلقيت فكرة الديف، قلنا اختصار ديفيجن، هو عبارة عن عنصر أو عملي تقسيم أو ترتيب للصفحات. كمان فكرة الديف أنه هو من العناصر البلوك. إيش يعني بلوك؟ مين متذكر؟ إيش حكينا في البلوك؟ لا، قلنا البلوك أنه بينزلوا تحت بعض. يعني لو أجيت أنا عملت هذ الديف كتبت فيها كلمة هلو مثلا، واجت كررتها، إيش حيصير؟ حيكونوا تحت بعض. شوفوا كيف الديف هي أساس العناصر، كل ديف عملتهم، هلا حيوا تحت بعض بهذا الشكل. تمام. إذا الديف من العناصر البلوك، حنستخدمها عشان نعمل ترتيب أو تقسيم للصفحات، وحنشوف خلال الشرح لقدام، حتشوفوا قديش حنستخدم الديف.

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

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

نعمل السي إس إس، ركزوا فيها. هلقيت كثير أجى أعمل ريفريش، شايفين كل الألوان ماخذة نفس التنسيق، ما عدا هذه الكلمة أخذت لون ثاني. كيف عملتها؟ بروح بحطها داخل السبان. مثال ثاني، في عندي مجموعة من الصور. تمام. في عندي مجموعة من الصور. هيج، إحنا قلنا الصور كيف بيجوا؟ كلهم على نفس السطر، صح ولا لا؟ لأنهم من العناصر الإنلاين. متذكرين؟ هلقيت لو أنا هدول كل الصور، حتلاقوا أنها الصورة كبيرة، بدي أوصلها في السي إس إس، الإمج، وأعطيها إيش؟ ها متذكرين؟ هاي 100 بكسل وال ويدث تبعها 100 بكسل. هدول خصائص السي إس إس، برضه حنأخذ.

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

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

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

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

هلقيت هذا النوع، حقل الإدخال الثاني، إيش قلت له أنا؟ نمبر. هي بدي أجرب أكتب قاعدة. بكتب أحرف على الكيبورد. هل ظهروا معكم على الأنبوت؟ لا. ليش؟ لأنه قلت له بس أنه الأنبوت تايب تبعه نمبر. لما أجي أدخل أرقام من هون، بيقبل. لكن أجى أدخل له أحرف، مش راضية يقبل. هي بدي أدخل له نجمة وسلاش، اللي هم رموز. جربوا عندكم كمان عشان تتأكدوا. مش حيقل، لأنه أنت قلت له نمبر. يبقى ما بيقبل إلا بس أرقام. وين هذا عادة حنستخدمه؟ في رقم الجوال، صح ولا لا؟ إيش قلت؟ رقم الجوال، رقم الهوية، أي حقل إدخال يحتوي بس على نمبر. فانت بتدخلي له الأنبوت تايب نمبر. يمكن ناس هون تقول لي: إيش الفائدة؟ ما نخليه كله تكست؟ دائما أخليه كله تكست نصوص، وأخلي المستخدم هو حر يدخل؟ لا، هذا الشيء مش صح. لازم تقول لنا أنه إحنا ما بدنا نشتغل شغل عادي، لا بدنا شغل ناس مختلفة. لو أنا كنت حقل الجوال، لو أنا كان عندي فورم أنه يعبي حقل الجوال وخليت له الأنبوت تايب تبعه تكست، لو المستخدم هو اللي غلط واجى حط في رقم الجوال حروف، إجى حط رموز، إجى نحفظ في البيس، طيب وأنا بدي أرجع لرقم الجوال تبعه، حلاقي رقم الجوال تبعه غلط، صح ولا لا؟ عشان هيك نركز في هي الأشياء. حقل الإدخال بداخل الأرقام، يبقى خلص بقول له الأنبوت تايب تبعه نمبر. لكن إذا الاسم، ممكن أحط فيه سلاش، ممكن أحط فيه نجمة، ممكن أحط فيه رقم عادي، بخلي له إياه تكست. لكن رقم الهوية، أجى ألاقي فيه حرف ولا رقم، هذا كله حياثر. افرض أنه أنا مثلا بعمل متجر بيبيع منتجات، وكنت طالبة منه رقم الجوال تبعه، والمستخدم غلط في رقم الجوال وحط أحرف. هو مثلا كان موصي على طلبية، وأنا بدي أجي أرن عليه، رقم الجوال تبعه غلط، صح ولا لا؟ بالتالي حيصير أنا عندي خلل في المتجر تبعي. وهذه الأشياء، فمن الأول يكون شغلكم صح.

إذا أخذنا أنبوت، معناتها حقل إدخال. حقل الإدخال هذا في منه أنواع. في تكست، أدخل إيش ما بدي. في نمبر، أدخل بس أرقام. في عننا أنبوت تايب اسمه ديت. من اسمه ديت، إيش معناتها؟ تاريخ. صح ولا لا؟ وهذا كثير بتكونوا بتفتحوا على موقع، بيجي بقول لك مثلا دخل تاريخ الميلاد تبعك. تروح تكتبي تاريخ الميلاد. لا، هو هون جايب لك زي لوحة تحكم فيها التاريخ، وأنت بتصيري تختاري التاريخ اللي بدك إياه. فب الحالة بكون يبقى لو أنا بعمل موقع وطلب بالتصميم تبعي أن ب يكون هذا الموقع فيه تاريخ الميلاد تبع اليوزر، ما رح أحكي نمبر وأخلي اليوزر هو يحط تاريخ الميلاد. فض ممكن يخطئ فيه. مثلا كمثال، تاريخ الميلاد 5 5 مثلا 2000 ومش عارف إيش. ه ممكن اليوزر يخربط. مثلا ممكن يكون بيكتب قاعد عربي، يجي يكتب ال 2020 بال أول، بعدين 5 6. ممكن تتخربط بين هل هو 5 6 ولا 6 5؟ صح ولا لا؟ فدائما ها الأشياء بنخلي اليوزر هو اللي يدخلها. لا، بكون عارفة كل أنبوت إيش التايب تبعه، عشان أحكم اليوزر بـ إيش يختار.

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

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

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

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

في عننا أنبوت تايب تبعه من نوع يو آر إل. هي أنبوت، بدل تكست، في عننا يو آر إل. من اسمه يو آر إل، إيش معناتها؟ رابط. فلو أنا بدي أحط رابط موقع، بدي أحط رابط صفحة ثانية، مش عارف إيش. فهون هون مش حيسمح لي أحط أي شيء غير يو آر إل، أنه يكون إتش تي تي بي أو دبليو دبليو دبليو. كوم، شيء زي هيك. هذا عبارة عن الأنبوت تايب تبعه يو آر إل.

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

واليوم أنا بعت لكم صورة توضح هذا الكلام. إيش الإجمالي تبعون الأنبوت تايب؟ هي في عننا أنبوت تايب من نوع بوتون، بهذا الشكل، أنه بكون عبارة عن جزء شكل زي الشيك بوكس. هلقيت حنأخذ ر، أنه بيعطيك إياها زي هيك بشكل كر. مثلا هذه الكلر، لايش بنستخدمها؟ لو أنا مثلا بتصفح موقع، والموقع هذا بيبيع ملابس، مثلا، وبدي أختار البلوزة الفلانية، وأختار اللون تبعها، فبكون مسموح لي أني أختار اللون. فبتكون بهذا الشكل. بيقلي الأنبوت من نوع خيني أختار اللون اللي بدي إياه، عشان لما أحفظ تنحفظ في الداتا بيس، ويعرف إيش اللون اللي أنا بدي أختاره. بكون مبين لك كل الألوان الموجودة، وبتصيري تتحكمي في اللون اللي بدك إياه. ثواني أورجيكم كيف، بهذا الشكل. شوفوا [موسيقى]. ظهر لكم ها الأشياء، وبصير أختار اللون اللي بدي إياه، حسب الموقع اللي أنا بكون شغالة عليه. فلما تلاقوا هذه الصورة، هذه عبارة عن أنبوت تايب من نوع ر.

فزي ما قلت لكم، في شغلات كثيرة وأنواع كثيرة للبوت، بتقدروا تشوفوها. منها، في عننا هون الرينج. برضه هذه كثير بنشوفها. مثلا أنا قاعدة، الرينج مثلا، لو أنا قاعدة بأخذ مثلا كورس تعليمي في في الموقع هذا، وبيجي بيقول لي: قديش مدى الاستفادة؟ استفدت منه 60%، 70%. فبكون هذا الرينج، بتصيري تتحكمي فيه. وبيكون شكله بهذه الطريقة، أنبوت تايب من نوع رينج، زي نسبة مئوية بتكون موضحة قدامكم زي هيك، وبصير أتحكم بهذا الشكل. أكيد برضه هذا الشكل بتشوفوه في المواقع. فهون في عننا أنواع كثيرة للأنبوت، زي ما قلت لكم، حبعت لكم صورة اليوم توضح ه الشغلات كلها، وأنتم بتجربوها.

حنأخذ نوعين ثانيين للبوت، وبرضه ها من الأنواع اللي كثير بنستخدمها. النوع الأول أنبوت تايب من نوع راديو، والنوع الثاني الأنبوت تايب من نوع التشيك بوكس. في حد بيعرف إيش الفرق بين الراديو والتشيك بوكس؟ أه، تفضل. أفضل. ممتاز. طيب، وظهورهم على البراوزر كيف بكون؟ ممتاز. ممتاز. إذا في عننا، قلنا نوعين من الأنبوت ثانيين. النوع الأول أنبوت تايب من نوع راديو، والنوع الثاني الأنبوت تايب من نوع التشيك بوكس. بنشوف إيش الفرق بين.

هلقيت لما أحكي له راديو، معناته مسموح لك تختار بس خيار واحد. هذه وين بنشوفها؟ بقصة الميل والفيميل، صح ولا لا؟ ذكر أو أنثى. لما أجي أعبي الموقع، لو اخترت ذكر، بينفع أختار أنثى؟ بس خيار واحد بيكون مسموح لي. صح ولا لا؟ أو مثلا أنا الموقع تبعي فيه قصة بوابات الدفع، في عندي أنواع كثير في الدفع. لو أنا بدي مثلا الموقع تبعي متجر، بدي أدفع فيه، بيكون محدد لي: بدك فيزا؟ بدك هايبر باي؟ بدك باي بال؟ مش عارف إيش. لو اخترت مثلا باي بال، بينفع أدفع الطريقة الثانية؟ صح ولا لا؟ فهون بيكون الخيار من نوع راديو، أنه بس مسموح لك تختاري خيار واحد.

التشيك بوكس لا، مسموح لك أكثر من خيار. وين مثلا التشيك بوكس حنستخدم؟ لو أنا بتصفح في الموقع وبدي أشتري أكثر من منتج، فعادي مسموح لي أختار خمس منتجات، أشتريهم. قد ما بدي بختار. شكلهم على البراوزر برضه بيختلف. الراديو بتكون عبارة عن شكل دائرة. التشيك بوكس بتكون عبارة عن شكل مربع. خليني أورجيكم كيفه. ها الفرق اللي كنا نحكي فيه. هذه الدائرة عبارة عن راديو بوتون. هذه عبارة عن تشيك بوكس. لو أنا أجيت اخترت أ راديو بوتون. وأجت هـ كررت التشيك بوكس بهذا الشكل، زي ما أنتم شايفين، كله بيجي على نفس السطر، لأنه من العناصر الإنلاين المنتس.

هلقيت الراديو بوتون، لما أضغط على هون، بيكون مش مسموح لي أضغط على هون. لو كان عندي زر سبمت، وبدي أعمل هذا الكلام، مبدئيًا، لأنه لسه في شيء عندنا حناخد زر سبمت، هو اللي بيخليني أرسل هذه البيانات على الداتا بيس. فهذه فكرة الراديو بوتون، أنه بس مسموح لي أختار خيار واحد. يعني لو أنا كان عندي زر سبمت وعملت هدول الثنتين، حيحي لي في إيرور عندك؟ لا، أنت هذا راديو بوتون، لازم تختار خيار واحد. لكن التشيك بوكس بهذا الشكل، ها زي ما أنت شايفين شكله، صح؟ وبيكون مسموح لكم تختاروا أكثر من خيار. تمام.

إذا لما يكون عندكم خيارات متعددة، ومنطقياً هذه الخيارات لازم المستخدم بس يختار خيار واحد منها، لازم أحط الأنبوت تايب تبعها راديو. إذا كان مسموح للمستخدم يختار أكثر من خيار، فبكون الأنبوت تبعها تشيك بوكس. ضح الفرق؟ إيش الفرق بين الراديو وبين التشيك بوكس؟ قلت لكم أنواع الأنبوت كثيرة. اليوم حبعت لكم واحدة توضح لكم كل هذا الكلام.

إذا هذا أول نوع من أنواع عناصر الفورم، اللي هو عبارة عن الأنبوت. وهذا الأنبوت فكرته أنبوت عندي حقل إدخال. بداخل حقل الإدخال هذا، بحط الأنواع اللي أنا بدي إياها، حسب حقل الإدخال هذا إيش بدي أخلي المستخدم يدخل فيه. في عننا عنصر ثاني من عناصر الفورم، هو عبارة عن ليبل. إيش يعني ليبل؟ عنوان. صح ولا لا؟ هذا الليبل، زي ما أنتم شايفين، الفورم عندي بكون اسم حقل الإدخال، وتحتيه حقل الإدخال. صح ولا لا؟ فهذا الاسم بكون حاطاه داخل ليبل. ليش مش حاطاه داخل بي؟ مين بيعرف؟ يعني هذا الاسم كان بإمكاني أحطه بين بي، كان بإمكاني أحطه بين أنواع الهيدينج. صح ولا لا؟ هلقيت حنحكي ليش.

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

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

إذا بتلاحظوا، لما أجيت قلت له ليبل، على طول أعطاني معه أتريبيوت، إيش اسمه؟ فور. مين بيعرف لايش بنستخدمه هذا الأتريبيوت؟ أه، تفضل. نـ... على على الأنبوت تبعها. ممتاز. عشان. ممتاز. ممتاز. وهي الفكرة صراحة، برضه اللي بتفرق الفرونت العاديين عن الفرونت اللي محترفين شغلهم. كثير ناس بتعمل الليبل والأنبوت لحال. بدنا نضيف عليه. كل ليبل بدي أعطيه أتريبيوت اسمه فور، وكل أنبوت بدي أعطيه أتريبيوت اسمه آي دي. ما زال بقول آي دي، اسم الآي دي يساوي الكوتيشن هدول. تمام. إيش الفكرة منه؟ هلقيت هذا الليبل، لما أحكي له أن بدي أدخل فيه إيميل، بداخل الفور، بحط أي قيمة تدل على العنوان تبعه. هذا وين حيكون بيلزم؟ في شغل الباك إند. هذا حتريحوا أنتم هون مبرمج الباك. لكن الباك لو استلم منكم هذا الملف، وكل فورم ما كنتوش محاطين الليبل والآي دي تبعه، حيحي: إيش شغل هذا؟ حتتعب الباك. وغير قلت لكم شغلكم مش حيكون كويس. فكل ليبل بعطيه فور، هذا الفور بعطيه قيمة، لازم تكون قيمتها نفس مين؟ قيمة الآي دي الموجودة في الأنبوت. ليش؟ لأنه هون حيصير تبع الباك عارف أنه هذا الليبل مرتبط في الأنبوت هذا. هذا الليبل تبع الباسورد مرتبط في الأنبوت تبع الباسورد. كل ليبل مرتبط في الأنبوت تبعه. إيش حيعرف عن طريق؟ اسم الفور اللي بكون معطاه لليبل، واسم الآي دي اللي بكون معطاه للأنبوت. والأسماء هون ما أروح أحط أسماء عشوائية. كثير بنلاقي هون حاطين لي إكس، حاطين لي واي، مش عارف إيش. لا، لازم تكون أسماء بتدل على الليبل اللي أنا عاملاه. مافيش فيها. لو أجيت قلت له هذا عبارة عن إيميل، ونفس الفور، وين بحطها؟ في الآي دي. وهون الفور والآي دي، بحكي عنهم الأسماء اللي بدي أحطها، بتشبه أسماء المتغيرات. إيش يعني؟ يعني لو أجيت كتبت له الإيميل بهاي الطريقة، بتختلف عن أجت لو كتبت له الإيميل بهاي الطريقة. شايفين ملاحظين الفرق؟ الإيميل هان كحرف سمول، حتفرق أنه حرف كابيتال. فعشان هيك لازم الاسم تبع الفور يكون نفسه الاسم تبع الآي دي، لأنه هيك مش حتعرفوا على بعض. هل هذه بتساوي هذه؟ لا، تساوي بعض. هان في ها الحالة، الحروف إيش بتصير اسمها؟ ولاف، يعني حساسه. يعني الحرف الصغير حيكون مختلف عن الحرف الكبير. فهذ كثير النقطة مهمة أنه في أسماء الفور وأسماء الآي دي لازم يكون نفس الاسم. فلما يجي مبرمج الباك، اطلع ها الأشياء، بيحكي: أه والله هذا الليبل بينتمي لهذا الأنبوت. بدي أعمل ليبل ثاني، مثلا يكون في داخلي الباسورد. إنتر باسورد. وهون إيش الأنبوت حيكون؟ أنبوت تايب من نوع باسورد، صح ولا لا؟ الفور هون بعطيه قيمة بتدل عليه، مثلا قيمة بس. خلص عرفت أنها بتدل على باسورد. وباجي على الأنبوت بعطيه أتريبيوت اسمه آي دي، صح ولا لا؟ وداخل هذا الآي دي، بحط نفس القيمة تبعت قيمة الفور. هذ النقطة واضحة لكم؟

هل بعد ما عملت الليبل والأنبوت، شغلي هيك؟ لس يعتبر 90%؟ مش حتشوف أنت هـ على البراوزر هذا الشغل؟ مش حتشوف هـ على البراوزر في قصة الـ إيش؟ التحقيق. هات أوريك كيف. مثلا نفوت على أي موقع. أه، بجيب لك إياها زي التايتل. أه، برضه ها النقطة أنا هلقيت حكي فيها. إذا بتلاحظي، لما ضغطت عليه، إيش صار في الأنبوت؟ صار زي معلم بلون أسود. صح ولا لا؟ فهذا برضه بدل أنه هذا الفور مربوطة في الآي دي نفسها. بس برضه هذه النقطة وين حتكون مهمة؟ لو جيت عملتي أي تسجيل دخول لموقع، مثلا هي الإيفنت، لما أجي أعمل لوج إن. هذا هذه أنت كفرونت، بس بتصممي تصميم. بيجي تبع الباك، ببرمجها. كيف حيب برمجها؟ حيب برمجها على هذا الأساس، أنك أنت تكوني رابطة الفور والآي دي بنفس العنوان. لأنه هون بيعمل أوثنتيكيشن، وبيعمل إف، ومش عارف إيش، بعمل شغل كثير هـ. فلو هو أجا استلم منك الملف، ولقاك مش عاملة هذا الكلام، في ممكن مبرمجين يرجع لك الملف، يحكي لك: مش يعني، ارجعي اعملي لي هذا الشيء مرة ثانية. في ناس حتلاقيها حكت من وراك: إيش هالشغل؟ مش شغل كويس. مش عارف إيش قالت.

حتى الآن وصلنا إحنا لأنه الشغل تبعكم حيكون 90%. كيف بدي أخليه 100%؟ كل ليبل وأن بوت لازم أحطهم داخل ديف. برضه هذا عشان يكون شغلي احترافي أكثر. فباجي الليبل والأنبوت هدول، عشان هيك اليوم إحنا أخذنا موضوع الديف. باجي بحطهم داخل ديف بهذا الشكل. فبتصير هذول أنا حطاهم داخل ديف. بدي أعمل شيء على الليبل والأنبوت، بدل ما أروح على السي إس إس، أوصل لليبل وأعطيه خصائص، أوصل للأنبوت وأعطيه الخصائص تبعه. لمين بوصل؟ بوصل لهذه الديف اللي فيها الليبل والأنبوت مع بعض، وبعطيها هذه الخصائص. فبص الكود بدل ما عندي هون خمس أسطر في الكود، وهون خمس أسطر، أسطر، بوصل للديف بخمس أسطر. هي وفر علي في قصة الكود. واضحة؟ يعني اليوم لما ناخذ تاسك الفورم، أجى أطلع على الكود، بدي ألاقي كل ليبل إيش مالهم؟ محطوطين داخل ديف. والليبل معطينه أتريبيوت اسمه فور، والأنبوت معطينه أتريبيوت اسمه آي دي، وبنفس الأسماء. تمام. هذ النقطة في حد حكي؟ وبرجع بأكد، أنه لما تكونوا رابطينهم مع بعض الفور والآي دي، حتلاحظوا لما بتضغطي هنا، بيجي التعليمة السودا هذه. فهذول معناته أنهم مربوطين ببعض.

طيب، الليبل والأنبوت برضه. أه، من ضمن الأخطاء اللي أحيانا بنكون شايفينها، بكونوا حاطين الأنبوت قبل الليبل. لا، هو منطقياً كيف بينعرض الشيء هذا؟ تحت هذا، صح ولا لا؟ لاحظنا لما عملنا ديف، إيش صار؟ مين لاحظ شيء؟ اطلعوا على البراوزر. نزلوا لتحت. صح ولا لا؟ فحنا قلنا تو، أنه أنواع الأنبوت إيش مالهم؟ إنلاين المنت، بيجوا كلهم على نفس السطر. فلما أحط كل وحدة بديف، فبصيروا خلص هدول أبعاد عن بعض. أكيد الإيميل حتكون في سطر مختلف عن الباسورد. فعشان هيك بنحط كل وحدة بديف لحالها.

طيب، أخذنا أنواع الأنبوت، وأخذنا الليبل. في عننا عنصر ثاني من عناصر الفورم، اسمه تكست أريا. في حد بيعرف لايش التكست أريا؟ ممتاز. كثير بلاقي، شوفوا شكلها كيف بكون عبارة عن مربع كبير، وبكون مسموح لي أكتب قد ما بدي في المربع. مش زي تو ما أخذنا الأنبوت تايب من نوع تكست، كان بس عبارة عن الحقل الإدخال تبعه كثير صغير. صح ولا لا؟ لكن لو أنا بدي أكون بدي أكتب، هذا وين بتشوفوه؟ مين يحكي لي وين في المواقع؟ أه، تفضل. ممتاز. غيره؟ التعليق. كثير في المواقع، بيجي بقول لك: اكتب لي تعليقك، اكتب لي ملاحظة. صح ولا لا؟ بكون سامح لليوزر أنه يدخل عدد كبير من الأحرف، فبكون الأنبوت تايب تبعه من نوع تكست أريا.

تكست أريا، إيش معناتها؟ شايفين قديش المربع كبير؟ في تكست أريا، في عننا أتريبيوت بياخذها، زي ما أنتم شايفين، النيم. هذ حتكون لمين؟ النيم هذه، لو أنا أجيت عاملة ليبل للتكست أريا، أنه مثلا بدي أحكيله: دخلي ملاحظاتك. وهذ كثير بشوفها، مثلا رايت كومنت. خليني أكتب رايت كومنت. اكتب لي تبع. حكينا الفور لازم يكون مربوط بشيء. التكست أريا هون مش زي الأنبوت، لها آي دي. لها لا، عفوا، لها آي دي. الليبل هـ، فبروح الفور هذه بعطيها نفس الآي دي تبعها. في عننا أتريبيوت اسمه نيم. مين بيعرف لايش النيم؟ النيم هذا القيمة اللي بدي أعطيه إياها، بتتخزن وين؟ في الداتا بيس. فبرضه هذا الشغل تبعون الباك إند، حيكونوا أنكم تريحوا تبعون الباك. لما أجي أكون معطيه مثلا اسم، أنه هذا عبارة عن كومنت، فهـ بيعرف على طول أنه خلص، هذا الأنبوت عبارة عن عبارة عن مربع الإدخال اللي بده يكون المستخدم يكتب فيه الكومنت تبعه. عشان هيك قلت لكم حاولوا المسميات تكون بتدل عليها.

وهـ نفس الشيء، الفور بربطه في الآي دي. في للتكست أريا أتريبيوت ثانية بتاخذهم، اللي هما الكولوم والرو. إيش هدول؟ الكولوم، يعني سي، اختصار لكولوم، عدد الأعمدة. والرو، عبارة عن عدد الصفوف. هدول عبارة عن مين؟ التكست أريا ها. هلقيت لما أجي أحكي له أنه رو 10، يبقى حيكون مسموح لي بس هيك 10. أكثر من 10 مش حيسمح لي. فلو أنا بدي أكبر حقل الإدخال هذا، إيش بصير؟ بكبر الرو والكولوم. مثلا خلي لي إياه 20، وخلي لي الكولومز 50. الكولوم بتمثل عدد الأعمدة، يعني إيش حتمل العرض؟ صح ولا لا؟ الرو بتمثل عدد الصفوف، يبقى حتمل الطول. أجى أعمل ريفريش، زي ما أنتم شايفين، حقل الإدخال عندي كبر بهذا الشكل. كيف كبرته؟ بدل ما أستخدم الهايت وال ويدث، بكبره عن طريق مين؟ الرو والكوم. إيش هذول؟ بتمثل أنه 20 صف مثلا، وهذ عبارة عن 50 كولوم. اوكي. واضحة النقطة؟

هذا التكست أريا. في عننا أنبوت، إذا بتلاحظوا، وين أنا حطاهم كلهم؟ بين تاج البداية والنهاية تبع مين؟ تبع الفور. ما بروح حاطتهم هون برا، لا، بين تاج البداية والنهاية تبعون الفورم.

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

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

في نوع ثاني اسمه ريسيت. مين بيعرف لايش بنستخدم الريسيت؟ من اسمه ريسيت، إعادة شيء، صح ولا لا؟ فالريست هذا بستخدمه لما بكون بدي المستخدم يعيد المعلومات اللي هو كاتبها. فبكون ه التايب مش يعيدهم، يعيد كتابتهم، لا، يرجع شيء للمستخدم. هيك معناتها يرجع بيانات للمستخدم. بصراحة، عادةً، نادر ما بنستخدمه. أغلب استخدامكم حيكون يا إما البوتون من نوع ولا شيء، يعني من نوع بوتون، أنه يكون يعرض بس البوتون يكون كعرض للمستخدم، أو يكون من نوع سبمت إذا كانت هذه البيانات بدي أحفظها عندي أو أوديها على الداتابيز، أوديها على مكان ثاني. تمام.

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

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

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

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

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

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

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

نجي نشتغل مع بعض. لو أنا بدي أعمل نفس هذا الشكل، حاجي على السي إس إس بس أعطيه باك جراوند كر. ها تعرفوها لقدام. في عننا عنصر بدي الديف يمثل كل البراوزر الموجود. فجي لما أجي أقول له باك جراوند كر، خليه هذا اللون مثلاً. تمام. لما أجي أحط الشيء داخل البدي، إيش بعمل؟ البدي كل المساحة البيضاء بخلي لي إياها باك جراوند كر. تمام؟ يبقى البدي بيمثل مين؟ الفيو بورد كلها. لو أنا بدي أعمل شيء على كل فيو بورد، إيش يعني على كل الصفحة الموجودة عندي؟ في عنصر اسمه بدي بيعمل هذا الكلام. هذا حنشوفه في السي إس إس. بس مبدئياً يعني كله حددت له لون خلفي عن طريق خاصية اسمها باك جراوند كر، بتحدد هي اللون الخلفية. نبدأ نشتغل على الأشياء اللي جوا. أول حاجة حكينا في عنا عنصر اسمه ديف، هو اللي حاوي كل هذا الكلام. وهذا الديف زي ما أنتم شايفين في الصورة، إيش ماخذ؟ ماخذ خصائص. إيش هم؟ هذه الخصائص. أول حاجة أنه جاي بالنص. ماخذ هاي وت معينين. إحنا حنعمل الديف الأول، بعدين أحط الفورم. ليش؟ لأنه الديف هدول بيانات الفورم محطوطة داخل ديف، مش الديف محطوط داخل الفورم. فبنشتغل صح أحسن. بجي بداخل قلنا أول حاجة بدي أعمل خصائص على. حاجي أقول له هان الب هاي نعم. أه طبعاً مش مشكلة. هذه النقطة مثلاً 300 بكسل. وشفت أنه ماخذ لون بيضا. فجي بقله باك جراوند لونها أبيض. وقبل الديف بكون حاطتها داخل تاج سنتر. تمام؟ خليه 300. لحتى الآن هي الديف اللي عملناه. بداخل الديف، بنبدأ نحط بيانات الفورم اللي شفنا. قلنا أول حاجة بعمل تاج اسمه فور. وهذا التاج له بداية ونهاية. في حد بحكي شيء؟ لا. هذه الأشياء كلها هي اللي بدي أحطها داخل الفورم. هذه كلها بالفورم. هلقيت بعمل هذا الكلام. لوجن فورم. ممكن تحطوها أي أنواع الهيدين أو أنواع بي. وتعملوا عليها خاصية البود اللي أخذناها. تاج البي. خلينا أجي أحطه مثلاً داخل إتش 3. كان مكتوب فيه لوجن ف. بهذا الشكل. تمام؟ طيب قلنا هدول إيش حعمل؟ ديف واحدة أحط فيها الإيميل والفون. مين يشتغل معي؟ يلا. بداخل هذا الديف إيش حيكون؟ ليبل وان بوت. صح ولا لا؟ زي ما قلت. تبعه من نوع. فيبل كان مكتوب انترون أور إيميل. نكمل. حكينا بنعمل للـ ليبل وان بوت. ولازم إيش نعمل؟ نربط الليبل بالفورم والبوت في الأيدي. صح ولا لا؟ يكون نفس الاسم. مثلاً أجي أحكيله هون إيميل. وهذا الكلام نفسه بحطه داخل الأيدي تبع الانبوت. بهذا الشكل. في عنا كان ديف ثانية فيها الباسورد. صح ولا لا؟ بجي بعمل كوبي بست مثلاً. بس هون إيش حيفرق؟ الليبل كان انتر باسورد. أخلي الفور والآيدي نفس الشيء؟ لا. بجي بقول له ه مثلاً. وخذها نفسها لمين؟ للآيدي. هذا ش كمان حيفرق؟ اللي هو التايب. صح ولا لا؟ لازم يكون من نوع باسورد. طبعاً كتنسيق، هذ في السي إس إس حنشوف كيف ننسق ونعمل ه. بس إحنا لس مبدئياً إتش تي إم إل. بعد هيك حكينا الفورتس ه عبارة عن لينك. رابط. ما زال رابط، بجي بقله ه عبارة عن إيه. بداخل هذا الرابط في جملة اسمها فورت باسورد. وهش إيش بكون؟ بكون رابط صفحة الفورورد اللي أنا بكون مجهزاه. بكون مجهزة صفحة اسمها كلمة المرور ومصممة ومجهزة وبحط ه الرابط تبعها. اسم الصفحة دوت إتش تي إم إل. بتكون تمام؟ طيب بعد هيك إيش في عنا؟ قلنا هذا عبارة عن زر. اللي هو بتت. والتايب حكينا إيش مكتوب كان في كلمة لوجين. والتايب حيكون من نوع سبمت. طبعاً لاحظوا اجوا جنب بعض ليش؟ لأنهم من العناصر الان لاين. إيش أعمل؟ أحطهم بديف عشان يجوا تحت بعض. عشان قلت لكم الديف من الشغلات اللي كثير ح تستخدموها عشان ترتبوا الصفحة أو تخلوا عناصر تحت بعض. هيك تمام؟ طيب آخر حاجة إيش كان عبارة عن بي. مثلاً وعبارة عن لينك رابط. هون أنا بدي أحطها إيه. ليش؟ لأنه قلنا البي من عناصر بلوك. لو حطيتها بي حتيجي السين أب وين تحتها. بخليهم جنب بعض. ممكن أحطها سبان. ممكن أحطها مثلاً إتش أو إتش 6. ممتاز. أرجع أحطها سبان. قلنا سبان انلاين. إيش كان مكتوب فيها؟ ممبر. وتحتيها كان في رابط. الرابط هذا حيكون بين على صفحة الساين أب. طبعاً هذا كله مبدئي. لسه ما فيش في شغل سي إس إس والأشياء اللي أخذناها. بس مبدئياً. في حد عنده أي سؤال في هذه النقطة؟ كيف ينشئ فون؟ وإش هي عناصر الفون؟ في حد عنده سؤال فيها؟