عبدالباسط ابراهيم

هناك بعض المواقع التي تحتوي على تحديات وتمارين بسيطة لمطوري واجهات المستخدم وتكون قريبة لموقع Frontend Mentor: هو موقع DevChallenges: حيث يوجد به تحديات يومية بمستويات بسيطة لتعزيز المهارات في مجال تطوير واجهات المستخدم. كما يوجد مواقع مثل UI Design DailyUplabs: حيث تعتبر هذه المواقع لمشاركة تصاميم واجهات المستخدم. كما أنه في المستوى التالي في ال css خاصة يوجد الموقع التالي CSS Battle: تحديات في تصميم CSS .

يتم تنفيذ الأمر run بالفعل ولكن لا يظهر أي نتيجة في ال terminal بسبب أنك لم تقم بحفظ التعديلات أو الأكواد في برنامج vs code حيث يمكنك الحفظ من خلال الضغط على كلمة file ثم auto save لحفظ التعديلات تلقائياً كما بالصورة التالية وبعد الضغط على هذه الكلمة جرب مرة أخرى وسيعمل معك

بعد تعلمك و إتقانك الأساسيات التي ذكرتها مثل أساسيات البرمجة ولغة جافاسكريبت يصبح من السهل تعلم لغة برمجة أخرى مثل بايثون وبالنسبة لمجال تعلم الآلة بعد الخطوات التي قمت بذكرها في تعليقك تحتاج تعلم استخدام المكتبات الشهيرة مثل Scikit-learn، TensorFlow، Keras، وPyTorch. هذه المكتبات توفر أدوات قوية لبناء وتدريب نماذج التعلم الآلي. تعلم كيفية جمع وتنظيف وتحليل البيانات باستخدام مكتبات مثل NumPy و Pandas. هذا أمر بالغ الأهمية لإعداد البيانات للتدريب على نماذج التعلم الآلي. تطبيق ما تعلمته على مشاريع عملية في مجالات مثل التصنيف، التنبؤ. هذا سيساعدك على بناء معرض أعمال قوي. الخطوات السابقة ليست بشكل مفصل لذلك يفضل الإطلاع على المصادر الموجودة بالتعليقات السابقة للمزيد من التفاصيل بالنسبة لإطار العمل، لا توجد إطارات عمل مثل الويب في تعلم الآلة ( بنفس الفكرة ). ولكن هناك مكتبات ومنصات مختلفة مثل TensorFlow و PyTorch التي تستخدم لبناء وتدريب نماذج التعلم الآلي. اختيار المكتبة المناسبة يعتمد على احتياجات المشروع والخبرة السابقة.

استخدام كلمة "object" في السطر class Node(object) في Python 2.x، هناك نوعان من الأصناف : الأصناف القديمة النمط و الأصناف الجديدة النمط. استخدام كلمة "object" في تعريف صنف يشير إلى أن الصنف هو صنف جديد النمط. تم تقديم الأصناف الجديدة النمط (New-style classes) في Python 2.2 وتوفر نموذج كائن أكثر وقوة مقارنة بالأصناف القديمة النمط (old-style classes ). من خلال التوريث الصريح من `object`، نضمن أن الصنف يتبع نموذج New-style classes ويورث جميع الميزات والوظائف المقدمة من قبل صنف `object`. وتشمل هذه الأمور دعم ميزات مثل super() @property descriptors والتي قد لا تعمل بشكل صحيح مع old-style classes. أما في الإصدارات Python 3.x، لم يعد استخدام كلمة "object" في تعريفات الأصناف ضروريًا، حيث أن جميع الكلاسات هي New-style classes افتراضيًا. لذا، في Python 3.x، يمكنك ببساطة كتابة `class Node:` دون التوريث الصريح من `object`.

يختلف Devin AI عن النماذج الكبيرة مثل Gemini أو ChatGPT .أن ل Devin AI يمكنه إدارة دورة حياة تطوير البرامج بالكامل، بينما تركز LLMs بشكل أساسي على إنشاء الكود. كما أنه يتمتع Devin AI بالقدرة على التعلم الذاتي وتحسين الكود وتحديث العمليات تلقائيًا من خلال تزويده بالأدوات مثل سطر الأوامر ومرر للكود ومتصفح ويب بينما تعتمد LLMs بشكل أكبر على المدخلات البشرية. لذلك يمكن لـ Devin AI اختبار الكود وتصحيح الأخطاء، بينما تتطلب LLMs عادةً تدخلًا بشريًا للتعامل مع الأخطاء. وبالتأكيد أدوات الذكاء الإصطناعي تؤثر على العديد من المجالات بما فيها البرمجة وذلك ليس جديداً ولكن استبدال المبرمج فذلك مستبعد ومع ظهور هذه الأدوات ستحتاج بالفعل تطوير مهاراتك بشكل أكبر واستخدام هذه الأدوات والإستفادة منها حتى لا تتأثر بهذه الأدوات

