محمد_عاطف

إن useRef هو خطاف (Hook) يستخدم لإنشاء مرجع (ref) يمكن ربطه بعنصر DOM أو لتخزين قيمة لا تؤدي إلى إعادة التصيير (re-render) عند تغييرها. الكائن ref هو كائن يحتوي على خاصية واحدة فقط مهمة اسمها: ref.current وهو الشكل الذي تحصل عليه من useRef(). والخاصية current هي التي تخزن القيمة المرجعية للعنصر وهي تتغير حسب الاستخدام: فإذا تم استخدام ref مع عنصر DOM: const myRef = useRef(null); return <div ref={myRef}>Hello</div>; بعد التصيير وبناء العنصر فإن myRef.current سيحتوي على العنصر DOM الفعلي مثل HTMLDivElement: console.log(myRef.current); // <div>Hello</div> وستلاحظ أن الخاصية ref للعنصر هنا تخبر React أن يقوم بإعطاء هذا العنصر DOM مرجع (Reference) وحفظه داخل الكائن myRef.current" إذا تم استخدام ref لتخزين قيمة داخلية لا تؤدي إلى إعادة التصيير وإعادة بناء المكون : const countRef = useRef(0); countRef.current += 1; هنا countRef.current مجرد قيمة رقمية يتم تخزينها وتحديثها بدون أن تقوم بإعادة تصيير المكون.

يوجد العديد من الأدوات والموقاع المتخصصة في ذلك. أولا Sora من OpenAI : حيث تعتبر Sora من أحدث وأقوى الأدوات في مجال تحويل النص إلى فيديو فإنها تتيح إنشاء مقاطع فيديو واقعية واحترافية من وصف نصي فقط وهي مناسبة لسرد القصص المرئية وتصور المفاهيم والمشاهد السينمائية. ثانيا InVideo AI : وهي منصة شاملة تتيح تحويل النص إلى فيديو بجودة عالية مع واجهة سحب وإفلات سهلة الاستخدام.وتوفر مكتبة ضخمة من الصور والفيديوهات والموسيقى المجانية بالإضافة إلى أدوات الذكاء الاصطناعي لتحويل النص إلى كلام وإنشاء فيديو تلقائيا.وهي مناسبة للإعلانات و الشروحات. ثالثا Lumen5 : وهو يركز على تحويل المقالات والمشاركات إلى فيديوهات و يقدم قوالب جاهزة ومكتبة وسائط كبيرة وتختار بشكل تلقائي الصور والمقاطع الصوتية المناسبة للنص. وهو مناسب أكثر للمسوقين ومنشئي المحتوى الذين يرغبون في إعادة استخدام محتواهم المكتوب في شكل فيديوهات. رابعا CapCut AI : وهي أداة سهلة الاستخدام تتيح تحويل النص إلى فيديو خلال دقائق مع إمكانية إضافة ترجمات أو ملصقات أو موسيقى أو مؤثرات أوصور. وهي تدعم إنشاء فيديوهات قصيرة احترافية تناسب TikTok وInstagram و YouTube. خامسا Renderforest : وهي تتيح تحويل النص إلى فيديو بشكل تلقائي مع إمكانية تخصيص الأسلوب والألوان والموسيقى والتعليق الصوتي.

يمكنك البحث عن فكرة لديك تريد تنفيذها وهذا الأمر سيطعيك حافز ودافع للإستمرار في هذا المشروع . أو يمكنك البحث في المواقع وتطبيق أى فكرة تراها جيدة ومناسبة لك. وبما أنك مشترك في دورة جافاسكريبت فيمكنك أنشاء مشروع الملاحظات بنفسك دون الإستعانة بالدروس . أو يمكنك مشروع قائمة المهام (To-Do List) من حيث إضافة وحذف المهام وتعديلها وتعينها كمكتملة أو قيد التنفيذ وأيضا يمكنك إضافة تاريخ للمهام يجب أن يتم إنجازه فيها مثلا و إنشاء مهام لها أولية عليا عن الأخرين . ويمكنك محاولة إنشاء إشعارات بقرب وقت إنتهاء المهمة وهكذا أى فكرة أخرى تجدها مناسبة أثناء التطوير يمكنك إضافتها للمشروع. يمكنك أيضا محاولة آلة حاسبة بسيطة (Calculator). وإذا كنت درست كيفية التعامل مع API فيمكنك أنشاء مشروع عن أحوال الطقس أو المباريات أو أى مشروع يتطلب إرسال طلبات API وإستقبال البيانات منها. وأيضا أنصحك بمشاهدة مسار "تطبيق دردشة يشبه WhatsApp" حيث سيتطيعك معلومات مفيدة وجيدة وأيضا خبرة لك للتعامل مع ال API وأيضا إدارات الحالات في مشروع React.

