تطبيق عرض الأفلام باستخدام React و Next.js

تفاصيل العمل

نظرة عامة على المشروع:

هذا المشروع هو تطبيق حديث ومتجاوب لبث الأفلام باستخدام React و Next.js. يقوم التطبيق بجلب وعرض الأفلام باستخدام واجهة برمجة التطبيقات الخاصة بـ TMDb. يتميز التطبيق بواجهة نظيفة وسهلة الاستخدام، تتيح للمستخدمين تصفح الأفلام والتنقل بين الصفحات بسهولة.

الميزات الرئيسية:

جلب وعرض الأفلام:

التكامل مع واجهة برمجة التطبيقات الخاصة بـ TMDb لجلب وعرض الأفلام الشعبية.

يتم عرض الأفلام في تخطيط على شكل بطاقات تشمل الملصقات والعناوين وأزرار المشاهده.

تصميم متجاوب:

تم تصميم التطبيق باستخدام نهج "الأولوية للجوال"، لضمان تجربة سلسة على جميع أحجام الأجهزة.

تم تنفيذ التصميم باستخدام Tailwind CSS لضمان تنسيق حديث ومتسق.

التوجيه الديناميكي باستخدام Next.js:

يعتمد التطبيق على Next.js لتقديم الصفحات من جانب الخادم والتوجيه الديناميكي.

التنقل بين الصفحات (الرئيسية، الأفلام، حول) سلس ومحسن للأداء.

مكونات مخصصة:

مكونات قابلة لإعادة الاستخدام مثل مكون Navbar للتنقل، ومكون Movies لعرض بطاقات الأفلام، ومكون Loading لمعالجة حالات التحميل. و معالجة الأخطاء بصفحة NotFound مخصصة للمسارات غير الصالحة.

عناصر واجهة المستخدم:

استخدام أيقونات React لإضافة أيقونات تفاعلية مثل أيقونة الصفحة الرئيسية (FaHome).

الأزرار والإجراءات مصممة لسهولة الاستخدام مع تأثيرات تمرير مناسبة ومراعاة لإمكانية الوصول.

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

الواجهة الأمامية: React.js, Next.js

التصميم: Tailwind CSS, CSS Modules

تكامل API: TMDb API

الأيقونات: React Icons (مثل FaHome)

الخط: Google Fonts (Inter)

معالجة الأخطاء: صفحة خطأ مخصصة 404 Not Found

ملفات مرفقة

بطاقة العمل

اسم المستقل Hagar Z.
عدد الإعجابات 3
عدد المشاهدات 37
تاريخ الإضافة
تاريخ الإنجاز

المهارات المستخدمة