Yomna Raouf

لقراءة الصورة كمصفوفة باستخدام ال matlab يمكنك استخدام الدالة imread:

image = imread('myImage.png');

لتحويل هذه الصورة إلى ال grey-scale يمكنك استخدام الدالة التالية:

I = rgb2gray(image);

لعرض الصورة يمكنك استخدام الدالة التالية:

imagesc(I);

أو 

imshow(I);

أما إذا أردت عرض المصفوفة نفسها يمكنك استخدام الدالة التالية:

disp(I);

في هذا الجزء يتم إضافة المقالات التي قمت بنشرها في حسوب هنا. و حتى تتمكن من نشر مقالات على الأكاديمية من المفترض أن يتم توظيفك كمستقل من قِبَل الأكاديمية. يمكنك أن تبحث عن هذه المشاريع على مستقل و تتقدم لها.

بتاريخ 10 ساعات قال Mr M Ostafa:

لقد انشات مشروع دجانجو بنجاح ولكن عندما اقوم بتفعيل البيئة الافتراضية virtual enviroment يعطي لي هذه الرسالة

 

Using C:/Users/username/AppData/Local/Programs/Python/Python37-32/python.exe (3.7.1) to create virtualenv...
[   =] Creating virtual environment...FileNotFoundError: [Errno 2] No such file or directory: 'c:\\users\\e\\appdata\\local\\programs\\python\\python37-32\\Lib\\venv\\scripts\\nt\\python.exe'

Failed creating virtual environment

[pipenv.exceptions.VirtualenvCreationException]:
Failed to create virtual environment.

iل يمكنك تجربة الأمر التالي في cmd:

 pip install virtualenv

بعد أن يكتمل التثبيت يمكنك استخدام الأمر التالي لإنشاء بيئة افتراضية:

// bash إذا كنت تستخدم 	

source venv/Scripts/activate

// Command Line	إذا كنت تستخدم 

venv\Scripts\activate.bat

// PowerShell	إذا كنت تستخدم 

venv\Scripts\Activate.ps1

بعدها يمكنك إكمال العمل و إنشاء تطبيق django داخل البيئة الافتراضية

بتاريخ 51 دقائق مضت قال Mr M Ostafa:

هذه نتيجة تحميل دجانجو

Installing collected packages: asgiref, pytz, sqlparse, Django
Successfully installed Django-3.1.3 asgiref-3.3.1 pytz-2020.4 sqlparse-0.4.1
 

 

اما بخصوص هذا الامر فلا يعطي لي نتائج 

set PATH=%PATH%;set PATH=%PATH%;'c:\users<USERNAME>\appdata\local\programs\python\python37-32\Scripts'

 

فيما يخص الأمر الأول ، فقد تم تنزيل django بنجاح يمكنك أن تبدأ باستخدامه و إنشاء مشروع django جديد.

أما الأمر الثاني فليس من المفترض أن يعطي نتائج، نقوم باستخدامه حتى نتمكن من استخدام pipenv.

بتاريخ 10 ساعات قال Mr M Ostafa:

نعم تاكدت من ذلك ولا انا لا استخدم WSL

هل يمكنك تجربة تنزيل django باستخدام الأمر التالي كما ينص التوثيق الرسمي ل django و إخباري بالنتائج:

pip install Django==3.1.3

أو 

أرجو أن تتأكد أنك قمت بالخطوات التالية سابقًا.

تنزيل pipenv

pip install pipenv

ثم تشغيل الأمر التالي مع تغيير ال< USERNAME > باسم ال username الخاص بك.

set PATH=%PATH%;set PATH=%PATH%;'c:\users<USERNAME>\appdata\local\programs\python\python37-32\Scripts'

بتاريخ 10 ساعات قال Mr M Ostafa:

اخرج لي هذه الرسالة 

