Waypoint is a Next.js template for a multi-instructor course platform. Learners get a lesson player with an AI tutor that answers from the lesson they have open. Teachers get a course studio that drafts an outline, splits a recording into lessons and writes quiz questions for them to rewrite. It is built for developers and studios shipping an e-learning site, an LMS front end or a course marketplace for a client.

Every control on the demo works from state in the browser: filters filter, the player seeks, notes save, checkout validates, certificates download. There is no backend to set up.

Pages

• Home: search, subjects, the tutor and the studio shown working, a path planner, instructors, pricing and FAQ.
• Course catalogue: filters in seven groups, sort, search with suggestions, grid and list views, compare, recently viewed and an empty state.
• Course page: a syllabus that opens before purchase, free preview lessons, a rating breakdown, the instructor, related courses and a buy card that follows the scroll.
• Lesson player: a scrubber and playback speeds, a contents list that ticks off, a transcript that seeks on click, notes stamped to the second, a quiz marked on the spot and the AI tutor panel.
• Learning paths: five courses toward a job, with prerequisites and a slider for hours a week that moves the finish date.
• Instructor directory and profiles: filters by field and verification; career, courses, reviews and upcoming cohorts.
• Teach: the revenue split, three steps, an earnings calculator and an application form.
• Course studio: an outline drafted from one line, a recording split into lessons, generated quiz questions to approve, revenue by course and drafts.
• Learner dashboard: courses under way, the learning path, certificates to download or share, and saved courses.
• Pricing: three plans, a monthly and yearly toggle, a full comparison, team seats and pricing FAQ.
• Checkout: three steps with real validation, a promo code, an order summary and a success screen.
• About, Contact with live desk hours and an office map, Sign in with a three-step password reset, Sign up in three steps, and a 404.

Built in

• 36 courses, 15 instructors and 4 learning paths of mock data, all in TypeScript arrays a page reads from.
• Saved courses, progress, notes and path choices kept in the browser and shared across tabs.
• Course comparison, recently viewed, follow an instructor, cohort waitlist.
• Earnings calculator, plan picker, hours-a-week planner.
• Downloadable certificates with share links.
• Responsive from 320px to wide desktop.
• SEO: per-route titles and link previews, a sitemap, robots and JSON-LD.

Stack

• Next.js 16.3 (App Router) and React 19.2
• Tailwind CSS 4.3 and shadcn/ui on Base UI
• TypeScript
• HugeIcons and Heroicons

Not included

• No backend, database or payment processing. The forms validate and do not send, and the AI tutor and studio answer from prepared demo data.
• Photography is loaded from Unsplash and Lummi for the demo and is not part of the download.
• The heading font, Cabinet Grotesk, is free but cannot be redistributed. One command, npm run fonts, downloads it from Fontshare.