سكيابل
منصة بحث واستكشاف الرحلات الجوية
التحدي
بناء منصة بحث عن الرحلات الجوية يتطلب التعامل مع استعلامات بحث معقدة واستجابات API سريعة وبيانات منظمة من مصادر متعددة وواجهات سهلة الاستخدام لمقارنة مئات النتائج.
التقنيات المستخدمة
النهج الهندسي
البحث عالي الأداء
بنيت تجربة بحث مركّزة على السرعة باستخدام Next.js وTypeScript مع هياكل بيانات محسّنة للتصفية السريعة.
تكامل API من جانب الخادم
طوّرت مسارات API في Next.js تتكامل مع MongoDB لتشغيل نتائج بحث منظمة مع الفهرسة الصحيحة.
تصميم التفاعل المعقد
صمّمت واجهات متجاوبة للتعامل مع النماذج متعددة الخطوات ونطاقات التاريخ وعدد الركاب ومقارنة النتائج.
الهندسة المعيارية
نظّمت قاعدة الكود مع خطافات قابلة لإعادة الاستخدام وحدود مكونات واضحة للتوسع المتوقع.
القرارات التقنية الرئيسية
الخيارات التي شكّلت الهندسة وحددت قابلية الصيانة على المدى البعيد.
مسارات API في Next.js
استخدام مسارات API في Next.js بدلاً من خلفية منفصلة
نشر موحد ومشاركة أفضل لـ TypeScript بين الواجهة الأمامية والخلفية
تجميع MongoDB
الاستفادة من خط أنابيب تجميع MongoDB للبحث
عمليات التصفية والفرز المعقدة أكثر كفاءة في قاعدة البيانات من في كود التطبيق
نمط الخطافات المخصصة
إنشاء خطافات قابلة لإعادة الاستخدام لحالة البحث والمرشحات
تضمين المنطق المعقد في وحدات قابلة للاختبار والتركيب يمكن لمكونات متعددة استخدامها
تحديثات UI المتفائلة
تنفيذ التحديثات المتفائلة لتفاعلات البحث
يتوقع المستخدمون تغذية راجعة فورية عند ضبط المرشحات ومعاملات البحث
التحديات والحلول
استعلامات البحث مع مرشحات متعددة كانت تستغرق 3+ ثوانٍ لإعادة النتائج
أضفت فهارس مركّبة في MongoDB ونفّذت تخزين نتائج الاستعلام مؤقتاً مع إبطال صحيح
حالة نموذج البحث المعقدة كانت صعبة الإدارة والتصحيح
أنشأت سياق بحث مركزي مع أنواع TypeScript والتحقق الصحيح في كل خطوة
المستخدمون كانوا يحتاجون لمقارنة عشرات خيارات الرحلات بكفاءة
بنيت عرض جدول قابل للفرز مع مرشحات ثابتة ووضع مقارنة للتحليل جنباً إلى جنب
النتائج والأثر
أُطلق Skiable كمنصة بحث رحلات سريعة وسهلة الاستخدام مع إمكانيات تصفية معقدة وتصميم متجاوب عبر الأجهزة.
الدروس المستفادة
واجهات البحث معقدة بشكل خادع. ما يبدو نموذجاً بسيطاً يخفي عشرات الحالات الحافة واعتبارات الأداء.