Entertainment App

Entertainment App is an app for displaying movies, tv series and trending series that you can search on it, watch its trailer and bookmark it.

🚀 Live Demo

The live demo link deployed on Netlify.

🛠 Built With

Tech Stack

  • React.
  • Vite.
  • TypeScript.
  • Redux Toolkit.
  • React Router.
  • Tailwind.
  • Linters.

Key Features

  • Initialize the app using vite with TypeScript and Tailwind.
  • Manage state using Redux Toolkit.
  • Use React Router as the main router.
  • Add Home page, Movies page , TV page and Bookmark page with responsive design.
  • Add animation for Home page trending section.
  • Add Details Page for specific movie or tv and displaing trailer.
  • Save bookmarks in localStorage.
  • Login and Add Authentication using TMDB API with managing its state using Redux Toolkit.
  • Add paginationto Movie and TV pages.
  • Add search functionality on pages with pagination.
  • Add lazy loading to images to increase UX and performance.
  • Testing using unit, integration test using React Testing Libraryand end-to-end test using cypress for components.
  • Finalize all design issues.
  • Deploy on netlify.

💻 Getting Started

Prerequisites

Setup

  • Create account on TMDB API and get your username and password.
  • Get Access Token Auth.
  • Get Account Id.
  • Clone the project using git-bash or Githup Desktop.
  • Open the project folder with VSCode or any Editor.
  • Open the terminal and navigate to the project folder.
  • Create .env file and add your credintial from TMDB API in this file
 VITE_USERNAME="example-username"
 VITE_PASSWORD="example-password"
 VITE_ACCESS_TOKEN="example-token"
 VITE_ACCOUNT_ID="example-id"

Usage

  • Run this command npm install to install dependencies.
  • Run this command npm run dev to start the dev server.

Author

👤 Islam Mohammed

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

⭐️ Show your support

Give a ⭐️ if you like this project!

📝 License

This project is MIT licensed.