gon250 / build-a-saas-with-next-js-supabase-and-stripe

Build a SaaS product using Next.js, Supabase and Stripe

This repo accompanies this free egghead course.

🔍 About

For your frontend, this application will be using Next.js and Tailwind CSS. You will learn how to maneuver around an app and build a strong static pricing page.

For your backend AND authentication, we will make use of Supabase. Supabase is open source and is all of the backend services that you will need to build your site. It includes a dedicated and scalable Postgres database and user management with Row Level Security!

Lastly, for payments, you will be using Stripe. It will be an individual payment checkout system that will create and update users' subscriptions.

Jon will take you through all of this and more in just 1 hour and 10 minutes!

🎓 Instructor

Jon Meyers is a Software Engineer, Educator and Hip Hop Producer from Melbourne, Australia. He's passionate about web development and enabling others to build amazing things!

Jon's courses at egghead.

Enjoyed the course? Follow Jon on Twitter and subscribe to his YouTube channel.

🗺 Table of Contents

1. Create a Supabase Project
2. Create a Table in Supabase
3. Create a Next.js App with Tailwind CSS
4. Query Data From Supabase Using Next.js
5. Use Next.js to Query a Single Record From Supabase
6. Implement Third Party Authentication with GitHub in Next.js Using Supabase
7. Add Relationships Between Tables in Supabase Using Foreign Keys
8. Use Postgres Functions to Implement Database Logic with Supabase
9. Use Supabase to Subscribe to Database Events with Postgres Triggers
10. Create a Stripe Customer with Next.js API Routes
11. Generate a Custom API Key to Secure an API Route in Next.js
12. Automatically Create a Stripe Customer for Each User with Supabase Function Hooks
13. Make User State Globally Accessible in Next.js with React Context and Providers
14. Implement Authorization Using Row Level Security and Policies
15. Implement Gated Content Using Row Level Security with Supabase
16. Use Stripe.js to Query Product Data and Pre-Render with Next.js
17. Create Shared Nav Bar in Next.js with _app.js
18. Query Dynamic Supabase Data in Static Pages Using Next.js
19. Pass Supabase Session Cookie to API Route to Identify User
20. Charge Customer for Stripe Subscription in Next.js
21. Subscribe to Stripe Webhooks Using Next.js API Routes
22. Use the Supabase Service Key to Bypass Row Level Security
23. Create a Client Page that Requires Authentication in Next.js Using getServerSideProps
24. Allow Customer to Manage Their Subscription with Stripe Customer Portal
25. Subscribe the UI to Database Changes with Supabase Real-Time
26. Configure Stripe for Production and Deploy Next.js Application with Vercel