• Got a TMDB api key to make a request to the service called TMDB; it gives back a lot of information about different films such as genres including Netflix Originals, trending now, top-rated, action, comedy, horror, and etc)
• Pulled those information in and built it in the frontend.
• Set up Firebase hosting.
• Customized the rows by passing in different movie titles.
• used state to keep track of the movies.
• pulled data from TMDB as soon as row is created.
• added functionality of scroll bars on the row.
• included optimization by adding movie.id.
• Built the banner
• each banner includes a title, 2 buttons, movie description, and a background image.
• set up a state to make it responsible for any one random movie from NetflixOriginals section to get selected for the banner.
• used a truncate function to shorten the text where there is too much of it on the screen. After 150 words, it shortens the text.
• Built the nav bar
• put a Netflix logo and a smiley face avatar on top.
• made sure that the header changes its color to black when a user scrolls down 10px down on a y-axis.
• added a scroll listener so that it listens to the scroll. When a user scrolls down, it makes sure to execute on a given condition.
• included a gradual fade-in transition on the black nav bar.
• Added trailer popups
• used two packages (react-youtube and movie-trailer)
• added a functionality so that the video autoplays when a user clicks on the thumbnail only if there is a trailer url. And when a user clicks the thumbnail again, the trailer disappears.
• Deployment to Firebase
• Website: https://netflix-clone-53735.web.app/
