Skip to content

Conversation

@Boris713
Copy link

Made the following changes:

  1. Add button and input of type search to act as search bar
  2. fetch information using API call from TMDB
  3. edit info and add more when see more button is pressed

code and image of output-
Screenshot 2024-06-11 at 1 46 00 PM
Screenshot 2024-06-11 at 1 46 20 PM

Boris Alexander Hernandez added 3 commits June 10, 2024 19:20
TLDR: Add movie info from API

Create elements with React and make GET request to IMDB API.
Returns movies now showing in theaters.
tldr: add more info from additional api request

Added button at bottom of page that when pressed
loads in 20 more movies.
This is done by updating the page in fetch to api.
it is able to load in as many times as is pressed.
padding: 20px;
width: 75%;
margin: 0 auto;

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

minor: use format to eliminate empty lines.

/>
))
) : (
<p>Loading movies...</p> //error handle if data length == 0

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can probably say "No Movies found instead"

};

const resetPage = () => {
console.log("resetPage");

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

remove console

};
useEffect(() => {
fetchData();
}, [page]); //adds to update for every new page

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can probably remove page from this dependency array, as we are calling API once page is changed.

`https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=${page}`,
options
); //fills link
const Data = await resp.json();

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

name it data or moviesList instead?


const searchMovies = () => {
updatePage(1);
setData([]);

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Might not need this as data is being set in the fetchData function anyway

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants