A small web app that uses the TMDB API to display a list of movie categories and the items belonging to each category.
Navigation is done through tabs and each tab corresponds to a category. The items are displayed as cards inside a grid system. Among the functionalities you cand find real time search, infinite loading and add/remove items to a certain category.
To get a local copy up and running follow the next steps.
You should make sure you have npm >= v8.11.0
and node >= v16.15.1
installed on your machine by typing the commands bellow inside a terminal.
If you don't see any output you can follow the steps decribed here to install the packages.
npm -v
node -v
Once you made sure you have npm
installed you can continue with the following.
Navigate to a folder of your choice
cd my-folder-name
Clone the repo
git clone https://github.com/MarinaGhe/movies-app.git
Go to the project directory
cd movies-app
Install dependencies
npm install
Start the server
npm run start
The project should run on http://localhost:3000/
To run this project, you will need to add the following environment variables to a .env
file which you should create in the root of the project. These are already generated keys for implementation and testing purposes. You can use these or you can replace them by generating your own keys as described in the TMDB API documentation.
REACT_APP_TMDB_API_KEY=61018ae91ee58ed4c9ea8a1ec8dc473c
REACT_APP_BASE_URL=https://api.themoviedb.org/3
REACT_APP_IMAGE_BASE_URL=https://image.tmdb.org/t/p/w500
REACT_APP_TMDB_SESSION_ID=c380cdfc103579bf5dfafe43a2ba99fc22b0628d
REACT_APP_TMDB_ACCOUNT_ID=15175279