LMS 플랫폼

✋ 소개

유데미, 인프런 등과 같은 LMS 플랫폼을 만들어보았습니다. 강사가 직접 강의를 관리할 수 있도록 도우며 학생은 강의를 수강하고 진행 상황을 추적 및 관리할 수 있습니다.

🧑‍🤝‍🧑 구성원

  • 백엔드 및 프론트엔드 : 1명

💻 기술 스택

  • TypeScript, Next.js
  • Clerk, Zustand, React-Hook-Form, Zod, Stripe, Uploadthing, Mux
  • TailwindCSS, Shadcn/ui
  • Postgres, Prisma ORM

내가 기여한 기능

로그인 및 회원가입

  • Clerk를 활용하여 구현하였습니다.
  • clerk/localization을 활용하여 한국어로 변경하였습니다. (실험 기능)

강의 관리

  • 강좌를 개설하고 관리할 수 있습니다.
    • 강좌 설명, 강좌 카테고리, 가격, 첨부 파일 등 관리
    • 강좌 공개 여부 설정 (필수 조건을 만족해야 공개로 설정할 수 있습니다.)
    • 챕터 관리 (챕터별 공개 여부 및 순서를 설정할 수 있습니다.)
강좌 개설 강좌 챕터 순서 변경 (드래그 & 드랍) 강좌 공개 여부 설정 (비공개 -> 공개)

강좌 수강

  • 강의를 결제하지 않았다면 무료로 공개된 챕터만 수강할 수 있습니다.
  • Mux 비디오 플레이어를 활용하여 학생은 화질 설정, 배속 기능 등을 활용할 수 있습니다.
  • 챕터 영상을 모두 시청하였다면 다음 챕터로 자동으로 넘어갑니다.
    (마지막 챕터라면 강의가 종료됩니다.)
  • Stripe를 활용하여 결제를 구현하여 학생은 강의를 구매할 수 있습니다.
  • 강의 진척도를 실시간으로 확인할 수 있습니다.
강좌 결제 결제하지 않은 챕터 접근 방지 강의 시청(시청 완료 후 자동으로 다음 챕터로 이동)

학생 대시보드

  • 수강 중이거나 완료된 강의의 수를 조회할 수 있습니다.
  • 강좌별 진행 상황을 조회할 수 있습니다.
학생 대시보드

강사 대시보드

  • 총 수익과 판매 강좌 수를 조회할 수 있습니다.
  • 강좌별 수익을 차트로 조회할 수 있습니다.
강사 대시보드