الفرق بين أيقونات Font Awesome وأيقونات React يكون في طريقة الاستخدام والأداء وسهولة التخصيص. فإن Font Awesome هي مكتبة أيقونات تستخدم في الويب منذ فترة من الزمن ويمكن استخدامها من خلال CDN أى رابط خارجي أو من خلال تثبيت الحزمة من خلال npm أو كعناصر SVG. وهي سهلة الاستخدام مع HTML و CSS وتحتوي على الكثير جدا من الأيقونات المشهورة والمستخدمة بكثرة . ويمكن تخصيص الحجم واللون و الاتجاه بسهولة باستخدام CSS وهي لا تتطلب أى معرفة ب React. ولكن من عيوبها أنه يجب تحميل كل الحزمة حتى الأيقونات التي لا تستخدمها مما قد تؤثر على أداء الموقع . وهي ليس مكتوبة ب React بل تقوم بتضمينها كملف CSS . وتقوم بإستخدامها هكذا مثلا : <i class="fas fa-home"></i> أما React Icons فهي أيقونات مبنية خصوصا للعمل داخل React وتعمل كمكونات (Components). وهي تعمل كمكونات React وتستطيع استيراد فقط الأيقونات التي تحتاجها وليس جميعها كما كان سابقا في font-awesome . ويمكنك التحكم فيها بسهولة عبر props المكونات. ويمكنك إستخدامها وتخصيها هكذا مثلا: import { FaHome } from 'react-icons/fa' <FaHome size={24} color="blue" /> إذا Font Awesome أنسب لك لو كان مشروعك بسيط أو لا يستخدم React بالكامل أو لو أنك معتاد على إستخدامه. أما React Icons لو كنت تعمل بمشروع React وتحتاج لأداء أفضل وأيضا التعامل مع الأيقونات كمكونات.

نعم بالطبع مع مرور الأشهر والتطبيق كثيرا ستكون لك الخبرة الكافية لبناء وتنفيذ أى مشروع.

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

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

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

