강의

멘토링

커뮤니티

BEST
Programming

/

Full-stack

Inflearn Clone Coding Part 1: Dự án thực tế bắt đầu với Next.js và NestJS

🔥 Từ đăng ký khóa học đến upload video, đây là khóa học fullstack thực chiến triển khai nguyên bản các tính năng của người chia sẻ kiến thức. Sử dụng Next.js 15 và NestJS để tạo khóa học, cấu thành curriculum, upload thumbnail và video, viết giới thiệu chi tiết theo đúng quy trình của Inflearn, giúp bạn tích lũy kinh nghiệm gần với thực tế thông qua Prisma modeling, JWT authentication, S3 + CloudFront upload, thiết kế Swagger API.

(4.8) 36 đánh giá

316 học viên

  • lopun
실습 중심
인프런
AWS
Docker
Next.js
NestJS
Prisma

Đánh giá từ những học viên đầu tiên

Bạn sẽ nhận được điều này sau khi học.

  • Xu hướng phát triển Full-stack mới nhất (Next.js 15, NestJS, Prisma)

  • Hoàn thành nền tảng 'Inflearn của riêng tôi' có thể sử dụng làm portfolio

  • Phát triển toàn bộ các tính năng dịch vụ thực tế như đăng ký khóa học, chỉnh sửa, tải lên video, chỉnh sửa chương trình giảng dạy

  • Tạo UI cảm giác chuyên nghiệp với Shadcn UI + TailwindCSS + Cursor AI

  • Cấu trúc gọi backend tự động hóa dựa trên Swagger + OpenAPI

  • Thiết kế mô hình cơ sở dữ liệu với Prisma và cấu trúc dựa trên PostgreSQL

  • Xây dựng hệ thống upload streaming dựa trên S3 + CloudFront

🚀

Đầu tiên tại Hàn Quốc!

Next.js 15 + NestJS Khóa học lập trình fullstack clone coding

Bạn có phải là học sinh đang theo học tại trường không?

🔗 Link Google Form giảm giá sinh viên (-40%) 🔗


Thông qua khóa học này, các bạn sẽ



Kết hợp fullstack mạnh mẽ NextJS, NestJS

Thông qua Prisma, ORM hot nhất hiện tại


Tạo Inflearn của riêng mình

Trở thành nhà phát triển fullstack với nền tảng vững chắc!


"Thử qua loa thôi đủ rồi! Hãy trải nghiệm fullstack thực sự."

Bắt đầu hành trình fullstack hoàn thành từ lập kế hoạch, phát triển, triển khai chỉ với một khóa học duy nhất.

"Tạo ra nền tảng Inflearn gần với thực tế từ đầu bằng sự kết hợp Next.js + NestJS."

🧩 Next.js + NestJS = Sự kết hợp tối ưu cho fullstack đơn ngôn ngữ

Next.js 15 bổ sung Server Components · App Router · Server Actions vào các dự án dựa trên React, cho phép xử lý từ việc render giao diện đến các API đơn giản trong cùng một codebase.

NestJS được viết bằng TypeScript, và nhờ vào dependency injection cùng cấu trúc modular, bạn có thể xây dựng backend dễ bảo trì ngay cả khi quy mô team ngày càng lớn.

Khi sử dụng hai framework cùng nhau, UI và server sẽ chia sẻ một định nghĩa kiểu dữ liệu, giúp giảm thiểu sự không nhất quán của dữ liệu và cho phép developer chuyển đổi giữa frontend và backend mà không cần thay đổi ngôn ngữ hay bộ công cụ.

🔥 Next.js v15 🔥

🔥 Nest.js v10 🔥

🤔 Tại sao lại là "Dự án nhân bản Inflearn"?

Với các ứng dụng ví dụ nhỏ thì khó có thể trải nghiệm đúng nghĩa một chu kỳ fullstack hoàn chỉnh. Bởi vì chỉ với blog có chức năng đăng nhập hoặc danh sách todo thì không thể cảm nhận được "dịch vụ thực tế hoạt động như thế nào" một cách trực quan.