FileNotFoundError: [Errno 2] No such file or directory: 'c:\\users\\e\\appdata\\
local\\programs\\python\\python37-32\\Lib\\venv\\scripts\\nt\\python.exe'

هل يمكنك أن تتأكد أن python موجود في متغيرات النظام الخاصة بك"و ال scripts أيضًا".

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

---

إذا كنت تستخدم "WSL "windows subsystem for linux أرجو إخباري بذلك.

هل يمكنك تجربة الأمر التالي و إخباري هل ظهر لك نفس الخطأ أم لا:

-إذا كنت تستخدم macos/linux

virtualenv venv --python=python3

--إذا كنت تستخدم windows نقوم بتشغيل هذا الأمر في cmd:

virtualenv venv

فيما يخص المشكلة الثانية "django-admin is not recognized" فهذا الخطأ له احتمالين:

• أنك لم تقم بتثبيت django في البيئة الافتراضية virtualenv التي تعمل عليها "أعتقد أنه سبب المشكلة لديك"
• أن الملف diango-amin.py ليس موجودًا في ال Python PATH الخاص بك

كلٌ من هذه المكتبات يعتبر مكتبة ممتازة و يمكنك تعلُم أي مكتبة منهم و لكن أنصح ب React فهي الأكثر شُهرة و طلبًا في سوق العمل هذه الأيام "على كلٍ إذا تعلمت أحد هذه المكتبات و تقدمت إلى وظيفة تطلب مكتبة أخرى سيقومون بتعليمك إيّاها إذا وجدوا أن أعمالك و مهاراتك ممتازة و مناسبة للوظيفة "

أما فيما يخص react native و flutter فلكلٍ منها مزاياه فمثلًا المزايا التي تقدمها react native هي أنك لن تحتاج لتعلم لُغة جديدة حتى تتمكن من تعلمها طبعًا هذا إذا كنت مطور ويب و تجيد JavaScript"ستحتاج لتعلم أساسيات react قبل أن تبدأ ب "react native"  أما حتى تتعلم flutter ستحتاج لتعلم لغة Dart قبلها مما يعني ستحتاج وقتًا أطول بعض الشئ حتى تبدأ بإنشاء تطبيقات و تعلم flutter أيضًا تطبيقات flutter أداءها أفضل من أداء تطبيقات react native قليلًا "الفرق ليس كبير بينهم" و لكن إذا قمت بعمل بعض من ال code optimization لأكواد react native سيصبح أداؤها مثل أداء التطبيقات التي تم بناءها ب flutter. أما من جهة المجتمع فالمجتمع و المصادر الخاصة ب react native أكثر بعض الشئ من  flutter و هذا لأن react native أقدم من flutter و لكن المجتمع حول flutter في تزايد مستمر الآن. 

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

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

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

بعد أن قمتي بأخذ دورة تطوير واجهات المستخدم يمكنك أن تبدأي في القراءة عن html و css و JavaScript أيضًا يمكنك أن تبدأي بالقراءة عن مواضيع مثل UI/UX أي واجهة المستخدم و تجربة المستخدم و مواضيع متعلقة بالتصميم.

لا أنصح باستخدام الكتب في لتعلم البرمجة في الحقيقة فهي في معظم الأحيان تكون قديمة و محتواها غير مواكب للتحديثات من الأفضل قراءة المقالات.و يوجد العديد من المصادر التي يمكنك القراءة منها مثل "دروس و مقالات" الخاصة بأكاديمية حسوب إذا كنت تحبين القراءة باللغة العربية أو من مدونات مثل css tricks و hackernoon و غيرها إذا كنت تحبين القراءة باللغة الإنجليزية. أيضًا يوجد بعض الكتب الجيدة إذا كنت تفضلين قراءة  الكتب مثل Eloquent javascript أيضًا يوجد مجموعة من الكتب الجيدة في أكاديمية حسوب متعلقة بأكثر من لغة يمكنك أن تبدأي بالقراءة منها فأغلب هذه الكتب حديثة و مفيدة.

