منصة "Jecard" لإنشاء بطاقات الأعمال الرقمية ومشاركة التواصل الاجتماعي

منصة Jecard هي منصة مبتكرة تهدف إلى رقمنة الهوية الشخصية والمهنية. تتيح للمستخدمين إنشاء "بطاقة أعمال رقمية" متكاملة تجمع كافة روابط التواصل الاجتماعي، بيانات الاتصال، والموقع الجغرافي في صفحة واحدة احترافية، مما يسهل عملية تبادل البيانات بلمسة واحدة عبر الـ QR Code أو الروابط المباشرة.

1. الأدوات والتقنيات المستخدمة (Tech Stack)

تم اختيار التقنيات بعناية لضمان سرعة فائقة وتجربة مستخدم تفاعلية:

Front-End: تم استخدام React.js مع Vite لضمان أفضل أداء، بالإضافة إلى TypeScript لكتابة كود مستقر ومنظم.

State & Data Management: الاعتماد على React Query (TanStack Query) لجلب البيانات بكفاءة، و Axios للتعامل مع الـ APIs.

Back-End: تم بناء النظام الخلفي وإدارة قواعد البيانات باستخدام PHP Laravel و MySQL لتوفير بيئة عمل آمنة وقابلة للتوسع.

UI/UX: استخدام Styled-components و Tailwind CSS مع Animate.css لتوفير واجهات عصرية وحركات انسيابية.

Special Features: دمج مكتبات متخصصة مثل qrcode.react لتوليد الأكواد، و Cropperjs لمعالجة الصور، و EmailJS للتواصل المباشر.

2. شرح تفصيلي للمشروع (Key Features)

الملف الشخصي الديناميكي: لوحة تحكم تتيح للمستخدم إضافة وتعديل روابط السوشيال ميديا (Facebook, LinkedIn, Instagram, إلخ) وبيانات الاتصال بلحظة واحدة.

نظام توليد الـ QR Code: إنشاء رمز استجابة سريع فريد لكل مستخدم يسهل مشاركته في الاجتماعات أو طباعته على بطاقات فعلية.

معالجة الصور المتقدمة: إمكانية رفع الصور الشخصية وقصها (Cropping) وتعديلها مباشرة داخل المنصة لضمان أفضل مظهر للهوية الرقمية.

المشاركة الذكية: ميزة "نسخ الرابط" بلمسة واحدة وتوافق تام مع كافة منصات التواصل الاجتماعي.

الاستخدام بدون إنترنت: دمج ميزة التنبيه عند انقطاع الاتصال (Offline Detection) لضمان تجربة مستخدم مستقرة.

التحقق وتأمين البيانات: استخدام Formik و Yup لضمان إدخال البيانات بشكل صحيح وآمن.

3. الدور الذي قمت به (Full-Stack Responsibility)

توليت إدارة المشروع تقنياً بالكامل لضمان تقديم منتج نهائي عالي الجودة:

بناء بنية الـ API: تطوير الجوانب الخلفية باستخدام Laravel لتخزين بيانات المستخدمين وتأمين حساباتهم.

تطوير واجهة المستخدم التفاعلية: تصميم وبرمجة واجهات تتسم بالبساطة والاحترافية، مع التركيز على الـ Mobile-First Approach لأن أغلب الاستخدام يكون عبر الهواتف.

تنفيذ ميزة التعديل اللحظي (Live Preview): تمكين المستخدم من رؤية التغييرات التي يجريها على ملفه الشخصي بشكل فوري قبل الحفظ.

تحسين الأداء وسرعة التحميل: استخدام تقنيات الـ Code Splitting والـ Lazy Loading لضمان فتح البطاقة الرقمية في أسرع وقت ممكن تحت أي ظروف شبكة.

التكامل مع خدمات الطرف الثالث: ربط ميزات المشاركة، توليد الأكواد، وإرسال البريد الإلكتروني بشكل متناغم داخل المنصة.