Vì vậy tôi đã quyết định tạo ra một Inflearn mini bằng cách chuyển nguyên xi luồng cốt lõi của Inflearn.
Từ quản lý thành viên đến đăng ký khóa học, chỉnh sửa chương trình giảng dạy, tải video lên S3 rồi streaming qua CloudFront, thông qua việc trực tiếp triển khai các quy trình này, bạn sẽ trải nghiệm một lần thiết kế → xác thực → xử lý media → quản lý quyền.

💡 Giới thiệu Phần 1

Trong khóa học Part 1 này

  • Thiết lập dự án frontend và backend (Next.js 15 · NestJS · Prisma · Docker)

  • Sau khi triển khai xác thực JWT bằng Auth.js

  • Chức năng người chia sẻ kiến thức (quản lý bài giảng, quản lý chương trình học, viết trang chi tiết, tải lên video·thumbnail) được hoàn thành.

  • TailwindCSS · ShadcnUI, Cursor AI를 sử dụng để tiến hành styling nhanh chóng và được thiết kế để tập trung vào logic thực tế cũng như trải nghiệm fullstack.

  • Sau khi hoàn thành khóa học, bạn sẽ có trong tay "nền tảng có thể đăng tải bài giảng và streaming", đồng thời tự nhiên thu được năng lực fullstack từ mô hình hóa dữ liệu đến streaming trên cloud.

Part 2에서는 trên nền tảng này sẽ xây dựng các tính năng tìm kiếm khóa học·học tập·đánh giá·Q&A, và cuối cùng hoàn thành việc triển khai AWSDịch vụ thực sự mà bất kỳ ai cũng có thể truy cập" để hoàn thành.

Chúng tôi đã thiết kế chương trình học sao cho nền tảng được xây dựng trong Part 1 kết nối tự nhiên với Part 2, vì vậy nếu bạn học liên tiếp cả hai phần, bạn có thể trải nghiệm hoàn toàn từ thiết kế đến vận hành toàn bộ quy trình fullstack.

🚀

Tất cả những người tham gia khóa học này

Bạn sẽ thực sự hoàn thành những sản phẩm như thế này


🥇 Đầu tiên tại Hàn Quốc! Hoàn thành thực chiến Full-stack Next.js 15 × NestJS

  • App Router, Server Action và các
    tính năng mới nhất của Next thực hành

  • Kiến trúc module NestJS & Thiết kế REST API

  • Prisma + PostgreSQL + Swagger để triển khai backend thực tế


🧑🏻‍💻 Tôi tạo ra "Inflearn mini" của riêng mình

  • Đăng ký/chỉnh sửa khóa học, viết giới thiệu chi tiết, tải lên hình thu nhỏ

  • Thêm phần/bài giảng và tính năng cấu trúc chương trình học

  • Phát triển trực tiếp tính năng quản trị viên chuyên dụng cho người chia sẻ kiến thức


🎥 Từ tải lên video đến streaming

  • S3 + CloudFront để tải lên video được xử lý bảo mật

  • Multer để triển khai tải lên video + xem trước

  • Hoàn thành hiển thị kết quả tải lên thời gian thực


🎨 UI đẹp mắt, phát triển nhanh chóng

  • TailwindCSS + ShadcnUI để tạo giao diện người dùng tinh tế

  • Cursor AI để tự động hóa style và phát triển nhanh

  • Thiết kế trực tiếp layout responsive và component chung


🏠

Tất cả những điều này với công nghệ stack cấp độ thực tếbằng

Hoàn thiện một cách vững chắc

Frontend

  • Next.js 15 – Framework frontend mới nhất

  • TailwindCSS – Thư viện CSS giúp tạo kiểu nhanh chóng

  • Shadcn/UI – Thư viện component UI thực tế

  • React Query – Thư viện quản lý trạng thái yêu cầu và cache dữ liệu server

  • Jotai v2 – Công cụ quản lý trạng thái toàn cục trực quan


