تطبيق المكتبة الافتراضية - 1
FullstackReactTypeScriptNode.jsPostgreSQLDrizzle ORMRedis

تطبيق المكتبة الافتراضية

متجر كتب حديث ومتكامل يعرض بيانات حقيقية من واجهات برمجة تطبيقات Google Books و NYT، مدعوم بطبقة تخزين مؤقت عالية الأداء باستخدام Redis وخلفية آمنة (Type-safe) باستخدام Drizzle و PostgreSQL.

الرؤية

تم انشاء تطبيق المكتبة الافتراضية كمنصة حديثة وغنية بالميزات لسد الفجوة بين استكشاف الكتب وإدارة المكتبات الشخصية. كان هدفي هو خلق تجربة سلسة حيث لا يكتفي المستخدمون بالعثور على الكتب الأكثر مبيعًا والبحث عن اهتماماتهم فحسب، بل يمكنهم أيضًا تنظيم قوائم القراءة الخاصة بهم. أردت تجاوز تطبيقات CRUD البسيطة وبناء نظام يجمع بيانات حقيقية من واجهات برمجة تطبيقات قوية (Google Books و NY Times) مع الحفاظ على الأداء العالي وواجهة مستخدم مصقولة.

التحدي

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

  • تجميع البيانات والأداء: الاعتماد على واجهات خارجية مثل Google Books و NY Times يعني احتمال وجود تأخير وقيود على معدل الطلبات. تقديم هذه البيانات فورًا للمستخدم تطلب استراتيجية تتجاوز مجرد طلبات الجلب العادية.
  • هندسة الخلفية الحديثة: بدلاً من اختيار حزمة Mongoose/MongoDB المألوفة، اخترت تبني ممارسات SQL الحديثة باستخدام PostgreSQL و Drizzle ORM. تطلب ذلك إعادة التفكير في نمذجة البيانات لضمان أمان الأنواع (Type Safety) واستعلامات علائقية فعالة.
  • إدارة الحالة: مع تطبيق متعدد الصفحات (بحث، تفاصيل، قائمة أمنيات)، كانت إدارة الحالة العامة لجلسة المستخدم ومجموعات الكتب دون تعقيد الكود أمرًا بالغ الأهمية.
  • المصادقة والأمان: تنفيذ مصادقة آمنة تعتمد على الججلسات لتمكين المستخدمين من الاحتفاظ بمجموعاتهم الخاصة عبر الأجهزة.

الحل

قمت بهندسة حل متكامل يوازن بين واجهة أمامية سريعة الاستجابة وخلفية قوية وآمنة:

  • التخزين المؤقت الذكي باستخدام Redis: لحل مشكلة تأخير الواجهات البرمجية، قمت بتنفيذ طبقة تخزين مؤقت باستخدام Redis. يتم تخزين عمليات البحث الشائعة وقوائم الأكثر مبيعًا مؤقتًا، مما يضمن أوقات تحميل شبه فورية للطلبات اللاحقة ويقلل بشكل كبير من استخدام الواجهة البرمجية.
  • طبقة قاعدة بيانات آمنة النوع: باستخدام Drizzle ORM مع PostgreSQL، ضمنت أن تكون تفاعلات قاعدة البيانات آمنة تمامًا من حيث الأنواع (Type-safe) من نقطة الدخول وحتى تنفيذ الاستعلام. أدى هذا إلى تقليل أخطاء وقت التشغيل بشكل كبير وتحسين سرعة التطوير.
  • واجهة مستخدم متجاوبة ومصقولة: تم بناؤها باستخدام React و TailwindCSS، والواجهة متجاوبة بالكامل. استخدمت Zustand لإدارة الحالة العامة بشكل خفيف وفعال للتعامل مع جلسات المستخدم وتحديثات قائمة الأمنيات بسلاسة.
  • ميزات شاملة:
    • بحث وتصفية متقدمة: يمكن للمستخدمين التصفية حسب الفئة، واللغة، وتفضيلات الفرز.
    • تكامل OAuth: تسجيل دخول سلس باستخدام Google.
    • توجيه ديناميكي: عروض تفصيلية لكل كتاب مع دعم الروابط العميقة.