يجب عليك تنظيم التخصصات بشكل واضح ومنطقي من خلال تقسيم التخصصات إلى فئات رئيسية مثل الطب و الهندسة و التجارة والتكنولوجيا وغيرها مع توفير أيقونات أو صور بصرية توضح وتعبر عن كل فئة. أيضا قم بإستخدام بطاقات معلومات (Cards) من خلال عرض كل تخصص في بطاقة تحتوي على معلومات مفصلة ومختصرة مثل: اسم التخصص. الجامعات التي تقدمه. متوسط درجة القبول. رسوم الجامعات لكل تخصص. نظرة عامة مختصرة عن فرص العمل. أيضا قم بتقديم جدول مقارنة تفاعلي حيث يكون عبارة عن أداة تتيح للطالب اختيار تخصصات مختلفة ومتعددة لعرض مقارنة جنبا إلى جنب لكل تخصص وتشمل الجامعات المتاحة مثلا الرسوم ومدة الدراسة وغيرها . أما بالنسبة إلى البحث فهو أمر ضروري ويجب توفير الفلاتر للطلاب الذين لديهم فكرة واضحة عما يريدون البحق عنه لتتيح لهم التحكم الدقيق في النتائج مثل: الموقع الجغرافي (مثلا المحافظات أو المناطق). نوع الجامعة (حكومية أم خاصة أم أهلية). درجة القبول (الحد الأدنى للتنسيق). الرسوم الدراسية. مدة الدراسة. وغيرها من الفلاتر الأخرى المهمة للطلاب ويفضل جعل الفلاتر مرئية وسهلة الاستخدام مع خيارات واضحة مثل القوائم المنسدلة أو إستخدام checkbox كإختيارات للفلاتر المستخدمة لتضمين أكثر من فلتر معا. وأيضا يفضل أن تضيف خاصية "إعادة ضبط الفلاتر" لتسهيل تجربة المستخدم. أيضا بالنسبة إلى نظام البحث الذكي فيمكنك توفيره لأنه مناسب للطلاب الذين لا يعرفون من أين يبدأون ويمكن أن يعتمد على كلمات مفتاحية مثل "هندسة" أو "طب" مع اقتراحات تلقائية (Auto-suggest) أثناء الكتابة. أما بخصوص عناصر الصفحة الرئيسية فإن الصفحة الرئيسية هي واجهة الموقع ويجب أن تكون جذابة و سهلة الاستخدام وتعكس الهدف الأساسي للموقع لجذب المستخدمين وجعلهم يستخدمون موقعك لفترات طويلة . والعناصر الأساسية تشمل: شعار جيد (Hero Section): فيمكنط توفير صورة أو فيديو قصير يعكس هدف موقعك مثل صور للطلاب بداخل الجامعات. عنوان رئيسي واضح مثل "اكتشف التخصص والجامعة المناسبين لمستقبلك". أيضا توفير شريط بحث بارز ويتيح للطالب البحث السريع عن تخصص أو جامعة. أيضا توفير أقسام رئيسية (Navigation): مثل قائمة تنقل بسيطة تحتوي على التخصصات و الجامعات و نصائح للطلاب مثلا و اتصل بنا وقسم للإستبيان مثلا أو المقترحات . ويفضل جعل القائمة مثبتة (Sticky Navigation) لتسهيل التنقل. أيضا عرض التخصصات الشائعة من خلال قسم يبرز التخصصات الأكثر طلبا مثل الطب و الهندسة و تكنولوجيا المعلومات مع روابط لاستكشاف المزيد من تلك التخصصات لتوفير الوقت على المستخدمين . أيضا توفير قسم الجامعات المميزة من خلال عرض قائمة مختصرة لأفضل الجامعات الحكومية والخاصة مع شعاراتها وروابط لصفحاتها أو موقعها. وأيضا تأكد من التوافق مع الهواتف المحمولةفيجب أن يكون التصميم متجاوب (Responsive) لأن معظم الطلاب سيستخدمون الهواتف وليس الحواسيب وإستخدام خطوط واضحة ومناسبة .

يبدوا أنك قد قمت بتعطيل javascript على متصفح chrome لديك ويجب تفعيله ولو في google فقط حتى يعمل لديك الموقع لأنه يتطلب إستخدام javascript . ويكنك إتباع الخطوات الموجودة في الرسالة لديك . من خلال الضغط على علامة الثلاث نقاط في الأعلى ومن ثم إختيار الإعدادات بعد ذلك قم بالتمرير إلى أسفل والبحث عن "إعدادات الموقع الإلكتروني" وقم بالبحث عن "javacript" وتأكد من تفعيلها والسماح بها.

لا يوجد الأفضل بينهما بل لكل منهما إستخداماته ومميزاته. حيث يعتمد إختيارك على نوع المشروع و خبرتك واحتياجاتك من حيث التخصيص وسرعة التطوير. أولا Bootstrap : من مميزاته أنه : جاهز للاستخدام بسرعة حيث يحتوي على مكونات جاهزة مثل الأزرار والنماذج والجداول وغيرها من المكونات الأخرى. مناسب للمبتدئين و للمشاريع التي تحتاج سرعة في التنفيذ. له مجتمع كبير . أما من عيوبه: فإنه صعب تخصيصه بالكامل حيث ستسحتاج لكتابة CSS إضافي لتغير النمط الافتراضي ب bootstrap. يحتوي على أكواد كثيرة زائد لا تحتاجها كلها في مشروعك. ثانيا Tailwind CSS : من مميزاته أنه : له مرونة عالية في التخصيص حيث يمكنك تصميم الواجهة بحرية تامة. لا يفرض عليك نمط تصميم معين. ينتج أكواد CSS خفيف لأنك تستخدم فقط ما تحتاجه حيث لديه خاصية تقوم بالبحث في ملفات مشروعك وإنشاء تنسيقات CSS المستخدمه فقط. مناسب للمشاريع الحديثة وخصوصا مع React و Vue وغيرها. أما عن عيوبه : أنه يحتاج إلى وقت للتعلم أكثر في البداية ويحتاج إلى خبرة ومعرفة مسبقة بال CSS. من الممكن إحتواء عناصر HTML على classes كثيرة جدا لتطبيق تنسيق معين ما حيث هو يستخدم class مساعدة كل منها تقوم بوظيفة واحدة. لا يحتوي على مكونات جاهزة حيث ستحتاج إلى بناء كل شيء بنفسك أو استخدام مكتبات خارجية. إذا يمكننا القول أنه للمشاريع الاحترافية أو القابلة للتوسع والتطوير يفضل إستخدام Tailwind. أما للمواقع البسيطة أو السريعة يفضل إستخدام Bootstrap. ولكن حاليا أثناء بداية تعلمك يفضل البدأ ب Bootstrap لتفهم الأساسيات ثم يمكنك الإننتقال إلى Tailwind بعد ذلك.

