رفع جودة الكود باستخدام Git Hooks & Husky

إحنا كمطورين عارفين المشاكل دي كويس:

• كوميت واحد يخرب الدنيا في البرودكشن 😅
• الكود ريفيو كله ملاحظات على الفورمات والـ spacing
• تيب صغير ناقص يخلي البيلد يضرب 🔥

الحل عندي في التيم كان باستخدام Git Hooks + Husky. الطريقة سهلة وفعّالة جدًا.

---

الخطوة ١: تثبيت Husky + lint-staged 📦​

ابدأ بتنصيب الأدوات دي على المشروع:

npm install husky lint-staged --save-dev
npx husky install

ده هيوفرلك Git Hooks اللي تقدر تشغّلها قبل أي كوميت أو push، وlint-staged لفحص الملفات المعدلة بس.

---

الخطوة ٢: إضافة Quality Checks في package.json 🛠️​

ضيف الجزء ده في package.json:

"lint-staged": {
  "./**/*.{js,jsx,ts,tsx}": [
    "eslint . --fix --max-warnings 0 --no-warn-ignored",
    "prettier --write",
    "tsc --noEmit"
  ]
}

من دلوقتي، أي كوميت هيتم التحقق منه أوتوماتيك:

• ESLint → يصلح اللي يقدر عليه ويوقف الكوميت لو فيه أخطاء حرجة
• Prettier → يخلي كل الكود ستايل واحد، مفيش نقاش في الـ PR 🖌️
• TypeScript → يوقف أي غلطة في الكود (strict validation)
• Import sorting → ينضف الكود ويخليه مرتب ✨

---

النتيجة بعد التطبيق ✅​

• Bugs أقل 🐞
• كود شكله واحد وسط التيم كله
• Code review أسرع ⏱️
• كود بروفيشنال يبهر أي كلاينت 😎

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

نصيحة 💡​

جربها فورًا على أي مشروع JavaScript/TypeScript، خصوصًا لو شغال في فريق كبير أو على مشروع Production. هتوفر عليك وقت ومشاكل كتير.