ياسر مسكين

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

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

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

السلام عليكم ورحمة الله تعالى وبركاته، بداية فإن أكاديمية حسوب لا توفر ملخصات للدروس ونحن في الأكاديمية نشجّع الطلبة على إعداد ملخصاتهم الخاصة بأنفسهم لما فيه من فائدة كبيرة تعود على التحصيل والفهم وترسيخ المفاهيم التي نتطرق إليها في الدروس والمسارات. وعوضا من ذلك فإنّ الأكاديمية لديها موسوعة خاصة تُعنى بجميع التوثيقات باللغة العربية إذ تسهّل على الطالب الرجوع إليها في أيّ وقت وحين وهي موسوعة ويكي حسوب ويمكنك الوصول إليها من هنا: موسوعة حسوب والتوثيق الرسمي لبايثون كما أنه توجد العديد من المقالات التي تتناول لغة بايثون من الأساسيات إلى المواضيع المتقدمة منها ويمكنك تصفحها من هنا: https://academy.hsoub.com/programming/python/ https://academy.hsoub.com/python/ كما أنصحك بالتطبيق العملي المستمر فإعداد الملخصات قد يكون مفيدا في البداية لترسيخ الأساسيات لكن فيما بعد فكلما أنجزت مشاريع وتطبيقات عملية أكثر كلما زاد مستواك في البرمجة، فنحن لسنا بحاجة إلى الحفظ بتاتا فهو تحصيل حاصل نتيجة العمل المستمر، فكلّ شيء يمكن الرجوع إليه ضمن التوثيقات الرسمية.

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

وعليكم السلام ورحمة الله تعالى وبركاته، في هذه الشيفرة والتي هي عبارة عن تطبيق بسيط لقائمة مهام (To Do List) ففي البداية يتم استيراد useState لإدارة حالة القائمة، وuseRef لإنشاء مرجع لحقل الإدخال هنا: import React, { useRef, useState } from 'react'; وداخل دالة App نعرّف حالة todos التي تبدأ كمصفوفة فارغة: const [todos , setTodos] = useState([]); وتعرّف refInp باستخدام useRef() لحفظ مرجع مباشر لحقل الإدخال: const refInp = useRef(); أما الدالة handelAddTodos فتستخدم عند الضغط على زر "Add" بحيث تقوم هذه الدالة بقراءة النص المدخل عبر المرجع: const textInp = refInp.current.value; ثم تضيفه إلى قائمة المهام باستخدام: setTodos([...todos, textInp]); وبعدها تقوم بمسح الإدخال بإسناد قيمة فارغة له: refInp.current.value = ""; في حين في الجزء المرئي (JSX) يتم عرض العنوان: <h2>To Do List</h2> ثم تعرض قائمة المهام باستخدام map() لإظهار كل مهمة في عنصر <li>: <ul> {todos.map((item) => <li>{item}</li>)} </ul> بعد ذلك يوجد حقل الإدخال المرتبط بالمرجع: <input ref={refInp} placeholder="Enter item..." /> في النهاية الزر الذي يستدعي دالة الإضافة عند الضغط عليه: <button onClick={handelAddTodos}>Add</button> وفائدة useRef هنا أنه يسمح بالوصول إلى قيمة حقل الإدخال دون الحاجة لتعريف حالة إضافية.

useRef هو أحد الخطافات (Hooks) في React ونحن نستخدمه لإنشاء مرجع (ref) يمكنه تخزين قيمة لا تتغير عبر إعادة التصيير (re-renders) دون أن تؤدي هذه القيمة إلى إعادة تصيير جديدة عند تغيّرها. فعندما تستدعي useRef(initialValue) سيقوم React بإنشاء كائن يسمى ref يحتوي على خاصية واحدة اسمها current، ويتم تعيين القيمة الابتدائية initialValue إلى ref.current بحيث أن هذا الكائن ref سيكون ثابتا طوال عمر المكوّن، مما يعني أنه لن يتغير بين كل إعادة تصيير، بينما يمكنك تحديث ref.current يدويا بأي قيمة تريد. الكائن ref يكون شكله كالتالي: { current: initialValue } هذه البساطة تجعله مفيدا جدا لتخزين أي شيء لا يؤثر على واجهة المستخدم بشكل مباشر مثل مرجع لعنصر DOM فعند استخدام: ref={myRef} في JSX أو تخزين مؤقت لقيم مثل مؤقت زمني setTimeout، أو الحالة السابقة لمتغيّر معيّن، أو عدد النقرات وغير ذلك. const myRef = useRef(0); myRef.current += 1; مثلا هنا نقوم بتخزين عدّاد في myRef.current، وسيتذكر هذا العدّاد القيمة بين كل إعادة تصيير، دون أن يسبب إعادة تصيير جديدة أما عند ربطه بعنصر DOM: const inputRef = useRef(null); <input ref={inputRef} /> ف inputRef.current في هذه الحالة سيشير إلى عنصر <input> في DOM بعد التصيير، ويمكنك مثلا استدعاء: inputRef.current.focus() لتركيز المؤشر في الحقل ليكون ref.current هو المكان الذي يخزّن فيه المرجع إلى العنصر أو القيمة.

