강의

멘토링

로드맵

Inflearn brand logo image
Programming

/

Full-stack

Inflearn Clone Coding Part 2: From Enrollment to Deployment, Completing the Real Inflearn

🔥 This is a practical full-stack course where you will directly implement the entire process a student experiences, from course enrollment to payment and deployment. By building everything yourself, including course exploration, detail pages, course registration, video viewing, reviews and questions, shopping cart and actual payment, continue watching, and Docker + AWS deployment, you will learn user flows and structural design similar to real services and complete an an advanced full-stack experience.

(5.0) 3 reviews

110 learners

  • lopun
실습 중심
클론코딩
사이드프로젝트
ai활용
도커
AWS
Docker
Next.js
NestJS
Prisma

What you will learn!

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

  • Complete 'My Own Inflearn' Platform, Portfolio-Ready

  • Full implementation of a user-centric course system, covering course browsing, registration, continuation, and payment.

  • Shadcn UI + TailwindCSS + Cursor AI for Practical, Stylish UI Creation

  • Modeling databases with Prisma and designing PostgreSQL-based architecture

  • Practical deployment methods using AWS and Docker

🚀

First in Korea!

Next.js 15 + NestJS Full Stack Clone Coding Course

Are you a student currently attending school?

🔗 Student Discount (-40%) Google Form Link 🔗

Wait! Part 2 Release Celebration

🔥 Part 1 Course - 30% Discount Coupon Provided 🔥

👉 Coupon Link (~7/30) 👈


In this lecture, you will:


A powerful full-stack combination of NextJS and NestJS

Through Prisma , a hot ORM


Completed from course registration to payment and distribution

Creating an Inflearn clone

Grow into a full-stack developer with solid fundamentals!

Stop taking pictures ! Experience the real full stack .”

Start your full-stack journey from planning, development, to deployment in just one lecture .

"Let's create a practical Inflearn platform from scratch using the combination of Next.js and NestJS ."

🧩 Next.js + NestJS = Best Single Language Full Stack Combination

In this lecture , we will implement the entire full-stack flow from course registration, continuation, payment, and distribution based on this 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 in a single codebase.

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

Using the two frameworks together reduces data inconsistencies by allowing the UI and server to share a single type definition , and allows developers to move between the front and back ends without switching languages or toolsets.

💡 Part 2 Introduction

In this Part 2 lecture,

  • We implement everything from course list search to detailed page, favorites, and course registration buttons.

  • Create a course page that includes the ability to save viewing time and resume watching.

  • We design course evaluation and question functions, and complete the UI for managing knowledge sharers.

  • Implement actual payment flow through shopping cart, payment API, and PortOne (Toss Payments) integration .

  • Complete up to operational level with AWS EC2 deployment, HTTPS connection, and GitHub Actions automation.

Based on the project created in Part 1 , functions such as course search, taking classes, shopping cart, and payment are added.
Finally, we will complete the AWS deployment and complete it as a “ real service that anyone can access .”

We designed the curriculum so that the foundation laid in Part 1 naturally leads to Part 2, so if you take both parts consecutively, you can fully experience the full-stack process from design to operation .

🚀

In Part 2 of the lecture,

You will actually complete the results below!


🥇 Implementation from course navigation to detailed page

  • Category, pagination based course search

  • Detailed page with star rating and knowledge sharer information

  • Implemented favorite function and course registration/shopping cart function


📺 Implementing a course page that works like a real one

  • Developing your own video player component

  • Completed viewing time saving and resume functions

  • Includes a mission to create a custom play button


📝 Establishing a course evaluation and question system

  • Star-based course review list and writing UI

  • Complete the flow from question writing/review/answer

  • Direct implementation of management page for knowledge sharers


💳 Complete actual payment flow

  • Design your own shopping cart/payment API

  • PortOne Server SDK and Toss Payments PG Integration

  • From actual payment, exception handling, to reflection in learning list after payment


💻 From distribution to monitoring to infrastructure automation

  • Sentry integration, daily statistics batch job development,
    Deep learning up to in-memory caching

  • EC2 + Docker + Route53 deployment configuration

  • Complete CI/CD automation with GitHub Actions


🎯

I highly recommend this to these people!

Beyond a simple to-do app
Proper service
Create and front-end developer

To the portfolio
A project that can be used right away
Job seekers who need to change jobs or prepare for employment

Like a lecture platform
I want to create a real service
Solo developer

We learn this in class


Section 2
Complete the flow before taking the course, from course exploration to detailed page

Implement search functionality including categories and pagination features, and create a course list screen and category search page.

The detailed page displays the star rating and information about the knowledge sharer, and the course registration button operates differently depending on whether you are logged in and the course type.

Section 3
Course page where you can save viewing time and continue watching