يعتمد تعلم البرمجة على التطبيق العملي لما تتعلمه فمشاهدة السلاسل التعليمية تباعًا "في فترة زمنية قصيرة" دون التطبيق العملي لن يفيد في شيء.

يوجد العديد من المواقع التي يمكنك أن تبدأ بممارسة اللغة و حل بعض المشكلات, منها:

• hackerrank
• edabit

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

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

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

 ستجد  الكثير من المشاريع إذا قمت بالبحث عن javaScript projects for beginners.

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

إذا كنت تريد أن تصبح مطور مواقع يمكنك أن تبدأ بتعلم أساسيات البرمجة و مفاهيمها الأساسية التفكير المنطقي و الخوارزميات و بعدها يمكنك أن تنتقل لتعلم لغات مثل html و css و javaScript و الذين يتم استخدامهم لبناء واجهات المستخدم "واجهة الصفحات التي يتعامل معها المستخدم" و بعدها تتعلم مكتبة لبناء واجهات المستخدم مثل React.js مثلًا بعدها يمكنك الانتقال إلى تعلم كيفية بناء ال backend "" باستخدام node.js و express "يستخدمان لغة جافاسكريبت" أو laravel "تستخدم لغة php" "" و قواعد البيانات مثل mongodb و postgresql.

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

بالتوفيق.

يوجد العديد من الإضافات الخاصة ب Affiliate Program WordPress Plugins التي يمكنك استخدامها.و هذه صورة توضح أفضل عشر إضافات لهذا الغرض بناءً على ما ذكر في المدونة الخاصة ب WordPress نفسها:

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

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

يوجد طريقتين لإضافة التنسيقات داخل ملف html نفسه.

• الأولى هي ال inline style و هي إضافة التنسيقات ك attribute داخل الوسم الذي بريد إضافة التنسيقات له، مثلًا:

  <!-- إضافة تنسيقات للفقرة لتغيير لون الخط و حجمه و ثِقله -->
  <p style="color: grey; font-weight:500; font-size:20px;" > This is a paragraph </p>

   

• الثانية هي ال embedded style و هي إضافة التنسيقات داخل وسم style داخل القسم head، مثلًا:

  <head>
    
    <!--  و نبدأ بإضافة التنسيقات التي نريدها style نقوم بتحديد الوسوم التي نريد إضافة التنسيقات لها داخل  -->
    <style>
     
      p {
        color: grey;
        font-size: 500;
        font-weight: 20px;
      }
      
    </style>
    
  </head>
  <body>
    <p> This is a paragraph </p>
  </body>

   

و لكن لا يُنصح أبدًا بهذه الطريقة، فمن الأفضل أن تكون التنسيقات في ملف منفصل بمفردها عن الملف الذي يحتوي أكواد html. و هذا لعدة أسباب منها:

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

و غيرها. فقديمًا عندما نشأ الويب كانت الطريقة المتبعة هي كتابة أكواد html و css و js في ملف واحد و لكن بسبب المشاكل التي واجهت المطورين تم فصل كل منهم في ملف بمفرده تحت ما يسمى separation of concerns فصل الاهتمامات و أصبح هذا العرف المتبع إلى الآن.

يوجد أكثر من طريقة يمكنك تنفيذها لإصلاح هذا الأمر:

-- نقوم بتشغيل ال power troubleshooter و نقوم بالفحص.

1. نضغط على Windows key + X Press   ثم نضغط على ال Control Panel.
2.  ننقر نقرًا مزدوج على  troubleshooting ثم view all.
3. نضغط على power ثم next لتشغيل ال power troubleshooter.
4.  نقوم باتباع الخطوات التي تظهر على الشاشة لاتمام العملية، بمجرد أن تتم العملية نغلق جميع النوافذ و نعيد تشغيل الجهاز. 