السلام عليكم ورحمة الله تعالى وبركاته، var و let هما طريقتان لتعريف المتغيرات في JavaScript، لكن الفرق بينهما أن var له نطاق دالة (function scope)، أي أنه متاح في كامل الدالة التي عُرّف فيها، بينما let له نطاق كتلة (block scope)، أي أنه متاح فقط داخل { } التي عرّف فيها. كما أنه يتم رفع var إلى أعلى الكود ويأخذ قيمة undefined مؤقتا، أما let فيُرفع لكن لا يمكن استخدامه قبل تعريفه، مما يقلل من الأخطاء. كما أنه يمكن إعادة تعريف متغير var في نفس النطاق، أما let فلا يمكن ذلك و let أكثر أمانًا وحداثة، ويُفضل استخدامها بدلا من var في معظم الحالات، يمكنك الاطلاع أكثر من خلال الإجابات الآتية: https://academy.hsoub.com/questions/21250-الفرق-بين-let-و-var-في-جافا-سكريبت/ و: https://academy.hsoub.com/questions/23436-استفسار-عن-لغة-جافاسكربت-ماهو-الفرق-بين-let-و-var-و-const/

ليس من الأفضل دائما تعويض القيم المفقودة، كما أنه ليس من الصحيح دائما حذفها. لأن الخيار الأفضل يعتمد على طبيعة البيانات، كمية القيم المفقودة، وأسباب فقدانها فإذا كانت نسبة القيم المفقودة مرتفعة في عمود معين مثلا لنقل أكثر من 40%-50% فقد يكون من الأفضل حذف هذا العمود لأنه قد لا يضيف قيمة تحليلية حقيقية. أما إذا كانت نسبة القيم المفقودة قليلة، فغالبا ما يكون من الأفضل تعويضها، وذلك باستخدام أساليب مثل المتوسط mean، الوسيط median، الأكثر تكرارا mode أو نماذج أكثر تقدما مثل KNN Imputer أو التوقع بالنماذج. لكن في بعض الحالات، القيم المفقودة قد تكون ذات دلالة بحد ذاتها، فمجرد كونها مفقودة يحمل معنى معين، وفي هذه الحالة يمكن إنشاء عمود إضافي يشير إلى كون القيمة مفقودة بدلا من حذفها أو تعويضها. أما بخصوص الفرق بين بيانات التدريب وبيانات الاختبار فنعم يوجد فرق مهم أولا يجب تعويض القيم المفقودة في بيانات الاختبار باستخدام نفس القيم أو الاستراتيجية المستخلصة من بيانات التدريب فقط، لضمان عدم تسريب المعلومات (data leakage) مثلا إذا عوّضت القيم المفقودة في التدريب باستخدام المتوسط، يجب أن تستخدم نفس هذا المتوسط أي المحسوب من التدريب لتعويض القيم في الاختبار، وليس أن تحسب متوسطا جديدا للاختبار.

السلام عليكم ورحمة الله تعالى وبركاته، الدورات ليست باشتراك شهري، بل بالعكس عند شرائك للدورة ستكون متاحة الوصول مدى الحياة ويتضمن ذلك حتى التحديثات المستقبلية التي تطرأ عليها أقترح عليك تصفح المصدر التالي الذي يوضح كيفية شراء الدورات أما بخصوص عمليات الشراء فمن الأفضل التواصل مع مركز المساعدة فهم المخولون بمعالجة هذه الجزئيات: https://support.academy.hsoub.com/buying-courses

وعليكم السلام ورحمة الله تعالى وبركاته، في بيئة Kaggle يتم استخدام المسار: /kaggle/working/ كمجلد مؤقت لتخزين الملفات أثناء تشغيل النوتبوك وهذا المجلد لا يحتفظ بأي ملفات بشكل دائم فعند إغلاق النوتبوك أو إعادة تشغيل الجلسة، يتم حذف جميع البيانات الموجودة فيه تلقائيا. لذا لحفظ الملفات بشكل دائم، يجب استخدام خاصية "Save Version" الموجودة في أعلى صفحة النوتبوك، حيث يتم رفع جميع الملفات الموجودة في /kaggle/working/ إلى قسم "Output Files" الخاص بالنوتبوك. يمكن بعد ذلك الرجوع لهذه الملفات في أي وقت أو تحميلها. يوجد خيار آخر وهو تنزيل الملفات يدويًا من خلال متصفح الملفات في الجانب الأيمن بعد إنشائها. كما يمكن حفظ الملفات خارجيا عبر GitHub أو Google Drive، لكن هذه الطريقة غير مدعومة مباشرة داخل Kaggle وتتطلب تنفيذها من بيئة خارجية.

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

