https://github.com/sankalp20tiwari/reelspro
ReelsPro is a dynamic web application that allows users to upload, view, and interact with short video reels shared by other users. The platform is designed to create an engaging experience where creativity thrives, fostering a community-driven environment for content creators and viewers alike.
https://github.com/sankalp20tiwari/reelspro
aceternity-ui imagekit nextjs ui-design
Last synced: about 1 month ago
JSON representation
ReelsPro is a dynamic web application that allows users to upload, view, and interact with short video reels shared by other users. The platform is designed to create an engaging experience where creativity thrives, fostering a community-driven environment for content creators and viewers alike.
- Host: GitHub
- URL: https://github.com/sankalp20tiwari/reelspro
- Owner: Sankalp20Tiwari
- Created: 2025-02-17T12:55:22.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-06-06T10:39:44.000Z (about 1 year ago)
- Last Synced: 2025-06-06T11:32:23.748Z (about 1 year ago)
- Topics: aceternity-ui, imagekit, nextjs, ui-design
- Language: TypeScript
- Homepage: https://reelspro-phi.vercel.app
- Size: 3.03 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ReelsPro
## 📌 Project Overview
🎬 About ReelsPro
ReelsPro is a dynamic web application that allows users to upload, view, and interact with short video reels shared by other users. The platform is designed to create an engaging experience where creativity thrives, fostering a community-driven environment for content creators and viewers alike.
## 🖼️ Preview
## 🚀 Features
- **User-friendly interface** for seamless feedback submission
- **Upload and rendering videos** using Imagekit
- **Authentication system** using NextAuth
- **Mobile-responsive design** ensuring accessibility across devices
- **Optimized performance** with server-side rendering (SSR) and static site generation (SSG)
- **Modern UI** powered by Tailwind CSS and Shadcn, magicui
- **Secure API interactions** for data integrity
## 🔗 Live Demo
Check out the live version of ReelsPro here: [Live Site](https://reelspro-phi.vercel.app/)
## 🛠 Installation & Setup
To set up and run the project locally, follow these steps:
### Prerequisites
Ensure you have the following installed:
- **Node.js** (Latest LTS version recommended)
- **npm** or **yarn** for package management
- A **MongoDB database**
### Steps to Run
1. **Clone the repository:**
```sh
git clone https://github.com/Sankalp20Tiwari/reelsPro.git
```
2. **Navigate to the project directory:**
```sh
cd reelsPro
```
3. **Install dependencies:**
```sh
npm install # or yarn install
```
4. **Configure environment variables:**
Create a `.env` file in the root directory and define the necessary environment variables:
```sh
NEXTAUTH_SECRET=
MONGODB_URI=
NEXT_PUBLIC_PUBLIC_KEY=
IMAGEKIT_PRIVATE_KEY=
NEXT_PUBLIC_URL_ENDPOINT=
```
5. **Run the development server:**
```sh
npm run dev # or yarn dev
```
6. Open `http://localhost:3000` in your browser to view the application.
## 🔧 Configuration
The application uses environment variables to manage API endpoints and database connections. Update the `.env` file accordingly to ensure smooth functionality.
## 📂 Project Structure
```
reelsPro/
├──app/
├──(app)/ # Pages of application
├──(auth)/ # Auth related pages
├──(api)/ # Auth and other APIs
├──components/ # Reusable custom made components
├──layout.tsx # Layout page
├──page.tsx # Actual Landing Page
├──components/ # Reusable UI components from shadcn and magicui
├──data/ # Data used at various places
├──lib # Utilities
├──models # Models
├── public/ # Static assets (images, icons, etc.)
├── next.config.ts # Next.js configuration settings
├── package.json # Project metadata and dependencies
├── .env # Environment variables (excluded from Git)
```
## 🏰 Technologies Used
- **Next.js** - React framework for SSR & SSG
- **TypeScript** - Ensures type safety and scalability
- **Imagekit** - Uploading and management of videos using imagekit
- **MongoDB** - Database solutions for storing feedback
- **Tailwind CSS** - Utility-first CSS framework for rapid styling
- **ESLint & Prettier** - Code linting and formatting for better maintainability
- **JWT Authentication** - Secure user authentication using NextAuth.js
- **React-hook-form** - All forms are managed using React Hook Form
- **Shadcn** - Responsive and clean UI with help of Shadcn
## 🤝 Contributing
We welcome contributions to enhance the project! To contribute:
1. Fork the repository.
2. Create a new branch (`feature/your-feature-name`).
3. Implement your changes and commit.
4. Push to your forked repository and submit a pull request.