Backend · Hạ tầng

  • NestJS – Framework máy chủ API backend

  • Prisma – ORM an toàn và tiện lợi để kết nối DB

  • PostgreSQL – Cơ sở dữ liệu quan hệ có tính mở rộng và ổn định

  • Docker – Công cụ thiết lập môi trường phát triển và triển khai nhất quán

  • AWS S3 / CloudFr

    ont – Cơ sở hạ tầng đám mây để lưu trữ video bài giảng và truyền tải nhanh chóng


🎯

Tôi thực sự khuyến khích những người như thế này!

Thoát khỏi ứng dụng todo đơn giản
Tạo ra dịch vụ thực sự chuyên nghiệp
và trở thành nhà phát triển frontend

Portfolio có thể
sử dụng ngay làm dự án
cần thiết cho người chuẩn bị chuyển việc·tìm việc

Nền tảng giảng dạy như vậy
Muốn tạo ra dịch vụ thực tế
Lập trình viên độc lập

Những gì bạn sẽ học trong khóa học


Phần 1~3
Xây dựng nền tảng cơ bản và thiết lập dự án Next + Nest

Next.js 15, TailwindCSS, ShadcnUI, Jotai, React Query để thiết lập front-end server,

NestJS, Prisma, Docker để chuẩn bị cả backend và DB một lần.
Cùng học quy trình phát triển thực tế sử dụng Cursor AI.

Phần 4
Từ đăng nhập đến xác thực như dịch vụ thực tế

Auth.js(next-auth) kết hợp với JWT để
triển khai đầy đủ đăng ký, đăng nhập, duy trì phiên và bảo vệ quyền hạn.

SSR/CSR Từ xử lý xác thực có xem xét đến
NestJS Auth Guard cho đến việc áp dụng, bạn sẽ làm quen với hệ thống xác thực có thể sử dụng ngay trong thực tế.

Phần 5
Phân tích cấu trúc Inflearn và thực hành lập kế hoạch trực tiếp

Để tạo ra một dịch vụ thực sự, trước tiên chúng ta sẽ phân tích Inflearn.

Hãy tự lập kế hoạch xem cần những tính năng và mô hình dữ liệu nào, định nghĩa trực tiếp các mô hình như Course, Section, Lecture bằng Prisma và tạo cả Seed 데이터 nữa nhé.

Phần 6
Triển khai chức năng người chia sẻ kiến thức (quản lý bài giảng)

Triển khai toàn bộ quy trình để người chia sẻ kiến thức trực tiếp đăng ký và chỉnh sửa bài giảng.

Sử dụng CKEditor để tạo trang chi tiết và
xây dựng tính năng upload video và thumbnail với kết hợp S3 + CloudFront. (Cũng triển khai streaming)
Tự động hóa API call với Swagger Codegen.

📦 Part 1 và Part 2, được kết nối như thế này

Khóa học này là một phần của series 'Dự án Clone Inflearn'.
Part 1 và Part 2 có thể học độc lập với nhau,
nhưng nếu học cùng nhau, bạn có thể hoàn thành một dịch vụ thực sự từ khâu lập kế hoạch đến triển khai.

Phần 1

Tập trung vào chức năng của người chia sẻ kiến thức

Tập trung vào tính năng học viên

Đăng ký khóa học, cấu thành chương trình giảng dạy, tải lên video

Phần 2

Tìm kiếm khóa học, đăng ký học, xem video, thanh toán, phân phối

JWT xác thực, tải lên S3, cấu hình trang quản trị

Lưu lịch sử xem, câu hỏi/đánh giá khóa học, API thanh toán, triển khai EC2

🧑‍🎓

Thông qua khóa học
bạn có thể thu được những điều này


1⃣ Cấu trúc dự án có thể được tự thiết kế từ đầu đến cuối.

2⃣ Bạn sẽ có sức mạnh để triển khai các tính năng cần thiết cho dịch vụ theo cách End-to-End.

3⃣ Bạn có thể xây dựng hạ tầng cần thiết thông qua AWS.

4⃣ Cursor AI를 활용하여 dịch vụ hoàn thiện cao를 구축할 수 있습니다.

