--- title: "Discussion on \"Set Up Subscription Payments With Stripe using Firebase and Next.JS\" | Hashnode" description: "Discussion on \"Set Up Subscription Payments With Stripe using Firebase and Next.JS\". Learn How To Implement Subscription Payments Using Next.JS, Firebase, and Stripe, With The Run Subscription Payments With Stripe Firebase Extension." url: "https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f" --- [Feed](https://hashnode.com/feed) / Discussion # [Set Up Subscription Payments With Stripe using Firebase and Next.JS](https://blog.jarrodwatts.com/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs?utm_source=hashnode&utm_medium=feed) Learn How To Implement Subscription Payments Using Next.JS, Firebase, and Stripe, With The Run Subscription Payments With Stripe Firebase Extension. Jul 13, 2021 · 18 min read · blog.jarrodwatts.com Updated Jul 16, 2021 Read the article - [#stripe](https://hashnode.com/tag/stripe) - [#nextjs](https://hashnode.com/tag/nextjs) - [#firebase](https://hashnode.com/tag/firebase) ## Written by [Jarrod Watts](https://hashnode.com/@JarrodWatts) @JarrodWatts · Sydney, Australia [View profile](https://hashnode.com/@JarrodWatts) Developer Relations Engineer @ Polygon Labs A software engineer turned developer relations engineer in the web3 space, from Australia 🇦🇺. ## Responses 7 Markdown supported · ⌘↵ to post [Josef](https://hashnode.com/@sebastiank) [Mar 9, 2023](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/6409a7f66b5ccef6ff20f191) Hi! This article seems great! I have a client side rendered react site att the moment and would like to add auth and subscriptions like this. Do I need to upgrade my project to Next.js? If so, why? Thank you. [Andres Moreno](https://hashnode.com/@andriusmv) [May 3, 2022](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/6271a97fd64dcf11c4fb5f04) "Plans" seems deprecated now (2022) -in Stripe's Restricted API Key ressources- and you should use "Prices" instead (see docs). Thanks a lot for this article. Spot-on! 😀 [Stefán Örn Hrafnsson](https://hashnode.com/@StefanOrn) [Jan 19, 2022](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/61e8172d0204273bdcb11827) Awesome post, gr8 job. but as I am going through it need to use these imports in firebaseClient.tsx to be more compatible with v9 ``` import firebase from 'firebase/compat/app'; import 'firebase/compat/auth'; import 'firebase/compat/firestore'; ``` [Maurizio Calarese](https://hashnode.com/@mcalarese) [Dec 28, 2021](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/61ca6b208787d923bc6634f1) Hi Jarrod, thanks for your post, it was very useful :) [Loïc B](https://hashnode.com/@lbar) [Aug 17, 2021](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/611b88f2ac5c985f3643b85c) Hi, Congrats, your work is great! If you have some time, I have a question : how is managed the unsubscribing of the premium user? For example, if its credit card expires, next payment will be rejected. How your application will be notified and the role attribute "premium" will be removed for the user? Thanks [Jarrod Watts](https://hashnode.com/@JarrodWatts) [Aug 19, 2021](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/611b88f2ac5c985f3643b85c#reply-611da742f86ef222fad178bd) To be completely honest I am not 100% sure how this is handled. I am hoping that this is handled by Stripe behind the scenes - I will let you know if I find out! [Kano](https://hashnode.com/@kano0403) [Oct 30, 2022](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/611b88f2ac5c985f3643b85c#reply-635e085479c5fd3f72f400aa) The cloud functions that add the claim also remove it using the `customer.subscription.updated` event. I just did some experimenting to make sure I understood everything correctly, and that is what I found. Also, if you do a refund make sure to cancel the subscription also, that way it doesn't charge again and they do not keep access (unless you want that of course). [kailoon](https://hashnode.com/@kailoon) [Aug 13, 2021](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/6115f6e1e249483e1210ff56) Thanks for the tutorial! I am trying to build a simple SaaS product with NextJs as well. I wasn't sure how to structure my data using firebase as it is different compare to traditional table db. Can I pick your mind on this? It is a restaurant menu app, paid user can create merchant, merchant has many categories, categories have many items. The key is to allow paid user to easily manage their shop inventory. Normal user able to leave a review for the restaurant or fav a dish and show in their profile page. How should I go with that? Thanks! [Jarrod Watts](https://hashnode.com/@JarrodWatts) [Aug 14, 2021](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/6115f6e1e249483e1210ff56#reply-61170cfae9f08a51fd85ef53) Hey there! Sounds like an interesting project, for this kind of structure I'd probably recommend having a database for users, and a database for items. Items could have a category field and a merchant field, then you could filter items by merchant and by category when you want to query them. I'd also recommend watching some of Firebase's videos about structuring the database as they really helped me. [youtube.com/watch](https://www.youtube.com/watch?v=haMOUb3KVSo) [Jarrod Watts](https://hashnode.com/@JarrodWatts) [Aug 14, 2021](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/6115f6e1e249483e1210ff56#reply-61170d0cf6ebde51f64f9bd1) [Jarrod Watts](https://hashnode.com/@JarrodWatts) And by "database" i mean top-level collections. [Paul Oloyede](https://hashnode.com/@paulayo) [Aug 10, 2021](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/6112891cc0623972de8a5fbc) Awesome post! [Jarrod Watts](https://hashnode.com/@JarrodWatts) [Aug 14, 2021](https://hashnode.com/posts/set-up-subscription-payments-with-stripe-using-firebase-and-nextjs/60ed3a16573c235ee63a235f/comment/6112891cc0623972de8a5fbc#reply-61170d1ee9f08a51fd85ef5e) Thanks Paul! Glad you enjoyed it :)