🎬 CineVault : Discover binge-worthy movies and TV shows!🍿✨

Welcome to CineVault - your ultimate destination for discovering and binge-watching your favorite movies and TV shows-based on genres, ratings and more, all in one place! 🍿✨

📜 Table of Contents

1. Introduction
2. Features
   • Shepherd.js Tour
   • Major Features
3. Technologies
4. Installation
5. Usage
6. Screenshots
7. Video
8. Contributing
9. License

🌟 Introduction

CineVault is a user-friendly platform that helps you explore trending movies and TV shows, check out ratings, watch trailers, and get personalized recommendations. Our seamless interface and interactive features ensure an enjoyable experience for all entertainment enthusiasts. 🎥🍿

🚀 Features

🌸 Shepherd.js Tour

Shepherd.js is used in CineVault to provide an interactive, step-by-step guide for new users. This tour highlights key features and guides users through the application, ensuring they make the most out of CineVault. Here are the main steps included in the tour:

1. Welcome Step: Introduces the user to CineVault and starts the tour.
2. Search Bar: Highlights the search functionality for finding movies and TV shows.
3. Trending Content: Shows how to check out the weekly and daily trending content.
4. Movie Details: Guides the user to click on a movie card to view its details.
5. Ratings and Cast Information: Points out where to find ratings and cast information.
6. Watch Trailers: Explains how to watch trailers directly from the app.
7. Related Videos and Similar Movies: Highlights the sections for related videos and similar movie recommendations.
8. Navigation to Movies and TV Shows Sections: Guides the user to navigate between the Movies and TV Shows sections.

🎥 Video

quine012mp4.mp4

🌟 Major Features

• Search Functionality 🔍: Search for your favorite movies or TV shows by title, genre, or actor.
• Trending Content 📈: Stay updated with the hottest content, both weekly and daily.
• Lazy Load: For optimization purposes, Lazy Load effect is used on movie images
• Detailed Movie Information 🎬: Get comprehensive details about movies, including ratings, cast information, and trailers.
• Personalized Recommendations 🤩: Find similar movies and shows based on your preferences.
• Infinite Scroll 📜: Seamlessly scroll through an extensive list of movies and TV shows without any interruption.
• Genre and Popularity Filters 🎭: Easily filter movies and TV shows by genre and popularity to find exactly what you're looking for.

📺 Screenshots!

Few sample images are attached below 📖:

• Hover effect over the tour box :)

🌟 Technologies Used

• React.js: A JavaScript library for building user interfaces, providing a component-based architecture and efficient rendering with a virtual DOM.
• Redux: A state management library to manage and centralize the application state.
• TMDb API: The Movie Database API, used for fetching detailed information about movies and TV shows.
• Shepherd.js: A JavaScript library for creating guided tours to enhance user onboarding and feature discovery.
• Axios: A promise-based HTTP client for making API requests to fetch movie and TV show data.
• SCSS: SCSS extends CSS with features like variables, nested rules, and mixins, enhancing the styling capabilities.
• React Router: For handling navigation and routing within the single-page application.

⚙️ Installation

Follow these steps to set up CineVault on your local machine:

1. Clone the repository:

   git clone https://github.com/username/cinevault.git
   cd cinevault

2. Install dependencies:

   npm install

3. Start the development server:

   npm start

4. Open your browser: Navigate to http://localhost:3000 to start exploring CineVault.

📖 Usage

To start using CineVault, follow these steps:

1. Explore the Tour: If you're a new user, follow the Shepherd.js tour to get acquainted with the app's features.
2. Search and Discover: Use the search bar to find specific movies or TV shows.
3. Check Trending Content: Visit the trending section to see what's popular this week and today.
4. View Details: Click on a movie or TV show card to view detailed information, including ratings and trailers.
5. Navigate Sections: Use the navigation menu to switch between Movies and TV Shows sections.
6. Apply Filters: Use the filters to narrow down your search results by genre and popularity.

🤝 Contributing

We welcome contributions to CineVault! If you'd like to contribute, please follow these steps:

1. Fork the repository: Click the 'Fork' button on the top right of the repository page.
2. Clone your fork:

   git clone https://github.com/your-username/cinevault.git

3. Create a new branch:

   git checkout -b feature-branch

4. Make your changes: Develop your feature or fix.
5. Commit your changes:

   git commit -m "Add your message here"

6. Push to your fork:

   git push origin feature-branch

7. Create a Pull Request: Navigate to the original repository and click on 'New Pull Request'.

📜 License

CineVault is licensed under the MIT License. See the LICENSE file for more details.