5⃣ "Tôi có thể tự tay tạo ra ít nhất một dịch vụ mà mình mong muốn!" - bạn sẽ có được sự tự tin có căn cứ.

🧰

Cấu trúc bài giảng

Tổng cộng 7 phần, ~15 giờ nội dung, ~50 bài giảng (cập nhật trọn đời)

Cung cấp mã ví dụ GitHub và tài liệu tham khảo

Dự án hoàn thành có thể được sử dụng làm portfolio

🧩

Chuẩn bị trước khi học

Cú pháp Typescript cơ bản, Kinh nghiệm sử dụng React

Hiểu biết về Git, Node.js

#Next.js #Nest.js #NextJS #NestJS #Fullstack #풀스택 #Jotai #ReactQuery #Prisma #PostgreSQL #CloneCoding #클론코딩 #Node.js #AWS #S3 #Cloudfront

Khuyến nghị cho
những người này

Khóa học này dành cho ai?

  • Blog, ứng dụng todo thôi đủ rồi! Dành cho các lập trình viên frontend muốn tự tay triển khai toàn bộ dịch vụ

  • Các lập trình viên junior~middle muốn học thiết kế backend NestJS thông qua thực hành

  • Sinh viên chuẩn bị việc làm cần dự án hoàn thiện chất lượng cao để chuyển việc và làm portfolio

  • Học viên hướng thực tiễn muốn học từ A đến Z về stack thực tế thông qua một khóa học

  • Học viên hướng thực tiễn muốn nắm vững cấu trúc fullstack dựa trên ngôn ngữ đơn từ đầu đến cuối

Cần biết trước khi bắt đầu?

  • Cú pháp cơ bản HTML/CSS/JS

  • Kinh nghiệm sử dụng cơ bản React

  • Hiểu biết về REST API, Node.js

Xin chào
Đây là

3,677

Học viên

213

Đánh giá

64

Trả lời

4.9

Xếp hạng

7

Các khóa học

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

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

  • (현) 네카라쿠배 재직

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

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

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

Chương trình giảng dạy

Tất cả

55 bài giảng ∙ (14giờ 42phút)

Tài liệu khóa học:

Ngày đăng: 
Cập nhật lần cuối: 

Đánh giá

Tất cả

36 đánh giá

4.8

