Fastest way to build a SaaS in 2024 - Next.js, Supabase & Stripe

แชร์
ฝัง
  • เผยแพร่เมื่อ 30 ก.ค. 2024
  • In this video, Jon Meyers demonstrates how to use Vercel's Subscription Payments Template [1] to bootstrap a Software as a Service product, deployed to production, that can take very real payments!
    ▶ Get started with Supabase: supabase.com/?...
    [1] github.com/vercel/nextjs-subs...
    Next.js is one of the most popular modern web frameworks that allows for client and server logic to be interwoven seamlessly. Supabase is a collection of open source tools that wrap around a PostgreSQL database. The `@supabase/ssr` package is the layer that glues these technologies together, configuring cookie-based auth so the user and their session are available throughout the entire Next.js stack.
    00:00 The fastest way to build a SaaS product
    00:18 Deploying template with Vercel
    01:40 Setting Environment Variables
    04:28 Creating subscription tiers
    06:27 Configure OAuth with GItHub
    09:54 Setup Stripe Customer Portal
    12:05 Activate Stripe Account
    Build SaaS apps and start making real money in 2024 with our latest video. We're showing you the fastest way to build a SaaS product using Vercel's subscription starter, Supabase for backend magic, and Stripe to handle those all-important payments. This isn't just about getting set up; it's about getting your SaaS out there and starting to see the cash flow in.
    What you will learn:
    ✅ Fork and Deploy: Kick things off by forking the Stripe subscription starter to your GitHub. It's the first step to getting your SaaS off the ground.
    ✅ Supabase Integration: Add the Supabase integration to your project, a crucial move for managing your backend and getting your product ready for use.
    ✅ Stripe Setup: Get your Stripe account up and running. We'll go through activating your account and setting up those key API keys, so you're ready to take payments.
    After this video you will be able to:
    ✅ Launch Your SaaS: With your Vercel project deployed, your Supabase backend sorted, and Stripe ready to process payments, you'll be set to launch your SaaS product.
    ✅ Handle Real Payments: With Stripe activated, you're all set to handle real transactions. Say hello to earning from your SaaS product thanks to Supabse integration!
    ✅ Manage Subscriptions: Dive into Stripe's dashboard using Supabase for the backend to create and manage subscription tiers, giving your users options and boosting your revenue potential.
    💻 Videos to watch next:
    ▶ Fastest way to host a Postgres database: • FASTEST way to host a ...
    ▶ Fastest way to get started with Next.js and Supabase: • FASTEST way to get sta...
    ▶ 10 new Supabase features you need to start using: • 10 new Supabase featur...
    👇 Learn more about Supabase 👇
    🕸 Website: supabase.com/
    🏁 Get started: app.supabase.com/
    📄 Docs: supabase.com/docs
    🔔 Subscribe for more tutorials and feature updates from Supabase: / @supabase
    📱 Connect with Us:
    ▶ GitHub: www.github.com/supabase/supab...
    ▶ Discord: www.discord.supabase.com/
    ▶ Twitter: / supabase
    ▶ Instagram (follow for memes): / supabasecom
    ABOUT SUPABASE:
    Supabase is the open source Firebase alternative. Supabase provides a full Postgres database for every project with pgvector, backups, realtime, and more. Add and manage email and password, passwordless, OAuth, and mobile logins to your project through a suite of identity providers and APIs.
    Build in a weekend, scale to millions.
    #Supabase #AppDevelopment #RealtimeApps #DeveloperTools
  • วิทยาศาสตร์และเทคโนโลยี

