تخطي إلى المحتوى
العودة إلى الأعمال

مشروع تطبيق محادثة فورية

تطبيق محادثة باستخدام Express وMongoDB وSocket.IO مع مستخدمين موثقين وملفات شخصية وشاشات محادثة متجاوبة.

عارض صور المشروع

تطبيق محادثة فورية

صورة 1 من 6

فكرة المشروع

تطبيق محادثة فورية بين مستخدمين، بمحادثات ثنائية، حالة قراءة/عدم قراءة، وأحداث لحظية عبر Socket.IO. بنفس الخادم بيتغذّى عليه عميل ويب (React) وعميل موبايل (React Native) منفصلين.

ما الذي تعرضه الواجهة

محادثة عربية بالكامل RTL، صندوق وارد بمحادثات متعددة، صفحتي ملف شخصي بحالتي الصورة (حقيقية وافتراضية)، وشاشة تسجيل دخول.

دوري وقراراتي

لما لاحظت إن الرسائل العربية بتتعرض LTR رغم إن المحتوى عربي، الحل ماكانش بترجمة القسم كله لـRTL يدويًا، لكن إضافة dir="auto" على مستوى نص الرسالة نفسه — يخلي المتصفح يحدد الاتجاه تلقائيًا حسب المحتوى الفعلي، فالرسائل العربية تظهر RTL والإنجليزية تفضل LTR من غير ما نكسر أي حاجة. لاحظت كمان إن مشكلة الإكمال التلقائي لكلمة المرور كانت بسبب حقل password بدون autocomplete="current-password" — إصلاح سطر واحد لكن بفهم دقيق للسبب.

الجوانب التقنية

Express + Mongoose + Socket.IO للخادم، React منفصل للويب و React Native للموبايل (مش مبنيين جوه بعض)، مصادقة JWT بـbcrypt الأصلية، وتخزين صور قابل للتبديل (محلي/Cloudinary). فصل الخادم عن الفرونت يعني نشر منفصل لكل واحد (Heroku للخادم، GitHub Pages للويب).

قيمة المشروع داخل المعرض

بيوضح التعامل مع نص ثنائي الاتجاه (bidirectional text) بحل بسيط ومناسب بدل حل زايد عن الحاجة، وبنية عميلين منفصلين (ويب وموبايل) على نفس الخادم.

عرض أعمال أكثر
عرض خدمات أكثر