Create your own video player component ,
It even implements viewing time saving and resume viewing logic .

In the backend, we design an API that stores and responds to course information .
On the front, we create a learning experience close to the actual Inflearn by configuring a UI and custom play buttons that operate depending on the viewing status .

Section 4
Course Evaluation and Questioning Function - Students & Knowledge Sharers

Students leave ratings and reviews,
You can register a question and receive an answer.

Knowledge sharers design their own role-appropriate UIs so they can reply to course reviews or leave answers to questions on the management page.

Section 5
Developing the entire purchase flow from shopping cart to checkout

Add the course to your cart,
Implement real payment by linking PortOne SDK and Toss Payments .

When payment is successful, it will be automatically reflected in the learning list.
Complete user experience by considering the entire payment flow and exceptions.

Sections 6-7
From field-level backend operation experience to actual deployment

Automatically collect daily statistics with NestJS's Cron function, and improve response speed with in-memory caching for frequently called APIs.

Connect to Sentry to monitor errors in real time
Configure an actual deployment environment using EC2, Docker, GitHub Actions, and Route 53 .

We will also practice connecting domains with HTTPS .

📦 Part 1 and Part 2 are connected like this

This lecture is part of the 'Inflearn Clone Project' series .
Part 1 and Part 2 can be taken independently of each other, but
If we listen together, we can complete a real service from planning to distribution .

Part 1

Focused on knowledge sharing functions

Student-focused function

Register for classes, create curriculum, upload videos

Part 2

Explore lectures, register for classes, watch videos, pay, and distribute

JWT authentication, S3 upload, admin page configuration

Viewing history storage, questions/reviews, payment API, EC2 deployment

🧑‍🎓

Through class
You can get these things


1⃣ You can design the project structure yourself from start to finish.

2⃣ The power to implement the functions required for the service end-to-end is created.

3⃣ You can build the necessary infrastructure through AWS .

4⃣ You can build a high-quality service by utilizing Cursor AI .

5⃣ “I can create at least one service that I want !” You will gain a well-founded confidence .

🧰

Lecture Structure

7 sections , 14+ hours , 40+ lectures (lifetime updates)

GitHub example code and references provided

Completed projects can be used as a portfolio

🧩

Things to prepare before attending class

Typescript grammar basics, React usage experience

Understanding Git and Node.js

#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, to-do apps! A frontend developer eager to implement an entire service.

  • Junior to mid-level developers who want to learn NestJS backend design hands-on

  • Job seeker needing a polished project for career change and portfolio.

  • Hands-on students who want to learn a practical stack from A to Z in one course

  • A hands-on developer eager to directly implement a Next.js + NestJS-based full-stack architecture.

Need to know before starting?

  • HTML/CSS/JS basic syntax

  • React basic usage experience

Hello
This is

3,479

Learners

176

Reviews

64

Answers

4.9

Rating

6

Courses

🚀 “핫한 스택으로 실전 서비스를 만드는 과정을 숨김없이 보여드립니다.”

이론보다는 프로젝트 위주의 실무 강의로 현업에 바로 도움이 될 수 있는 내용을 제공합니다.

  • (현) 네카라쿠배 재직

  • (현) 7년차 풀스택 개발

  • (강의) 스파르타 코딩클럽 강사

  • (교육) 한국과학기술원(KAIST) 전산학과 졸업

Curriculum

All

44 lectures ∙ (14hr 11min)

Course Materials:

Published: 
Last updated: 

Reviews

All

3 reviews

5.0

3 reviews

  • tomorrowcho님의 프로필 이미지
    tomorrowcho

    Reviews 15

    Average Rating 4.7

    5

    100% enrolled

    Following Part 1, I've finally completed Part 2! In this Part 2 lecture, technologies I was always curious about (such as video player implementation, shopping cart, payment processing, Sentry integration, etc.) were naturally explained with actual code, which was truly enjoyable and beneficial. As a junior developer, there were many parts I could immediately apply to actual work, and I also enjoyed learning by following along :) The lecture explained the design intentions and reasons for choices, allowing me to go beyond simply typing along and truly "implement with understanding." Thank you for creating such a great lecture! I look forward to your next one 🙌

    • tonyglenn님의 프로필 이미지
      tonyglenn

      Reviews 10

      Average Rating 5.0

      5

      90% enrolled

      • 5undaye3385님의 프로필 이미지
        5undaye3385

        Reviews 1

        Average Rating 5.0

        5

        45% enrolled

        I'm watching Part 2 lectures following Part 1 lectures and they are very helpful. I'm working as a frontend developer, but learning about backend content makes it easier to understand the overall flow. Thank you for providing such good lectures.

        $127.60

        lopun's other courses

        Check out other courses by the instructor!

        Similar courses

        Explore other courses in the same field!