Movie Explorer is a modern and interactive web app for browsing movies.
It’s designed to deliver a smooth and visually engaging user experience — from browsing movie posters to watching trailers — all in one place.
Built with Next.js, React, TypeScript, and Tailwind CSS, this project demonstrates the best of modern front-end development with clean design and dynamic interactivity.
- 🏠 Home Page displaying movies in an elegant and responsive grid layout
- 🎬 Movie Detail Page with poster, title, description, genre, year, rating, and trailer
- 🔍 Search Functionality to quickly find your favorite movie by title
- 🧭 Navigation Bar for smooth and simple page transitions
- 💫 Framer Motion Animations for dynamic and modern UI transitions
- 📱 Fully Responsive design for desktop, tablet, and mobile devices
| Technology | Purpose |
|---|---|
| ⚛️ React | Building reusable UI components |
| 🧭 Next.js | Server-side rendering and routing |
| 🟦 TypeScript | Static typing and better code safety |
| 🎨 Tailwind CSS | Fast and flexible styling |
| 🌀 Framer Motion | Smooth animations and transitions |
The Movie Explorer project is a great demonstration of building an engaging, data-driven web app using the modern front-end stack.
Users can:
- 🎥 Browse movies with stylish animations
- 🔎 Filter movies using real-time search
- 🧾 Read detailed descriptions and genres
- ⭐ View ratings and watch trailers
- 💻 Enjoy a seamless, responsive, and visually captivating experience
Perfect for anyone looking to learn and showcase skills in React, Next.js, TypeScript, Tailwind CSS, and Framer Motion.
- 🎞️ Add a “Favorites” section for saved movies
- 🌐 Connect to a real API (like TMDB) for live data
- 🎭 Add filtering by genre, rating, and release year
- 🧠 Include dark/light theme toggle
- 🔔 Add trailer autoplay and cinematic transitions
Developed by: Hami Parsa
💬 Front-End Developer | Building creative, animated, and user-friendly web experiences