https://github.com/hs094/moodflix
Moodflix is a dynamic movie discovery platform built with React.js, Appwrite, and Tailwind CSS. It offers a sleek UI and real-time trending movie recommendations.
https://github.com/hs094/moodflix
appwrite reactjs tailwind-css vite
Last synced: 3 months ago
JSON representation
Moodflix is a dynamic movie discovery platform built with React.js, Appwrite, and Tailwind CSS. It offers a sleek UI and real-time trending movie recommendations.
- Host: GitHub
- URL: https://github.com/hs094/moodflix
- Owner: hs094
- Created: 2025-02-06T19:52:44.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-06T20:42:07.000Z (over 1 year ago)
- Last Synced: 2025-08-25T17:45:03.630Z (10 months ago)
- Topics: appwrite, reactjs, tailwind-css, vite
- Language: JavaScript
- Homepage: https://hs094-moodflix.netlify.app/
- Size: 6.2 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Moodflix
Moodflix is a cutting-edge movie application built with React.js, Appwrite, and Tailwind CSS. It offers an intuitive and immersive platform for browsing, discovering, and streaming movies. Key features include:
- **Dynamic Interface:** Experience seamless interactivity powered by React.js.
- **Trending Movies Algorithm:** Discover popular movies in real time using Appwrite.
- **Responsive Design:** Enjoy a beautiful, fully responsive layout crafted with Tailwind CSS.
- **Comprehensive Features:** Benefit from powerful movie search, detailed listings, and an engaging user experience.
## 📋 Table of Contents
1. 🤖 [Introduction](#introduction)
2. ⚙️ [Tech Stack](#tech-stack)
3. 🔋 [Features](#features)
4. 🖥️ [Installation](#installation)
Built with React.js for the user interface, Appwrite for the Trending Movies Algorithm, and styled with TailwindCSS, Moodflix is a website project designed to help beginners get started with learning React.js. The platform offers a sleek and modern experience for browsing and discovering movies.
- React.js
- Appwrite
- Tailwind CSS
## 🔋 Features
✅ **Browse All Movies**: Explore a wide range of movies available on the platform.
✅ **Search Movies**: Easily search for specific movies using a search function.
✅ **Trending Movies Algorithm**: Displays trending movies based on a dynamic algorithm.
✅ **Modern UI/UX**: A sleek and user-friendly interface designed for a great experience.
✅ **Responsiveness**: Fully responsive design that works seamlessly across devices.
Follow these steps to set up the project locally on your machine.
**Prerequisites**
Make sure you have the following installed on your machine:
- [Git](https://git-scm.com/)
- [Node.js](https://nodejs.org/en)
- [npm](https://www.npmjs.com/) (Node Package Manager)
**Cloning the Repository**
```bash
git clone https://github.com/hs094/MoodFlix.git
cd MoodFlix
```
**Installation**
Install the project dependencies using npm:
```bash
npm install
```
**Set Up Environment Variables**
Create a new file named `.env` in the root of your project and add the following content:
```env
VITE_IMDB_API_KEY=
VITE_APPWRITE_PROJECT_ID=
VITE_APPWRITE_DATABASE_ID=
VITE_APPWRITE_COLLECTION_ID=
```
Replace the placeholder values with your actual **[TheMovieDatabase API](https://developer.themoviedb.org/reference/intro/getting-started)** and **[Appwrite](https://apwr.dev/JSM050)** credentials.
**Running the Project**
```bash
npm run dev
```
Open [http://localhost:5173](http://localhost:5173) in your browser to view the project.