Abhishek5165 / Private

Movie & TV Shows Reviews

Home Page:https://private-nine-phi.vercel.app/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

FLAME Movie Application -

Fully responsive web application to get to know about awesome movies and web shows. Everything is renderd dynamically from TMDB's API using Axios, Redux, Custom Hooks and many more usefull react libraries.

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

Alt Text

Details of Movie / TV

Alt Text

Recomendation Page for Movies && TV Shows

Alt Text

Footer

Alt Text

πŸ› οΈ Installation Steps:

1. Clone the repository

git clone https://github.com/Abhishek5165/Private.git

2. Install the required dependencies

npm install

3. Start the development server

npm run dev

4. Access the application at

http://localhost:5173/

Contact 🌟

If you have any query or feedback, feel free to reach out πŸ’–:

About

Movie & TV Shows Reviews

https://private-nine-phi.vercel.app/


Languages

Language:JavaScript 55.9%Language:SCSS 42.9%Language:CSS 0.7%Language:HTML 0.4%