السلام عليكم ورحمة الله تعالى وبركاته، الخاصية v-model في Vue.js تقوم بإنشاء ربط ثنائي الاتجاه (two-way data binding) بين حقل الإدخال input والمتغير email في بيانات المكون وهذا يعني أن أي تغيير يحدث في قيمة حقل الإدخال سيتم تحديثه تلقائيا في المتغير email، وفي المقابل أي تغيير يحدث في قيمة المتغير email في الكود سيظهر مباشرة في حقل الإدخال. وعمليا فإن: v-model="email" هي اختصار للكتابة: value="email" و: @input="email = $event.target.value" مما يجعل إدارة البيانات أسهل وأكثر فعالية دون الحاجة لكتابة كود إضافي للتعامل مع الأحداث وتحديث البيانات يدويا.

$emit هي ميزة في Vue.js تسمح للمكونات الفرعية (Child Components) بإرسال أحداث مخصصة إلى المكونات الأبوية (Parent Components)، وهي الطريقة الأساسية للتواصل من الأسفل إلى الأعلى في هيكل المكونات. ففي Vue.js يمكن للمكونات الفرعية إرسال أحداث مخصصة إلى مكوناتها الأبوية باستخدام دالة $emit، وهذه العملية تسمى "إصدار" الحدث وبمجرد أن يصدر المكون الفرعي حدثا ما يمكن للمكون الأبوي "الاستماع" لهذا الحدث المحدد باستخدام رمز @ أو توجيه v-on. والاستخدام بسيط جدا في المكون الفرعي تكتب this.$emit('اسم-الحدث', البيانات) لإرسال الحدث مع البيانات إلى الأب، وفي المكون الأبوي تكتب: @اسم-الحدث="دالة-للتعامل-مع-الحدث" للاستماع والاستجابة للحدث.

الخطأ في السطر الثاني هنا: numbers = 'Hello World'; لأن TypeScript عندما رأى السطر الأول: let numbers = [1,2,3,4,5]; استنتج تلقائياً أن المتغير numbers نوعه number[] أي مصفوفة أرقام وبالتالي عندما حاولت في السطر الثاني تعيين نص إلى هذا المتغير، رفض TypeScript ذلك وأظهر خطأ لأنه يتوقع مصفوفة أرقام وليس نص، بينما JavaScript سمح بذلك لأنه لا يهتم بأنواع البيانات ويقبل تغيير نوع المتغير في أي وقت. لذا الحل هو أن تخبر TypeScript من البداية أن هذا المتغير يمكن أن يكون مصفوفة أرقام أو نص باستخدام Union Types هكذا: let numbers: number[] | string = [1,2,3,4,5]; وبعدها السطر numbers = 'Hello World'; سيعمل بدون مشاكل، أو يمكنك استخدام متغيرين منفصلين بدلا من تغيير نوع المتغير الواحد، والهدف من هذا السلوك في TypeScript هو منعك من الوقوع في أخطاء غير مقصودة قد تحدث بسبب تغيير أنواع المتغيرات عن طريق الخطأ.

السلام عليكم ورحمة الله تعالى وبركاته، Vue.js هو إطار عمل حديث يتميز بالبساطة وسهولة التعلم، مما يجعله خيارا ممتازا خاصة بالنسبة للمطورين المبتدئين وأيضا بالنسبة للمشاريع الصغيرة وحتى المتوسطة. لكن بالرغم من ذلك أعتبر أنّ قابليته لبناء مشاريع كبيرة ومعقدة تظل ممكنة لكنها مشروطة بعدة عوامل فمن جهة Vue يوفر أدوات قوية مثل Vue Router لإدارة التنقل، وPinia أو Vuex لإدارة الحالة، ويتيح كتابة مكونات قابلة لإعادة الاستخدام، وهي خصائص أساسية لتطوير التطبيقات الكبيرة والمعقدة. كما أن Vue يدعم التكامل مع TypeScript وهذه نقطة إيجابية لكونه يعزز قابلية الصيانة والتنظيم في المشاريع الضخمة. لكن من جهة أخرى ومقارنة ب React وAngular فإن Vue يعاني من قاعدة مستخدمين أصغر نسبيا وقد يفتقر إلى بعض المكونات الجاهزة والدعم المؤسسي الواسع الذي تتمتع به الأطر الأخرى، خاصة في بيئات المؤسسات الكبرى. كما أن بعض الشركات تفضل Angular لما يقدمه من حل شامل ومدمج، أو React لما له من انتشار واسع ومجتمع ضخم. كذلك إذا لم يتم اتباع بنية واضحة وانضباط في كتابة الكود، قد يصبح المشروع المعقد المبني ب Vue صعب الصيانة مع مرور الوقت وفي النهاية لا توجد تقنية أفضل من الأخرى فكل تقنية لها إيجابياتها وسلبياتها اعتمادا على المشروع المراد إنجازه.

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