--  يمكنك اتباع الخطوات الموجودة تحت قسم  “Make your PC sleep” من هنا، فربما تساعدك

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

بالتوفيق.

يمكنك استخدام أي لغة من اللغتين، لغة جافاسكريبت قديمًا كانت تعمل في المتصفح فقط في بناء الواجهات الأمامية للمواقع. و لكن الآن أصبحت تستخدم في البرمجة الخلفية أيضا بفضل بيئة العمل node.js"و هي runtime environment مكنتنا من استخدام جافاسكريبت خارج المتصفح" و إطار العمل express"إطار عمل لبناء ال backend". و لكن يوجد فرق يجعل javascript تتفوق على php في برمجة المواقع. و هي طريقة تنفيذ الأكواد حيث أن لغة جافاسكريبت non blocking أي أنها لا تنتظر أن يتم تنفيذ عملية ما حتى تنتقل إلى التي تليها مثل php مما يجعل أداؤها أفضل من php.

كما أن لغة javascript مجالها أوسع حيث يمكنك بناء تطبيقات ويب و تطبيقات هواتف باستخدام مكتبة react native و تطبيقات سطح مكتب باستخدام مكتبة electron و بناء تطبيقات virtual reality و يمكن استخدامها في مجال تعلم الآلة و مجال برمجة المتحكمات الدقيقة و الروبوتات  و غيرها كل هذا باستخدام لغة واحدة فقط و هذا ما لا توفره لغة php.

و في النهاية اختيار التقنيات يتوقف على المشروع الذي تريد بناؤه.

مرحبًا علي.

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

في الجزء الأول من الأكواد الخاص ب useEffect من المعروف أن هذا ال hook يتم تنفيذه مرة واحدة فقط عند تحميل المكون و في المثال الذي أرفقته عند تحميل هذا المكون يقوم useEffect بتغيير قيمة خطاف الحالة fetching إلى true ثم يقوم بجلب البيانات الخاصة بالمنتجات عن تطريق الدالة fetchProducts و نقوم بالتقاط أي أخطاء قد تحدث في عملية جلب بيانات المنتجات هذه و نجعل قيمة خطاف الحالة error تأخذ قيمة رسالة الخطأ و هذا يتم باستخدام التابع catch في النهاية بعد أن يتم جلب البيانات الخاصة بالمنتجات بطريقة صحيحة نقوم بتغيير قيمة خطاف الحالة fetching إلى false و هذا الجزء الخاص بالتابع finally.

أما في الجزء الثاني من الأكواد الخاص ب useFocusEffect، فهو يعتبر HOOK خاص ب React Navigation. يستخدم هذا الخطاف في التطبيقات عندما نريد إضافة side-Effect، و هذه التأثيرات الجانبية قد تتضمن أشياء مثل إضافة مستمع أحداث، أو جلب بيانات، ....إلخ.

مثلًا في حالتنا التأثير الجانبي هو إعادة التحميل. Refresh.

و الخطاف useFocusEffect مماثل للخطاف useEffect. الفرق الوحيد بينهما هو أن useFocusEffect يعمل إذا كنا نركز على الصفحة حاليًا.و التأثير سيعمل عندما تتغير الاعتماديات التي يتم تمريرها React.useCallback"خطاف"، مثلًا ستعمل عند عملية ال render الابتدائية (if the screen is focused) و أيضًا إذا تغيرت الاعتماديات.

import { useFocusEffect } from '@react-navigation/native';

function Profile({ userId }) {
  const [user, setUser] = React.useState(null);

  useFocusEffect(
    React.useCallback(() => {
      const unsubscribe = API.subscribe(userId, user => setUser(user));

      return () => unsubscribe();
    }, [userId])
  );

  return <ProfileContent user={user} />;
}

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

بعد أن تصل إلى صفحة "إتمام عملية الشراء" ستجد خيارات الدفع في الأسفل من ضمنها paypal كما هو موضح في الصورة

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

