موقع لبيع مستلزمات الحاسوب PC Haven

أحببت مشاركة تجربتي في بناء PC-Haven، وهو متجر إلكتروني متكامل لبيع قطع الحواسيب والإكسسوارات. المشروع كان فرصة رائعة لصقل مهاراتي في React، TypeScript، Tailwind CSS، بالإضافة إلى تحسين الأداء والاستجابة عبر مختلف الأجهزة.

المشروع المباشر: PC-Haven

الكود المصدري: GitHub Repo

تقنيات استخدمتها في المشروع

React & Vite – لأداء أسرع وتجربة تطوير سلسة

TypeScript – لضمان كتابة كود أكثر أمانًا وتنظيمًا

Tailwind CSS – لتصميم مرن ومتجاوب مع الأجهزة المختلفة

React Router – لإدارة الصفحات والتنقل السلس

Lazy Loading – لتحسين سرعة تحميل المحتوى

GitHub Pages Deployment – لنشر الموقع بسهولة

ميزات المشروع

واجهة مستخدم حديثة وسهلة الاستخدام ️

تصميم متجاوب 100%

نظام تصنيفات متكامل لعرض المنتجات

إمكانية إضافة المنتجات إلى السلة والتنقل بينها بسهولة

تحسين استدعاء الصور لعرضها بشكل صحيح على GitHub Pages

أهم التحديات التي واجهتها؟

ضبط مسارات الصور بحيث تعمل على GitHub Pages

تحسين تجربة المستخدم عبر التأثيرات البصرية والتحميل التدريجي

تحسين الأداء باستخدام تقسيم الكود (Code Splitting) والتحميل الكسول (Lazy Loading)

خلاصة التجربة

هذا المشروع كان تجربة رائعة في تحسين مهاراتي في تطوير الواجهات الأمامية، كما ساعدني في التعامل مع التحديات الحقيقية التي تواجه أي مطور عند نشر المشاريع.

هل لديك أي أفكار أو ملاحظات حول المشروع؟ يسعدني سماع رأيك!