محمد Fahmy

إذا كنت تشعر بأن المعلومات متشتتة قليلاً، فقد يكون من الأفضل بالفعل مراجعة المسار الأساسيات لتثبيت المفاهيم الأساسية قبل الانتقال إلى مسار react.js. ومع ذلك، يمكنك أيضًا الانتقال إلى مسار react.js والعودة إلى المفاهيم الأساسية عند الحاجة. ولكن أعتقد أن الإجابة تعتمد على عدة عوامل، مثل مستوى الثقة بالنفس، والهدف من التعلم، والوقت المتاح، والإمكانيات الشخصية. لكن بشكل عام، أنصح بأن يكون هناك توازن بين المراجعة والانتقال إلى المستوى التالي. فالمراجعة مهمة لتثبيت المعلومات في الذاكرة، ولتصحيح الأخطاء، ولتحسين الفهم. لكن المراجعة لوحدها لا تكفي لتطوير المهارات. فلا بد من التطبيق. لذلك أنصحك بعمل مشروع أو أكثر حتي تتمكن من اللغة, ويوجد الكثير من الفيديوهات التعليمية علي اليوتيوب تشرح كيفية عمل مشاريع باستخدام JavaScript فقط (طبعاً مع HTML و CSS), فقط قم بالكتابة في مربع البحث الخاص باليوتيوب هذه الجملة "vanilla JavaScript projects". فإن الانتقال إلى مسار react.js يمكن أن يكون فرصة رائعة لتطبيق ما تعلمته في مسار أساسيات JavaScript ، ولتعلم مفاهيم وأدوات جديدة، ولإنشاء تطبيقات حديثة ومتطورة. لكن يجب ألا ننسى أن react.js هو إطار عمل مبني على JavaScript ، ولذلك فإن فهم الأساسيات جيدا هو شرط ضروري لإتقان react.js. في نهاية المطاف، يجب عليك اختيار ما يناسبك وطريقة تعلمك الخاصة. حظًا سعيدًا في رحلتك التعليمية!

في البداية أنصحك بمشاهدة هذا الفيديو. وهذه المقالة توضح الطريق بالتفصيل. وهذة المقالة مفيدة جداً في مجال البرمجة بشكل عام. هناك العديد من المواقع والمصادر التي تقدم دورات تعليمية مجانية لتعلم الـ Frontend بمهارة وإحترافية، ومن أهم هذه المواقع: اليوتيوب : يوجد في اليوتيوب العديد من القنوات العربية التي تشرح مسار الـ Frontend بالكامل مثل قناة "Elzero Web School". وهذه بعض النصائح: أولاً - يجب أن تتقن لغات البرمجة الأساسية لل frontend وهي HTML و CSS و JavaScript. هذه اللغات تمكنك من إنشاء وتصميم وتفاعل مواقع الويب بشكل جذاب. ثانياً - يجب أن تطبق ما تعلمته من خلال مشاريع صغيرة وتحديات برمجية تساعدك على تطوير مهاراتك وحل المشكلات. ثالثاً - يجب أن تتعلم المهارات المتقدمة لل frontend development وهي استخدام أطر العمل (frameworks) والمكتبات (libraries) والأدوات (tools) التي تسهل عليك عملية التطوير وتزيد من إنتاجيتك. بعض هذه المهارات هي: تعلم لغة SASS، وهي لغة تضيف مزايا لغات البرمجة في ال code الخاص بك في لغة CSS لتوفير الوقت والإحتراف. تعلم Pug.js، وهي template engine تحصل على مميزات لغات البرمجة أثناء كتابة HTML code. تعلم Gulp.js، وهي أداة تقوم بعمل مهامك المتكررة بالنيابة عنك وبشكل تلقائي. تعلم Bootstrap أو Tailwind، وهما من أشهر اطر العمل لتصميم صفحات الويب. رابعاً - لا تتوقف عن التعلّم، نجحت هذه المجالات من تقنياتٍ معينة، ولكن هناك العديد من التقنيات الجديدة التي يمكنك تحسين مهاراتك بها.

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

