EgyRack

EgyRack: موقع شركة استيراد وتصدير لعرض المنتجات

EgyRack هو موقع إلكتروني مصمم خصيصًا لشركة تعمل في مجال الاستيراد والتصدير، ويهدف إلى عرض المنتجات والخدمات بطريقة احترافية تسهّل على العملاء الاطلاع على تفاصيل المنتجات والتواصل مع الشركة.

-أقسام الموقع ووظائفه:

--الصفحات العامة:

الصفحة الرئيسية:

تحتوي على شعار الشركة (اللوجو) وأيقونات لوسائل التواصل الاجتماعي.

تصميم بسيط وجذاب يعكس هوية الشركة.

-صفحة المنتجات:

عرض المنتجات بطريقة منظمة وجذابة.

إمكانية الضغط على أي منتج للانتقال إلى صفحة التفاصيل الخاصة به.

-صفحة "من نحن":

تقدم نبذة مختصرة عن الشركة وخدماتها.

توضح نوعية المنتجات التي تقوم الشركة باستيرادها وتصديرها.

-صفحة "اتصل بنا":

تعرض معلومات التواصل مثل:

رقم الهاتف.

رقم الواتساب.

البريد الإلكتروني.

تحتوي على نموذج لإرسال رسائل مباشرة إلى الشركة.

صفحة المنتجات بالتفصيل:

تضم جميع المنتجات المعروضة.

توفر إمكانية تصفية المنتجات حسب الفئات (مثل احمال خفيفة، احمال ثقيلة، إلخ).

كل فئة تحتوي على مجموعة منتجات مرتبة بشكل جيد.

-خصائص الإدارة (Admin Panel):

-صفحة تسجيل الدخول:

مخصصة فقط للمدير (Admin).

تتيح للمدير الوصول إلى جميع الوظائف الإدارية في الموقع.

-إدارة المنتجات:

-إضافة منتجات جديدة مع التفاصيل الكاملة (الاسم، الوصف، الصورة، إلخ).

-تعديل بيانات المنتجات الحالية.

-حذف المنتجات غير المرغوب فيها.

إدارة الفئات:

-إضافة فئات جديدة.

-تعديل الفئات الحالية.

-حذف الفئات غير الضرورية.

التأكد من صحة البيانات (Validations):

-التأكد من عدم تكرار اسم المنتج.

-التأكد من عدم تكرار اسم الفئة.

-عرض رسائل تنبيه عند حدوث أخطاء أثناء الإدخال.

التقنيات المستخدمة:

-تصميم الواجهات:

استخدمت Figma لتصميم المخططات الأولية (Wireframes) والواجهات النهائية للموقع، مما ساهم في إنشاء تصميم متكامل ومتناسق.

-التطوير البرمجي:

--Frontend:

HTML، CSS، JavaScript، وReact.js.

مكتبة Tailwind CSS لتصميم واجهات المستخدم.

--Backend:

Node.js مع Express.js لإدارة الخادم.

استخدام MongoDB كقاعدة بيانات لتخزين وإدارة بيانات المنتجات والفئات.

--قاعدة البيانات:

تم الاعتماد على MongoDB كحل فعال وآمن لتخزين البيانات وضمان سرعة الأداء.

-مميزات إضافية:

-تصميم متجاوب يناسب جميع الأجهزة (Responsive Design).

-تجربة مستخدم سهلة وبسيطة (User-Friendly).

-كود نظيف ومنظم تسهّل التطوير المستقبلي.