Build a Course & LMS Platform: Next 13, React, Stripe, Mux, Prisma, Tailwind, MySQL | Udemy Clone
Discord for any problems/errors/bugs: https://www.codewithantonio.com/discord
Github & Live Website: https://www.codewithantonio.com/projects/lms-platform
Clerk Authentication: https://dub.sh/IQUAEbL
In this 10 hour tutorial you are going to learn how to create your very own LMS (Learning Management System) platform. We are going to use the latest tech such as Next 13 with the App Router, Prisma as an ORM, Stripe for payments, and many more.
Key Features:
– Browse & Filter Courses
– Purchase Courses using Stripe
– Mark Chapters as Completed or Uncompleted
– Progress Calculation of each Course
– Student Dashboard
– Teacher mode
– Create new Courses
– Create new Chapters
– Easily reorder chapter position with drag n’ drop
– Upload thumbnails, attachments and videos using UploadThing
– Video processing using Mux
– HLS Video player using Mux
– Rich text editor for chapter description
– Authentication using Clerk
– ORM using Prisma
– MySQL database using Planetscale
Timestamps
00:00 Intro & Demo
08:55 Environment setup
19:28 Folders setup
35:14 Authentication
48:01 Layout
01:16:22 Dynamic Layout
01:26:55 Course Creation UI
01:45:37 Prisma & DB setup
02:00:21 Course Creation API
02:09:47 Course Edit Page UI
02:28:37 Course Title Form
02:42:35 Course Description Form
02:52:13 UploadThing & Image Form
03:16:45 Course Category Form
03:34:20 Course Price Form
03:42:58 Course Attachment Form
04:03:23 Prisma schema finalization
04:12:13 Chapter Creation API
04:28:08 Chapter Reorder Functionality
04:55:12 Chapter Edit Page UI
05:11:20 Chapter Description Form
05:21:34 Chapter Access Form
05:31:04 Mux Setup & Chapter Video Form
05:47:40 Chapter Publish Action
06:19:21 Course Publish Action
06:42:32 Courses Data Table
07:07:27 Categories Query
07:21:33 Search Query
07:32:12 Course Grid & Card UI
08:00:26 Course & Chapters Layout
08:30:36 Chapter HLS Video Player
08:55:06 Course Purchase UI
09:02:44 Stripe Integration
09:27:32 Chapter Progress Functionality
09:55:11 Student Dashboard
10:09:59 Teacher Analytics Dashboard
10:25:29 (Optional) Admin Protection
10:34:23 Deployment