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

Primary LanguageJavaScript

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

Course artwork

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