Dávid Lévai

Build Your Own Subscription-based Course Platform

Stop writing backend boilerplate. See how to build a complete subscription course platform using Supabase, Stripe, and Next.js.

Build Your Own Subscription-based Course Platform
#1about 2 minutes

Introducing the modern stack for a course platform

An overview of the tools used to build the subscription platform, including Supabase, Stripe, Next.js, and GraphCMS.

#2about 1 minute

Using the Vercel subscription payments starter kit

The Next.js starter project from Vercel provides a foundation with Supabase and Stripe already integrated.

#3about 3 minutes

Styling the application with Tailwind CSS and UI

Tailwind CSS is a utility-first framework for styling, while the paid Tailwind UI package provides pre-built components to accelerate development.

#4about 3 minutes

Deploying the platform with Vercel's features

Vercel provides hosting, serverless functions, CI/CD, and preview environments for every pull request.

#5about 17 minutes

Managing users and data with Supabase

Supabase, an open-source Firebase alternative, handles authentication via OAuth and magic links, and uses Postgres with row-level security for data access.

#6about 10 minutes

Handling payments and subscriptions with Stripe

Stripe is used to create products, manage pricing plans, and handle the entire payment lifecycle, from checkout to recurring billing.

#7about 11 minutes

Managing course content with a headless CMS

GraphCMS serves as the headless CMS, allowing for easy schema creation and content management for courses and lessons via a GraphQL API.

#8about 5 minutes

Syncing Stripe products to Supabase with webhooks

Webhooks from Stripe automatically trigger a serverless function to insert or update product and price data in the Supabase database.

#9about 5 minutes

Automating site updates with Vercel deploy hooks

When content is updated in GraphCMS, a Vercel deploy hook or integration can be triggered to automatically rebuild and deploy the static site.

#10about 7 minutes

Demonstrating the complete user subscription journey

A live demonstration shows a new user signing up, being denied access to paid content, subscribing via Stripe, and then successfully viewing the courses.

#11about 4 minutes

Analyzing the cost of running this modern stack

The entire platform can be run for free using the generous free tiers of Supabase, Vercel, and GraphCMS, with Stripe charging only transaction fees.

#12about 12 minutes

Q&A on low-code, production readiness, and career

The speaker answers audience questions about the evolution of low-code tools, production readiness of this stack, and how to keep up with new technologies.

Related jobs
Jobs that call for the skills explored in this talk.

Featured Partners

Related Articles

View all articles
CH
Chris Heilmann
Building a "shoutout" component in plain HTML/CSS/JavaScript
Every Wednesday we meet at noon to talk about a lot of tech news, tools and resources in something we call WeAreDevelopers Live . We go live on YouTube and afterwards we cut out short videos to post on social media. What we needed was an obvious “sho...
Building a "shoutout" component in plain HTML/CSS/JavaScript
S
SciChart
The Fastest JavaScript Charts - Built for React and Beyond
For most developers, browser charting works fine — until it doesn’t. Once you push beyond tens of thousands of points, add live streaming, or need advanced interactions, the story changes: frame drops, frozen dashboards, memory issues. That’s where S...
The Fastest JavaScript Charts - Built for React and Beyond
DC
Daniel Cranney
Security Basics for Vibe Coders
Vibe coding has become a popular trend in the tech world. With so many tools now available for both developers and non-developers, it’s easier than ever to build projects using natural language, in some cases without touching a line of code along the...
Security Basics for Vibe Coders

From learning to earning

Jobs that call for the skills explored in this talk.

Full-Stack Developer

Full-Stack Developer

BrainRocket Limited
Municipality of Valencia, Spain

React
Python
Node.js
Next.js
Prometheus
+2
Full Stack Developer

Full Stack Developer

STEM Learning Ltd.
York, United Kingdom

42-50K
API
MySQL
React
Next.js
+3