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.
The live demo link deployed on Netlify.
- React.
- Vite.
- TypeScript.
- Redux Toolkit.
- React Router.
- Tailwind.
- Linters.
- Initialize the app using
vite
withTypeScript
andTailwind
. - Manage state using
Redux Toolkit
. - Use
React Router
as the main router. - Add
Home page
,Movies page
,TV page
andBookmark 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 usingRedux Toolkit
. - Add
pagination
to Movie and TV pages. - Add
search functionality
on pages withpagination
. - Add
lazy loading
to images to increase UX and performance. - Testing using
unit
,integration
test usingReact Testing Library
andend-to-end test
using cypress for components. - Finalize all design issues.
- Deploy on
netlify
.
- Install node.js.
- 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"
- Run this command
npm install
to install dependencies. - Run this command
npm run dev
to start the dev server.
👤 Islam Mohammed
- GitHub: @Solvic2
- LinkedIn: @Islam-Mohamed
Contributions, issues, and feature requests are welcome!
Feel free to check the issues page.
Give a ⭐️ if you like this project!
This project is MIT licensed.