E‑Movie Center is a modern, high‑performance movie and TV browsing platform built with React, Vite, Tailwind CSS, Zustand, Axios, and Vitest. It delivers a fast, accessible, and visually engaging experience for exploring movies, TV shows, actors, and trending entertainment content. The project focuses on scalability, clean architecture, smooth UI interactions, and strong testing practices.

⭐ Core Features

• Browse trending movies, TV shows, and people (actors, directors, crew)

• Dynamic routing for movies, TV shows, and actor profiles

• Fully responsive UI with accessibility improvements

• Smooth scrolling, animations, and optimized layout

• High‑performance React + Vite setup with HMR

• Clean ESLint configuration for consistent code quality

🔍 Search & Discovery

• Global search for movies, TV shows, and people

• Instant results with dynamic routing

• Keyword‑based search with smart filtering

• Fast API calls with Axios

• Search page optimized for speed and clarity

🎥 Application Pages

• Homepage — Trending movies & TV shows, featured banners, smooth scrolling, responsive layout

• Movie Page — Title, release date, rating, runtime, poster, trailer, cast list, recommendations

• TV Page — Seasons, episodes, thumbnails, episode details, ongoing/completed tracking

• People Page — Biography, filmography, profile images, interactive cards

• Search Page — Instant results for movies, TV shows, and people with dynamic routing

• Interactions Page — Favorites, watchlist, rating system, smooth UI transitions

🧪 Testing & Reliability

• Unit & integration tests using Vitest + React Testing Library

• Covers component rendering, API calls, search behavior, navigation, and Zustand store logic

• Strengthened skills in mocking API responses, testing dynamic routing, and validating UI interactions

🧱 Architecture & Code Quality

• Modular folder structure with reusable components

• Zustand store for global state management

• Custom hooks for API and UI logic

• Clean separation of concerns

• Tailwind CSS for fast, consistent styling

• Vite for blazing‑fast builds and HMR

• Deployed on Vercel with CI/CD automation

🚀 Performance & Deployment

• Optimized for fast load times

• Vite bundling + code splitting

• Automatic deployments on Vercel

• Production URL: https://e-movie-center.vercel.app

🛠️ Challenges Solved

• Implemented dynamic routing for movies, TV, and people

• Improved accessibility with test‑ids and ARIA considerations

• Fixed layout issues across mobile and desktop

• Debugged API integration and search behavior

• Ensured smooth scrolling and animation performance

🎯 Skills Demonstrated

• Modern React development

• State management with Zustand

• API integration with Axios

• UI/UX design and responsive layouts

• Testing with Vitest + RTL

• Performance optimization

• Deployment workflows with Vercel

🔮 Future Enhancements

• Add user authentication

• Real watchlist persistence with backend

• Advanced filters (genre, rating, year)

• Infinite scrolling for search results

• More detailed actor/crew analytics

📌 Summary

E‑Movie Center is a polished, scalable entertainment browsing platform showcasing strong front‑end engineering, clean UI/UX, dynamic routing, API integration, and reliable testing. It highlights my ability to build real‑world, production‑ready applications with modern tools and best practices.