السلام عليكم ورحمة الله تعالى وبركاته، هل تقصد تفعيل خاصية ال Dark Mode؟ في حال كان كذلك فالموقع لا يدعم ذلك حاليا وتبقى هذه الميزة تفضيلية واختيارية لذلك لم تتم إضافتها يمكنك في حال أردت استعمالها تثبيت إضافة خاصة بذلك ولتكن مثلا: Dark Reader

السلام عليكم ورحمة الله تعالى وبركاته، abc تعني أن VS Code يتعامل مع كلمة logo كنص عادي وليس كخاصية Vue معرفة لذا يمكنك تثبيت إضافة Volar أو كما يطلق عليها بالاسم الجديد Vue - Official: https://marketplace.visualstudio.com/items?itemName=Vue.volar أرجو الضغط على زر "Enable" بدلا من "Disable" ثم أعد تشغيل VS Code وستختفي تلك الأخطاء باللون الأحمر المزعج فالإضافة مثبتة لكنها غير مفعلة، لذلك الأخطاء مستمرة.

السلام عليكم ورحمة الله تعالى وبركاته، لا مشكلة في الكود، أما اللون الأزرق فلون كلمة export محجوز في JavaScript لأنها كلمة مفتاحية (keyword) في JavaScript/ES6 وتستخدم لتصدير المتغيرات والدوال من الملف. كما أن VS Code يستخدم نظام الألوان (syntax highlighting) لتمييز الكلمات المحجوزة باللون الأزرق واستخدامك ل export default صحيح ويعمل بشكل جيد لتصدير كائن البيانات كتصدير افتراضي.

السلام عليكم ورحمة الله تعالى وبركاته، إن كنت تقصد الموسوعة الخاصة بأكاديمية حسوب أين تجد التوثيقات الرسمية لمختلف اللغات يمكنك الوصول إليها من هنا: https://wiki.hsoub.com/الصفحة_الرئيسية

وعليكم السلام ورحمة الله تعالى وبركاته، على حسب التخصص الذي ذكرته فأنا أنصحك بداية بالبدء بدورة لغة بايثون أولا والسبب بسيط ومهم فالذكاء الاصطناعي يعتمد بشكل شبه كامل على البرمجة، ولغة بايثون هي الأداة الأساسية في هذا المجال. لذا فإن الدخول مباشرة في دورة الذكاء الاصطناعي بدون فهم جيد للبرمجة سيجعلك تشعر بالضياع، لأنك لن تفهم ما الذي يحدث في الكود، ولن تستطيع تعديل أي نموذج أو التعامل مع البيانات بشكل فعّال. أما إذا بدأت ببايثون فستتمكن من بناء أساس قوي يجعلك تفهم كيف تبنى أنظمة الذكاء الاصطناعي، وستفهم المكتبات المشهورة مثل NumPy وPandas وScikit-Learn وTensorFlow عندما تصل إليها. يمكنك التفكير في بايثون على أنها لغة التخاطب مع الذكاء الاصطناعي فهل يعقل أن تدخل في نقاش مع خبير في الذكاء الاصطناعي وأنت لا تعرف لغته؟ قطعا لا. يمكنك الاطلاع على مميزات ومسارات دورة بايثون من هنا: https://academy.hsoub.com/learn/python-application-development/ وعلى مسارات ومميزات دورة الذكاء الاصطناعي أيضا من هنا: https://academy.hsoub.com/learn/artificial-intelligence/