ความคิดเห็น • 67

  • @Supabase
    @Supabase  5 หลายเดือนก่อน +4

    If you're looking for how to build AI (RAG) applications quickly...
    you'll probably want to follow this one: th-cam.com/video/ibzlEQmgPPY/w-d-xo.html

  • @yunyang6267
    @yunyang6267 5 หลายเดือนก่อน +23

    "I am gonna show you Fastest Possible way to build a Saas product and start making Real money" never expect less from a Supabase intro

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน +4

      When supabase stops being so sensational, my intros will stop being so sensationalised! 😆

  • @wlockuz4467
    @wlockuz4467 4 หลายเดือนก่อน +3

    Straight to the point and a ton of valuable information. Really looking forward to more videos.

  • @mark.raetzel
    @mark.raetzel 5 หลายเดือนก่อน +6

    So good, waiting for the next videos. Thank you guys, great work!

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน

      Next week is Local Dev! 🚀

  • @FlorinPop
    @FlorinPop 5 หลายเดือนก่อน +8

    This is a cool video! Great job Jon!

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน

      Thanks Florin! Glad you enjoyed it! 🙌

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน

      What would you like to see next?

  • @carlosricardoziegler2650
    @carlosricardoziegler2650 5 หลายเดือนก่อน +4

    Amazing and so detailed video :)

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน

      Thanks! Glad you enjoyed it! What would you like to see next?

  • @_taishi
    @_taishi 4 หลายเดือนก่อน +1

    great as always

  • @TheBlackManMythLegend
    @TheBlackManMythLegend 4 หลายเดือนก่อน

    the cleanest of that video is .... damn..... it's try it's the fastest way to build a saas in 2024.. all those steps packed in one video.

  • @akhiladecosta9326
    @akhiladecosta9326 3 หลายเดือนก่อน +3

    Good stuff man! Can you do a tutorial on multi-tenant applications next?

  • @maskman4821
    @maskman4821 4 หลายเดือนก่อน +1

    Awesome ❤

  • @logemann74
    @logemann74 4 หลายเดือนก่อน

    wonder whats the better stripe integration approach. The one outlined in this vid with synced tables via webhooks or with Stripe Postgres Data Wrappers?

  • @MrPvr14
    @MrPvr14 3 หลายเดือนก่อน

    Is anyone else having trouble when installing the template from vercel? I can't get past the add integration with supabase, the modal window that pops up keep loading and does not respond, even though in the background it does create all the supabase services and everything it seems.

  • @harryzachariou1
    @harryzachariou1 2 หลายเดือนก่อน

    Is this using NextJS API routes to handle the webhook events from stripe to sync the prices, products and subscriptions or supabase edge functions?

  • @AlexMilman_googleplus
    @AlexMilman_googleplus หลายเดือนก่อน

    Great video! Thank you. How can I add the product features from stripe to Supabade? What are the required changes to the template?

  • @maxjbre
    @maxjbre 29 วันที่ผ่านมา

    Great video! one question: what do I need to change if I switch to a custom domain instead of the stripe domain?

  • @timothyalcaide
    @timothyalcaide 2 หลายเดือนก่อน

    I don't understand how the postgres database has been synchronized with stripe (prices, subscription, profucts...) how is this done?

  • @geraldaburto7712
    @geraldaburto7712 4 หลายเดือนก่อน

    Do I always need to create a users table in the public schema?

  • @beepdotboop
    @beepdotboop 4 หลายเดือนก่อน +5

    Not sure if something has changed in the last 2 weeks, but the tutorial breaks down after switching over to the live stripe keys, where managing the subscription or going to the customer portal throws an error/toast for new accounts/subscriptions as well as existing accounts that has already subscribed. Updating it to a live webhooks key doesn't work either. I am very new vercel, supabase and general ops stuff, but I'll try to debug and will report back if there's a solution.

    • @DaytonRumbold
      @DaytonRumbold 19 วันที่ผ่านมา

      I'm having the same thing. Did you figure it out?

  • @avi_mukesh
    @avi_mukesh 3 หลายเดือนก่อน +1

    Step 2 in the deployment template doesn't work for me it bugs out and doesn't seed the database

  • @luizvictoriobaptistaneto1561
    @luizvictoriobaptistaneto1561 22 วันที่ผ่านมา

    Hey guys, I am having a super high webhook error rate (can be seen on the stripe dashboard under developers -> webhooks). Is this normal?

  • @init_bobjames
    @init_bobjames 3 หลายเดือนก่อน

    not bad Supabase, not bad 👏👏

  • @andrewajoe
    @andrewajoe 2 หลายเดือนก่อน

    Used this starter last year was pretty buggy. Maybe need to try a fresh start and port some stuff over

  • @dishanhewage
    @dishanhewage 4 หลายเดือนก่อน +1

    I love Supabase. I just started using Supabase Auth for my new project with Next.js. I'm just wondering why there are so many auth requests in the Supabase Dashboard - more than 3k auth requests (/auth/v1/user, /rest/v1, /rest/v1/health) for just a single user within 3-4 hours. Is that normal or am I doing something wrong? I'm using Next.js Middleware according to the Supabase documentation.

    • @nicolasramos7084
      @nicolasramos7084 4 หลายเดือนก่อน

      I noticed the same thing on a test project of mine. Have you found out if there was something wrong?

    • @neon-gi5tb
      @neon-gi5tb 3 หลายเดือนก่อน

      Same thing happened for me, I ended up running it locally to avoid that.

  • @voidigitaldownload
    @voidigitaldownload 4 หลายเดือนก่อน +1

    How about paddle or Lemonquezzy? Stripe is not available in my country

    • @neon-gi5tb
      @neon-gi5tb 3 หลายเดือนก่อน

      Yeah, it would be great to have that.

  • @fullstackwebdev2996
    @fullstackwebdev2996 4 หลายเดือนก่อน

    I have surround sound I kept thinking some squirel was in the attic.

  • @carlosricardoziegler2650
    @carlosricardoziegler2650 5 หลายเดือนก่อน +3

    What about role based permissions. ? SOme video about that will be awesome

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน +3

      Thor is working on exactly this! Coming soon!

  • @kamil_supabase_enjoyer
    @kamil_supabase_enjoyer 5 หลายเดือนก่อน +2

    ❤❤❤

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน

      Glad you enjoyed it! 🙌

  • @eleah2665
    @eleah2665 5 หลายเดือนก่อน +1

    Hi Jon. I need some very real payments. Thanks!

    • @dreamsachiever212
      @dreamsachiever212 5 หลายเดือนก่อน +1

      lol

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน

      That’s the only missing piece - actually getting the very real payments! 😆

  • @selambengp
    @selambengp 5 หลายเดือนก่อน +2

    Please and please make a React-only version. I am trying to build my SaaS but don't want to use Next. I want to focus solely on SPA.

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน

      Will add it to the list! 🙌

    • @didiercatz
      @didiercatz 5 หลายเดือนก่อน +1

      You will likely need a secure backend for this, though

  • @azoozym
    @azoozym 4 หลายเดือนก่อน

    Good!
    But what about other gateways? Because Stripe is not available in my country

  • @kasper369
    @kasper369 5 หลายเดือนก่อน +2

    What if we don't have stripe in our country,

    • @meowmesh
      @meowmesh 5 หลายเดือนก่อน +1

      Which country?

    • @selambengp
      @selambengp 5 หลายเดือนก่อน

      @@meowmeshTurkey😂

    • @dreamsachiever212
      @dreamsachiever212 5 หลายเดือนก่อน +1

      well you have to find a way to get it lol. you can consider Stripe Atlas to incorporate your business in the US or do it yourself using registered agents

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน

      PayPal is sometimes another good option 👍

  • @DaytonRumbold
    @DaytonRumbold 19 วันที่ผ่านมา

    @supabase Hi! Thanks for the tutorial! It works well except for going live. Is anyone else having this issue?

  • @wlockuz4467
    @wlockuz4467 4 หลายเดือนก่อน

    Now just need a tutorial on business ideas 🤣

  • @ia.mtzrmz
    @ia.mtzrmz 5 หลายเดือนก่อน +1

    Please use another Frameworks to do this kind of videos, NuxtJs for example,

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน +2

      Am working on some Nuxt content atm! Coming soon!

  • @geraldaburto7712
    @geraldaburto7712 4 หลายเดือนก่อน

    How can I add a free plan?

    • @hikionori
      @hikionori 4 หลายเดือนก่อน

      Just default value

  • @yarapolana
    @yarapolana 5 หลายเดือนก่อน

    😢 We don’t have Stripe in Iceland.

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน

      Is PayPal an option?

    • @yarapolana
      @yarapolana 5 หลายเดือนก่อน +1

      Yes it is, Braintree to be specific.

  • @OmarAfet
    @OmarAfet 5 หลายเดือนก่อน +2

    Speedy and valuable! But stripe don't support saudi arabia 😢

    • @JonMeyers
      @JonMeyers 5 หลายเดือนก่อน

      Damn! Maybe PayPal is an option?

    • @azoozym
      @azoozym 4 หลายเดือนก่อน

      ​@@JonMeyersDoes Paypal has extension in Supabase and provide Subscriptions?

  • @JustBrowsing2021
    @JustBrowsing2021 4 หลายเดือนก่อน +1

    This is not even close to being the fastest as it introduces database sync for the data that is already available in Stripe. Talk about over engineering just to promote Supabase.
    Code can be simplified and still utilize Supabase which is a great product. With the presented architecture there is always a chance that Stripe data and Supabase data (that syncs stripe data) will be out of sync. This will happen and it will cause you incredible headaches. Get the data directly from Stripe which should be the only source of truth.

    • @MylesChatman
      @MylesChatman 3 หลายเดือนก่อน

      Agreed. Not having Stripe as a source of truth caused many headaches for my team. My company synced Stripe data into MongoDB and it was difficult to maintain. It took us about a year to fully migrate to just using Stripe and has been so much easier to manage.

  • @moritz8618
    @moritz8618 4 หลายเดือนก่อน

    hi

  • @mikeyoung3519
    @mikeyoung3519 2 หลายเดือนก่อน

    This explains how to set up a template but doesn't actually teach you anything about how to implement this in your own project. Pretty bad.