36 đánh giá

  • nochikk님의 프로필 이미지
    nochikk

    Đánh giá 9

    Đánh giá trung bình 5.0

    Đã chỉnh sửa

    5

    100% đã tham gia

    Tôi là nhà phát triển frontend, vốn muốn thử sức với backend, nên nhớ lại đã học tốt khóa fullstack Next.js của 로펀님, tôi đã đăng ký khóa học này. Cá nhân tôi muốn thử xây dựng một trang web như Inflearn, đã từng chính thức hỏi xin được phép crawl dữ liệu khóa học của Inflearn nhưng đã bị từ chối, tôi nghĩ mình đã có thể thực hiện mong muốn của mình với khóa học này. Là người lần đầu tiếp xúc với Nest.js, đây là khóa học giúp tôi hình dung được cách cấu trúc dự án khi thực hiện, cũng bao gồm phần lập kế hoạch "Inflearn 프로덕트 둘러보기" nên tôi có thể suy nghĩ về kiến trúc và cấu trúc. Hơi tiếc vì Part1 không bao gồm phần triển khai (deployment), nhưng nếu Part2 ra mắt sớm, tôi muốn có một portfolio hoàn chỉnh kèm theo phần triển khai. 😊😊

    • lopun
      Giảng viên

      Anh Chi Hyun, xin chân thành cảm ơn vì bài đánh giá chi tiết của anh ạ! Em rất vui khi khóa học này đã giúp anh phần nào hiện thực hóa mong muốn tự tay xây dựng một trang web giống như Inflearn 😊😊 Dù anh mới tiếp xúc với Nest.js lần đầu, việc anh đã hiểu được cấu trúc và nắm bắt được nó khiến em, người tạo ra khóa học này, cảm thấy rất tự hào! Đúng như anh đã đề cập, Part 1 không bao gồm phần triển khai (deployment) nên em đoán anh có chút tiếc nuối. Em sẽ cố gắng chuẩn bị thật tốt cho Part 2 để anh có thể xây dựng một portfolio hoàn chỉnh hơn cùng với phần triển khai. Hãy mong chờ nhé! 😊 Một lần nữa, xin chân thành cảm ơn bài đánh giá quý báu của anh ạ!

  • upustream6450님의 프로필 이미지
    upustream6450

    Đánh giá 3

    Đánh giá trung bình 5.0

    5

    71% đã tham gia

    Tôi đã mua cả Part1 và Part2. Với tư cách là một người làm thực tế, hiện tại đang tìm kiếm công nghệ để đưa vào công ty, tôi cần công nghệ sử dụng framework nest và next nên định đưa vào sử dụng. Thông qua khóa học, tôi đã biết được nhiều công nghệ và đang áp dụng chúng. Luồng xử lý tốt, các thư viện được sử dụng và đây không phải là dự án làm sao cũng được, mà là cấu trúc có tác động trực tiếp đến việc phát triển/quản lý/vận hành một cách hiệu quả, nên tôi cho rằng khóa học này được một triệu điểm trên thang điểm tối đa. Cảm ơn khóa học tuyệt vời này. Nhưng thầy ơi... Những gì thầy biết thì chúng em học viên không biết nên mới muốn học và đang nghe khóa học này... Khóa học này không phải là cấp độ sơ cấp... Phần lớn những người học có lẽ khi xem tài liệu chính thức cũng nghĩ rằng "Chính xác thì tôi phải xem cái gì đây?".. Vì không biết rõ...😊 Khi thầy đột nhiên nói "Phần này thay thế cho phần kia nên tôi sẽ xóa nó đi." thì phần lớn học viên phải suy nghĩ lâu về việc phần này và phần kia chính xác là gì, và có vẻ như cảm thấy rất khó khăn trong việc tìm ra.. Khóa học của thầy rất tốt. Thầy đang cấu trúc tất cả những gì tôi cần, những gì tôi mong muốn. Chỉ... chỉ một chút thôi, chỉ một chút xíu thôi ạ. Xin thầy hãy nghĩ rằng những "củ khoai tây tệ hại" vẫn chưa biết thở một mình cho tốt đang học khóa này thì em sẽ rất biết ơn ạ.

    • lopun
      Giảng viên

      Cảm ơn bạn đã để lại ý kiến tốt! Tôi sẽ cố gắng phản ánh nội dung bạn đã nói để những người mới bắt đầu cũng có thể theo dõi dễ dàng hơn :) Nếu có điều gì thắc mắc hoặc gặp khó khăn, hãy liên hệ qua Slack bất cứ lúc nào. Chúc bạn hoàn thành khóa học thành công!

  • chanwoolee747485님의 프로필 이미지
    chanwoolee747485

    Đánh giá 2

    Đánh giá trung bình 5.0

    Đã chỉnh sửa

    5

    100% đã tham gia

    저는 프론트엔드 개발자가 되기 위해 공부 중인데, 이전에 로펀님의 supabase 강의를 듣고 많은 도움이 되어 이번 클론코딩 강의도 수강하게 되었습니다. 팀 프로젝트를 할 때 백엔드 분께 API를 받아 스웨거를 참고해 프론트 코드를 작성하면서, 항상 백엔드에서는 어떤 로직으로 데이터가 흘러가는지 궁금했는데, 이번 강의를 통해 그 흐름을 직접 경험해볼 수 있어서 정말 유익했습니다. NestJS, Prisma 등 처음 접하는 기술도 많아 어려운 부분이 있었지만, 강사님이 실무에서 자주 쓰는 최신 기술들을 잘 설명해주시고 노션에도 정리가 잘 되어 있어 따라가기가 수월했습니다. Shadcn UI, TailwindCSS, S3 등 여러 도구를 활용해보는 과정도 흥미로웠고, 실무에서 바로 쓸 수 있는 팁과 노하우를 많이 배울 수 있었습니다. 특히, 프론트와 백엔드가 어떻게 연결되고 전체적으로 어떤 구조로 동작하는지 직접 구현해보면서 풀스택 개발에 대한 이해도가 확실히 높아졌습니다. 포트폴리오로 활용할 만한 완성도 높은 프로젝트를 만들고 싶은 분이나, 실무 지향적인 풀스택 개발을 배우고 싶은 분들에게 이 강의를 추천합니다!

    • lopun
      Giảng viên

      Cảm ơn bạn Chanwoo vì nhận xét khóa học quý báu! Bạn nói rằng khóa học hữu ích, điều đó làm tôi rất ý nghĩa 😊😊. Bạn đã rất cố gắng để hoàn thành khóa học. Chúc bạn một ngày tốt lành! :)

  • rach님의 프로필 이미지
    rach

    Đánh giá 6

    Đánh giá trung bình 5.0

    Đã chỉnh sửa

    5

    100% đã tham gia

    🎯Khóa học giúp lập trình viên Frontend dễ dàng nắm bắt luồng Full Stack Khi phát triển Frontend, tôi cảm thấy cần thiết phải có kiến thức về Backend, nên trước đó tôi đã tham gia khóa học "Backend 101 cho lập trình viên Frontend". Vì cảm thấy rất hài lòng nên tôi đã tiếp tục học ngay khóa này. Khóa học này không chỉ đơn thuần là triển khai chức năng, mà còn đi sâu vào lý thuyết về các công nghệ mới nhất như Next.js 15, NestJS, Prisma, React Query, TailwindCSS, Cursor AI, Jotai, v.v., giúp cả người mới bắt đầu cũng có thể theo kịp. Khi tự tay triển khai từng chức năng thông qua việc clone một dịch vụ thực tế, tôi cảm thấy đây là một khóa học rất phù hợp cho những lập trình viên Frontend muốn hiểu rõ luồng Backend. Đặc biệt, những phần gây ấn tượng mạnh là: ✅ Triển khai API sử dụng Prisma và mô hình hóa cơ sở dữ liệu dựa trên PostgreSQL ✅ Cấu hình cấu trúc gọi Backend tự động dựa trên Swagger + OpenAPI ✅ Xây dựng hệ thống tải lên video streaming dựa trên AWS S3 + CloudFront Có rất nhiều nội dung triển khai cụ thể ở mức độ có thể áp dụng ngay vào thực tế. Ngoài ra, trong quá trình học, tôi có thể đặt câu hỏi về những điểm thắc mắc hoặc cần phản hồi qua kênh Slack và nhận được câu trả lời, nên môi trường học tập cũng rất đáng hài lòng. Tuy nhiên, một điểm đáng tiếc là có những đoạn video không liền mạch do vấn đề liên quan đến CKEditor. Điều này không ảnh hưởng lớn đến mạch kiến thức chung, nhưng khiến tôi hơi bối rối một chút. 👉 Đây là khóa học tôi rất khuyến khích cho những ai muốn tích lũy kinh nghiệm dự án bao gồm cả Frontend và Backend. ⭐⭐⭐⭐⭐ Tôi hài lòng về cảm giác thực tế, bộ công nghệ và đối tượng clone.

    • tomorrowcho님의 프로필 이미지
      tomorrowcho

      Đánh giá 15

      Đánh giá trung bình 4.7

      Đã chỉnh sửa

      5

      100% đã tham gia

      Vì dựa trên Next.js nên tôi có thể bắt đầu quen thuộc, còn NestJS và Prisma thì lần đầu tiếp xúc nhưng cũng rất thú vị khi được thử sức. Vì là project clone giống dịch vụ thật nên tôi cũng rèn luyện được kỹ năng làm việc thực tế, thấy rất hài lòng! Rất mong chờ Part 2! 😊

      Ưu đãi có thời hạn, kết thúc sau 7 ngày ngày

      90 ₫

      29%

      3.458.199 ₫

      Khóa học khác của lopun

      Hãy khám phá các khóa học khác của giảng viên!

      Khóa học tương tự

      Khám phá các khóa học khác trong cùng lĩnh vực!