في التعليقات السابقة تم توضيح ما هو إطار العمل nextjs وفيما يستخدم ولماذا يمكن استخدامه في ال backend وهو بالأساس إطار عمل لل frontend مبني على react وتم توضيح أن express هو إطار عمل لل backend لذلك لإنشاء تطبيق سطح المكتب باستخدام Electron فالأفضل استخدام Express.js لبناء الواجهة الخلفية بدلاً من Next.js للأسباب التالية: Express.js هو إطار عمل مخصص لبناء واجهات برمجة التطبيقات (APIs) والخدمات الخلفية. فهو الأنسب لهذا الغرض. Next.js مخصص أساسًا لبناء تطبيقات الويب . وهو يضيف بعض الميزات مثل توليد الصفحات تلقائيًا عند الطلب، وهذا غير مطلوب لتطبيق سطح المكتب. Express.js سيكون أبسط لاستخدامه لبناء واجهة برمجة التطبيقات فقط دون تعقيدات إضافية. لذلك أوصي باستخدام Express.js لبناء الواجهة الخلفية لتطبيق السطح المكتب بينما ستستخدم Electron لبناء الجانب الأمامي. سيكون أفضل لمشروعك.

كما تم التوضيح في التعليقات السابقة أنه يمكنك تسهيل بناء التطبيق من خلال jquery حيث تسهل عليك مثلاً تعديل عناصر DOM (مثل العناصر، النصوص، الأنماط، الفصول، وما إلى ذلك) بسهولة. تقدم jQuery وظائف بسيطة لإضافة وإزالة وتغيير العناصر في الصفحة. تقدم العديد من الوظائف لإضافة تأثيرات بصرية تسهل jQuery عمليات استخدام تقنية AJAX لتحميل المحتوى بشكل ديناميكي دون إعادة تحميل الصفحة بأكملها. ولها العديد من المميزات الأخرى ولكن معظمها أصبح غير مناسب حالياً حيث أنه تم تطوير العديد من إطار العمل مثل react كما أنه تم تطوير العديد من واجهات المستخدم ل javascript حتى تحل المشكلات التي نستخدم jquery لحلها وللتوضيح أكثر إليك بعض الأمثلة التالية التحقق مما إذا كانت حقل البريد الإلكتروني مملوءًا بشكل صحيح أو لا: // التحقق من صحة حقل البريد الإلكتروني $("#emailField").blur(function(){ var email = $(this).val(); if(email === "" || !isValidEmail(email)) { alert("الرجاء إدخال بريد إلكتروني صحيح."); } }); function isValidEmail(email) { // تنفيذ خوارزمية التحقق من صحة البريد الإلكتروني هنا } يمكنك تحقيق تأثير تحرك لعنصر عند النقر عليه بشكل بسيط // تحقيق تأثير التحرك للعنصر عند النقر عليه $("#myElement").click(function(){ $(this).animate({left: '250px'}); });

هذه المشكلة تحدث بسبب إصدار nodejs وهو 20.6.1 غالباً لذلك حاول تحديث إصدار nodejs ويفضل إلى أحدث إصدار LTS من خلال الرابط التالي https://nodejs.org/en/download/

الأفضل حالياً هو التطبيق العملي وبناء المشاريع المختلفة بالتدريج من التطبيقات البسيطة والمتوسطة إلى التطبيقات الكبيرة والتي بالتأكيد ستتعلم بها الكثير من التقنيات والأساليب المختلفة في مجال تطوير واجهات المستخدم مثل يمكنك الآن التوسع في التقنيات واللغات التي تعلمتها والتعرف على ميزاتها المتقدمة وأفضل الممارسات في استخدامها (كما أخبرتك من خلال التطبيق العملي). لاحقاً يمكنك تعلم أحد إطارات العمل مثل React.js، Angular، أو Vue.js. هذه الأدوات تساعد في تطوير تطبيقات الويب بشكل أكثر كفاءة وسرعة. انضم إلى مجتمعات المطورين عبر الإنترنت، والمنتديات، والمجموعات على وسائل التواصل الاجتماعي للتواصل مع المطورين الآخرين وتبادل الخبرات والمعرفة. من خلال مواصلة التعلم والتطبيق العملي، ستتمكن من تعزيز مهاراتك في تطوير الواجهات وتصبح Frontend Developer أكثر كفاءة وتأهيلاً لفرص العمل المتقدمة في هذا المجال.

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

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

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

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

