Inflearn Clone Coding Part 1: Real-world Project Starting with Next.js and NestJS

🔥 This is a practical full-stack course where you will implement the knowledge-sharer features from scratch, from course registration to video uploading. Using Next.js 15 and NestJS, you will follow the actual Inflearn workflow—creating courses, organizing curriculums, uploading thumbnails and videos, and writing detailed descriptions—while gaining hands-on experience in Prisma modeling, JWT authentication, S3 + CloudFront uploading, and Swagger API design.

(4.8) 40 reviews

340 learners

Level Intermediate

Course period Unlimited

AWS
AWS
Docker
Docker
Next.js
Next.js
NestJS
NestJS
Prisma
Prisma
AWS
AWS
Docker
Docker
Next.js
Next.js
NestJS
NestJS
Prisma
Prisma

Reviews from Early Learners

Reviews from Early Learners

4.8

5.0

치현

100% enrolled

I am currently a frontend developer and had been wanting to try backend development as well. Remembering the positive experience I had with Ropan-nim's Next.js full-stack course, I decided to enroll in this one. Personally, I had wanted to create a site like Inflearn and had even officially inquired if I could crawl Inflearn's course data, but it was rejected. It seems I was able to fulfill that wish through this course. As someone new to Nest.js, this course helped me grasp how a project could be structured if I were to develop one. Because it also included a planning section titled "Exploring the Inflearn Product," I think I was able to contemplate the architecture and structure. Although it's a bit disappointing that deployment isn't included in Part 1, if Part 2 comes out quickly, I'd like to have a complete portfolio including deployment 😊😊.

5.0

찬우 이

100% enrolled

I am currently studying to become a frontend developer. Ро펀's previous supabase course was very helpful, which led me to take this clone coding course as well. When working on team projects, I would receive APIs from the backend team and write frontend code referencing Swagger. I was always curious about the data flow logic on the backend side, and this course was really beneficial as I could experience that flow firsthand. There were difficult parts as I encountered many new technologies like NestJS and Prisma for the first time. However, the instructor explained the latest technologies frequently used in practice very well, and the material was well-organized on Notion, making it easy to follow. The process of using various tools like Shadcn UI, TailwindCSS, and S3 was also interesting, and I learned many tips and know-how that can be immediately used in real work. Specifically, by directly implementing how the frontend and backend are connected and how the overall structure operates, my understanding of full-stack development has definitely increased. I recommend this course to anyone who wants to create a high-quality project that can be used for a portfolio, or those who want to learn practice-oriented full-stack development!

5.0

cafe small house

100% enrolled

I'm writing this again after finishing the lecture. First of all, it's really good. Before, I just thought it was a neat lecture, but I gained a lot from it. For me, learning how to receive backend specs from the frontend via hey-api was really great. Honestly, I think this alone made the lecture worth it. Of course, there are many methods like GraphQL, tRPC, etc., but eventually, when you get a job, everything is done with REST APIs. I was thinking about whether there's a way to avoid that, a way to reduce each other's work, and I feel like I've learned a good method. It was also good because it was a lecture that made me think there are better ways for next and nest than what I'm currently using.

What you will gain after the course

  • Latest Full-Stack Development Trends (Next.js 15, NestJS, Prisma)

  • Completion of "My Own Inflearn" platform, usable as a portfolio

  • Developed overall service features including course registration, modification, video uploading, and curriculum editing.

  • Creating professional-grade, stylish UIs with Shadcn UI + TailwindCSS + Cursor AI

  • Configuring an automated backend calling structure based on Swagger + OpenAPI

  • Modeling a database with Prisma and designing a PostgreSQL-based structure

  • Building an S3 + CloudFront-based Streaming Upload System

🚀

Korea's first!

Next.js 15 + NestJS Full-stack Clone Coding Course

✋ Wait! Now recruiting for the Inflearn Clone Coding Challenge Season 2
✅ Recruitment Period: 3/24 ~ 4/18
✅ 100% Refund for Top Graduates

https://inf.run/bNpwg


Through this course, you will



The powerful full-stack combination of NextJS, NestJS and

Through the trendy ORM, Prisma,


While building your own Inflearn project

Grow into a full-stack developer with a solid foundation!


No more scratching the surface! Experience real full-stack development.”

Start your full-stack journey to complete everything from planning and development to deployment with just one course.

"Build an Inflearn-like platform close to real-world practice from scratch using the Next.js + NestJS combination."

🧩  Next.js + NestJS  = The optimal single-language full-stack combination

Next.js 15 adds Server Components, App Router, and Server Actions to React-based projects, allowing you to handle everything from screen rendering to simple APIs within a single codebase.

