pratya0011 / flixxit

Project Name

Flixxit

Live Link: https://flixxit-2i45.onrender.com Responsive for mobile and tab

Description

Flixxit is a cutting-edge web application that seeks to provide users with an immersive and feature-rich streaming experience, akin to popular OTT (Over-The-Top) platforms like Netflix, Prime Video, and AppleTV+ etc

Installation

To run this project on your local machine, follow these steps:

• Clone the repository: git clone https://github.com/Pratya0011/Flixxit.git

• Change directory: cd server

• Install dependencies: npm install

• Start development mode: npm start

• Create a .env file and add the following environment variables:

• JWT_SECRET_KEY: Used for JWT token generation and validation.

• JWT_REFRESH_SECRET: Used for refreshing JWT tokens.

• RAZORPAY_API_KEY: The API key for Razorpay payment integration.

• RAZORPAY_API_SECRET: The API secret for Razorpay payment integration.

• Then cd .. to comes back to root file and do cd app and then do npm install.

• Start the development server: npm start

Payment

• Test card details: Mastercard 5267 3181 8797 5449 Random CVV Any future date Visa 4111 1111 1111 1111 Random CVV Any future date

• Test UPI ID: success@razorpay

*** Note *** Free instance of web sevice types spins down with inactivity.so it might take some time to connect

Features & Usage

• Login or Register as an user

• Search for movies by title

• Navigate to different section in the nav bar

• Home: Movies: Shows: View contents based on different catagories and genre

• Hover on any content and add them to watchlist to play later

• Click on the title of any content to view synopsis, rating, and other details of a chosen title

• Add likes and comments to any content on title view

• Subscription: Uer can watch any content once they are subscribed, complete you subscripton to watch content

• Profile Page : User can view their profile details like name email address subscription details , also they have option to set their fav genre

• History: Go to history sction to see viewed contents

• Watchlist: Go to watchlist section to view watchlist -Watch video: r play the selected content on the platform with “Skip Intro” feature of 10sec.

• Admin: For admin signup visit https://flixxit-server-9v89.onrender.com/admin and create new account with role "Admin"

• Dashboard: Admin can see details like amount collected, subscribed users etc in Dashboard section

Technologies Used

• MERN Stack (MongoDB, Express.js, React, Node.js): The core technology stack used for building the web application, covering the front-end and back-end development.

• JWT (JSON Web Tokens): Used for secure user authentication and authorization, allowing users to access protected routes and resources.

• Razorpay: Integrated payment gateway solution for handling online payments and transactions securely for subscription.

• Range-parser: A library for parsing HTTP Range headers, which can be useful for handling partial content requests in streaming media.

• React: The JavaScript library for building user interfaces, allowing for the creation of dynamic and interactive components.

• Redux: A state management library for managing and organizing the application's global state.

• CSS: Cascading Style Sheets used for styling the web application, ensuring a visually appealing and consistent design.

• React Router: A library for handling client-side routing in a React application, enabling navigation between different components and pages.

• React Player: A React component for playing video and audio files in the web application.

• Axios: A popular JavaScript library used for making HTTP requests from the client-side to interact with the server and APIs.

• Font Awesome Icons: A comprehensive library of icons that can be easily integrated into the project to enhance the user interface.

• Material-React-Table: A React component library for creating interactive and responsive data tables with Material Design styles.

• Server-Side Rendering (SSR) using Pug templates for generating dynamic HTML on the server side for admin signup

Screenshots

• Desclaimer - All rights of images are belong to the Flixxit. This project is created just for educational purposes only. we do not intend to use it for any commercial purposes.