الوضع الصارم: لماذا نفرض TypeScript

التجارة الإلكترونية هي البنية التحتية الحيوية. الخلل هنا لا يبدو سيئًا فحسب؛ يكلف المال. جافا سكريبت، مع كتابتها الفضفاضة، هي مسؤولية. يمكنك تمرير سلسلة حيث من المتوقع وجود رقم؟ يتحطم. هل تحاول الوصول إلى “.price” على منتج فارغ؟ شاشة بيضاء.

درع TypeScript

نحن نعمل وفقًا لسياسة الوضع الصارم فقط.

1. التحقق من صحة عقد API مع Zod

نحن لا نثق في API. حتى شوبيفاي. عندما نقوم بجلب البيانات، نقوم بتحليلها من خلال مخططات Zod.

استيراد {z} من 'zod'؛

مخطط المنتج الثابت = z.object({
  المعرف: z.string()،
  العنوان: z.string()،
  نطاق السعر: z.object({
    الحد الأدنى للسعر: z.object({
      المبلغ: z.string().transform(val => parseFloat(val)))، // فرض الرقم
      رمز العملة: z.string()،
    })
  })
});

// إذا أعادت واجهة برمجة التطبيقات البيانات المهملة، فسيتم ذلك على الفور، مما يحافظ على أمان واجهة المستخدم.
منتج ثابت = ProductSchema.parse(apiResponse);

---

2. المكونات الوراثية

مكتبة واجهة المستخدم الخاصة بنا مكتوبة بالكامل. لا يمكنك استخدام مكون <PriceTag /> الخاص بنا دون تمرير currencyCode صالح. سوف يصرخ عليك IDE (VS Code) قبل أن تحاول تشغيل الكود.

3. نوع الأمان الشامل

باستخدام أدوات مثل GraphQL Code Generator، نقوم بإنشاء أنواع TypeScript مباشرة من استعلاماتنا. إذا قمنا بتغيير استعلام GraphQL لجلب “الوصف” بدلاً من “النص”، فستعلم مكونات React تلقائيًا بالتغيير.

الخلاصة

يبطئ TypeScript الساعة الأولى من التطوير (أنواع الكتابة). يعمل على تسريع الـ 100 ساعة القادمة (إعادة البناء، وتصحيح الأخطاء، والقياس). في فريق مكون من 10 مهندسين، كانت هذه هي الطريقة الوحيدة للنوم ليلاً.