강의

멘토링

로드맵

Programming

/

Web Development

Complete Real-world YouTube Clone Development with Next.js 15

In this 24-hour tutorial, you will learn how to build your own YouTube clone. We will cover advanced topics such as Next 15 and React 19 (including tRPC), prefetching in Server Components, utilizing Suspense in Client Components, video processing, background jobs, and AI features.

(3.9) 14 reviews

575 learners

  • antonio
youtubeclone
Next.js
React
PostgreSQL
TailwindCSS
drizzle

Reviews from Early Learners

What you will learn!

  • Experience directly designing and building a video platform like YouTube

  • Acquisition of modern full-stack web development skills utilizing React 19 and the latest full-stack framework based on Next.js 15 (App Router), TypeScript, and tRPC.

  • Type-Safe Database Management Skills Using PostgreSQL + Drizzle ORM

  • Fast and Efficient Server-Side Environment Setup Experience with Bun Runtime

  • Learning User Authentication and Stability Enhancement Methods Based on the Clerk Authentication System

  • Production-Level Feature Implementation via AI Automation and Async Processing

  • Practical performance improvement through infinite scrolling and data flow optimization

Clone Coding , the best learning method to learn practical development!

Clone coding is the fastest way to learn the structure and flow of an actual service. Rather than a simple example, if you implement an actual app that we know well, you will naturally understand how technologies are combined and operated.

Since you learn firsthand why each function is necessary and in what order they should be built for efficiency, you can develop both practical sense and design skills at the same time .

In this course, you will build a YouTube-style video platform and build a production-grade full-stack application using cutting-edge web technologies such as Next.js 15, tRPC, Drizzle, Clerk, and Bun.

Actual service level
You can create a YouTube.

Real-time video processing & AI content creation

  • 🎥 Video player with selectable quality

  • 🎬 Real-time video processing using Mux


  • 🖼 Automatically generate thumbnails/titles/descriptions with AI

  • 📝 Automatic subtitle generation


Personalized Feed & Responsive UI Design

  • 🗂 Custom playlist management feature

  • 🔄 Configure multiple content feeds

  • 🎯 Track your personal viewing history

  • 📱 Responsive design optimized for all devices

Implementing comments, likes, and dashboards

  • 💬 Interactive comment/reply system

  • 👍 Like and Subscribe System

  • 📊 Creator Studio
    (Views, Likes, Traffic Management)

Key technologies used in implementation

  • 📦 Module-based structural design

  • 🗄 PostgreSQL integration based on DrizzleORM

  • 🚀 Latest stack based on Next.js 15 & React 19

  • 🔄 Type-safe API implemented with tRPC

  • 💅 Using TailwindCSS and ShadcnUI

Check out the final result for yourself!

Chosen by 380,000+ subscribers worldwide
Clone coding expert, Antonio!

The latest lecture for 2025 created by the strongest in clone coding education

380,000 subscribers, 14.4 million views! The best practical clone coding education!
Meet Antonio's latest lecture for 2025, which contains his know-how in designing more than 25 clone coding lectures.
You can experience a real-world project from start to finish, following the complete function design and implementation process.

The same combination of technologies used by developers today, such as Next.js 15

It contains the most popular full-stack combinations in today's practice, such as Next.js 15 (App Router), React 19, and Drizzle ORM. We will personally create a YouTube-style full-stack service one by one, from authentication, DB, API, video processing, AI automation, feed, playlist, comment system, search, subscription, and distribution.

Adding generative AI capabilities to your services

Like YouTube, we implement a function that automatically generates thumbnails, titles, and descriptions using generative AI. Rather than simply adding AI functions, we design a background workflow that automatically handles delays and errors, and create an AI system that operates stably at the actual service level .

With 11 cutting-edge technologies
Complete one service.

The most practical and up-to-date full-stack combination

Next.js 15 + React 19 + TypeScript

File-based routing of Next.js 15 (App Router) and React 19 are a powerful combination that reflects the latest web trends. Adding TypeScript to this reduces errors and makes maintenance easier, so you can use it right away for practical use. As it is the most commonly used combination these days, you can learn the basics as well as practical design sense.

Type-safe API communication

tRPC

A type-based framework that allows you to automatically connect front and back ends without an API specification.
It maximizes the strengths of TypeScript and ensures code consistency between the front and back ends, making maintenance easier. It is a trendy technology that is gaining attention in recent practical projects because it can simultaneously achieve both speed and productivity.

Design as fast as code
TailwindCSS + Shadcn UI

Tailwind, which helps you not to worry about CSS, and Shadcn UI, which has sophisticated components, are optimized for quickly implementing high-quality UI. It provides a practical experience that allows flexible customization while maintaining the style guide, and naturally crosses the boundaries between development and design.

DB design with both safety and productivity
PostgreSQL + Drizzle ORM

The stability of PostgreSQL, a proven open source DB, and the productivity of Drizzle ORM, which allows you to design code based on types, combine to create a more secure and efficient data layer. You can manage without inconsistencies between SQL and code, allowing you to build design capabilities essential for data-centric services.

Easily implement complex authentication
Clerk

You can implement an authentication system for real services, including social login, email authentication, and session management, with just a few lines of code. Since you can easily replace complex and security-related authentication logic with SaaS when implementing it yourself, it is increasingly being used in services that prioritize rapid MVP development or stability.

YouTube-level video processing experience
Mux

It is a powerful media platform that automatically transcodes and streams videos to each device when uploaded. The experience of designing and building the entire video processing while cloning the core functions required for services such as YouTube will be a strong competitive edge when handling media services in the field.

You can also meet Bun, a runtime that is getting a lot of attention these days!

Bun is a JavaScript runtime that is gaining attention in modern projects these days due to its fast execution speed and build performance.

