https://github.com/milan-960/moonlight-films
This app is about movies using the movie database API. it will allow users to create an account and they also will be able to put comments in the review section on the movie app. As well it will allow users to stream movies online and can download the app is a PWA.
https://github.com/milan-960/moonlight-films
firebase firebase-auth formkit react react-icons react-toastify redux swiper tailwindcss
Last synced: 9 months ago
JSON representation
This app is about movies using the movie database API. it will allow users to create an account and they also will be able to put comments in the review section on the movie app. As well it will allow users to stream movies online and can download the app is a PWA.
- Host: GitHub
- URL: https://github.com/milan-960/moonlight-films
- Owner: Milan-960
- Created: 2023-02-20T18:58:41.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2023-05-06T12:09:04.000Z (about 3 years ago)
- Last Synced: 2025-08-31T09:53:19.612Z (9 months ago)
- Topics: firebase, firebase-auth, formkit, react, react-icons, react-toastify, redux, swiper, tailwindcss
- Language: TypeScript
- Homepage: https://moonlight-film.vercel.app
- Size: 24.8 MB
- Stars: 3
- Watchers: 2
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Live demo 🔥 [LIVE](https://moonlight-film.vercel.app/)
# How to start the Project!
### Clone the repo in your machine!
```
git clone https://github.com/Milan-960/Moonlight-films.git
```
### install the dependency
```
npm install
```
### Run on the dev server
```
npm start
```
## To be able to watch the movies you would need to have your API in .env
```
REACT_APP_API_KEY=MOVIE API
REACT_APP_FB_API_KEY=FIREBASE API KEY
REACT_APP_FB_AUTH_DOMAIN=FIREBASE AUTH_DOMAIN KEY
REACT_APP_FB_PROJECT_Id=FIREBASE PROJECT_Id KEY
REACT_APP_FB_STORAGE_BUCKET=FIREBASE STORAGE_BUCKE KEY
REACT_APP_FB_MESSAGING_SENDER_ID=FIREBASE MESSAGING_SENDER_I KEY
REACT_APP_FB_APP_ID=FIREBASE APP_ID KEY
REACT_APP_FB_MEASUREMENT_ID=FIREBASE MEASUREMENT_ID KEY
```
## what this app will have
This app is about movie with using the movie database API. it will allow user to create an account and they also will be able to put commnets on in review section on the movie app. As well it it will allow user to stream movie online and can download the app.
# Moonlight Films
Hot TV Show / Movie Watching Website
# Movie sources API
The Movie Database [API](https://www.themoviedb.org/documentation/api)
### Main technology used
- ReactJS, Typescript, TailwindCSS
- Redux-Toolkit
- React-Query, Axios
- Firebase
- Swiper
- React-AutoAnimate, React-Select, React-Toastify, React-Circular-Progressbar, React-Infinite-Scroll-Component, React-Lazy-Load-Image-Component, React-Icons, React-Router-Dom
- Formik, Yup
## Features
- designed homepage detail watching pages.
- Sort filter (query-params based).
- Search by name, with suggestion keywords, filter result by type.
- Skeleton loading, infinite scrolling, query-based pagination and smooth animation.
- Authentication by email password or Google Facebook. Fully validated sign-up form.
- Bookmark favourite films, store recently watched films. Allowing to edit films list: Select All -> Clear.
- Profile page: allowing to change profile photo, name, email, password, verify, delete account after reauthentication.
- Comment: Allowing to give reactions, see who reacts to a comment (sorted and filter out the 3 most popular reactions), reply to a comment, edit, delete, hide, sort by latest popular and load more comment.
## Screenshots, Preview
```
```