-
Notifications
You must be signed in to change notification settings - Fork 81
Description
🎬 Movie Night Planner 🍿
📜 Description
The Movie Night Planner would be web application that will helps users find movie suggestions based on selected filters such as genre & year. It should fetch movie data using the OMDB API and displays results dynamically in a visually appealing format. Users can filter movies by genre, release year, and actor to help decide on a movie for their next movie night.
🛠️ Task Breakdown
1. Project Structure:
- Set up a basic directory structure.
- Install dependencies and make required configuration files.
2. UI & UX:
- Create the user interface with dropdowns for genre, input for the year, actor search, or other parameters as desired.
- Add a button to trigger the movie search and a section to display the results.
- Style the app using CSS for a clean and intuitive user interface.
- Ensure responsiveness and readability across devices.
3. API Integration:
- Fetch movie data from the OMDB API based on user-selected filters.
- Handle dynamic filtering based on genre, year, language, release year, etc.
4. Display Movie Results Dynamically:
- Dynamically create movie cards showing title, poster, short description, etc.
5. Test the Application:
- Test the functionality by selecting different filters and ensuring the results are properly displayed.
✅ Outcomes
The application should allow users to:
- Select a movie genre from a dropdown list.
- Input a year to filter movies by release year.
- Enter an actor's name to search for movies they have appeared in.
- Get the movie language from user input.
- Click the "Find Movies" button to trigger the search.
The movie results should:
- Display a list of movie cards.
- Each movie card should show a poster image, title, and short description.
- The movie results should be updated based on the filters applied (genre, year, actor).
- Display an error message if no movies are found or if there is an issue with the API request.
(Optional: Each movie card should include a "View More" button linking to the movie's IMDb page.)
🧑💻 Tech Stack
- React
- OMBD API
- Axios
🔧 Additional Notes
- Pagination can be implemented to display results across multiple pages.
- The app could be enhanced by adding more filters like movie ratings, popularity, and more.
🎯 Conclusion
The Movie Night Planner project demonstrates how to fetch and display dynamic data, manage user input, and create a user-friendly interface using basic web technologies. With additional features like pagination, better error handling, and more filtering options, this app can be enhanced into a more robust tool for movie discovery.