هذه المشكلة خاصة بموقع formsubmit يبدوا انه به عطل حاليا . حيث لا يمكن الاتصال بالخادم الخاص بالموقع . يمكنك اعادة المحاولة مرة اخرى عند حل هذا العطل في الموقع

لاحظ المشكلة تخبرك أنه لا يمكن إرسال النموذج من خلال تشغيل ملف html مباشرة. يبدوا أنك تقوم بفتح ملف htm على جهازك المحلي مباشرة ولهذا تحدث لك تلك المشكلة. يوجد حلان لتلك المشكلة . أولا أن تقوم بفتح الملف في خادم على جهازك مثلا تشغيل إضافة live server في vs code وفتح الملف أى يجب أن يكون عنوان الموقع الذي تفتح الملف منه هكذا : http://127.0.0.1:5500/index.html أما الحل الثاني فهو إضافة الحقل التالي في النموذج لديك وكتابة عنوان الموقع الخاص بك : <input type="hidden" name="_url" value="https://yourdomain.co/contact.html"> أى أن النموذج يجب أن يكون هكذا : <form action="https://formsubmit.co/hxfhfucicic@gmail.com" method="POST"> <input type="hidden" name="_url" value="https://yourdomain.co/contact.html"> <input type="text" name="name" id="name" placeholder="Name" required> <input type="email" name="email" id="email" placeholder="Email" required> <textarea name="message" id="message" cols="30" rows="10" placeholder="Enter your request"></textarea> <button type="submit" class="btn">Send</button> </form> وتأكد من إستبدال "https://yourdomain.co/contact.html" بإسم الموقع الخاص بك .

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

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

نعم الرابط يمكن الوصول إليه لا مشكلة.

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