تعلم sass مع المكتبة react هو أمر مفيد ومهم لتطوير واجهات المستخدم الحديثة والمتجاوبة. sass هو معالج لغة CSS يسمح بكتابة أنماط أكثر تنظيما وإعادة استخداما وسهولة. react هي مكتبة جافاسكريبت لبناء مكونات واجهة المستخدم القابلة لإعادة الاستخدام والتفاعلية. لكن هل يؤثر تراجع webpack لصالح Vite على استخدام sass مع react؟ الإجابة هي لا. Vite هو أداة بناء جديدة للتطوير تستفيد من وحدات جافاسكريبت الأصلية أو esm. Vite يقدم مزايا عديدة عن webpack والأدوات التقليدية الأخرى، مثل بدء سريع لخادم التطوير وتحديثات سريعة وتجزئة الشفرة. Vite يدعم sass بشكل افتراضي، ولا يتطلب أي إعداد إضافي. كل ما عليك فعله هو تثبيت sass كإعتمادية للتطوير، وإنشاء ملفات sass بامتداد .scss أو .sass، واستيرادها في مكونات react الخاصة بك. ولكن ماذا عن المكتبات الأخرى التي تسهل وتسرع كتابة الأنماط، مثل tailwind؟ هل تحل محل sass أو تتعارض معها؟ الإجابة هي لا أيضا. tailwind هي مكتبة CSS تقدم نظامًا من الفئات(classes) المسبقة التي يمكن استخدامها لإنشاء تصاميم مخصصة دون كتابة أي شفرة CSS. tailwind تعتمد على فكرة CSS الذرية، التي تقسم كل خاصية إلى فئة منفصلة. tailwind توفر أيضًا مزايا مثل التحسينات الأدائية التي تأتي مع المترجم الجديد jit، والذي يولد فقط الفئات التي تستخدمها في المشروع. tailwind لا تحل محل sass، بل تكمله. يمكنك استخدام sass لإنشاء فئات مخصصة باستخدام المتغيرات والحلقات والوظائف وغيرها من المزايا التي يقدمها sass. ثم يمكنك استخدام tailwind لإضافة هذه الفئات إلى عناصر html في مكونات react. كما يمكنك استخدام tailwind لإضافة فئات جاهزة من tailwind إلى عناصر html في حالات لا تحتاج إلى فئات مخصصة.

First Class Function: تعني أن الدوال في جافا سكريبت يمكن استخدامها كمتغيرات وإرجاعها كقيمة من دالة أخرى، ويمكن تمريرها كوسائط لدوال أخرى. مثال: function calc(num1, num2) { return num1 + num2; } const plus = calc; // يتم تخزين الدالة add في متغير sum console.log(plus(8, 4)); // سيظهر الناتج 12 Higher-Order Function: تعني دالة يمكنها استقبال دالة أخرى كوسيط أو إرجاع دالة جديدة. مثال: function calc(num) { return function(x) { return x * num; } } const double = calc(4); // يتم إنشاء دالة جديدة تضرب العدد بـ4 console.log(double(2)); // سيظهر الناتج 8 يمكنك التعمق في Higher-Order Function من خلال موسوعة حسوب. الدوال من المرتبة الأعلى (Higher-Order Functions) و Lambdas - موسوعة حسوب (hsoub.com)

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

