Moviestan App

Ultimate Movie and TV Show Discovery Platform

Discover real-time movies and TV shows with detailed information using, 🎥 The Moviestan App: A dynamic and fully responsive web app that explores Trending, Upcoming, and Top-rated exciting movies and web shows.🍿 Built with React, Axios, Redux, and Custom Hooks, it fetches data in real-time from TMDB’s API, offering an immersive experience with the help of various useful React libraries. This app offers a responsive and visually appealing user interface that adapts seamlessly to various screen sizes.

Live link 🌍📡 - [ https://moviestan-one.vercel.app/ ]

🖥️ Screen Preview:

Search Result

Explore Movies & TV Shows

Details of Movie / TV

Cast of the Movie / TV

Similar Movies & Recommendations

📝 Features

• 🎥 Movie and TV Shows Search: Users can easily search for movies and TV shows by their respective names.

• 🌟 Popular, Trending, and Upcoming: The homepage showcases popular, trending, and upcoming movies and TV shows, with their names, posters, genres, and ratings.

• 🎭 Detailed Movie/TV Show Pages: Clicking on a movie or TV show provides users with a detailed page containing comprehensive information about the title, cast, runtime, release year, rating, director, writer, including its description, trailer, and additional videos.

• 🔍 📄 Personalized Recommendations: Users receive recommendations for similar movies and TV shows based on the content they are currently viewing.

• 🍿 Fine-Tuned Filters: Users can apply filters based on various criteria, such as genre, release date, rating, and more, to refine their search results.

• 🏠 Single page application: Seamless navigation between different pages without the need for page refreshes..

• 🏠 Random Home Page Background: Background changes on page refresh or revisit, giving a fresh look every time.

• 🎬 Carousel: Explore trending, upcoming, and top-related movies and TV shows using interactive carousels.

• 📄 Multiple Pages: Navigate through different pages including Home, Details, Search Results, and Page Not Found.

• ♾️ Infinite Scroll: Incorporates the InfiniteScroll library for seamless scrolling through content.

• 🔍 Search: Implement the efficient and user-friendly search functionality.

• 🚀 Lazy Loading: Enhance performance by lazily loading images using the react-lazy-load-image library.

React Hooks 🎣

Utilized several React hooks for efficient state management and dynamic behavior:

• useState
• useEffect
• useDispatch
• useParams
• useSelector
• useLocation
• useNavigate
• useRef
• Custom-Hook

🙏 Acknowledgments

In the development of Moviestan, we express our gratitude to the following third-party libraries and APIs that have significantly contributed to the application's functionality and user experience:

• Redux Toolkit (@reduxjs/toolkit): A comprehensive toolset for managing application state with Redux, streamlining state management and reducing boilerplate code.

• Axios (axios): A reliable and efficient HTTP client that seamlessly integrates with the TMDB API, enabling smooth data retrieval.

• Day.js (dayjs): A lightweight and versatile library for date and time manipulation, enhancing the application's date formatting capabilities.

• React (react) and React DOM (react-dom): The core libraries powering the dynamic user interface and rendering of React components.

• React Circular Progressbar (react-circular-progressbar): An eye-catching component that brings visually appealing circular progress bars to the application.

• React Icons (react-icons): A treasure trove of icons that adds visual charm and enhances the user interface with diverse iconography.

• React Infinite Scroll Component (react-infinite-scroll-component): Empowers infinite scrolling functionality, making content loading seamless and intuitive.

• React Lazy Load Image Component (react-lazy-load-image-component): Enhances performance by deferring image loading until needed, improving page loading times.

• React Player (react-player): Facilitates smooth integration of media players to showcase movie trailers and videos within the application.

• React Redux (react-redux): Seamlessly integrates Redux state management with React, providing predictable application state handling.

• React Router DOM (react-router-dom): Enables smooth and intuitive navigation and routing within the application.

• React Select (react-select): Provides customizable select dropdowns for better user interaction and search functionalities.

• Sass (sass): A powerful CSS preprocessor that streamlines and organizes styling, contributing to the overall visual aesthetics of the application.

⚠️ Disclaimer

Please note that Moviestan relies on the TMDB API to fetch movie and TV show data. The accuracy, completeness, and availability of the data are subject to TMDB's policies and may be subject to change. Users are advised to refer to the TMDB API documentation and terms of use for any restrictions or usage guidelines related to the data accessed through the API.

Contact

If you have any questions or feedback, feel free to reach out:

• LinkedIn : https://www.linkedin.com/in/yashk9293/
• GitHub : https://github.com/yashk9293

💖Like my work?

This project needs a ⭐️ from you. Don't forget to leave a star ⭐️.