مشروع تطبيق تتبع المصروفات
تطبيق Next.js لتتبع المصروفات مع مصادقة ومعاملات ولوحة ملخصات وسجل وشاشات متجاوبة مدعومة بـ MongoDB.
عارض صور المشروع

صورة 1 من 8
فكرة المشروع
تطبيق ويب لإدارة المصروفات الشخصية، بيسمح بتسجيل حساب، تسجيل دخول، وتسجيل معاملات مالية باسم ومبلغ وتاريخ لكل مستخدم على حدة — كل مستخدم يشوف ويعدّل ويحذف معاملاته هو بس، مفيش أي تداخل بين الحسابات. الرصيد الكلي بيُحسب كمجموع حسابي للمبالغ كلها: المبالغ الموجبة دخل، والسالبة مصروف.
ما الذي تعرضه الواجهة
المعرض بيوضح لوحة التحكم بالإنجليزي والعربي (نفس البيانات، واجهة مختلفة الاتجاه بالكامل RTL/LTR)، بملخص رصيد ودخل ومصروفات ملوّن (أخضر للدخل، أحمر للمصروف)، مع نموذج إضافة معاملة وقائمة تاريخ فيها أزرار حذف. شاشتي تسجيل الدخول والتسجيل بتصميم موحّد بتقسيم النص/الصورة (illustration مالي على الجنب) وبطاقة نموذج مرفوعة بالظل.
دوري وقراراتي
لما اكتشفت سر JWT حقيقي متسرّب في تاريخ Git، قررت أعيد كتابة التاريخ
بالكامل بدل إضافة commit حذف بس — لأن الحذف وحده كان هيسيب السر ظاهر في
الالتزامات القديمة. أول محاولة فشلت لأن السر اتكتب في قاعدة بيانات Git
الجديدة أثناء عملية checkout قبل الحذف، فغيّرت الأسلوب لتصدير الشجرة
برّه Git وتنظيفها الأول وبعدين إضافتها. لما فحصت ثغرات الاعتماديات،
لقيت ثغرة في مكتبة Sharp (تابعة لـNext.js) بدون تحديث آمن متاح — بدل ما
أنتظر أو أتجاهلها، فحصت هل التطبيق فعليًا بيعالج أي صور من مستخدمين،
ولقيت إن الاستخدام الوحيد لـnext/image هو صورتين ثابتتين، فقبلت
الاستثناء موثّقًا بدل الترقية الخطرة. وثبّت إصدار Node.js على 24.x عشان
يفضل ضمن نطاق الدعم الرسمي لـNext.js 16 على Heroku.
الجوانب التقنية
Next.js App Router موحّد (واجهة وAPI في نفس التطبيق)، MongoDB عبر
Mongoose بموديلين (مستخدم ومعاملة، مربوطين بمرجع وفهرس على userId)،
مصادقة JWT بخوارزمية HS256 عبر jose، وتشفير كلمات مرور بـbcrypt. خط
النشر (GitHub Actions) بيشغّل قاعدة بيانات MongoDB معزولة للاختبارات،
وبيربط النشر على Heroku بنجاح بوابة الجودة (فحص الاعتماديات، Lint،
الاختبارات، البناء). صورة Docker منفصلة بتحزم التطبيق مع MongoDB محلي في
صورة واحدة، بتبدأ بقاعدة بيانات فاضية.
قيمة المشروع داخل المعرض
المشروع ده بيوضح دورة استجابة حقيقية لمشكلة أمنية (اكتشاف سر مسرّب، فشل أول محاولة إصلاح، تصحيح المنهج)، مش مجرد سرد “عملنا كذا وخلاص”. كمان بيوضح قرار مبني على دليل فعلي (قبول ثغرة بعد التحقق من عدم وجود مسار استغلال حقيقي) بدل قرار افتراضي.
أعمال ذات صلة
تطبيق مشاركة صور اجتماعي
منصة اجتماعية لمشاركة الصور بموجز عام وإعجابات، بوضعين داكن وفاتح، مبنية بـ Next.js وMongoDB وCloudinary لتخزين الصور.
اقرأ المزيدتطبيق تعلم الإنجليزية بالذكاء الاصطناعي
مساعد تعلّم إنجليزية بالذكاء الاصطناعي لمتعلمين عرب، بدروس وأسئلة وترجمة وتدريب نطق، بدون حسابات أو تخزين دائم.
اقرأ المزيدمنصة حجز فعاليات
منصة حجز فعاليات بواجهة GraphQL، بحث وتصفح وحجز وإلغاء، وأحداث لحظية عبر GraphQL Subscriptions.
اقرأ المزيدخدمات ذات صلة
تطوير تطبيقات ويب متكاملة
تطبيقات ويب متكاملة تربط واجهات متجاوبة وAPIs ومصادقة وقواعد بيانات داخل تدفقات منتج عملية.










