مشروع تطوير واجهة أمامية (Frontend) حديثة ومتكاملة تماماً باستخدام JavaScript البحتة (Vanilla JS) و HTML/CSS. يمثل هذا المشروع محاكاة واقعية لنظام إدارة مستخدمين آمن، مع التركيز على تجربة المستخدم (UI/UX) السلسة وإدارة البيانات بكفاءة.
الميزات التقنية والبرمجية المطبقة:
نظام مصادقة محلي (Local Storage Authentication): تم بناء صفحتين لتسجيل الدخول وإنشاء حساب جديد. يتم تخزين بيانات المستخدمين بأمان باستخدام Local Storage داخل المتصفح، مع التحقق من صحة المدخلات.
جلب البيانات من API ديناميكي (Dynamic API Fetching): يتم جلب بيانات المستخدمين وتفاصيلهم بشكل حيوي من API خارجي (DummyJSON) وعرضها بتنسيق "بطاقات" (Cards) أنيق في لوحة التحكم (Dashboard).
نظام تصفح معقّد (ID-based Details Page using Cookies): عند النقر على "بطاقة" مستخدم معين في لوحة التحكم، يتم تخزين المعرف الفريد للمستخدم (User ID) في ملفات تعريف الارتباط (Cookies)، وفتح صفحة تفاصيل جديدة بشكل تلقائي، ثم استرجاع بيانات هذا المستخدم وعرضها بالتفصيل.
تبديل الوضع الليلي/النهاري (Dynamic Theme Toggle): تم تطبيق زر مخصص لتبديل مظهر الموقع فوراً بين الوضع الليلي (Dark Mode) والنهاري (Light Mode)، ويتم حفظ تفضيلات المستخدم عبر ملفات تعريف الارتباط لتظهر تلقائياً عند الزيارة القادمة.
تصميم متجاوب (Responsive Design): تم بناء جميع الصفحات لتكون متجاوبة بالكامل لتعمل بسلاسة على جميع الأجهزة (الهواتف الذكية، الأجهزة اللوحية، وأجهزة الكمبيوتر).
هذا المشروع يوضح قدراتي في بناء واجهات مستخدم معقدة، التعامل باحترافية مع الـ API، إدارة حالة التطبيق (State Management) محلياً، وتحويل ملفات التصميم إلى تطبيق ويب تفاعلي جاهز للاستخدام.