هذا الخطأ يحدث عندما يتم منع طلب API من المصادر المختلفة لحماية الأمان (CORS). لمعالجة هذا الخطأ، يجب إزالة هذا الحماية من جانب الموارد التي تريد الوصول إليها او اضافة الـ `Access-Control-Allow-Origin ` header. ولكن يمكنك حل هذه المشكلة من خلال استخدام عدد من الطرق البديلة. يمكنك مثلا استخدام خدمة توفر API للوقت مثل Timezonedb أو Worldtimeapi بدلاً من Timeapi. أو المرور بالطلب من خلال الخادم الخاص بك ثم تمرير البيانات إلى العميل. للحصول على الوقت الحالي باستخدام API Timezonedb و Axios في لغة الجافاسكريبت، يمكنك استخدام الكود التالي: const axios = require('axios'); function getCurrentTime(timezone, apiKey) { const url = `http://api.timezonedb.com/v2.1/get-time-zone?key=${apiKey}&format=json&by=zone&zone=${timezone}`; return axios.get(url) .then(response => { const currentTime = new Date(response.data.formatted); return currentTime; }) .catch(error => { console.log(error); }); } // مثال علي مدينة const timezone = 'Asia/Baghdad'; const apiKey = 'your_api_key_here'; getCurrentTime(timezone, apiKey) .then(currentTime => { console.log('Current time is:', currentTime); }) .catch(error => { console.log(error); }); ضع في الاعتبار أنك ستحتاج إلى التسجيل في Timezonedb للحصول على مفتاح API الخاص بك ووضعه في مكان "apiKey" في الرمز أعلاه. كما يجب تغيير المكان/المدينة المذكورة في "timezone" إلى المدينة التي تريد الحصول على الوقت الحالي لها.

يمكن استخدام معدل الوزن الحسابي لجمع تقييمات المسلسلات والأفلام ولإيجاد التقييم النهائي. يتم ذلك عن طريق ضرب كل تقييم بوزنه وجمعها مع بعضها البعض ، ثم يتم تقسيم الناتج على مجموع الأوزان. للحصول على التقييم النهائي للمسلسل من 1 إلى 10, يمكن استخدام العملية الحسابية التالية: تقييم المسلسل النهائي = ( (تقييم المستخدم الأول × وزن المستخدم الأول) + (تقييم المستخدم الثاني × وزن المستخدم الثاني) + ... + (تقييم المستخدم النهائي × وزن المستخدم النهائي) ) / مجموع الأوزان. على سبيل المثال، إذا كان لدينا ثلاثة تقييمات بالأنجمة (8، 7.5، 9) وزن كل منها هو 2، 3، و 5 على التوالي، فإن التقييم النهائي هو: ((8 × 2) + (7.5 × 3) + (9 × 5)) / (2 + 3 + 5) = 8.2/10 لذا، فإن تقييم المسلسل النهائي يبلغ 8.2 من 10.

للحصول على الوقت الحالي في JavaScript ، يمكن استخدام الدالة `Date()` التي تُرجع الوقت والتاريخ الحالي من النظام. ويمكن الحصول على الوقت بالساعات والدقائق والثواني من خلال استخدام دوال `getHours()`، `getMinutes()` و `getSeconds()` المتوفرة في كائن التاريخ (Date Object). لإظهار الوقت والتاريخ بصيغة محددة ، يمكن استخدام العديد من المكتبات الجاهزة، مثل Luxon وmoment.js لحل المثال الذي ذكرته في سؤالك حول استرداد وقت إضافة المنشور ، فإنك بحاجة إلى تخزين الوقت الحالي عند إنشاء المنشور. ثم يمكن استخدام هذا الوقت في المستقبل لإظهار وقت إضافة المنشور. أنظر إلى الكود التالي تم كتابته باستخدام باستخدام Luxon Library: const { DateTime } = require('luxon'); // Get current date and time const now = DateTime.utc(); // Create a new post and save the timestamp const post = { content: 'المحتوي', timestamp: now.toISO(), }; // Get the timestamp and display in user's timezone const timestamp = DateTime.fromISO(post.timestamp, { zone: 'local' }).toFormat('dd/MM/yyyy HH:mm:ss'); console.log(timestamp); // (e.g. 07/09/2022 18:29:30") ولكي يعمل معك الكود يجب عليك تثبيت مكتبة Luxon من خلال هذا الأمر. npm i Luxon أنصحك بتصفح هذه المقالة فهي تشرح الموضوع بالتفصيل.

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

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

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

