Air Travelerr

📋 نبذة عن المشروع

AirTravelerr هو منصة حجز تذاكر طيران تجريبية تقدم أسعارًا حصرية للمسافرين الباحثين عن رحلات بدرجة رجال الأعمال والدرجة الأولى بخصومات تصل إلى 64%.

🛠️ التقنيات المستخدمة

الواجهة الأمامية (Frontend)

التقنية الغرض

React 18 بناء واجهة المستخدم التفاعلية

TypeScript كتابة كود آمن ومقاوم للأخطاء

Tailwind CSS تصميم سريع وجذاب مع دعم كامل للشاشات المختلفة

Vite بناء سريع وتطوير فعال

React Router إدارة التنقل بين الصفحات

Lucide React أيقونات أنيقة وعصرية

الخادم (Backend)

التقنية الغرض

Node.js بيئة تشغيل الخادم

Express.js إدارة المسارات وطلبات API

PostgreSQL قاعدة بيانات علائقية قوية

Sequelize ORM التعامل مع قاعدة البيانات بطريقة كائنية

Neon استضافة قاعدة البيانات السحابية

استضافة ونشر (Deployment)

الخدمة الغرض

Render استضافة الخادم الخلفي

Vercel استضافة الواجهة الأمامية

🔧 المميزات التقنية الحالية

واجهة المستخدم

✅ تصميم متجاوب بالكامل - يعمل على جميع الأجهزة (جوال، جهاز لوحي، حاسوب)

✅ إكمال تلقائي - اقتراح المطارات أثناء الكتابة

✅ بحث فوري - عرض نتائج الرحلات (بيانات وهمية للعرض)

✅ حجز سريع - نموذج مبسط لإتمام الحجز (يخزن في قاعدة البيانات)

✅ لوحة تحكم - لوحة إدارة لعرض الحجوزات (كلمة المرور: 1234)

✅ رسوم متحركة - تأثيرات سلسة لتحسين تجربة المستخدم

الخادم

✅ API متكامل - مسارات للبحث، الحجز، والنشرة البريدية

✅ توثيق CORS - دعم الطلبات من مصادر مختلفة

✅ معالجة الأخطاء - نظام متكامل لالتقاط ومعالجة الأخطاء

✅ قاعدة بيانات - نماذج بيانات للمستخدمين والحجوزات

📊 هيكل المشروع

text

airtravelerr/

├── client/ # React + TypeScript

│ ├── src/

│ │ ├── components/

│ │ │ ├── common/ # مكونات مشتركة (أزرار، حقول)

│ │ │ ├── layout/ # (Navbar, Footer)

│ │ │ └── sections/ # (Hero, Features, HowItWorks)

│ │ ├── hooks/ # دوال React المخصصة

│ │ ├── pages/ # (Home, Admin)

│ │ ├── api/ # اتصال API

│ │ └── styles/ # ملفات التصميم

│ └── package.json

│

├── server/ # Node.js + Express

│ ├── src/

│ │ ├── config/ # (database, environment)

│ │ ├── controllers/ # (search, booking, newsletter)

│ │ ├── models/ # (User, Booking)

│ │ ├── routes/ # مسارات API

│ │ ├── middleware/ # (auth, validation, errorHandler)

│ │ └── services/ # خدمات مساعدة

│ └── package.json

│

└── README.md

🌐 الروابط المباشرة

الخدمة الرابط

الموقع المباشر https://airtravlerr.onren...

لوحة الإدارة https://airtravlerr.onren...

API الخادم https://airtravlerr.onren...

فحص الصحة https://airtravlerr.onren...

🔑 كلمة مرور لوحة الإدارة

text

1234

📦 الميزات المتاحة حالياً

البحث عن رحلات طيران ✈️

إدخال مدينة المغادرة والوصول

إكمال تلقائي لاقتراح المطارات

ملاحظة: البيانات معروضة بشكل وهمي للعرض

عرض النتائج 📊

عرض شركات الطيران المتاحة

السعر الأصلي مقابل السعر المخفض

نسبة التوفير

حجز التذاكر 📝

نموذج بسيط لإدخال بيانات المسافر

تخزين الحجز في قاعدة البيانات

تأكيد الحجز برقم مرجعي

لوحة التحكم 👨‍💼

عرض جميع الحجوزات

حالة الحجز (مؤكد، معلق، ملغي)

تفاصيل المسافرين

النشرة البريدية 📧

الاشتراك في التنبيهات

تخزين المشتركين في قاعدة البيانات

❌ الميزات غير المتوفرة حالياً

❌ دفع عبر الإنترنت (Stripe/PayPal)

❌ إشعارات البريد الإلكتروني الفعلية

❌ بيانات رحلات حقيقية (بيانات وهمية للعرض)

❌ تسجيل دخول المستخدمين

❌ إدارة الملفات الشخصية

📋 ملخص المشروع

العنصر الحالة

واجهة المستخدم ✅ مكتملة

تصميم متجاوب ✅ مكتمل

بحث الرحلات ✅ (بيانات وهمية)

نظام الحجز ✅ (يخزن في قاعدة البيانات)

لوحة التحكم ✅ مكتملة

النشرة البريدية ✅ مكتملة

قاعدة البيانات ✅ متصلة

النشر ✅ (Vercel + Render)

بوابة الدفع ❌ غير متوفرة

👨‍💻 فريق التطوير

الدور الاسم

مطور واجهة أمامية React, TypeScript, Tailwind

مطور خادم Node.js, Express, PostgreSQL

مسؤول النشر Vercel, Render

📝 ملخص الإنجازات

✅ تصميم عصري وجذاب - ألوان احترافية (أزرق وأبيض)

✅ تجربة مستخدم ممتازة - تنقل سلس واستجابة سريعة

✅ كود نظيف ومنظم - فصل كامل بين الواجهة والخادم

✅ جاهز للإنتاج - ناجح على منصات Vercel و Render

✅ متجاوب بالكامل - دعم جميع أحجام الشاشات

✅ قاعدة بيانات قوية - PostgreSQL مع Neon

✅ أمان - حماية CORS ومعالجة الأخطاء