NestJS is written in the same TypeScript, and thanks to its dependency injection and modular structure, it allows you to build a backend that is easy to maintain even as the team size grows.

Using these two frameworks together allows the UI and server to share a single type definition, reducing data inconsistencies and enabling developers to move between the frontend and backend without switching languages or toolsets.

🔥 Next.js v15 🔥

🔥 Nest.js v10 🔥

🤔 Why the "Inflearn Clone Project"?

With small example apps, it is difficult to properly experience a full-stack cycle. This is because blogs or to-do lists that only feature login functionality don't allow you to feel firsthand "how a real service actually operates."

That's why I decided to create Mini Inflearn, which replicates Inflearn's core workflow.
By directly implementing the process from member management to registering courses, editing curriculums, uploading videos to S3, and streaming them via CloudFront, you will experience design → authentication → media processing → permission management all at once.

💡 Part 1 Introduction

In this Part 1 course,

  • Frontend and backend project setup will be carried out (Next.js 15 · NestJS · Prisma · Docker) (Next.js 15 · NestJS · Prisma · Docker)

  • After implementing JWT authentication using Auth.js,

  • Instructor features (course management, curriculum management, detail page creation, video and thumbnail uploads) will be completed.

  • It is designed to allow you to focus on actual logic and full-stack experience by using TailwindCSS, ShadcnUI, and Cursor AI for rapid styling.

  • Upon completing the course, you will have “a platform where you can upload and even stream lectures” in your hands, and you will naturally acquire full-stack capabilities ranging from data modeling to cloud streaming.

In Part 2, we will build upon this foundation by adding course browsing, enrollment, reviews, and Q&A features, and finally complete the project as a "real service that anyone can access" by finishing with AWS deployment.

The curriculum is designed so that the foundations built in Part 1 naturally lead into Part 2, so by taking both parts consecutively, you can fully experience the entire full-stack process from design to operation.

🚀

Everyone who takes this course

you will actually complete these results


🥇 Korea's first! Next.js 15 × NestJS Practical Full-stack Completion

  • App Router, Server Action, etc.
    Hands-on practice with the latest Next features

  • NestJS Module Architecture & REST API Design

  • Implementing a professional backend with Prisma + PostgreSQL + Swagger


🧑🏻‍💻 My very own "Mini Inflearn" that I build myself

  • Register/edit courses, write detailed descriptions, and upload thumbnails

  • Add sections/lectures and curriculum organization features

  • Directly developing admin features exclusively for knowledge sharers


🎥 From video upload to streaming

  • S3 + CloudFront secured video uploads

  • Multer-based video upload + preview implementation

  • Completed even the real-time display of upload results


🎨 Beautiful UI, Fast Development

  • TailwindCSS + ShadcnUI for a sophisticated UI composition

  • Cursor AI for style automation and rapid development

  • Designing responsive layouts and common components from scratch


🏠

All of this with a professional-level tech stack

Let's build it solidly

Frontend

  • Next.js 15 – The latest frontend framework

  • TailwindCSS – A CSS library for rapid styling

  • Shadcn/UI – UI component library for production use

  • React Query – Server data caching and request state management library

  • Jotai v2 – An intuitive global state management tool


Backend · Infrastructure

  • NestJS – Backend API server framework

  • Prisma – A safe and convenient ORM for DB connection

  • PostgreSQL – A relational database with scalability and stability

  • Docker – A tool for configuring consistent development and deployment environments

  • AWS S3 / CloudFr

    ont – Cloud infrastructure for storing and fast delivery of lecture videos


🎯

I highly recommend it to these people!

Moving beyond a simple To-Do app
to create a
proper service as a Frontend Developer

Job seekers and career changers who need a project that can be used immediately as a
portfolio
cần thiết

Lecture platforms and similar
real-world services for
solo developers

What you will learn in this class


Sections 1–3
Master the basics and set up the Next + Nest project

Set up the front-end server with Next.js 15, TailwindCSS, ShadcnUI, Jotai, and React Query, and, Jotai và React Query,

NestJS, Prisma, and Docker will be used to set up the backend and database all at once.
You will also learn a practical development workflow using Cursor AI.

Section 4
From Login to Authentication, Just Like a Real Service

Auth.js (next-auth) and JWT are used to implement everything from
sign-up, login, session maintenance, and permission protection.

From SSR/CSR considered authentication handling to the application of NestJS Auth Guard, you will master authentication systems used directly in real-world practice.
, bạn sẽ nắm vững hệ thống xác thực được sử dụng trực tiếp trong thực tế.

Section 5
Analyzing Inflearn's Structure and Planning It Yourself