Material UI و Tailwind CSS هما إطار عمل CSS تم تصميمهما لتسريع عملية تطوير المواقع والتطبيقات الويب. وعلى الرغم من أن كل منهما يحقق الهدف الرئيسي بتسهيل عملية التطوير، إلا أنهما يختلفان في بعض النواحي. Material UI: - يعد من أكثر الإطارات شهرةً وشعبيةً في مجال تطوير الواجهات - يوفر عددًا كبيرًا من العناصر الجاهزة - يعتمد على مفهوم المكونات، حيث يمكن إعادة استخدام المكونات بكل سهولة في أي مكان بالصفحة - يعمل أفضل مع إطارات العمل مثل React JS Tailwind CSS: - يوفر أسلوبًا بسيطًا في كتابة الشفرة CSS، حيث يمكنك استخدام فئات CSS لتحديد الأنماط - يوفر نطاقًا واسعًا من التخطيطات والأنماط الجاهزة للاستخدام - لا يعتمد على مفهوم المكونات، ويظهر الفرق قويًا فيما يخص التخطيط والتنسيق - يسمح للمطورين بإنشاء أنماط خاصة بهم مباشرةً، وهو يعتبر خيارًا جيدًا للأشخاص الذين يرغبون في إعادة استخدام التصميمات والأنماط التي يتم إنشاؤها مع ذلك يمكنك أن تستخدم الأثنين معًا. في النهاية، يتوقف الاختيار بين Material UI و Tailwind CSS على احتياجات المشروع ومستوى خبرة المطورين. إذا كنت تفضل أسلوبًا بسيطًا في كتابة الشفرة، فيجب عليك اختيار Tailwind CSS. أما إذا كنت ترغب في استخدام مكونات جاهزة، فينبغي عليك اختيار Material UI.

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

تخصص IT هو تخصص يشمل العديد من المجالات المتعلقة بتكنولوجيا المعلومات، ويشمل البرمجة والشبكات والأمن السيبراني والتحليلات والتصميم والتطوير والتحكم في النظم والتطبيقات والمزيد. ويمكن الدخول إلى هذا التخصص من خلال العديد من الجامعات والكليات في العالم العربي والعالمي. بالنسبة لتخصص هندسة البرمجيات، فهو يشمل البرمجة والتصميم والتطوير والاختبار والصيانة والتحكم في الجودة والمزيد. وبالنسبة للنصيحة، فمن المهم أن تتابع دراستك في الثانوية بجدية وتحافظ على مستواك الأكاديمي. كما يمكنك البدء في تعلم البرمجة من خلال الكورسات المجانية على الإنترنت، مثل دورات أكاديمية حسوب أو Codeacademy أو Udemy. وهذه المقالة تشرح لك بالتفصيل خريطة الطريق لتتعلم البرمجة. وهذه بعض النقاشات المفيدة في هذا الموضوع. ما هو التخصص الجامعي المهتم بالبرمجة - حسوب I/O (hsoub.com) ما هو تخصص الحاسوب الجامعي الذي يشمل برمجة و تطوير الويب ؟ - حسوب I/O (hsoub.com)

الخيار الأفضل يعتمد على نوع المشروع ومتطلباته. إذا كان المشروع صغيرًا ولا يحتاج إلى الكثير من التخصيص، فإن استخدام واجهة أو قالب جاهز سيكون خيارًا جيدًا. ومن الجدير بالذكر أن هذه الخيارات تأتي مع محدودية في التخصيص. أما إذا كان المشروع أكبر وأكثر تعقيدًا، فسيكون من الأفضل استخدام إطار عمل (Framework) لإدارة المحتوى. يسمح لك هذا الإطار بتخصيص كافة جوانب الموقع، بما في ذلك تصميم الصفحات وإضافة المزيد من المزايا. لذلك أنصحك بشراء Laravel Content Management System من موقع codecanyon. يوجد فيه الكثير من أنظمة إدارة المحتوي يمكنك تصفحهم من خلال هذا الرابط و هذا. بعد شراء CMS يمكنك تخصيصه كما تريد إذا كنت مبرمج Laravel أو يمكنك أن توظف مستقل ليفعل ذلك من خلال مواقع العمل الحر مثل مستقل.

