This is a Movie Web App built with React, Redux, and various other useful libraries. The app dynamically renders movie data from TMDB's API using Axios, Redux, Custom Hooks, and more. It utilizes React Router DOM, React Icons, React Player, DayJS, Redux Toolkit, React Infinite Scroll Component, Axios React, React Lazy Load Image Component, and React Circular Progress Bar to enhance the user experience.
- Browse and search for movies.
- View movie details, including synopsis, release date, runtime, genres, and ratings.
- Watch movie trailers using the embedded React Player.
- Infinite scroll functionality for smooth navigation through movie lists.
- Lazy loading of images to optimize performance.
- Display of circular progress bars for loading and buffering.
- Utilization of Redux for state management.
- Implementation of custom hooks for reusable logic.
- Integration with TMDB's API for fetching movie data.
- Seamless navigation with React Router DOM.
- Enhanced visual appeal with React Icons for icons and DayJS for date formatting.
- Clone the repository:
- Change to the project directory:
- Install dependencies:
- Start the development server:
- Open your browser and visit:
git clone <repository-url>
cd movie-web-app
npm install
npm start
http://localhost:3000
- React: A JavaScript library for building user interfaces.
- Redux: A predictable state container for managing application state.
- React Redux: Official React bindings for Redux.
- React Router DOM: A library for routing in React applications.
- React Icons: A library of popular icons for React.
- React Player: A customizable React component for playing media.
- DayJS: A minimalist JavaScript library for date formatting.
- Redux Toolkit: A library that simplifies Redux usage.
- React Infinite Scroll Component: A React component for infinite scrolling.
- Axios React: A library for making HTTP requests in React.
- React Lazy Load Image Component: A library for lazy loading images in React.
- React Circular Progress Bar: A circular progress bar component for React.
This app uses the TMDB API (https://www.themoviedb.org/documentation/api) to fetch movie data.