Cinemera

Movie App - Angular

هذا التطبيق يهدف إلى عرض ومراجعة الأفلام باستخدام إطار العمل Angular. يتميز بالقدرة على البحث عن الأفلام، استعراض تفاصيلها، وحفظ المفضلات. وهو يعتمد على واجهة API للحصول على بيانات الأفلام.

الميزات الأساسية:

واجهة المستخدم الرئيسية (Home Page):

تعرض مجموعة من الأفلام الشائعة أو الأعلى تقييمًا.

يتضمن شريط بحث يمكن المستخدم من البحث عن فيلم معين.

تستخدم مكونات Angular لعرض الأفلام في بطاقات (Cards)، مع عرض العنوان، صورة الفيلم، وسنة الإصدار.

صفحة تفاصيل الفيلم (Movie Details):

عند الضغط على فيلم، يتم نقل المستخدم إلى صفحة التفاصيل الخاصة به.

تعرض الصفحة تفاصيل الفيلم مثل القصة، التصنيف، مدة العرض، وطاقم العمل.

يتم استرجاع هذه المعلومات من واجهة API باستخدام HttpClient.

نظام المفضلة (Favorites):

يمكن للمستخدم إضافة أفلام إلى قائمة المفضلات.

يتم تخزين المفضلات في الذاكرة المحلية (Local Storage) بحيث تبقى عند إعادة فتح التطبيق.

التقييمات والمراجعات (Reviews and Ratings):

يمكن للمستخدمين ترك مراجعاتهم حول الأفلام وتقييمها.

يتم عرض التقييمات المتوسطة للأفلام، مع إمكانية مشاهدة جميع المراجعات.

واجهة API:

يتم استدعاء بيانات الأفلام باستخدام HttpClient في Angular من خدمات API مفتوحة مثل OMDb أو The Movie Database (TMDb).

تستخدم الخدمات (Services) لجلب البيانات ومعالجتها ثم عرضها في المكونات.

التنقل (Routing):

يستخدم Angular Router لتنفيذ التنقل بين صفحات التطبيق مثل الصفحة الرئيسية، صفحة التفاصيل، وصفحة المفضلة.

يوفر التنقل السلس باستخدام روابط ديناميكية.

تصميم متجاوب (Responsive Design):

التطبيق مصمم باستخدام CSS وBootstrap ليكون متوافقًا مع جميع الأجهزة (مكتبية، لوحية، وهواتف).

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

Angular: لبناء واجهة المستخدم وإدارة مكونات التطبيق.

Angular Material أو Bootstrap: لتحسين تجربة المستخدم وإضافة عناصر واجهة مستخدم متفاعلة.

RxJS: لإدارة التدفقات والمعالجة المتزامنة للبيانات.

HttpClient: للتواصل مع واجهات API وجلب بيانات الأفلام.

Local Storage: لتخزين بيانات المفضلات محليًا في متصفح المستخدم.