وعليكم السلام ورحمة الله وبركاته. نعم يوجد فرق بين القيم الرقمية مثل 0.0 و0 أو 1.0 و1 في نطاق الحاسوب عموما ولكن تأثير هذا الفرق يعتمد على السياق وأين يستخدم وكيفية استخدام هذه القيم في تحليل البيانات أو نماذج التعلم الآلي أو غيرها. فالفرق الأساسي هو في النوع حيث 0 و1 هما أعداد صحيحة (Integers) أما 0.0 و1.0 هما أعداد عائمة (Floating-point numbers). أما بخصوص التخزين فإن الأعداد الصحيحة تخزن بدقة تامة وتستخدم مساحة أقل في الذاكرة مثل 32 بت لـ int32. أما الأعداد العائمة فأنها تستخدم مساحة أكبر. أما بخصوص الدقة فالأعداد الصحيحة دقيقة تماما للقيم التي تحفظها . أما الأعداد العائمة قد تؤدي إلى أخطاء دقة في العمليات الحسابية المعقدة خاصة عند التعامل مع قيم صغيرة جدا أو كبيرة جدا حيث لا يستطيع الحاسوب التعامل مع الكسور بشكل دقيق إذا كانت كثيرة. أما بخصوص الفرق في تحليل البيانات : فأولا بخصوص الحسابات ففي معظم تحليلات البيانات إذا كانت القيم متساوية عدديا مثل 0 == 0.0 أو 1 == 1.0 فلن يكون هناك فرق فعلى في النتائج الحسابية الأساسية مثل الجمع أو الطرح.ولكن في العمليات التي تتطلب دقة عالية مثل مقارنة القيم قد تؤدي الأعداد العائمة إلى أخطاء صغيرة على سبيل المثال، مقارنة 0.0 == 0 قد تكون صحيحة لكن مقارنة 0.1 + 0.2 == 0.3 قد تفشل بسبب أخطاء التمثيل العائم . أما بخصوص الأداء فإن الأعداد الصحيحة أسرع في المعالجة وتستهلك ذاكرة أقل مقارنة بالأعداد العائمة مما قد يكون مهما عند التعامل مع مجموعات بيانات ضخمة. وأيضا بعض مكتبات تحليل البيانات مثل Pandas أو NumPy قد تعامل الأعداد الصحيحة والعائمة بشكل مختلف فعلى سبيل المثال إذا كانت البيانات تحتوي على 0.0 بدلا من 0 فقد يتم تحويل العمود إلى نوع float64 بدلا من int32، مما يؤثر على استخدام الذاكرة. import pandas as pd df = pd.DataFrame({'col': [0, 1, 0.0, 1.0]}) print(df['col'].unique()) #array([0., 1.]) print(df['col'].dtype) #float64 حيث لاحظ أن حتى القيم 0 و 1 تم تحويلهم تلقائيا إلى 0.0 و 1.0 لأن هناك قيم float في العمود. ومثلا في One-Hot Encoding : إذا كانت البيانات : [0, 1] فقد يتم إعتبار الفئة فئوية (Categorical) ويتم تحويلها إلى One-Hot. أما إذا كانت: [0.0, 1.0] فقد يتم إعتبارها أعداد مستمرة (Continuous)، ولن يتم تحويلها. لذلك إذا كنت تبني نموذج تعلم آلي فيفضل دائما استخدام ال float لجميع الخصائص العددية. و أن تقوم بتحويل int إلى float إذا كانت القيم مستمرة وليست فئوية . إذا الملخص لما سبق الفرق بين 0.0 و0 أو 1.0 و1 يكمن في نوع البيانات (صحيحة أو عائمة) وطريقة تمثيلها وحفظها في الذاكرة. وفي تحليل البيانات والتعلم الآلي هذا الفرق عادة لا يكون له تأثير كبير ولكنه قد يؤثر على الأداء أو الدقة في حالات محددة مثل العمليات الحسابية الدقيقة أو معالجة البيانات الضخمة. لذلك من المهم اختيار نوع البيانات المناسب بناء على طبيعة البيانات وسياق الاستخدام.

وعليكم السلام ورحمة الله وبركاته. في هذا السطر نقوم بإستخراج الأعمدة ذات القيم الفئوية (categorical) من البيانات الأصلية data_train وتلك الأعمدة هي: orientation و behavior و phase و gesture. هنا المتغير encode غير واضح لأنه لا يظهر في الكود المرفق ولكن غالبا هو ناتج من تحويل الأعمدة الفئوية إلى تمثيل رقمي باستخدام أداة ك OneHotEncoder ومن ثم يتم تحويل الناتج إلى مصفوفة NumPy من خلال toarray() ثم إلى أعداد صحيحة من خلال astype(int) . وهنا يتم إنشاء DataFrame جديد في المتغير encoded_df من هذه البيانات المشفرة في المتغير encoded ومن ثم تحديد أسماء الأعمدة الناتجة باستخدام encoder.get_feature_names_out . وأخيرا يتم حذف الأعمدة الأصلية الفئوية من data_train وهي الأعمدة التي حددناها في المتغير categorical_cols . ومن ثم يتم دمج الأعمدة الجديدة المشفرة encoded_df مع باقي البيانات.و يتم استخدام reset_index(drop=True) لضمان تناسق الفهارس بين DataFrames قبل الدمج. إذا الكود بإختصار يقوم بإستخراج الأعمدة الفئوية من البيانات ومن ثم تشفير هذه الأعمدة وأخيرا دمج الأعمدة المشفرة مع بقية البيانات بعد حذف الأعمدة الأصلية. أما بخصوص تحسينه فلو قصدت جعل الكود أسهل في القراءة فإليك التالي : # استخراج الأعمدة الفئوية categorical_cols = ['orientation', 'behavior', 'phase', 'gesture'] X_cat = data_train[categorical_cols] # تشفير البيانات الفئوية encoded_array = encoder.transform(X_cat).toarray() encoded_columns = encoder.get_feature_names_out(categorical_cols) encoded_df = pd.DataFrame(encoded_array.astype(int), columns=encoded_columns) # حذف الأعمدة الفئوية من البيانات الأصلية X_num = data_train.drop(columns=categorical_cols).reset_index(drop=True) # دمج البيانات الرقمية مع البيانات المشفرة data_encoded = pd.concat([X_num, encoded_df], axis=1)

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

