CommunityOfCoders / CommunityOfCoders/WebGenesis
Movie Night Planner
- Dominant language
- HTML
- Stars
- 10
- Forks
- 77
- PR merge metrics
- No merged PRs in 30d
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.
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.