Next 15 MyTube Clone

A feature-rich video platform with quality controls, real-time processing, AI tools for transcription, thumbnails, and titles. Includes Creator Studio, custom playlists, responsive design, and engagement features. Built with Next.js 15, React 19, tRPC, and PostgreSQL for a secure, scalable experience.

View Demo · Documentation · Report Bug · Request Feature

📔 Table of Contents

• About the Project
  • Screenshots
  • Tech Stack
  • Environment Variables
• Getting Started
  • Prerequisites
  • Installation
  • Run Locally
  • Deployment
• Contact

🌟 About the Project

📷 Screenshots

LIVE DEMO 💥

👾 Tech Stack

Client

• Typescript
• Next.js
• React.js
• Drizzle ORM

Database

• Neon

🧰 Getting Started

‼️ Prerequisites

• Install Node JS in your computer HERE
• Sign up for a clerk account HERE
• Sign up for a NeonHERE

🔑 Environment Variables

To run this project, you will need to add the following environment variables to your .env file

CLERK_SECRET_KEY

CLERK_SIGN_SECRET

DATABASE_URL

UPSTASH_REDIS_REST_URL

UPSTASH_REDIS_REST_TOKEN

QSTASH_TOKEN

UPSTASH_WORKFLOW_URL

MUX_TOKEN_ID

MUX_TOKEN_SECRET

MUX_WEBHOOK_SECRET

UPLOADTHING_TOKEN

OPENAI_API_KEY

NEXT_PUBLIC_APP_URL

QSTASH_NEXT_SIGNING_KEY

NEXT_PUBLIC_CLERK_SIGN_IN_URL

NEXT_PUBLIC_CLERK_SIGN_UP_URL

QSTASH_CURRENT_SIGNING_KEY

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY

NEXT_PUBLIC_CLERK_SIGN_IN_FALLBACK_REDIRECT_URL

NEXT_PUBLIC_CLERK_SIGN_UP_FALLBACK_REDIRECT_URL

This project was bootstrapped with Create React App.

⚙️ Installation

Install my-project with npm

bunx create-next-app@latest my-project --typescript --eslint

cd my-project

bun install

Install dependencies

🔶 Dependency Info

🏃 Run Locally

Clone the project

  https://github.com/SashenJayathilaka/Next-15-YouTube-Clone

change directory

  cd Next-15-YouTube-Clone

Install dependencies

  bun install

Start the server

  bun run dev:all

---

This is a Next.js project bootstrapped with create-next-app.

---

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying pages/index.js. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.js.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

Learn More

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

🚩 Deployment

To deploy this project run

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

🤝 Contact

Sashen - @twitter_handle - sashenjayathilaka95@gmail.com

Project Link: https://github.com/SashenJayathilaka/Next-15-YouTube-Clone

Don't forget to leave a star ⭐️