إزاي تستخدم Claude Code في تطوير المواقع؟ دليل عملي من أول خطوة

أدوات الذكاء الاصطناعي في البرمجة اتغيّرت كتير. زمان كانت بتكمّل لك سطر وانت بتكتب، والنهارده فيه أدوات بتقرا المشروع كله، وتعدّل في كذا ملف، وتشغّل الأوامر والاختبارات بنفسها. Claude Code من أشهر الأدوات دي.

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

يعني إيه Claude Code؟

Claude Code أداة برمجة من شركة Anthropic، شغّالة بنموذج Claude. الفرق بينها وبين إنك تفتح شات وتنسخ الكود منه وتلزقه إن الأداة شغّالة جوه مشروعك نفسه. تقدر:

• تقرا ملفات المشروع وتدوّر فيها عشان تفهم الكود الموجود.
• تعدّل الملفات أو تعمل ملفات جديدة.
• تشغّل أوامر زي npm run build أو الاختبارات، وتشوف النتيجة وتصلّح الأخطاء.
• تتعامل مع git: تشوف التعديلات وتعمل commit لما تطلب منها.

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

بتشتغل من سطر الأوامر (Terminal)، وفيه كمان إضافات لمحررات الأكواد زي VS Code وJetBrains، وتطبيق للكمبيوتر، ونسخة على الويب. طرق التثبيت والاشتراك بتتحدّث من وقت للتاني، فخدها دايمًا من الصفحة الرسمية.

# بعد التثبيت: افتح مجلد المشروع وشغّل الأداة
cd my-project
claude

قبل ما تبدأ: جهّز المشروع

الأداة شاطرة على قد ما المشروع واضح. شوية تجهيز في الأول بيوفّروا عليك وقت كبير بعدين.

١. خلّي المشروع على git

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

git status          # اتأكد إن مفيش تعديلات مش متسجّلة
git diff            # بعد الجلسة: شوف كل اللي اتغيّر
git restore .       # لو عايز ترجّع كل التعديلات اللي ما اتسجّلتش

٢. اكتب ملف CLAUDE.md

ده ملف في جذر المشروع، الأداة بتقراه تلقائيًا في أول كل جلسة. اكتب فيه اللي أي مبرمج جديد محتاج يعرفه:

• المشروع معمول بإيه (مثلًا Next.js وTypeScript وTailwind).
• أوامر التشغيل والاختبار والـ build.
• قواعد الفريق: طريقة التسمية، والمكتبات المسموحة، والحاجات الممنوعة.

تقدر تخلي الأداة تكتب أول نسخة منه بأمر /init، وبعدين تراجعها وتعدّلها بنفسك.

٣. خلّي عندك اختبارات وأوامر فحص

لما يبقى عندك أمر زي npm test أو npm run lint، الأداة تقدر تتأكد بنفسها إن تعديلها ما كسرش حاجة. من غيرها، انت اللي هتكتشف الأخطاء بعدين.

طريقة شغل عملية خطوة بخطوة

اطلب مهمة واضحة ومحدودة

بدل «حسّن الموقع»، اكتب طلب واضح ليه نهاية:

ضيف صفحة تواصل فيها فورم بالاسم والإيميل والرسالة، بنفس تصميم صفحة «عن المدوّنة»، ومن غير أي مكتبات جديدة.

كل ما الطلب أوضح، النتيجة أقرب للي في دماغك. ولو المهمة كبيرة، قسّمها لخطوات وخلّص خطوة خطوة.

خلّيها تفهم الأول، وبعدين تخطّط

في المهام الكبيرة، اطلب منها تقرا الكود المتعلّق بالمهمة وتقترح خطة قبل ما تعدّل أي حاجة. فيه وضع مخصوص لده اسمه Plan Mode، وفيه الأداة بتستكشف وتخطّط من غير ما تلمس الملفات. راجع الخطة، وعدّل فيها لو محتاج، وبعدين وافق.

خلّيها تتأكد من شغلها

اطلب منها صراحة تشغّل الاختبارات أو الـ build بعد التعديل. ولو فيه خطأ، هي بتقرا رسالته وتحاول تصلّحه. ده من أكبر الفروق بينها وبين الشات العادي.

راجع الـ diff بنفسك

قبل ما تقبل الشغل، افتح التعديلات واقراها. مش لازم تكون كتبتها بإيدك، لكن لازم تفهمها. لو فيه جزء مش فاهمه، اسأل الأداة نفسها: «ليه عملت كده هنا؟».

خلّي الجلسة مركّزة

الجلسة الطويلة اللي فيها مواضيع كتير بتلخبط السياق. لما تخلّص مهمة وتبدأ واحدة مختلفة، ابدأ جلسة جديدة أو امسح السياق بأمر /clear.

أمثلة على طلبات بتنفع

• «اقرا المشروع واشرح لي هيكله: الصفحات فين، والبيانات بتيجي منين.»
• «الصفحة دي بتاخد وقت طويل في التحميل. دوّر على السبب واقترح حل، ومتعدّلش حاجة قبل ما أوافق.»
• «اكتب اختبارات للدالة دي، تغطي الحالات العادية والمدخلات الغلط.»
• «فيه الخطأ ده في الـ build: (الصق الرسالة). صلّحه وشغّل الـ build تاني.»
• «راجع التعديلات اللي في الـ branch ده ودوّر على أخطاء قبل ما أعمل merge.»

إمتى متعتمدش عليها لوحدها

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

• الأمان والصلاحيات: تسجيل الدخول، والصلاحيات، والتعامل مع بيانات المستخدمين. راجع الكود ده سطر سطر.
• بيانات الإنتاج: أي أمر بيمسح أو يعدّل في قاعدة بيانات حقيقية، أو أي migration. جرّبه الأول على نسخة تجريبية.
• الأسرار: متحطّش مفاتيح API أو كلمات سر جوه الكود أو في الشات. خليها في ملفات .env اللي مش بتترفع على git.
• الكود اللي مش هتقدر تصونه: لو الأداة كتبت حاجة انت مش فاهمها خالص، هتبقى مشكلة يوم ما تحتاج تعدّلها. اطلب منها تبسّطها أو تشرحها.
• القرارات المعمارية: تختار قاعدة بيانات إيه، أو تقسّم المشروع إزاي. استخدمها عشان تعرض لك الاختيارات، والقرار في الآخر بتاعك.

الخلاصة

اتعامل مع Claude Code كأنه مبرمج سريع جدًا انضم لفريقك جديد: عرّفه على المشروع بملف CLAUDE.md، واديله مهام واضحة، وخليه يتأكد من شغله بالاختبارات، وراجع كل اللي بيسلّمه. لو مشيت بالطريقة دي، هتلاقي الأداة بتوفّر عليك وقت كبير في الشغل المتكرر، وتفضل انت المسؤول عن الجودة وعن القرارات المهمة.