هل يمكنك توضيح السؤال أكثر حتى نتمكن من مساعدتك بشكل أفضل؟

هل يمكنك تجربة التالي و إخباري بالنتائج:

1. هل يمكنك التأكد من أن ال output path الخاص بالمشروع صحيح ==> (Project > Properties > Build > Output path)
2.  توجه إلى menu ثم build ثم Configuration Manager وتأكد من أن ال main/entry project تم بناءه "has checked Build" إذا لم يكن يمكنك القيام بذلك بنفسك

إذا كان كل مما سبق صحيح، يمكنك تجربة التالي:

توجه إلى Tools ثم Options ثم Projects and Solutions ثم Build and Run ستجد قائمة تحت

"On Run, when projects are out of date:" Select: "Always Build

أيضًا يمكنك التحقق من أن المشرع الصحيح تم اختياره  at the StartUp Project إذا لم يكن يمكنك النقر بزر الفأرة الأيمن على المشرع الصحيح و اختيار Set as StartUp Project

الملف الأول خاص بإضافة تسمى jquery validate , هي تستخدم للتحقق من البيانات التي يقوم المستخدم بإدخاها مثلًا تُستخدم للتحقق من أن المستخدم لم يترك حقل إدخال اسم المستخدم فارغ و أنع قام بكتابة email بطريقة صحيحة و هكذا.

لاستخدام هذه الإضافة:

سنأخذ المثال التالي:

التحقق من مدخلات المستخدم في form التعليقات.

• نقوم بوضع الملف الذي يحتوي هذه الأكواد في المجلد js 
• سنقوم بإنشاء ملف لاستخدام هذه الإضافة سأسميه pbd-validate-comments 

محتوى الملف pbd-validate-comments .

<?php
/**
 * Plugin Name: PBD Validate Comments
 * Plugin URI: http://www.problogdesign.com/
 * Description: Validate comments instantly with jQuery. Uses <a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Form Validation</a> plugin by Jörn Zaefferer.
 * Version: 0.2
 * Author: Pro Blog Design
 * Author URI: http://www.problogdesign.com/
 * License: GPLv2
 */


/**
 * Add jQuery Validation script on posts.
 */
function pbd_vc_scripts() {
	if(is_single() ) {
		wp_enqueue_script(
			'jquery-validate',
			plugin_dir_url( __FILE__ ) . 'js/jquery.validate.min.js',
			array('jquery'),
			'1.10.0',
			true
		);
 
		wp_enqueue_style(
			'jquery-validate',
			plugin_dir_url( __FILE__ ) . 'css/style.css',
			array(),
			'1.0'
		);
	}
}
add_action('template_redirect', 'pbd_vc_scripts');


/**
 * Initiate the script.
 * Calls the validation options on the comment form.
 */
function pbd_vc_init() { ?>
	<script type="text/javascript">
		jQuery(document).ready(function($) {
 
			$('#commentform').validate({
              rules: {
                  author: {
                      required: true,
                      minlength: 2
                  },

                  email: {
                      required: true,
                      email: true
                  },

                  url: {
                      url: true
                  },

                  comment: {
                      required: true,
                      minlength: 20
                  }
               },
               messages: {
                  author: "Please enter a valid name.",
                  email: "Please enter a valid email address.",
                  url: "Please use a valid website address.",
                  comment: "Message must be at least 20 characters."
              }
             });
		});
	</script>

<?php }
	add_action('wp_footer', 'pbd_vc_init', 999);
 
?>

ثم نقوم لبإضافة التنسيقات التالية في ملف style.css:

label.error {
	display: block;
	background: #ffd2d2;
	padding: 0 10px;
}

------------------

الكود الثاني يخص مكتبة respond.js و هي مكتبة تستخدم ال  media query polyfill  لجعل الموقع متجاوب مع مختلف الشاشات "تسهل التصميم المتجاوب للموقع" و تقد م بعض المزايا عن ال media queries العادية.

