بوابة الطلاب المتقدمة

بوابة الطلاب المتقدمة هو تطبيق ويب حديث ومتجاوب تم تطويره باستخدام JavaScript الخام (Vanilla JavaScript) والممارسات الحديثة في تطوير الواجهات. يقدم هذا المشروع بوابة بسيطة لإدارة بيانات الطلاب مع نظام تسجيل دخول أساسي، ويتيح تنفيذ عمليات CRUD (إنشاء – عرض – تعديل – حذف) على سجلات الطلاب. ? مميزات المشروع: تسجيل الدخول والخروج: باستخدام localStorage مع رسالة ترحيبية بسيطة بعد الدخول. إدارة الطلاب: يمكنك إضافة، تعديل، حذف، والبحث عن الطلاب. يتم حفظ البيانات (الرقم التعريفي، الاسم، العمر، المهارات) محليًا. تصميم متجاوب: واجهة نظيفة وعصرية باستخدام CSS فقط بدون أطر تصميم خارجية، تعمل على جميع الشاشات (جوال، تابلت، كمبيوتر). بحث ذكي: يمكنك البحث عن الطلاب حسب الاسم، الرقم التعريفي، أو المهارات. تنظيم الكود: الكود مكتوب بطريقة منظمة، مع تعليقات توضيحية، باستخدام JavaScript الخام فقط، مما يجعله سهل القراءة والتعلّم. ️ التقنيات المستخدمة: HTML5: لإنشاء الهيكل العام للصفحات باستخدام عناصر دلالية. CSS3: لتنسيق وتصميم الواجهة بشكل متجاوب وعصري. JavaScript (ES6+): لتنفيذ الوظائف المنطقية وعمليات التفاعل مع الصفحة. LocalStorage: لتخزين بيانات الدخول وسجلات الطلاب بشكل دائم داخل المتصفح. ▶️ كيفية تشغيل المشروع: قم بتحميل أو استنساخ (Clone) المشروع إلى جهازك. افتح المجلد باستخدام أي محرر أكواد تفضله. شغّل ملف index.html في المتصفح مباشرة (أو باستخدام سيرفر محلي). استخدم نموذج تسجيل الدخول (أي اسم مستخدم وكلمة مرور مقبولين) لبدء إدارة بيانات الطلاب. طريقة الاستخدام: تسجيل الدخول: اضغط على زر "تسجيل الدخول" وأدخل أي اسم مستخدم وكلمة مرور. تسجيل الخروج: اضغط على "تسجيل الخروج" لمسح الجلسة الحالية. إضافة طالب: اضغط على "إضافة طالب"، ثم أدخل الرقم التعريفي، الاسم، العمر، والمهارات مفصولة بفواصل. تعديل طالب: اضغط على "تعديل" في بطاقة الطالب لتحديث بياناته. حذف طالب: اضغط على "حذف" وسيظهر تأكيد قبل الإزالة. بحث: استخدم خانة البحث لتصفية النتائج حسب الاسم، الرقم، أو المهارات.