A modern, feature-rich Learning Management System built with Next.js 15, Sanity CMS, Clerk, and Stripe. Features real-time content updates, course progress tracking, and secure payment processing.

• 📚 Access to comprehensive course content
• 📊 Real-time progress tracking
• ✅ Lesson completion system
• 🎯 Module-based learning paths
• 🎥 Multiple video player integrations (YouTube, Vimeo, Loom)
• 💳 Secure course purchases
• 📱 Mobile-friendly learning experience
• 🔄 Course progress synchronization

• 📝 Rich content management with Sanity CMS
• 📊 Student progress monitoring
• 📈 Course analytics
• 🎨 Customizable course structure
• 📹 Multiple video hosting options
• 💰 Direct payments via Stripe
• 🔄 Real-time content updates
• 📱 Mobile-optimized content delivery

• 🚀 Server Components & Server Actions
• 👤 Authentication with Clerk
• 💳 Payment processing with Stripe
• 📝 Content management with Sanity CMS
• 🎨 Modern UI with Tailwind CSS and shadcn/ui
• 📱 Responsive design
• 🔄 Real-time content updates
• 🔒 Protected routes and content
• 🌙 Dark mode support

• 🎯 Modern, clean interface
• 🎨 Consistent design system using shadcn/ui
• ♿ Accessible components
• 🎭 Smooth transitions and animations
• 📱 Responsive across all devices
• 🔄 Loading states with skeleton loaders
• 💫 Micro-interactions for better engagement
• 🌙 Dark/Light mode toggle

Create a .env.local file with:

# Sanity
NEXT_PUBLIC_SANITY_PROJECT_ID=your-project-id
NEXT_PUBLIC_SANITY_DATASET=production
# Read Token
SANITY_API_TOKEN=your-sanity-read-token
# Full Access Admin Token
SANITY_API_ADMIN_TOKEN=your-sanity-admin-token

# For Sanity Studio to read
SANITY_STUDIO_PROJECT_ID=your-project-id
SANITY_STUDIO_DATASET=production

# Next.js
NEXT_PUBLIC_BASE_URL=http://localhost:3000

# Stripe
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=your-stripe-publishable-key
STRIPE_SECRET_KEY=your-stripe-secret-key
STRIPE_WEBHOOK_SECRET=your-stripe-webhook-secret

# Clerk
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your-clerk-publishable-key
CLERK_SECRET_KEY=your-clerk-secret-key

# Clone the repository
git clone https://github.com/yourusername/lms-platform

# Install dependencies
npm install

# Start the development server
npm run dev

# In a separate terminal, start Sanity Studio
npm run sanity:dev

1. Create a Sanity account
2. Create a new project
3. Install the Sanity CLI:

   npm install -g @sanity/cli

4. Initialize Sanity in your project:

   sanity init

5. Deploy Sanity Studio:

   sanity deploy

1. Create a Clerk application
2. Configure authentication providers
3. Set up redirect URLs
4. Add environment variables

1. Create a Stripe account
2. Set up webhook endpoints
3. Configure payment settings
4. Set up webhook forwarding for local development:

   stripe listen --forward-to localhost:3000/api/stripe-checkout/webhook

• Courses

  • Title
  • Description
  • Price
  • Image
  • Modules
  • Instructor
  • Category

• Modules

  • Title
  • Lessons
  • Order

• Lessons

  • Title
  • Description
  • Video URL
  • Content (Rich Text)
  • Completion Status

• Students

  • Profile Information
  • Enrolled Courses
  • Progress Data

• Instructors

  • Name
  • Bio
  • Photo
  • Courses

• Course Management System

  • Content creation and organization
  • Module and lesson structuring
  • Rich text editing
  • Media integration

• Progress Tracking

  • Lesson completion
  • Course progress calculation
  • Module progress visualization

• Payment Processing

  • Secure checkout
  • Course enrollment
  • Stripe integration

• User Authentication

  • Clerk authentication
  • Protected routes
  • User roles

1. Access Sanity Studio
2. Create course structure with modules and lessons
3. Add content and media
4. Publish course

1. Browse available courses
2. Purchase and enroll in courses
3. Access course content
4. Track progress through modules
5. Mark lessons as complete
6. View completion certificates

/app                    # Next.js app directory
  /(dashboard)          # Dashboard routes
  /(user)              # User routes
  /api                 # API routes
/components            # React components
/sanity                # Sanity configuration
  /lib                 # Sanity utility functions
  /schemas             # Content schemas
/lib                   # Utility functions

• Next.js 15
• TypeScript
• Sanity CMS
• Stripe Payments
• Clerk Auth
• Tailwind CSS
• Shadcn UI
• Lucide Icons

• Flexible course structure with modules and lessons
• Rich text editor for lesson content
• Support for multiple video providers
• Course pricing and enrollment management

• Progress tracking across all enrolled courses
• Lesson completion status
• Continue where you left off
• Course navigation with sidebar

• URL Video Player
• Loom Embed Support
• Responsive video playback

• Secure Stripe checkout
• Course access management
• Webhook integration
• Payment status tracking

• User registration and login
• Protected course content
• Role-based access control
• Secure session management

• Modern, responsive design
• Loading states and animations
• Progress indicators
• Toast notifications
• Modal dialogs

Built with ❤️ using Next.js, Sanity, Clerk, and Stripe