To build a real service, we will first analyze the structure of Inflearn.

Plan what features and data models are needed, define models such as Course, Section, and Lecture yourself using Prisma, and even create Seed data.

Section 6
Instructor Feature Implementation (Course Management)

We will implement the entire flow where knowledge sharers can directly register and edit lectures.

Create a detailed page using CKEditor
and build video and thumbnail upload functions using a S3 + CloudFront combination. (Streaming is also implemented)
Automate API calls with Swagger Codegen as well.Swagger Codegen.

📦 Part 1 and Part 2 are connected like this

This course is part of the 'Inflearn Clone Project' series.
Part 1 and Part 2 can be taken independently, but
taking them together allows you to complete a real service from planning to deployment.

Part 1

Instructor-focused features

Student-focused features

Lecture registration, curriculum organization, video upload

Part 2

Course browsing, enrollment, video streaming, payment, and deployment

JWT authentication, S3 upload, admin page configuration

Saving watch history, questions/reviews, payment API, EC2 deployment

🧑‍🎓

Through this class,
you can gain these things


1⃣ You will be able to design the project structure from start to finish on your own.

2⃣ You will develop the End-to-End power to implement the features necessary for a service.

3⃣ You can build the necessary infrastructure through AWS.

4⃣ You can build high-quality services using Cursor AI..

5⃣ You will gain the well-founded confidence that you can build at least one service you've always wanted on your own!

🧰

Curriculum Structure

A total of 7 sections, ~15 hours of content, ~50 lectures (lifetime updates)

GitHub example code and reference materials provided

The completed project can be used as a portfolio

🧩

Prerequisites

Typescript syntax basics, React experience

Git, Node.js understanding

#Next.js #Nest.js #NextJS #NestJS #Fullstack #Fullstack #Jotai #ReactQuery #Prisma #PostgreSQL #CloneCoding #CloneCoding #Node.js #AWS #S3 #Cloudfront

Recommended for
these people

Who is this course right for?

  • No more blogs or to-do apps! A frontend developer who wants to implement an entire service from scratch.

  • Junior to mid-level developers who want to learn NestJS backend design through practical experience

  • Job seekers who need high-quality projects for career changes or portfolios

  • Practical-oriented students who want to master the real-world stack from A to Z with a single course.

  • Practical-oriented students who want to master a single-language-based full-stack architecture from start to finish.

Need to know before starting?

  • Basic syntax of HTML/CSS/JS

  • Basic experience using React

  • Understanding of REST API and Node.js

Hello
This is lopun

3,773

Learners

229

Reviews

64

Answers

4.9

Rating

8

Courses

🚀 “I will show you the entire process of building a real-world service using the trendiest tech stacks.”

I provide project-oriented practical lectures rather than theory, offering content that can be immediately helpful in the field.

  • (Current) Working at Naver/Kakao/Line/Coupang/Baemin

  • (Current) 7th-year Full-stack Developer

  • (Lecturing) Instructor at Sparta Coding Club

  • (Education) B.S. in Computer Science, Korea Advanced Institute of Science and Technology (KAIST)

More

Curriculum

All

55 lectures ∙ (14hr 42min)

Course Materials:

Published: 
Last updated: 

Reviews

All

40 reviews

4.8

