https://github.com/boddepallyvenkatesh06/movix-app
About Welcome to The Movie Explorer, your gateway to a world of real-time movies and TV shows with comprehensive details for each title.
https://github.com/boddepallyvenkatesh06/movix-app
api avascript rapidapi reactjs responsive-ui tailwindcss vite-react
Last synced: 28 days ago
JSON representation
About Welcome to The Movie Explorer, your gateway to a world of real-time movies and TV shows with comprehensive details for each title.
- Host: GitHub
- URL: https://github.com/boddepallyvenkatesh06/movix-app
- Owner: BoddepallyVenkatesh06
- Created: 2025-01-12T18:56:46.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-12T19:16:11.000Z (over 1 year ago)
- Last Synced: 2025-03-17T18:15:30.530Z (about 1 year ago)
- Topics: api, avascript, rapidapi, reactjs, responsive-ui, tailwindcss, vite-react
- Language: JavaScript
- Homepage: https://movix-web.netlify.app/
- Size: 26.5 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
#
Movix App
Discover real-time movies and TV shows with detailed information using The Movix App.
This app is built with React.js and styled using Tailwind CSS, providing an engaging and responsive user experience.
This app offers a responsive and visually appealing user interface that adapts seamlessly to various screen sizes.
Live link ππ‘ - [ https://movix-web.netlify.app/ ]
## Tech Stack π οΈ
- β‘ Vite + React.js
- π¨ Tailwind CSS
- π Redux
- π₯ The Movie Database (TMDB) API
## Features π
- π **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.
## Pages π
- **Home**π : Refreshing backgrounds, interactive carousels, and a captivating UI.
- **Details**π₯: In-depth information, ratings, and trailers for each movie and TV show.
- **Search Results**π: Efficiently browse through search results with react-select.
- **Page Not Found**π«: A friendly page for unexpected routes.
## React Hooks π£
Utilized several React hooks for efficient state management and dynamic behavior:
- `useState`
- `useEffect`
- `useDispatch`
- `useParams`
- `useSelector`
- `useLocation`
- `useNavigate`
- `useRef`
- `Custom-Hook`
π **React Library**:
- π
**dayjs**: Utilizes the Dayjs library to beautifully format dates.
- π **Lazy Loading**: Enhance performance by lazily loading images using the react-lazy-load-image library.
- βΎοΈ **Infinite Scroll**: Incorporates the InfiniteScroll library for seamless scrolling through content.
- π **Select**: Enhance your user interface with interactive and customizable select option using the React Select library.
## π₯οΈ Screen Preview:
# π Random Home Page Background



# Search Button

# Loading Skeleton



# Details of Movie / TV


# Cast of the Movie / TV



# Official Videos & Recommendations


# Explore Page for Movies && TV Shows


# Filters for Generes && Sorting

# Footer
