Use-Popcorn is a React.js web application that allows users to search for movies and view detailed information about each movie using the OMDb API. Users can also add movies to a personalized watchlist, making it easy to keep track of films they want to watch.
A live version of Use-Popcorn can be found here.
- Movie Search: Search for any movie by title and view a list of results.
- Movie Details: Click on a movie to see details such as the title, year, genre, rating, director, cast, and plot summary.
- Add to Watchlist: Save movies to a watchlist to keep track of what you want to watch later.
- Responsive Design: Optimized for both desktop and mobile devices.
- Clone the repository:
git clone https://github.com/vasudevsoni/use-popcorn.git cd use-popcorn
- Install dependencies:
npm install
- Get an API key:
- Sign up at OMDb API to obtain an API key.
- Add this key to an
.env
file in the root of your project:REACT_APP_OMDB_API_KEY=your_api_key_here
- Start the development server:
npm start
- Build for production:
npm run build
- Search for a Movie:
- Use the search bar to look up movies by title.
- View Movie Details:
- Click on a movie from the search results to see detailed information.
- Add to Watchlist:
- Click the "Add to Watchlist" button on a movie's details page to save it to your watchlist.
- View and Manage Watchlist:
- Access your watchlist from the navigation bar, where you can view or remove movies.
This project utilizes the OMDb API for fetching movie data.
- Base URL:
https://www.omdbapi.com/
- Parameters:
apikey
(required): Your API keys
(optional): Movie title to searchi
(optional): IMDb ID to get detailed movie data
Example request:
GET https://www.omdbapi.com/?apikey=your_api_key&s=inception
Contributions are welcome! To contribute:
- Fork the project.
- Create a new branch (
git checkout -b feature/your-feature
). - Make your changes.
- Commit and push your changes (
git commit -m 'Add some feature'
). - Open a pull request.