الRouter هو عبارة عن نظام في Vue.js يتحكم في التنقل بين الصفحات دون إعادة تحميل الصفحة بالكامل يمكنك تخيله كخريطة طرق للتطبيق إليك هذا المثال: const router = new VueRouter({ routes: [ { path: '/', component: Home }, { path: '/about', component: About }, { path: '/contact', component: Contact } ] }) أما ال Route فهو مسار واحد أو صفحة واحدة في التطبيق وكل route يحتوي على: path: المسار في الرابط (مثل /home) component: المكوّن الذي سيظهر عند زيارة هذا المسار name: اسم اختياري للمسار إليك هذا المثال: { path: '/products', name: 'Products', component: ProductsPage } أما ال Options فهو عبارة عن هكائن يحتوي على جميع إعدادات ال router وأهمها: routes: وهو مصفوفة تحتوي على جميع المسارات mode: ويمثل نوع التنقل إما من خلال hash أو history base: وهو المسار الأساسي للتطبيق بالنسبةللشيفرة التي شاركتها: mounted(){ this.myRoutes = this.$router.options.routes } ف this.$router.options.routes يعطينا قائمة بجميع الطرق أو بالأحرى الصفحات الموجودة في الموقع فمثلا إذا كان عندنا صفحة رئيسية وصفحة "من نحن" وصفحة "اتصل بنا" ستحصل على قائمة بهذه الصفحات الثلاث. ونستخدمه عادة لإنشاء قائمة تنقل أوتوماتيكية، أو للتحقق من الصفحات الموجودة، أو لعرض خريطة الموقع والفكرة أننا نحصل على جميع المسارات المعرّفة في مكان واحد لنتعامل معها برمجيا. وللتوضيح أكثر فإن: mounted(): هي دالة تعمل بعد تحميل المكوّن بالكامل this.$router: نستخدمه للوصول لكائن ال router في المكوّن options: عبارة عن كائن الإعدادات الخاص بال router routes: مصفوفة جميع المسارات المعرّفة this.myRoutes: متغير في المكوّن نستخدمه لحفظ المسارات

السلام عليكم ورحمة الله تعالى وبركاته، من الرائع أن تمتلك شغفا كبيرا تجاه البرمجة فهذا المجال يحتاج إلى شغف وحب واجتهاد كي تستطيع الاستمرار فيه. وهذا الحماس يمكن أن يدفعك نحو تحقيق أهداف كبيرة في المجال، لكن قضاء 11 ساعة يوميا في تعلم البرمجة لا ينصح به بتاتا، فهو مبالغ فيه بعض الشيء أنصحك بتخصيص من ساعتين إلى 5 ساعات يوميا فليست العبرة في حجم الوقت الذي تقضيه أمام الشاشة بل في كمّ المعلومات التي تكتسبها وتقوم بالتطبيق عليها. كما أنّ نصف يومك تقريبا سيذهب إلى البرمجة وهذا يجعل من حياتك تقريبا غارقة في متاهة لا تستطيع الخروج منها. قضاء أوقات طويلة في البرمجة بالنسبة للمحترفين هو أمر قد نعتبره عاديا في حال كان هنالك مشاريع يجب تسليمها في وقتها أما في مرحلة التعلم فلا ينصح بهذا الوقت كله، ركز على التعلم والتطبيق خطوة بخطوة وحينما تتعب يمكنك الرجوع فيما بعد ثم المواصلة بطاقة وإيجابية أكبر. سأقترح عليك هاته المقالات والإجابات وستنفعك إن شاء الله: https://academy.hsoub.com/learn-programming/

السلام عليكم ورحم الله تعالى وبركاته، Debugger هو المصحّح في جافاسكريبت ومن اسمه يظهر لنا دوره فهو أداة نستخدمها لإيقاف تنفيذ الكود ولكن بشكل مؤقت حتى نتمكن من فحص ما يحدث داخل البرنامج خطوة بخطوة. يساعدنا على معرفة أين تحدث الأخطاء أو لماذا لا تعمل النتيجة كما نتوقع فعند كتابة الكلمة debugger داخل الكود، سيتوقف المتصفح عند هذا السطر بالطبع حينما تكون أدوات المطوّر مفتوحة وسنتمكن من رؤية القيم الحالية للمتغيرات والتنقّل بين السطور خطوة بخطوة وهذه الطريقة مفيدة جدا أفضل بكثير من استخدام console.log في كل مكان. إليك هذا المثال: function sayHello(name) { let message = "Hello, " + name; debugger; alert(message); } sayHello("Hsoub Academy"); هنا الكود سيتوقف عند debugger ويمكنك حينها أن ترى أن قيمة name هي: name = "Hsoub Academy" وقيمة message هي: message = "Hello, Hsoub Academy" وبعد ذلك يمكنك الاستمرار في تنفيذ الكود خطوة بخطوة لترى كيف يعمل وهذه طريقة مفيدة لفهم تدفق البرنامج وتصحيح الأخطاء بسهولة.