أمثلة:

/* العنصر يقوم بالاستعلام عن نفسه/عرضه باستخدام شرط واحد */
header[min-width~="500px"] {
    background-color: #eee;
}

/*العنصر يقوم بالاستعلام عن نفسه/عرضه باستخدام  شرطين  */

header[min-width~="500px"][max-width~="800px"] {
    background-color: #eee;
}
Copy
This rule queries a parent for a condition:
/* هذه القاعدة تقوم بالاستعلام عن العنصر الأب كشرط لتطبيق تنسيق ما */

header[min-width~="31.250em"] nav {
    clear: both;
}

يمكنك أن تبحث عن سلاسل تعليمية media query polyfill حتى تتعلم كيفية استعمالها

يمكنك توظيف أحد المطورين من موقع مستقل و لن يكلفك هذا كثيرًا ربما 50$ مثلًا.

و لكن من جهة تجربة المستخدم أقترح عليك أن تبقي الnavbar شريط التنقل على حاله في الأعلى في الشاشات الكبيرة"الحواسيب" فهي تعتبر تجربة مستخدم أفضل لأنها تسهل على المستخدمين التنقل في الموقع الخاص بك لذلك أنصحك أن توظف أحد المطورين ليقوم بتحسين مظهر القائمة العلوية "شريط التنقل/navbar" و ترتيبها لك بدلًا من أن يضعها في قائمة جانبية كما في الشاشات صغيرة و متوسطة الحجم"الهواتف/تابلت"

 html هي لغة لغة ترميز markup language و لا تعتبر أحد لغات البرمجة فهي تستخدم لإنشاء البنية الأساسية/الهيكلية العامة لصفحات الويب مثل الأزرار و الفقرات و العناوين و هكذا. 

أما php فهي تعتبر أحد اللغات البرمجية التي تستخدم في تطوير الويب"البرمجة الخلفية تحديدا  إرسال و إحضار البيانات من قواعد البيانات و مصادقة المستخدمين و غيرها"

في الحقيقة html لا يمكن الاستغناء عنها فهي تستخدم داخل ملفات php لإنشاء العناصر التي نراها في المواقع و نتفاعل معها.

أما عن سؤالك عن التقنيات التي تحتاج تعلمها فالأمر يتوقف على هدفك من تعلم البرمجة: 

فمثلا إذا كنت تريد أن تصبح مطور مواقع، سيكون أمامك عدة مسارات:

• مطور واجهات أمامية: و في هذه الحالة ستحتاج لتعلم html"تستخدم في بناء الهيكلية العامة للمواقع" و css"تستخدم لإعطاء الشكل الجمالي للمواقع و تنسيقها" و javascript " تستخدم لجعل الصفحات تفاعلية مثل فتح نافذة عند الضغط على زر ما و إخفاؤ أو إظهار عناصر ما بناؤ على تفاعلات المستخدم" و بعد أن تتعلم أساسيات التقنيات السابقة يمكنك أن تتعلم إحدى مكتبات بناء واجهات المستخدم مثل react و angular و vue.
• أن تصبح مطور backend "البرمجة الخلفية للمواقع" في هذه الحالة ستحتاج لتعلم لغة php مع إطار العمل"يمكنك التفكير في إطار العمل على أنه ورشة عمل متكاملة توفر لنا كل ما نحتاجة لبناء الموقع" laravel أو python مع إطار العمل django أو javaScript مع إطار العمل express و بيئة العمل node.js يمكنك اختيار أي تقنية منهم.أيضا ستحتاج إلى معرفة التعامل مع قواعد البيانات مثل mysql و mongodb. هنا ستحتاج أيضا لمعرفة أساسيات html و css و js أساسيات فقط دون التعمق.
• أما إذا أردت أن تصبح مطور ويب شامل full stack: في هذه الحالة يجب أن تكون ملم بكل ما سبق