هذا الفيديو يوضح جميع مجال البرمجة و ما هي التقنيات المطلوبة فيها. ولكن دعنا نوضح في البداية ما هي الغاية من تعلمك البرمجة, بمعني أخر هل تريد تعلم البرمجة للعمل في شركة في بلدك ام تريد تعلم البرمجة للعمل كمستقل في مواقع العمل الحر مثل مستقل وخمسات . تختلف الأجابة علي حسب الغاية لذلك سوف أوضح لك كل الأختيارات. تريد تعلم البرمجة للعمل في شركة في هذه الحالة يجب أن تعرف ما هي التقنيات المطلوبة في الشركات حتي تتعلمها. مثلاً في مصر في مجال تطوير مواقع الويب يجب أن تعرف في البداية أن مجال تطوير مواقع الويب ينقسم إلى قسمين وهما: تطوير واجهات المستخدم Frontend تطوير الواجهات الخلفية Backend وكل مجال من هذه المجالات يستخدم تقنيات مختلفة. وهذه نبذة مختصرة عن تقنيات تطوير واجهات المستخدم Frontend وهذه نبذة مختصرة عن تقنيات تطوير الواجهات الخلفية Backend ويمكنك معرفة تفاصيل مجال تطوير مواقع الويب من خلال هذا الدليل. ولتلخيص كل شئ إذا أردت العمل كمستقل في مواقع العمل الحر فأكثر التقنيات المطلوبة(بالنسبة للوطن العربي) الأن هي: في مجال تطوير المواقع (Laravel, PHP, HTML, CSS, JS) في مجال تطوير تطبيقات الموبيل (Flutter, React Native, Kotlin for android, Swift for IOS) WordPress مطلوب بشكل عام وهذه بعض المقالات المفيدة في هذا الموضوع.

الإجابة على هذا السؤال يعتمد على عدة عوامل، لكن بشكل عام فإن Node.js أسرع في معالجة الطلبات، كما أنه يتميز بقدرته على معالجة المهام المتزامنة بكفاءة عالية. من ناحية أخرى، Laravel هو إطار عمل قوي وشائع في PHP، ويوفر الكثير من الميزات التي يمكن استخدامها في بناء تطبيقات الويب القوية، كما يتميز ببنية قوية تسهل إنشاء تطبيقات كبيرة. بما أن هذا هو مشروع كبير ويتعامل مع معاملات حساسة، فإنه يحتاج إلى دراسة عميقة لتحديد أي منها تناسب المشروع الخاص بك. وهذه بعض المصادر و النقاشات المفيدة. أيهما أكثر انتاجية للمشاريع الصغيرة والمتوسطة Laravel أم Express.js؟ - حسوب I/O (hsoub.com)

الطريقة الأولي يمكن أن تكون المشكلة في إصدار npm جرب تنفيذ الأمر التالي. npm i -g npm@8.5.1 الطريقة الثانية يمكن أن يكون سبب المشكلة هو بطئ النت لديك لذلك قم بتنفيذ هذه الأوامر. npm config set fetch-retry-mintimeout 20000 npm config set fetch-retry-maxtimeout 120000

إليك بعض النصائح لجعل التصميم responsive: 1- استخدام وحدات القياس المناسبة مثل الـ percentages والـ rem والـ em بدلاً من الـ pixels. 2- استخدام الـ media queries لتغيير النمط الأساسي للصفحة باستخدام CSS حسب حجم الشاشة. 3- ـيفضل أنت ستخدام grid systems وflexbox لترتيب العناصر على الشاشة بدلاً من Float. 4- استخدام الـ images والفيديوهات المناسبة لأحجام الشاشات المختلفة. وهذه بعض المقالات المفيدة.

يمكنك استخدام هذا الكود. {checked.forEach((product) => ( <div key={product.id}> <h3>{product.name}</h3> <p>{product.description}</p> </div> ))} في هذا المثال، يتم استخدام forEach() لعرض المنتجات المختارة. يتم تحويل كل عنصر في مصفوفة checked إلى عنصر JSX يتم عرضه في الصفحة. يمكنك استخدام أي عنصر JSX تريده لعرض المنتجات المختارة، ولكن يجب تحديد مفتاح فريد لكل عنصر. أتمنى أن يكون هذا مفيدًا! أخبرني إذا كان لديك أي أسئلة أخرى.

