محرر الكود للمبتدئين في البرمجة
المسار: أساسيات البرمجة الوحدة: مقدمة وأدوات التعلم
مدخل إلى الدرس: محرر الكود للمبتدئين في البرمجة
ما هو محرر الكود محرر الكود هو البرنامج أو الأداة التي تستعملها من أجل كتابة الكود. في هرمش، قمنا بتطوير محرر كود بسيط جداً ليتيح لكم تجربة الكود بشكل...
طريقة الدراسة: اقرأ التعريف، تتبّع المثال في الشرح، نفّذه بنفسك، ثم اختبر النتيجة والحالات الاستثنائية قبل الانتقال.
ما هو محرر الكود
محرر الكود هو البرنامج أو الأداة التي تستعملها من أجل كتابة الكود.
في هرمش، قمنا بتطوير محرر كود بسيط جداً ليتيح لكم تجربة الكود بشكل مباشر و تفاعلي أثناء التعلم.
إذاً لن تحتاج إلى تحميل أي برامج على جهازك لأنك ستتمكن من تجربة أي كود يمر معك بشكل مباشر.
آلية عمل محرر الكود
في هذا الدرس لن نتطرق للأوامر البرمجية التي يمكنك استعمالها في محرر الكود لأنك ستتعرف عليها تباعاً في دروس لاحقة. ما ستتعلمه في هذا الدرس هو كيفية استعمال محرر الكود حيث ستتعرف على وظيفة كل زر موضوع فيه بالإضافة إلى ما الذي سيظهره لك في حال قام بتنفيذ أوامرك بنجاح أو كان هناك مشكلة.
الأوامر التي ستستخدمها في هذا المحرر مبنية بالأساس على لغة جافا سكربت، أي أنت يفترض بك كتابتها كما سنعلمك إياها و المحرر سيقوم بشكل تلقائي بتحويلها لأوامر جافا سكربت حتى يفهمها المتصفح و من ثم ينفذها و يعرض لك نتائجها.
مكونات محرر الكود
بدايةً، محرر مقسوم لقسمين: قسم خاص لكتابة الكود و قسم خاص لعرض نتيجة تنفيذ الكود.
الآن ركز على أسماء أزرار التحكم.
- زر التشغيل: مهمته تنفيذ الكود الذي كتبته فيه و عرض نتيجته.
- زر التنظيف: يقوم بمسح كل الكود و النتيجة.
- زر التحميل: لتحميل الكود كملف نصي على جهازك.
- زر الرفع: لفتح الملف الذي كنت قد حملته مسبقاً بداخل المحرر.
- زر الصفحة الرئيسية: للإنتقال إلى الصفحة الرئيسية في الموقع.
النتائج المتوقعة عند التشغيل
عند تجربة أي كود قمت بكتابته في المحرر فهناك ثلاث نتائج متوقعة:
- أن يتنفذ كل الكود لأنه مكتوب بشكل صحيح.
- أن لا يتنفذ الكود من الأساس لأنه غير مكتوب بشكل صحيح.
- أن يتنفذ جزء من الكود و لكن يظهر فيه خطأ في وقت لاحق.
إذا كان الكود مكتوب بشكل صحيح، سيتمكن المحرر من تنفيذه و ستجد أنه سيظهر لك في النهاية عبارة Done Execution و التي تعني أنه أنهى تنفيذ كل الأوامر التي وضعتها فيه بنجاح.
المثال الأول
write("Hello world!");
النتيجة
Done Execution
تمرين: انسخ المثال وجرّبه بنفسك، ثم عدّل القيم ولاحظ النتيجة.
إذا كان الكود من الأساس مكتوب بشكل خاطئ، لن يتمكن المحرر من تنفيذه و ستجد أنه سيظهر لك رسالة الخطأ باللون الأحمر.
المثال الثاني
write(x + 5);
النتيجة
تمرين: انسخ المثال وجرّبه بنفسك، ثم عدّل القيم ولاحظ النتيجة.
إذا كان أول الكود قابل للتنفيذ و لكن يوجد مشكلة في آخره، فإنه قد يتمكن من تنفيذ الكود المكتوب بشكل صحيح و سيتوقف و يظهر لك وجود خطأ حين يحاول تنفيذ أول كود فيه مشكلة.
المثال الثالث
write("Coding is awesome"); write(X);
النتيجة
ReferenceError: X is not defined
تمرين: انسخ المثال وجرّبه بنفسك، ثم عدّل القيم ولاحظ النتيجة.
مراجعة وتمرين تثبيت المهارة
اختبار سريع: اشرح بعبارتك معنى «محرر الكود للمبتدئين في البرمجة»، ثم بيّن أين ستستخدمه داخل برنامج صغير لحل مشكلة يومية مع مدخلات ونتائج يمكن التحقق منها، وما الخطأ الذي يجب اختباره قبل الاعتماد على الحل.
تحدٍّ إضافي: غيّر شرطًا واحدًا في التطبيق، وتوقع النتيجة، ثم نفّذ الاختبار وفسّر الاختلاف.
الدرس التالي: محلل الكود للمبتدئين في البرمجة. من الأفضل إنهاء التجربة الحالية قبل متابعة الدرس التالي.
