The Project “BIOSCOPE” is a web app(pwa) that lets us to know the information related to the movies. This app will be helpful to find the release date of movies, people can search for movies even by voice. Find out recommendations,also see cast and reviews and trailers of all movies and web series and review any movie and tv shows easily. Also app helps you keep track of your "Favourite list" which the "firestore-db" keeps safe and sound according to users-login.
In this project, we have used the Recycler view to show the list of the movies. As we click on a movie, it directs the user to another activity that contains the poster along with release date and ratings. On the front page, we have a search interface to search for any movie of our liking. It also contains a spinner that contains options like top rated movies, upcoming movies, now playing and popular movies for the users to choose from.
Plus it will recommend you about the movie/series based on your search and you can even sort the movie/series based on "genre"
Moreover it is a PWA which is an awesome technology through which you can install the app in any device such as android/ios/PC so it is platform independent and also you can obviously access the web app through the given link😀✌
It is very benefecial for movie addictive people who can't keep track of the movies they saw/willing to see and can ultimately buy/rent out the movie/series from platforms.
BIOSCOPE has user-aunthentication and user-uid based db's records and and keeping the security in mind we added "email-push" notification when a user wants to change password and it has "email & password validation" for protected surfing🐱👤.
Demo Videos
A short demo of our Web App🐱👤
"forget password🧠" feature Demo
Api used : The Movie Database(tmdb)🎬
GET /api/trending/all/day?api_key=?{...}&page={...}
https://api.themoviedb.org/3/trending/all/day?api_key=${process.env.REACT_APP_API_KEY}&page=${page}
Parameter | Type | Description |
---|---|---|
api_key |
string |
Required. Your API key |
pages |
string |
Required. Number of Pages |
GET /api/discover/tv?api_key=?{...}&page={...}&with_genres=${...}
https://api.themoviedb.org/3/discover/tv?api_key=${process.env.REACT_APP_API_KEY}&language=en-US&sort_by=popularity.desc&include_adult=false&include_video=false&page=${page}&with_genres=${genreforURL}
Parameter | Type | Description |
---|---|---|
api_key |
string |
Required. Your API key |
page |
string |
Required. Number of Pages |
genres |
string |
Required. Genre of Tv-Series |
GET /api/discover/movie?api_key=?{...}&page={...}&with_genres=${...}
https://api.themoviedb.org/3/discover/movie?api_key=${process.env.REACT_APP_API_KEY}&language=en-US&sort_by=popularity.desc&include_adult=false&include_video=false&page=${page}&with_genres=${genreforURL}
Parameter | Type | Description |
---|---|---|
api_key |
string |
Required. Your API key |
page |
string |
Required. Number of Pages |
genres |
string |
Required. Genre of Movies |
GET /api/search/type{...media_type...}api_key=?{...}&querarcy=${...searchText...}&page={...}
https://api.themoviedb.org/3/search/${type ? "tv" : "movie"}?api_key=${process.env.REACT_APP_API_KEY}&language=en-US&querarcy=${searchText}&page=${page}&include_adult=false
Parameter | Type | Description |
---|---|---|
api_key |
string |
Required. Your API key |
page |
string |
Required. Number of Pages |
query |
string |
Required. Your Search Text |
GET /api/type{...media_type...}/{...id...}/recommendations/api_key=?{...}&page=1
https://api.themoviedb.org/3/${media_type}/${id}/recommendations?api_key=${process.env.REACT_APP_API_KEY}&language=en-US&page=1
Parameter | Type | Description |
---|---|---|
api_key |
string |
Required. Your API key |
id |
string |
Required. Current movie/tv-series id |
media_type |
string |
Required. Movie/Tv-Series |
GET /api/watch?v={...video name...}
https://www.youtube.com/watch?v=${video}
Parameter | Type | Description |
---|---|---|
movie/tv-series name |
string |
Required. Video name |
To run this project, you will need to add the following environment variables to your .env file
API_KEY
: get your own api_key from The Movie Database(tmdb)🎬
ANOTHER_API_KEY
: connect your Firebase account & configure it in "firebase.js"
npm i @material-ui/core
npm i @material-ui/icons
npm i @material-ui/lab
npm i axios
npm i bootstrap
npm i react-bootstrap
npm i firebase
npm i react-alice-carousel
npm i react-router-dom
npm i react-speech-recognition
Clone the BIOSCOPE project
git clone https://github.com/saikatXshrey/Bioscope-OTT-platform
Go to the project directory
cd my-project
Install dependencies
npm install
Start the server
npm run start
or
yarn start
To deploy this project run
npm run deploy