YTShorts 🚀

Create, upload, and share YouTube-style short videos with a modern, beautiful UI!

---

YTShorts is a modern web application for creating, uploading, and sharing YouTube-style short videos. Built with Next.js, Prisma, Clerk authentication, and a beautiful UI powered by shadcn/ui components.

✨ Features

• 🔑 Secure authentication with Clerk
• 🎬 Upload and manage short videos easily
• 🗂 User dashboard to view and manage your own shorts
• 🖼️ Modern, responsive UI for all devices
• 🌗 Light/Dark theme toggle for your comfort
• 🔍 Search functionality to find shorts quickly
• 🛠️ Built with Next.js App Router, TypeScript, and Prisma ORM

🚀 Getting Started

Follow these steps to get YTShorts running locally:

1️⃣ Clone the repository

git clone https://github.com/your-username/ytshorts.git
cd ytshorts

2️⃣ Install dependencies

npm install

3️⃣ Set up environment variables

Create a .env file in the root directory and add your database and Clerk credentials:

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
DATABASE_URL=

-- {imagekit.io}

NEXT_PUBLIC_PUBLIC_KEY=
PRIVATE_KEY=
NEXT_PUBLIC_URL_ENDPOINT=

4️⃣ Set up the database

Run Prisma migrations to set up your database schema:

npx prisma migrate dev

Generate the Prisma client:

npx prisma generate

5️⃣ Start the development server

npm run dev

Open http://localhost:3000 in your browser to see your app in action!

🗂️ Project Structure

Click to expand project structure

<pre>

├── app/ # Next.js app directory │ ├── api/ # API routes (auth, upload, etc.) │ ├── upload/ # Upload page │ └── page.tsx # Home page ├── components/ # Reusable UI and feature components │ ├── header/ # Navbar and header components │ ├── shorts/ # ShortCard component │ └── ui/ # UI primitives (button, input, etc.) ├── lib/ # Prisma client and utilities ├── prisma/ # Prisma schema and migrations ├── public/ # Static assets ├── .env # Environment variables ├── package.json # Project metadata and scripts └── README.md # Project documentation

🧑‍💻 Usage

• ✍️ Sign up / Sign in: Use Clerk authentication to create an account and access your dashboard.
• ⬆️ Upload Shorts: Go to the upload page and submit your video in seconds.
• 👀 View Shorts: See your uploaded shorts on your dashboard and share with others.
• 🔎 Search: Use the search bar to quickly find shorts by title or description.
• 🌗 Theme Toggle: Switch between light and dark mode for a personalized experience.

🛠️ Tech Stack

• ⚡ Next.js (App Router)
• 🗄️ Prisma ORM
• 🔐 Clerk authentication
• 🎨 shadcn/ui components
• 🧑‍💻 TypeScript
• 🐘 PostgreSQL

🤝 Contributing

We welcome contributions from everyone! To get started:

1. 🍴 Fork the repository
2. 🏗️ Create your feature branch (git checkout -b feature/my-feature)
3. 💡 Commit your changes (git commit -am 'Add new feature')
4. 🚀 Push to the branch (git push origin feature/my-feature)
5. 📝 Open a pull request

Feel free to open issues for bugs, feature requests, or questions!

📄 License

This project is licensed under the MIT License.

---

Questions or support?
Open an issue or contact the maintainer.