Please check before taking the class! 📢

This lecture is also available on the Code with Antonio YouTube channel,
In fact, to complete clone coding, you definitely need paid learning materials.
(including the entire codebase, configuration files, and structured components)

💬 Only available in Inflearn courses!

  • We've divided the 23-hour long video into a systematic curriculum. You can quickly find the part you want, learn it, and review it conveniently at any time.

  • Don't worry if English isn't your thing!

    Korean dubbing is provided so you can listen comfortably.

  • Don't just skip what you've learned 🙂

    You can review in a fun way with AI quizzes from time to time!


Recommended for
these people

Who is this course right for?

  • A developer who wants to learn the latest web development trends and apply them to real projects

  • A developer who wants to experience modern app design based on Next.js 15, React 19, and tRPC

  • Developer who wants to complete a YouTube clone project personally

  • Junior developer looking to strengthen their portfolio

Need to know before starting?

  • Basic knowledge of JavaScript and React

Hello
This is

575

Learners

14

Reviews

4

Answers

3.9

Rating

1

Course

안녕하세요, 저는 소프트웨어 엔지니어 Antonio입니다. 7년 이상의 개발 경력을 가지고 있으며, 프로그래밍 세계에 매료되어 이 분야에서 일할 수 있다는 것을 큰 행운으로 생각합니다.

그동안 다양한 프로그래밍 언어와 기술을 다루는 경험을 통해 개발자로서 많은 성장을 이룰 수 있었습니다. 지금까지 쌓은 지식과 경험도 소중하지만, 저는 여전히 배우고 성장하는 데에 큰 열정을 가지고 있습니다.

이러한 경험과 열정을 바탕으로, 프로그래밍에 대한 애정을 나누고 함께 배우며 성장하기 위해 "Code With Antonio" 유튜브 채널과 학습 플랫폼을 운영하고 있습니다. 제가 만든 튜토리얼과 인사이트가 많은 분들께 도움이 되고, 프로그래밍 커뮤니티에 긍정적인 기여를 할 수 있기를 바랍니다.

 

Curriculum

All

40 lectures ∙ (23hr 41min)

Course Materials:

Lecture resources
Published: 
Last updated: 

Reviews

All

14 reviews

3.9

14 reviews

  • goodsosbva4133님의 프로필 이미지
    goodsosbva4133

    Reviews 5

    Average Rating 3.6

    Edited

    3

    20% enrolled

    Poor Korean description

    • jojoldu2inflab

      Hello Hyunseong This is Hyangro from Inflab. We are truly sorry for the inconvenience. If you could tell us what you mean by the Korean explanation being insufficient, we will try to improve it. Regarding the quality issues with translation and dubbing, we have thoroughly reviewed everything again and improved the deficient system issues, resulting in several improvements being applied. We will continue to keep your feedback in mind and work to create a better system. Thank you very much for using Inflearn, and we will repay you with better service.

  • ej90611066님의 프로필 이미지
    ej90611066

    Reviews 2

    Average Rating 5.0

    Edited

    5

    10% enrolled

    It's hard to call it 'clone coding' because it has such diverse features and explains well why each tech is used, allowing you to grasp design principles too. Among YouTube clone coding courses, this one is personally meaningful as it lets you utilize AI and various stacks in diverse ways!

    • codewithantonio
      Instructor

      Thank you so much for the thoughtful review! I’m really glad you found the explanations helpful and meaningful, especially around architecture and AI usage. Hope the course continues to inspire you as you explore different stacks 🙏 Translation (I used ChatGPT): 정성스러운 리뷰 정말 감사합니다! 설계나 AI 활용 부분에서 설명이 도움이 되셨다니 너무 기쁩니다. 앞으로도 다양한 스택을 탐색하실 때 이 강의가 좋은 영감이 되길 바랍니다 🙏

  • divdivdivv님의 프로필 이미지
    divdivdivv

    Reviews 4

    Average Rating 5.0

    5

    30% enrolled

    I'm enjoying the lecture!

    • codewithantonio
      Instructor

      Thank you so much! I'm really glad to hear you're enjoying the lecture 🙏 Translation (I used ChatGPT): 정말 감사합니다! 강의를 즐기고 계시다니 저도 정말 기쁩니다 🙏

  • dydals34402231님의 프로필 이미지
    dydals34402231

    Reviews 8

    Average Rating 5.0

    Edited

    5

    30% enrolled

    Listening to the lectures I had only encountered on YouTube, translated into Korean through Inflearn, felt much newer and different. Thanks to that, I feel like my understanding has also increased! In the future, I'm curious if you have plans to create lectures that proceed not only with the method of handling both front and server solely with Next.js but also by building a monorepo environment with server frameworks like NestJS, Express, and Hono!

    • codewithantonio
      Instructor

      Thank you so much for the thoughtful feedback! I'm really happy to hear that the Korean-translated lectures helped deepen your understanding. I also appreciate your suggestion. Lectures covering monorepo environments and frameworks like NestJS, Express, and Hono sound like a great idea. I’ll definitely keep that in mind for future content. Translation (I used ChatGPT): 정성스러운 피드백 정말 감사합니다! 한국어로 번역된 강의가 이해에 도움이 되었다니 저도 정말 기쁩니다. 또한 제안해 주신 내용도 정말 좋네요. NestJS, Express, Hono 같은 서버 프레임워크를 활용한 모노레포 환경에 대한 강의는 확실히 가치 있는 주제라고 생각합니다. 앞으로 콘텐츠 제작 시 꼭 참고하겠습니다!

  • jjhgwx님의 프로필 이미지
    jjhgwx

    Reviews 606

    Average Rating 4.9

    5

    8% enrolled

    Thank you for the great lecture!

    $42.90

    Similar courses

    Explore other courses in the same field!