40 reviews

  • tomorrowcho님의 프로필 이미지
    tomorrowcho

    Reviews 18

    Average Rating 4.8

    Edited

    5

    100% enrolled

    Since it was based on Next.js, I could start comfortably, and although NestJS and Prisma were new, I found them interesting to work with. Because it's a clone project like a real service, I was satisfied that I could develop practical skills as well! I'm also looking forward to Part 2! 😊

    • upustream6450님의 프로필 이미지
      upustream6450

      Reviews 4

      Average Rating 5.0

      5

      71% enrolled

      I purchased both Part1 and Part2 together. As a working professional, I'm currently exploring technologies to introduce to my company and need to implement technologies using nest and next frameworks. Through the lectures, I'm learning about various technologies and applying them. The flow is good, and rather than being a project that somehow just works with whatever libraries, I think it's a configuration that directly impacts efficient development/management/operations, so the lecture gets a million points out of a perfect score. Thank you for the excellent lecture. But teacher... We students don't know what you know, which is why we want to learn and are taking the lectures... This lecture is not beginner level... Most students probably think "What on earth am I supposed to look at?" even when looking at official documentation... because we don't know much...😊 When you suddenly say "I'll delete this part because this part replaces that part," most students have to think for a long time about what "this part" and "that part" actually are, and it seems they feel great difficulty in figuring it out... Your lectures are good. You're providing everything I need and everything I want. Just... just a little bit, a very little bit. I would be grateful if you could think of us as "poor potatoes" who can't even breathe on our own yet.

      • lopun
        Instructor

        Thank you for leaving such great feedback! I'll work hard to reflect your suggestions so that beginners can follow along more easily :) If you have any questions or get stuck on anything, please feel free to reach out on Slack anytime. Fighting until you complete the course!

    • rach님의 프로필 이미지
      rach

      Reviews 6

      Average Rating 5.0

      Edited

      5

      100% enrolled

      🎯 A course that allows frontend developers to easily learn the full-stack flow As I developed in frontend and felt the need for backend knowledge, I previously took the "Backend 101 for Frontend Developers" course. Since I was highly satisfied, I decided to take this course immediately afterwards. This course goes beyond simple feature implementation. It first covers the theory of the latest technology stack including Next.js 15, NestJS, Prisma, React Query, TailwindCSS, Cursor AI, and Jotai, making it suitable for beginners to follow. Implementing each feature while cloning a real service, I felt this course is highly appropriate for frontend developers who want to understand the backend flow together. Particularly impressive were: ✅ API implementation using Prisma and database modeling based on PostgreSQL ✅ Configuration of an automated backend call structure based on Swagger + OpenAPI ✅ Building a video streaming upload system based on AWS S3 + CloudFront There was a lot of specific implementation content at a level that can be directly used in practice. Furthermore, I was very satisfied with the learning environment as I could ask questions or get feedback on points I was curious about during learning via the Slack channel and receive answers. However, one drawback was that the video order was not smooth in some parts due to CKEditor related issues. It didn't affect the overall flow significantly, but it was a bit confusing. 👉 I highly recommend this course for those who want to gain project experience covering both frontend and backend. ⭐⭐⭐⭐⭐ Satisfied with practical sense, technology stack, and cloning target.

      • nochikk님의 프로필 이미지
        nochikk

        Reviews 10

        Average Rating 5.0

        Edited

        5

        100% enrolled

        I am currently a frontend developer and had been wanting to try backend development as well. Remembering the positive experience I had with Ropan-nim's Next.js full-stack course, I decided to enroll in this one. Personally, I had wanted to create a site like Inflearn and had even officially inquired if I could crawl Inflearn's course data, but it was rejected. It seems I was able to fulfill that wish through this course. As someone new to Nest.js, this course helped me grasp how a project could be structured if I were to develop one. Because it also included a planning section titled "Exploring the Inflearn Product," I think I was able to contemplate the architecture and structure. Although it's a bit disappointing that deployment isn't included in Part 1, if Part 2 comes out quickly, I'd like to have a complete portfolio including deployment 😊😊.

        • lopun
          Instructor

          Chihyun, thank you so much for your thoughtful course review! I'm happy to hear that this course helped you realize your wish of wanting to build a site like Inflearn yourself, even just a little bit 😊😊 You mentioned you were new to Nest.js, but it's rewarding from the course creator's perspective that you were able to understand the structure and get the hang of it! As you mentioned, I understand you might have felt a bit disappointed that deployment wasn't included in Part1. I'll do my best to prepare well so that you can build a more complete portfolio with deployment in Part2. Please look forward to it! 😊 Thank you once again for your valuable course review!

      • chanwoolee747485님의 프로필 이미지
        chanwoolee747485

        Reviews 2

        Average Rating 5.0

        Edited

        5

        100% enrolled

        I am currently studying to become a frontend developer. Ро펀's previous supabase course was very helpful, which led me to take this clone coding course as well. When working on team projects, I would receive APIs from the backend team and write frontend code referencing Swagger. I was always curious about the data flow logic on the backend side, and this course was really beneficial as I could experience that flow firsthand. There were difficult parts as I encountered many new technologies like NestJS and Prisma for the first time. However, the instructor explained the latest technologies frequently used in practice very well, and the material was well-organized on Notion, making it easy to follow. The process of using various tools like Shadcn UI, TailwindCSS, and S3 was also interesting, and I learned many tips and know-how that can be immediately used in real work. Specifically, by directly implementing how the frontend and backend are connected and how the overall structure operates, my understanding of full-stack development has definitely increased. I recommend this course to anyone who wants to create a high-quality project that can be used for a portfolio, or those who want to learn practice-oriented full-stack development!

        • lopun
          Instructor

          Thank you for your valuable course review, Chanwoo! I feel very rewarded that you found the lecture beneficial. 😊😊 Thank you for your hard work completing the course. I hope you have a happy day! :)

      lopun's other courses

      Check out other courses by the instructor!

      Similar courses

      Explore other courses in the same field!

      $127.60