The FlickBytes By Praabindh
The FlickBytes - AI Powered Movie App [React.js, Material UI, Alan AI]
Explore The Project >>
View Demo Site
·
Report Bug
·
Request Feature
Table of Contents
About The Project
FlickBytes by Praabindh's Org is an innovative web application that offers a comprehensive platform for movie enthusiasts to explore, interact with, and discover new films. With its powerful creativity and utilization of advanced JavaScript tools, such as React.js, Redux, Material UI, and Alan AI, FlickBytes delivers an engaging user experience.
Features
User Authentication
This feature allows users to create accounts, log in, and manage their personal information.
Light & Dark Mode
FlickBytes offers a choice between light and dark themes, allowing users to customize the appearance of the application according to their preferences.
API Calls With Axios & Redux
Axios is a JavaScript library used for making HTTP requests, and Redux is a state management library. These technologies enable the application to interact with external APIs and manage the data retrieved from those APIs efficiently.
Actors & Movie Details Page
Users can explore detailed information about movies, including information about actors involved in the production.
Watchlist & List Of Favorite Movies
This feature allows users to create a personal watchlist and mark movies as their favorites, making it easier for them to keep track of the movies they want to watch or have enjoyed.
Movie Search Functionality
Users can search for specific movies based on their titles, genres, or other criteria.
Project's Live Shots
Within this compilation, we proudly present a curated selection of captivating snapshots that were skillfully captured during the dynamic and enthralling live phase of the project.
( Back To Top )
FlickByte | The Home
FlickByte | All Genres
FlickByte | Movie Listing
This feature may provide several filtering and sorting options, enabling users to search for movies based on specific criteria, such as movie ratings, genre, or release date.
FlickByte | Movie Information
Well-structured and visually appealing layout that showcases all relevant information about the selected movie. This may include details such as the movie's title, release date, duration, genre, director, and cast members.
FlickByte | Movie Search
Empowers users to quickly and efficiently find specific movies based on their preferences and search criteria. It serves as a dedicated search functionality designed to enhance the movie discovery experience for users.
FlickByte | My Profile
Allows users to manage their personal information, preferences, and activity within the platform. It serves as a dedicated section where users can access and customize their profile settings. This includes users' watchlist & favorite movies within the platform.
FlickByte | Light Mode
The overall design and color palette of the application are adjusted to create a visually lighter and brighter experience. This typically involves using lighter shades for backgrounds, text, buttons, and other interface elements.
FlickByte | A.I. Search
The AI-powered search system analyzes the input and applies sophisticated algorithms to understand the user's intent and retrieve the most relevant and accurate results.
FlickByte | Artist Informations
Users with detailed information on the artists associated with a movie, such as the director, actors, and crew. It enables users to access comprehensive biographical data, career highlights, and other relevant information about the artists involved in a particular movie.
FlickByte | Video Player
The video player provides standard controls such as play, pause, rewind, and fast-forward, allowing users to adjust the playback speed according to their preferences.
FlickByte | Popular Featured
FlickByte | Recommendations
Alan AI Voice Functionality & Many More.
Alan AI is an AI-powered voice assistant. By integrating Alan AI into FlickBytes, users can interact with the application using voice commands, making the user experience more intuitive and hands-free.
In addition to these features, it's mentioned that FlickBytes combines powerful creativity with technologies such as React.js, Redux, Material UI, and more. React.js is a popular JavaScript library for building user interfaces, Redux is a state management library, and Material UI is a UI component library that provides pre-styled components for a consistent and visually appealing design.
( Back To Top )
FlickByte - Complete Project Description
The FlickBytes project focuses on enhancing the movie browsing experience through a variety of features. User authentication ensures that users can create accounts, log in securely, and manage their personal information within the application. By offering both light and dark modes, FlickBytes allows users to customize the visual appearance of the interface to match their preferences.
The application leverages Axios and Redux to seamlessly make API calls, facilitating data retrieval from external sources. This functionality enables FlickBytes to provide comprehensive information about movies, including details about actors involved in their production. Users can delve into actors' filmography and explore specific movie details, enhancing their understanding and appreciation of the film industry.
FlickBytes also offers a watchlist and a list of favorite movies, empowering users to curate personalized collections of films. This feature facilitates organization and tracking of movies users intend to watch or have already enjoyed. To further streamline the movie discovery process, a robust search functionality allows users to search for movies based on titles, genres, or other criteria, making it easier to find specific films or explore movies within their preferred genres.
One of the standout features of FlickBytes is its integration of Alan AI, an in-app voice assistant. By incorporating Alan AI, the application enables users to interact with it through voice commands, providing a hands-free and intuitive experience. Users can perform various tasks, such as searching for movies, accessing movie details, and managing their watchlist, simply by speaking to Alan AI.
Overall, FlickBytes by Praabindh's Org combines a visually appealing user interface, advanced JavaScript tools, and a range of features to offer a dynamic and immersive movie browsing experience. Whether users are seeking information about movies, managing their film preferences, or discovering new titles, FlickBytes strives to provide an all-encompassing platform for movie enthusiasts.
Getting Started
To get a local copy up and running follow these simple steps
Prerequisites
List of things you need to use and how to install them:
NPM - Node Package Manager
npm install npm@latest -gInstallation
Setup
-
Install Node, NPM, NVM (If Required)
-
Get a free TMDB API Key at https://www.themoviedb.org/.
-
Clone the repository
git clone https://github.com/praabindh/Flick-Bytes.git
-
Install NPM packages:
npm install --legacy-peer-deps
-
Create your
.envfile -
Enter your TMDB API key in your
.env.REACT_APP_TMDB_KEY=<put your key here>
( Back To Top )
Usage
For a full demonstration of all the functionalities of this phenomenal web application check out this demo site.
_For more detailes regarding TMDB API calls, please refer to the Documentation.
See the open issues for a full list of proposed features (and known issues).
( Back To Top )
Contributing
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!
-
Fork the Project
-
Create your Feature Branch
git checkout -b feature/AwesomeFeature
- Commit your Changes
git commit -m 'Added Some AwesomeFeature'
- Push to the Branch
git push origin feature/AwesomeFeature
- Open a Pull Request
( Back To Top )
License
Distributed under the MIT License. See LICENSE.md for more information.
( Back To Top )
Contact
Praabindh Pradeep | Personal - @praabindhp
Praabindh P | Codingmart - @praabindh
Built During The Internship Phase Of Product Engineer In Codingmart Technologies, Coimbatore, Tamil Nadu, India.
Dated & Documented : May 17, 2023
Project Link - https://github.com/praabindh/Flick-Bytes
( Back To Top )
Acknowledgments
Used Resources:
( Back To Top )
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent