✨Scene-Movie-Platform✨

![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=for-the-badge) ![Visitors](https://api.visitorbadge.io/api/visitors?path=sourabhsikarwar%2FScene-Movie-Platform%20&countColor=%23263759&style=for-the-badge) ![GitHub forks](https://img.shields.io/github/forks/sourabhsikarwar/Scene-Movie-Platform?style=for-the-badge) ![GitHub Repo stars](https://img.shields.io/github/stars/sourabhsikarwar/Scene-Movie-Platform?style=for-the-badge) ![GitHub contributors](https://img.shields.io/github/contributors/sourabhsikarwar/Scene-Movie-Platform?style=for-the-badge) ![GitHub last commit](https://img.shields.io/github/last-commit/sourabhsikarwar/Scene-Movie-Platform?style=for-the-badge) ![GitHub repo size](https://img.shields.io/github/repo-size/sourabhsikarwar/Scene-Movie-Platform?style=for-the-badge) ![Github](https://img.shields.io/github/license/sourabhsikarwar/Scene-Movie-Platform?style=for-the-badge) ![GitHub issues](https://img.shields.io/github/issues/sourabhsikarwar/Scene-Movie-Platform?style=for-the-badge) ![GitHub closed issues](https://img.shields.io/github/issues-closed-raw/sourabhsikarwar/Scene-Movie-Platform?style=for-the-badge) ![GitHub pull requests](https://img.shields.io/github/issues-pr/sourabhsikarwar/Scene-Movie-Platform?style=for-the-badge) ![GitHub closed pull requests](https://img.shields.io/github/issues-pr-closed/sourabhsikarwar/Scene-Movie-Platform?style=for-the-badge)

Introduction📌

Scene is a OTT platform clone, similar to popular streaming services like Netflix or Hulu. It is built using React.js for the frontend and Firebase for the backend services.

Features

User Authentication: Users can sign up, log in, and manage their accounts. Firebase Authentication is used to handle user authentication and account management.
Media Catalog: The platform provides a catalog of movies, TV shows, and other media content. Users can browse and search for their favorite shows or movies.
Media Details:Each media item has its own dedicated page with details such as title, description, genre, and rating.
User Profiles: Users can create personalized profiles and manage their watchlists, favorites, and viewing history.

Live Site -- Click Here

Technology Used🚀

![React](https://img.shields.io/badge/react-%2320232a.svg?style=for-the-badge&logo=react&logoColor=%2361DAFB) ![Firebase](https://img.shields.io/badge/Firebase-039BE5?style=for-the-badge&logo=Firebase&logoColor=white)

(back to top)

## Getting Started💥 To get started with Scene Movie Platform, follow the instructions below. ### Prerequisites Before installing the application, ensure that you have the following: - Node.js (version 12 or higher) - MovieDB API Key ### Installation 1. Fork this Repository. 2. Clone the forked repository in your local system. ```bash git clone https://github.com//Scene-Movie-Platform.git ``` 3. Navigate to the project directory: ```bash cd Scene-Movie-Platform ``` 4. Install Dependencies ```bash npm i #or yarn install ``` ### Running the Application To run the application, follow the steps below 1. Set up a Firebase project and enable the necessary services ((Firebase Authentication, Firebase Firestore, Firebase Storage). > Firebase setup is already done in this repo you can skip this step. 2. Get an API KEY from [MovieDB Website](http://api.themoviedb.org/). 3. Create a `.env` file in root directory. ```.env REACT_APP_API_KEY=paste your moviedb api key ``` 4. Then start the application with ```bash npm start #using npm #or yarn start #using yarn ``` 5.Open your web browser and visit [localhost:3000](http://localhost:3000) to access the Scene Movie Platform. ### How To Contribute We welcome contributions from the community! To contribute to the Scene Movie Platform project, follow the steps below: - View the [Live Project](https://scene-movie-platform.vercel.app/) here. - Raise an issue if you find a bug or add a feature. - Wait for the issue to be assigned and proceed only after the issue is assigned to you. - Navigate to the project directory. ```bash cd Scene-Movie-Platform ``` - Create a new branch for your feature. ```bash git checkout -b ``` - Perfom your desired changes to the code base. - Track and stage your changes. ```bash # Track the changes git status # Add changes to Index git add . ``` - Commit your changes. ``` git commit -m "your_commit_message" ``` - Push your committed changes to the remote repo. ``` git push origin ``` - Go to your forked repository on GitHub and click on `Compare & pull request`. - Add an appropriate title and description to your pull request explaining your changes and efforts done. - Click on `Create pull request`. - Congrats! 🥳 You've made your first pull request to this project repo. - Wait for your pull request to be reviewed and if required suggestions would be provided to improve it. - Celebrate 🥳 your success after your pull request is merged successfully.

(back to top)

### Increase Lighthouse score (Performance, Accessibity and SEO) - Use modern image formats like WebP, which offer better compression than JPEG or PNG. - Use lazy loading techniques to defer loading images until they come into view. - Minify your JavaScript and CSS files to remove unnecessary characters, white spaces, and comments, reducing file sizes. This will be done automatically when you build the react app. - Utilize code splitting techniques to load only the necessary code for each page, reducing the initial bundle size and improving load times. - Remove all the console.log messages. - Remove all the unused javascript codes. - Only include li tags directly inside ul tags - Add proper associated labels to all form elements

Code Of Conduct📑

This project and everyone participating in it is governed by the [Code of Conduct](https://github.com/sourabhsikarwar/Scene-Movie-Platform/blob/master/CODE_OF_CONDUCT.md). By participating, you are expected to uphold this code.