بالإضافة أيضاً للنصائح الجميلة بواسطة ياسر إليك بعض النصائح التالية لتصبح لديك فرصة كبيرة في الحصول على المشروع أهم خطوة هي بناء موقع شخصي و معرض أعمال جذاب حيث يعتبر ال portfolio هو الذي يجعل العميل يثق في المستقل وجودة الأعمال لديه . وثانياً حاول اختيار المشروع الذى يناسب مهاراتك وتثق أنك تستطيع تنفيذه شكل جيد حيث أنكمن خلال الخبرة في بناء موقع مماثل تستطيع تقديم عرض يطمئن العميل ويثق بك أخيراً من الأخطاء التي يقع فيها البعض هو كتابة المهارات التي تجيدها لكن العميل لا يهتم بما تجيد بل يهتم بما تستطيع أن تقدم له مثال على ذلك بدلاً من تقديم قائمة بالتقنيات التي تجيدها حاول التركيز القيمة التي يمكنك تقديمها للعميل . فبدلاً من ذكر التقنيات مثل React.js و CSS Grid أ و Flexbox يمكنك التوضيح أنه يمكنك تنفيذ واجهة متجاوبة وتعمل على الأجهزة المختلفة بشكل ممتاز وحاول توضيح تأثير ذلك على النشاط الخاص بالعميل

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

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

لتصبح Front-End Developer، فإن تعلم Mongoose و Express ليست ضرورية . Mongoose هو مكتبة تسهل عمليات التفاعل مع قواعد البيانات MongoDB في تطبيقات Node.js، بينما Express هو إطار عمل (Framework) لتطوير تطبيقات الويب بلغة JavaScript على الجانب الخادم. لذلك هذه المهارات خاصة بال Backend Next.js هو إطار عمل لتطوير تطبيقات الويب بلغة JavaScript والتي تعتمد على React.js. يمكن استخدام Next.js في تطوير الجزء الأمامي (Front-End) والجزء الخلفي (Back-End) من التطبيق، ولكنه في الأساس إطار عمل لل Front-End . ويفضل الإطلاع على الإجابات التالية

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

بالإضافة للشرح السابق وحل المشكلة يفضل أيضاً إتباع الخطوات التي يمكن اتخاذها لمعرفة الخطأ فمثلاً في الخطأ الموجود يجب تحليل رسالة الخطأ أولاً وكما يبدو في في رسالة الخطأ أن الخطأ الذي تواجهه هو "TypeError" وحسب رسالة الخطأ "document.getElmentsByClaassName is not a function" يعني أن هناك مشكلة في استدعاء الدالة getElementsByClassName. و تشير إلى أن الخطأ حدث في السطر الثالث من ملف script.js. ومع فحص الكود في السطر الثالث من ملف script.js للتحقق من الخطأ . في هذه الحالة، الكود المكتوب هو document.getElmentsByClaassName وهناك خطأ إملائي في كلمة "getElmentsByClaassName". يفضل الإطلاع على الإجابات التالية

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

بالإضافة أيضاً لما تم شرحه في التعليق السابق يفضل بعض المستخدمين Cmder بسبب أن Cmder يسمح بتخصيص مظهره وسلوكه بشكل كبير، بما في ذلك تخطيط علامات التبويب، والخطوط، والألوان وأيضاً يمكنك استخدام ال Alias بسهولة كمايلي <name-of-alias>=<actual-command> في النهاية، يعتمد اختيار Cmder أو Hd منفذ أوامر على تفضيلات و احتياجات المستخدم.

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

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

كما وضح لك حمزة في التعليق السابق أنه يفضل التعرف على بروتوكول HTTP حيث ستقوم ببناء واجهات برمجية API وبالإضافة للمقالات التي تم الإشارة إليها يوجد بالفعل قسم في الدورة لتعلم ذلك وهو " الواجهات البرمجية APIs " بداخل المسار " التعامل مع البيانات " لذلك سيتم الشرح في الدورة كما أنه إذا كان هناك مفهوم أو موضوع معين يجب عليك معرفته سيتم تنبيهك لذلك من البداية

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