لقد تم شرح الخاصية float بالتفصيل في الإجابات السابقة. ولكن أنصحك باستخدام Flexbox و Grid System فهما أدوات تصميم قوية لتحديد ترتيب العناصر في الصفحة. بدلاً من استخدام float كأسلوب أساسي لتحديد ترتيب العناصر. Flexbox هو نظام تنظيم العناصر الذي تم إدخاله في CSS3. يتيح لتصميمات الويب القدرة على إنشاء أشكال مختلفة للعناصر - مثل تقسيم الشاشة إلى مساحات متساوية وأطوال مختلفة - دون الحاجة إلى عناصر متعددة (div) لتحقيق ذلك. بالإضافة إلى ذلك، يسمح Grid System للمطورين بتحديد ترتيب سلاسل العناصر وعرضها بشكل منتظم في الصفحة. هذا يجعل تصميمات البنية أكثر تنظيمًا وأفضل للقراءة. على الرغم من أن استخدام float لا يزال ممكنًا، إلا أن استخدام Grid System يقلل من وقت التصميم ويجعل التصميم أكثر فعالية في النهاية. عندما يتم استخدام Flexbox و Grid System، يمكن للمطورين الاهتمام بالتصميم والعرض بدلاً من القلق حول كيفية وضع العناصر بشكل صحيح في الصفحة. هذا يجعل تصميم المواقع أكثر دقة ويمكن عرض هذه الصفحات بشكل أفضل على الشاشات المختلفة، بغض النظر عن حجم الشاشة. بشكل عام يجب أن يتم استخدام Flexbox و Grid System بدلاً من عناصر العرض الأخرى مثل float في تقسيم تصميمات الشاشة وتحديد ترتيب العناصر وعرضها بشكل منتظم. هذا يوفر على مطوري الويب الوقت والجهد في إنشاء مواقع أفضل وأكثر فعالية وتنظيمًا. وهذه بعض المصادر لتعلم Flexbox و Grid System.

مجال الأمن السيبراني هو مجال ممتاز يمكن اتخاذه كاحتمال لتحويل شغفك بالبرمجة إلى مصدر دخل. يوجد العديد من المسارات المختلفة في الأمن السيبراني، بما في ذلك الأمان السيبراني العام، والحماية من الاختراق والوقاية من الفيروسات، وأمن التطبيقات، والتحقق من الهوية والوصول. وبالنسبة للشهادات المعتمدة، يمكنك الحصول على شهادات جيدة مثل Security+, CEH، CISSP، وغيرها. إذا كنت ترغب في معرفة المزيد، يمكنك البحث على شبكة الإنترنت عن الشهادات الأمنية والمعايير والمؤهلات والاختبارات. ومع ذلك، فإن السؤال الذي يطرحه الكثيرون هو ما إذا كان الذكاء الاصطناعي سيحل محل مهندسي الأمن السيبراني الذين يعملون على حماية الشبكات والأنظمة من الهجمات الإلكترونية. على الرغم من أن الذكاء الاصطناعي يعد تطبيقًا عظيمًا لتحليل البيانات والتعلم الآلي، إلا أنه لا يمكنه حتي الآن حل جميع مشاكل الأمن السيبراني. فعلى سبيل المثال، فإن المهام الأساسية التي يقوم بها مهندسو الأمن السيبراني مثل اكتشاف الثغرات والتحليل الشامل للأنظمة، لا يزال يمكن الاعتماد عليها بشكل حصري على الخبراء البشريين. ومع ذلك، فإن نمط العمل المركز على الإنسان والمحسَّن بالذكاء الاصطناعي يمكن أن يؤدي إلى زيادة كفاءة مهندسو الأمن السيبراني في أداء مهامهم. على سبيل المثال، يمكن للذكاء الاصطناعي أن يساعد في تقليل الأخطاء البشرية في اكتشاف الثغرات. بشكل عام، يمكن القول أن مهندسي الأمن السيبراني ما زالوا ضروريين لاعتماد خبراتهم في العمليات الضرورية للحماية السيبرانية. ومع ذلك، يمكن أن يكون الذكاء الاصطناعي مساعدًا قيمًا وشاملاً لتحريك المهنةإلى الأفضل، مما يوفر زيادة في الكفاءة وتحسين النتائج في صيانة الأنظمة والشبكات. وهذه بعض المناقشات المفيدة في هذا الموضوع. كيف أستطيع البدء في مجال أمن المعلومات و إكشاف الثغرات؟ - حسوب I/O (hsoub.com)

