https://github.com/sepidsoroush/nextwatch

A movie database created by Next.js: you can search movies by title and see details on each movie page, and bookmark your favorites in watchlist.
https://github.com/sepidsoroush/nextwatch

api async-await axios custom-hook es6 javascript movie movie-database movie-database-api nextjs omdbapi pagination react react-hooks reactjs serach-movie usecontext watchlist

Last synced: 1 day ago
JSON representation

A movie database created by Next.js: you can search movies by title and see details on each movie page, and bookmark your favorites in watchlist.

• Host: GitHub
• URL: https://github.com/sepidsoroush/nextwatch
• Owner: sepidsoroush
• Created: 2023-03-13T22:50:26.000Z (almost 2 years ago)
• Default Branch: main
• Last Pushed: 2024-07-06T06:13:35.000Z (6 months ago)
• Last Synced: 2024-07-06T07:28:16.187Z (6 months ago)
• Topics: api, async-await, axios, custom-hook, es6, javascript, movie, movie-database, movie-database-api, nextjs, omdbapi, pagination, react, react-hooks, reactjs, serach-movie, usecontext, watchlist
• Language: JavaScript
• Homepage: https://moviedatabase-swart.vercel.app/
• Size: 393 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
## 🎥 NextWatch Movie Database

- This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).

- This project is using [OMDb API](https://www.omdbapi.com/)

- [Live Demo](https://moviedatabase-swart.vercel.app/)

## Features

- This application was built using Next.js, React Hooks (useState, useContext, useEffects), API, Axios, React icons, etc.

- Custom hook (useFetch) for fetching data from API

- Global context for watchlist

- Categories component to filter search results based on type (movies, TV series, games)

- Dynamic Routes with `next-router`

- Fonts with `@next/font`

- Icons with [Font Awesome 5](https://fontawesome.com/)

- Responsive design

## Components

> **Warning**

> This is a work in progress. I'm building this in public.

- [ ] Authentication

- [ ] Dark/light mode toggle

- [x] Search bar

- [x] Loading

- [x] Bookmark

- [x] Watchlist

- [x] Filter categories

- [x] Pagination

- [x] Notifications

- [x] Top Picks

- [x] Movie Detail page

- [x] Home page

## 📸 Screenshots of the project:

Home Page 🏠














Search 🔍












Watchlist 🎥