https://github.com/mrakashsaha/skyflex
SkyFlex is a dynamic movie management web application that allows users to browse movies, view details, and manage favorites with authentication. The platform ensures a seamless user experience with private routes, interactive UI elements, and a responsive design.
https://github.com/mrakashsaha/skyflex
daisyui react react-router swiper-slider tailwind-css
Last synced: about 2 months ago
JSON representation
SkyFlex is a dynamic movie management web application that allows users to browse movies, view details, and manage favorites with authentication. The platform ensures a seamless user experience with private routes, interactive UI elements, and a responsive design.
- Host: GitHub
- URL: https://github.com/mrakashsaha/skyflex
- Owner: mrakashsaha
- Created: 2025-02-05T11:19:13.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-05T18:33:06.000Z (over 1 year ago)
- Last Synced: 2025-10-24T17:24:25.728Z (8 months ago)
- Topics: daisyui, react, react-router, swiper-slider, tailwind-css
- Language: JavaScript
- Homepage: https://movies-auth-1.web.app/
- Size: 8.23 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# SkyFlex - A Movie Management Web App
## Project Overview
SkyFlex is a dynamic movie management web application that allows users to browse movies, view details, and manage favorites with authentication. The platform ensures a seamless user experience with private routes, interactive UI elements, and a responsive design.
## Live Demo
🔗 [Movies Auth Portal](https://movies-auth-1.web.app)
## Technologies Used
- **Frontend**: React, React Router, Tailwind CSS, DaisyUI, Swiper
- **Backend & Authentication**: Firebase
- **State Management & Utilities**: React Hook Form, LocalForage, Match Sorter
- **UI Enhancements**: React Circular Progress Bar, SweetAlert2, React Simple Star Rating
## Core Features
- 🔐 **Authentication System**: Secure login/registration using Email/Password and Google authentication.
- 🎬 **Dynamic Movie Management**: Users can browse, add, and delete movies.
- ⭐ **Favorites Management**: Save and manage favorite movies easily.
- 📱 **Responsive Design**: Works across all devices (mobile, tablet, desktop).
- 🚀 **Private Routes**: Restricted access to movie management features.
- 🎨 **Dark/Light Theme Toggle**: Personalized browsing experience.
- 🎭 **Interactive UI**: Toast notifications and smooth animations.
## Dependencies
### Main Dependencies
```json
{
"firebase": "^11.0.2",
"localforage": "^1.10.0",
"match-sorter": "^8.0.0",
"react": "^18.3.1",
"react-circular-progressbar": "^2.1.0",
"react-dom": "^18.3.1",
"react-hook-form": "^7.53.2",
"react-icons": "^5.4.0",
"react-router-dom": "^7.0.2",
"react-simple-star-rating": "^5.1.7",
"sort-by": "^1.2.0",
"sweetalert2": "^11.14.5",
"swiper": "^11.1.15"
}
```
### Dev Dependencies
```json
{
"@eslint/js": "^9.15.0",
"@types/react": "^18.3.12",
"@types/react-dom": "^18.3.1",
"@vitejs/plugin-react": "^4.3.4",
"autoprefixer": "^10.4.20",
"daisyui": "^4.12.14",
"eslint": "^9.15.0",
"eslint-plugin-react": "^7.37.2",
"eslint-plugin-react-hooks": "^5.0.0",
"eslint-plugin-react-refresh": "^0.4.14",
"globals": "^15.12.0",
"postcss": "^8.4.49",
"tailwindcss": "^3.4.15",
"vite": "^6.0.1"
}
```
## Running the Project Locally
Follow these steps to set up the project on your local machine:
1. **Clone the repository**:
```sh
git clone https://github.com/mrakashsaha/skyFlex.git
cd movies-auth-portal
```
2. **Install dependencies**:
```sh
npm install
```
3. **Start the development server**:
```sh
npm run dev
```
4. **Open the project in the browser**:
- Visit `http://localhost:5173` (or the port shown in the terminal).
## Resources & Links
- 🔥 **Live Project**: [Movies Auth Portal](https://movies-auth-1.web.app)
- 📘 **React Docs**: [react.dev](https://react.dev/)
- 🚀 **Vite Docs**: [vitejs.dev](https://vitejs.dev/)
- 🔥 **Firebase Docs**: [firebase.google.com](https://firebase.google.com/)
---
🎬 **Happy Coding!** 🚀