هناك عدة طرق يمكن استخدامها للقيام بذلك باستخدام HTML و JavaScript. يمكنك الحصول على حقل الإدخال باستخدام getElementById وإضافة مستمع لحدث keypress على حقل الإدخال. ثم يمكنك التحقق مما إذا كان المستخدم قد ضغط على مفتاح “Enter” باستخدام خاصية keyCode أو which من كائن الحدث. إذا تم الضغط على مفتاح “Enter” ، يمكنك استخدام window.location.href لإعادة توجيه المستخدم إلى صفحة جديدة. أنظر هذا الكود. HTML <input type="text" id="myInput"> JavaScript // احصل على حقل الإدخال var input = document.getElementById("myInput"); // قم بتنفيذ دالة عندما يضغط المستخدم على مفتاح في لوحة المفاتيح input.addEventListener("keypress", function(event) { // إذا ضغط المستخدم على مفتاح "Enter" في لوحة المفاتيح if (event.keyCode === 13 || event.which === 13) { // قُم بإعادة توجيه المستخدم إلى صفحة جديدة window.location.href = "newPage.html"; } }); 13 هو كود المفتاح “Enter”. طريقة أخرى هي استخدام jQuery للتعامل مع الحدث keypress والتحقق مما إذا كان المستخدم قد ضغط على مفتاح “Enter”. يمكنك القيام بذلك كما يلي: $("#myInput").keypress(function(event) { if (event.which == 13) { window.location.href = "newPage.html"; } }); طريقة أخرى هي استخدام نموذج HTML وإضافة حدث onsubmit على النموذج Form. يمكنك التحقق مما إذا كان المستخدم قد ضغط على مفتاح “Enter” داخل حقل الإدخال (عند الضغط علي مفتاح “Enter” سوف يتم تشغيل الحدث onsubmit تلقائياً )، وإعادة توجيه المستخدم إلى صفحة جديدة. يمكنك القيام بذلك كما يلي: <form onsubmit="redirect(event)"> <input type="text" id="myInput"> </form> <script> function redirect(event) { event.preventDefault(); window.location.href = "newPage.html"; } </script>

لا يوجد عمر محدد للبرمجة. يمكن لأي شخص تعلمها في أي وقت، بغض النظر عن عمرهم. HTML و CSS مهمان جداً لبناء مواقع الويب و هذا يعني أنك لديك بداية جيدة. يمكنك تعلم لغات برمجة أخرى مثل جافاسكريبت، بايثون، جافا، وغيرها التي ستتيح لك فرص عمل في مجال تطوير البرمجيات. أنصحك بتصفح هذا النقاش فهو يتكلم عن نفس الموضوع. هل يمكن لمن أصبح في الـ 35 من العمر أن يتعلم البرمجة ؟ - حسوب I/O (hsoub.com لن تجد عمل ب HTML و CSS فقط, كان يمكنك العمل بهم قبل 15 سنة من الأن أما الأن فالحد الأدني لمتطلبات العمل يحتاج منك تعلم أكثر من تقنية حتي تصبح جاهز لسوق العمل وهي (في حال كنت تريد أن تصبح مطور واجهات مستخددم). JavaScript jQuery Bootstrap React or Vue Angular يمكنك تصفح هذه المقالة فهي تتحدث بالتفصيل عن هذا الموضوع.