نعم يمكنك تحقيق مبدأ الصفحة الواحدة (Single Page) وذلك باستخدام HTML وCSS فقط دون الحاجة لإستخدام أطر عمل مثل React أو Angular أو Vue أو غيرها . حيث يمكنك إنشاء صفحة طويلة تحتوي على جميع الأقسام التي لديك أو جميع الصفحات معا مثل الصفحة الرئيسية و صفحة عرض المنتجات أو إضافتها وتعديلها . ومن خلال ال css تستطيع إخفاء الأقسام أو الصفحات وإظهارها من خلال الضغط على عناصر a مثلا . ولكن هنا في هذا الأمر بإستخدام Html و Css لا يمكنك تغيير المحتوى ديناميكيا بدون إعادة تحميل الصفحة وأيضا لن تستطيع التفاعل مع الخادم (backend) أو تحميل البيانات وأيضا لن تستطيع إدارة الحالة (state ) كما في React أو Vue. ولهذا إذا أردت ذلك يجب عليك إستعمال Java Script والتعامل والتلاعب بال DOM والعناصر ولكن بالطبع سيكون الأمر معقدا وصعبا إذا كان المشروع أو حجم التلاعب بال DOM كبيرا . وأيضا سيكون بطيئا بالنسبة إلى إستخدام أطر العمل وسيأخذ الكثير من الوقت سواء في التطوير أو غيره . وهذا الأمر لن يكون جيدا لإنشاء مشاريع لأشخاص تستطيع أن تقوم ببيعها لهم وأيضا لا توجد شركات ستقبل بهذا الأمر . لهذا يمكنك التدرب مع نفسك في ذلك ولكن لا يجب أخذ هذا الأمر طريقا لك.

لم تقم بإنشاء التنسيقات الخاصة بهذا الأمر . حيث يجب إخفاء جميع تلك العناصر في الشاشات الكبيرة وفي الشاشة الصغيرة يجب إظهارها وإخفاء الكلاس navbar . ويجب إنشاء كلاس active والذي يشير إلى أنه تم الضغط على زر bars والعناصر تظهر وعند الضغط عليه يجب إخفاء العناصر مرة أخرى من خلال حذف هذا الكلاس. إليك ملفاتcss و js بتعد تنفيذ الأمر يمكنك النظر إلى الكود بهما لتعرف ما الذي تم فيه. main.js style.css

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

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

وعليكم السلام ورحمة الله وبركاته. إن الاستضافة العادية سواء كانت Shared Hosting أو VPS فإنك تقوم بإستئجار مساحة محددة من سيرفر مملوك لشركة ما وهنا أنت لا تتحكم بالنظام بالكامل وتكلفة الصيانة والتبريد والأمان هنا هي مسؤولية الشركة التي تقوم بشراء السيرفر منها . أما السيرفر الخاص Dedicated Server أو Self-Hosted فهنا أنت تمتلك أو تستأجر جهاز سيرفر بالكامل ولك حرية كاملة في البرمجة والتحكم في النظام وغيره وحتى الشبكة نفسها . ويختلف نوع الإستضافة على حجم مشروعك وعلى خصائصه. فالإستضافات المشتركة Shared Hosting إذا كان مشروعك صغير ولا تريد تحكم كامل في الخادم لديك وأيضا إذا كنت تريد إستضافة رخيصة . أم ال VPS فهي للمشاريع الكبيرة ولك تحكم كامل في النظام الخاص بالخادم ويمكنك تخصيصه كما تريده ولكنها مرتفعة في السعر . ويمكنك قراءة التالي لتفاصيل أكثر حول الإستضافات المتاحة والفروقات بينها :