EN
تعلّم المسارات المرجع مقالات المحفوظات
المستوى 3: اقرأ مع Claude · الدرس 4 · مسار سطح المكتب

من أين يأتي هذا، وأين يُستخدم؟

قراءة قصيرة

أعطاك الدرس 3.3 وحدة الفضول: الـ symbol. وهذا الدرس يعطيك الخطوة التي تصل الـ symbols ببعضها.

«من أين يأتي هذا؟» و*«أين يُستخدم هذا؟»* هما السؤال نفسه، مطروحًا في اتجاهين. كلاهما كان يستغرق من المطورين ذوي الخبرة ساعةً من البحث اليدوي. الآن يستغرقان جملة في المحادثة.

إن كان هناك فصل واحد في هذا المستوى يجب أن تستوعبه بعمق، فهو هذا.

اتجاها التتبّع

الكود شبكة. كل شيء تقريبًا في الـ codebase متصل بشيء آخر: function تستدعي function أخرى، ومتغيّر يُضبَط في مكان ويُقرَأ في آخر، وقيمة تتدفق من الـ database عبر الـ backend إلى الـ frontend ثم إلى الشاشة.

حين تريد أن تفهم أي جزء من تلك الشبكة، يكون لديك سؤالان طبيعيان:

  • من أين جاء هذا؟ — إلى الخلف، نحو المصدر.
  • أين يُستخدم هذا؟ — إلى الأمام، نحو العواقب.

كان كلا السؤالين صعبًا. الآن لم يَعُدا كذلك.

من أين يأتي هذا؟

تقرأ saveMessage في server/messages.js فترى أنه يُسلَّم كائن msg. من أين جاء ذلك؟ لا داعي للتمرير. اسأل:

where does the msg that saveMessage receives come from? Trace it back.

سيتتبّع Claude الأثر: ربما يُقرَأ من ملف. ربما يُمرَّر إليه من function أمّ. ربما يُبنى من web request. الإجابة سلسلة — «يُبنى في handleContact في server/index.js من req.body — الاسم والـ email والرسالة التي كتبها زائر في contact.html — ثم يُمرَّر إلى saveMessage».

تلك السلسلة نموذج ذهني حقيقي لكيفية تشبيك الكود. ما كنتَ لتقرأه خطيًا. Claude جمّعه لك.

أين يُستخدم هذا؟

الآن اقلبه. لقد فهمتَ function. السؤال التالي هو من يعتمد عليها؟ — لأن هذا ما يخبرك بما إذا كان تغييرها آمنًا.

what calls sendNotification? List every file and what it does with the result.

ستحصل على إجابة مثل: «مستدعٍ واحد — handleContact في server/index.js، الذي يستدعيها مباشرةً بعد حفظ الرسالة، ويتجاهل الـ return value». هذا كنز. أنت الآن تعرف:

  • ما الذي يتغيّر إن كسرتَ هذه الـ function.
  • ما إذا كان تغييرك بحاجة إلى الحفاظ على نوع الإرجاع نفسه.
  • أن هناك مكانًا واحدًا بالضبط يرسل الـ email، فتغيير طريقة عمل الـ email مهمّة ملف واحد.

هذا هو السؤال الذي يطرحه كبار المطورين قبل كل refactor. إنه السؤال الذي يفصل بين «سأنقل هذه الـ function هنا وهناك» و*«يا للهول، لقد كسرتُ الـ production للتوّ».*

ساعة البحث التي تحوّلت إلى جملة

قبل agents مثل Claude، كان التتبّع وظيفة كاملة. كنتَ تفتح المشروع في محرّرك، وتُجري عمليات بحث نصّية، وتتبع الـ imports يدويًا، وتفتح أربعة ملفات في آنٍ واحد، وتحتفظ بـ stack ذهني من «وهذا يُستدعى من هنا، الذي يُستدعى من هنا…». إن كان الـ codebase غير مألوف، فقد تختفي ساعة كاملة في تتبّع واحد.

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

بضعة أشكال أخرى تستحق المعرفة

تتبّع البيانات إلى الخلف:

where do the messages in messages.json actually come from? Trace it back to the form.

تتبّع البيانات إلى الأمام:

when a visitor submits the contact form, what happens? Walk me through every function that runs, in order.

تتبّع الـ imports:

what does server/index.js require, and what does each one do?

العثور على مكان حدوث شيء:

where in this project does the email actually get sent?

أسئلة مختلفة، شكل واحد: ابدأ عند نقطة واحدة، واتبع السلك.

النقطة التي تربك الناس

ستُغرى بسؤال Claude «هل هذه الـ function مستخدَمة في أي مكان؟» وبالوثوق بإجابة نعم/لا. لا تفعل. اطلب من Claude دائمًا أن يسرد المستدعِين — ملفًا ملفًا. لسببين:

  1. «نعم، إنها مستخدَمة» لا يخبرك بشيء تقريبًا. القائمة هي ما يُمكن التصرّف بناءً عليه.
  2. القائمة قابلة للفحص. تستطيع فتح أحد تلك الملفات في بضع ثوانٍ والتأكد من أن Claude عثر على مستدعٍ حقيقي — لا متخيَّل. (المزيد عن هذا في الدرس 3.7.)

التتبّع الذي لا يمكنك التحقق منه ليس تتبّعًا. إنه حكاية.

جرّبها: prompt واحد، التتبّع كله

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

أرسِل prompt وراقب طلبًا يتحوّل إلى خطة ونتيجة:

في مشروع حقيقي ستكتب where does sendNotification come from, and what uses it? فيجيب Claude في سطر واحد — «مُعرَّفة في server/email.js، ومُستدعاة مرة واحدة بواسطة handleContact في server/index.js» — قائمة تستطيع التصرّف بناءً عليها، في كلا الاتجاهين دفعةً واحدة. ثم خذه أبعد: اختر متغيّرًا لا تتعرّف عليه واسأل من أين يأتي؛ اختر function واسأل ما الذي يستدعيها. سؤال واحد، ثم المتابعة. خريطة ذهنية في ثلاث دقائق، كانت تستغرق ساعةً من الصفر.

ما التالي

يساعد التتبّع حين يكون الكود يعمل لكنه غير مألوف. النصف الآخر من القراءة هو حين يكون الكود معطوبًا — حين يكون لديك جدارٌ من نصّ الخطأ الأحمر ولا فكرة عمّا يعنيه. هذا هو الدرس التالي.