To-Do List Web Application (Vanilla JavaScript) تطبيق قائمة مهام (To-Do List) باستخدام JavaScript فقط

تطبيق قائمة مهام تفاعلي وكامل تم تطويره باستخدام HTML وCSS وJavaScript فقط بدون استخدام أي مكتبات أو أُطر عمل خارجية. يهدف التطبيق إلى مساعدة المستخدم على إدارة مهامه اليومية بشكل منظم وسهل، مع واجهة بسيطة وتجربة استخدام سلسة، بالإضافة إلى حفظ البيانات بشكل دائم باستخدام Local Storage.

المميزات الأساسية

إضافة المهام بسهولة

يمكن للمستخدم إضافة مهام جديدة بسرعة من خلال حقل إدخال مع التحقق من صحة البيانات لمنع الإدخال الفارغ.

حذف المهام

إمكانية حذف أي مهمة بسهولة وبنقرة واحدة.

تحديد حالة الإكمال

يمكن تغيير حالة المهمة من غير مكتملة إلى مكتملة مع تمييزها بصريًا عبر خط على النص.

إلغاء الإكمال

إمكانية إعادة المهمة إلى حالتها الأصلية في أي وقت.

نظام الأولويات

تحديد المهام المهمة وترتيبها في أعلى القائمة مع إمكانية إزالة التمييز عنها.

تخزين البيانات

يتم حفظ جميع البيانات داخل المتصفح باستخدام Local Storage، مما يضمن:

بقاء المهام بعد إعادة تحميل الصفحة

حفظ حالة كل مهمة (مكتملة أو غير مكتملة)

حفظ حالة الأولوية لكل مهمة

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

تصميم عصري بخلفية متدرجة داكنة

تأثير زجاجي (Glassmorphism) لعرض المهام بشكل جذاب

عرض المهام داخل بطاقات منظمة

تأثيرات عند تمرير المؤشر لتحسين التفاعل

تصميم متجاوب يعمل على جميع الأجهزة

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

HTML5 لبناء الهيكل

CSS3 للتنسيق والتصميم المتجاوب

JavaScript (Vanilla) لتنفيذ كل الوظائف

التعامل مع DOM لتحديث المحتوى بشكل ديناميكي

Event Handling للتفاعل مع المستخدم

Local Storage لحفظ البيانات

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

عداد للمهام (إجمالي / مكتملة / متبقية)

خاصية البحث داخل المهام

تصفية المهام حسب الحالة

تعديل المهام

حذف المهام المكتملة دفعة واحدة

إمكانية السحب والإفلات لإعادة الترتيب

وضع الليل والنهار

تحديد موعد للمهام

تأثيرات حركية سلسة

أبرز نقاط المشروع

كود منظم ونظيف بدون استخدام مكتبات جاهزة

تطبيق عملي قوي على أساسيات JavaScript

تجربة مستخدم سلسة وسريعة الاستجابة

قابلية عالية للتطوير وإضافة مميزات مستقبلية