Submitted by: Destiny Okonkwo
Estimated time spent: 45 hours spent in total
Deployed Application : [(https://flixster-balp.onrender.com/]
- ✅ Display Movies
- ✅ Users can view a list of current movies from The Movie Database API.
- ✅ For each movie displayed, users can see its title, poster image, and votes.
- ✅ Users can load more current movies by clicking a button at the bottom of the list (page should not be reloaded).
- ✅ Search Functionality
- ✅ Users can search for movies and view the results in a grid.
- ✅ Users can clear results and view previous current movies displayed.
- ✅ Accessibility Features
- ✅ Website implements accessibility features (semantic HTML, color contrast, font sizing, alt text for images).
- ✅ Responsive Design
- ✅ Website implements responsive web design.
- ✅ Movie Details
- ✅ Users can view more details about a movie in a popup, such as runtime in minutes, backdrop poster, release date, genres, and/or an overview.
- ✅ Sorting Options
- ✅ Users can click on a filter by drop down to sort product by type (alphabetic, release date, rating).
- ✅ Layout
- ✅ Website displays header, banner, search, movie grid, about, contact, and footer section.
- ✅ Deployment
- ✅ Website is deployed via Render.
- ✅ Embedded Movie Trailers
- ✅ Within the popup displaying a movie's details, users can play the movie trailer.
- ✅ Watched Checkbox
- ✅ For each movie displayed, users can mark the movie as watched.
- ✅ Favorite Button
- ✅ For each movie displayed, users can favorite the movie.
- ✅ Sidebar
- ✅ Users can open a sidebar
- ✅ The sidebar displays the user's favorited and watched movies
Walkthrough Video: YouTube ([https://youtu.be/um68S-KCnXM]), Loom ([https://www.loom.com/share/47330bfbc2d541389bff834fa37dab36?sid=ef2ce7af-d9b4-450f-b80c-b1d533e7da75])
- Did the topics discussed in your labs prepare you to complete the assignment? Be specific, which features in your weekly assignment did you feel unprepared to complete?
Yes, the topics discussed during lecture did prepare me to complete the assignment. Namely, the overview of how data is handled and passed as props in React was incredibly useful in creating my application. I did feel a bit unprepared when it came to creating more complex components that involve passing data with React, but, eventually, got the hang of it.
- If you had more time, what would you have done differently? Would you have added additional features? Changed the way your project responded to a particular event, etc.
If I had more time, I would attempt to make the fetching from the TMDB API faster and create a profile page to be able to see watched movies, favorited movies, etc. Additionally, I would have created more filters and possibly made a way for a user to add ratings.
- Reflect on your project demo, what went well? Were there things that maybe didn't go as planned? Did you notice something that your peer did that you would like to try next time?
Getting through all of the features and integrating the required & stretch features in visually appealing ways was very fun and went well. Data passing through props was something that I struggled with, but I eventually mastered it.
Shout out to Dara, Sammy, Faustina, Tosin, Gianna, and Izu!!