Mayo Chat App

قمت ببناء تطبيق دردشة فورية (Real-time Chat Application) من الصفر باستخدام React.js مع التركيز على الأداء العالي، التصميم المتجاوب، والتجربة التفاعلية الشبيهة بتطبيقات التواصل الشهيرة. المشروع يدعم المحادثات الفردية والجماعية، إرسال الصور والرسائل الصوتية، التفاعل عبر الإعجابات (Reactions)، وإدارة الملف الشخصي، مع دعم اللغات المتعددة. أبرز الميزات التي طورتها بنفسي: نظام الرسائل الفورية (Real-time Messaging): إرسال واستقبال الرسائل لحظيًا باستخدام Pusher. عرض حالة "جاري الكتابة..." و"تم الإرسال/تم التسليم/تم القراءة". إرسال الصور والرسائل الصوتية: رفع الصور مع معاينة فورية قبل الإرسال. تسجيل وتشغيل الرسائل الصوتية داخل التطبيق بتصميم أنيق. التفاعل مع الرسائل (Reactions): إضافة إعجابات (️...) على أي رسالة بنقرة واحدة. عرض عدد التفاعلات أسفل الرسالة. الملف الشخصي (User Profile): تعديل الصورة الشخصية، الاسم، والـ Bio. تأثيرات بصرية عند التعديل (blur + overlay). حفظ البيانات محليًا مع إمكانية التوسع لقاعدة بيانات. دعم اللغات (Multilingual): ترجمة كاملة للواجهة (عربي/إنجليزي) باستخدام i18n. تغيير اللغة ديناميكيًا دون إعادة تحميل. واجهة مستخدم متطورة: تصميم متجاوب 100% (هاتف، تابلت، دسكتوب). مودال مخصص لعرض الصور والتفاصيل. إشعارات Toast لتأكيد الإجراءات (تم الإرسال، خطأ، إلخ). ثيم فاتح/داكن مع حفظ تفضيل المستخدم. هيكلة الكود النظيفة: استخدام Custom Hooks لإدارة الرسائل، التفاعلات، والحالة. كود قابل للتوسع والصيانة بسهولة.