Project Overview

Developed a responsive, high-performance web frontend prototype for a modern movie streaming and cinema scheduling platform. The primary objective was to design a clean, dark-themed user interface featuring smooth transitions, interactive carousels, and optimized rendering times.

Key Features & Technical Implementation Interactive Media Sliders: Integrated Swiper.js to build fluid, touch-responsive movie sliders and a dynamic featured movie banner. Component-Driven Architecture: Developed modular, reusable React components (including search filters, blog cards, and play-button triggers) to keep the codebase clean and maintainable. Responsive Styling: Implemented a mobile-first responsive layout using Bootstrap 5 and custom CSS Grid/Flexbox, ensuring compatibility across all screen sizes. Dynamic Modals & Portals: Created robust modal overlays for video trailer playback and user authentication without interfering with page scroll performance. Search & Filter Logic: Built state-driven filtering for the cinema schedule and a real-time search component for instant movie filtering.

Technologies Used Frontend Library: React.js (v18) Build Tool: Vite Styling Framework: Bootstrap 5, Custom CSS Slider Library: Swiper Data Mockup: JSON-Server

Outcome Delivered a pixel-perfect, highly responsive frontend application. The modular design of the React components ensures that the codebase is completely production-ready and prepared for backend API integration.