I'm mobile dev trying to learn web development and I struggled for so long with Strip checkout. Finally managed to implement it thanks to this video. Awesome content!
Thank you so much for posting this video. I'm using Stripe for the first time in my side project, and it was challenging to implement. But thanks to you, I was able to apply it smoothly.
Thank you so much for this! I am new to NextJS and have been fighting with making this work on my own. Your video was super clear and extremely helpful! Liked and subbed :)
Bro all of ur videos are so helpful and easy to understand.I can even watch them in 2x . PLEASE make more videos on Next js.Thank you for such awesome content and if possible make authentication on next js with mongodb without prisma.
The video is a really good tutorial on how to get involved with stripe. The stripe documentation is not so great, as you pointed out, but watching the video, I can tell you put a lot of time into creating this tutorial. Thanks man.@@brettwestwooddeveloper
Hey, really appreciate the tutorial - got me really far. I called the product object api instead of the price by changing the GET method, but I need a picture, description, title, and price and this data is spread between the product and the price objects. I can find no way to set product. default_price (stripe's docs lead to a nebulous or non-existent endpoint) so it appears I need both objects to display all necessary data in one card on the site. So is there one all-encompassing object that I can get with all data (I can't find one)? Or do I need to call both, in which case I need to link them though the same product does not share an id common to both the product and the price obj. Any help on which direction to go would be much appreciated and thanks again for the concise tutorial.
Very effective content. Please continue this kind of content also I want to know how to build a saas and setup free trail. You can continue this series and effectively see your growth because there are less tutorial about next 13 and app router. So, please create videos like this. Thanks for helping me buddy ❤
I was following along up until the last bit. There's a form that the users fill out which picks the membership type. I was submitting this membership information to a sheets doc, however when I added stripe, it messed up how my data is saved and instead I get 500 internal errors. Any ideas of how I should do this and work with the flow that I want to implement?
Great video. It would be good include Supabase as the backend to sync customer information, subscription type i.e. Free, Premium or Enterprise for recurring subscription
I wondered about something. Do we need to write the api part to bring our data on Stripe? Couldn't we bring our data in the client part? By the way, I can say that it is a great video
You have to manually give it a nickname in your Stripe dashboard. So, if you are getting everything back and the nickname is null then you haven't created a nickname
Bro thanks a lot , just save me with the window.locate.assign() ! I was fighting with the Cors so nice tips thank you really great and helpful content 👌
I have deployed the project on Vercel but when I Checkout to Stripe Payment I got error 405 Method not Allowed can you tell me how can I fix this issue Locally it's wokring fine only issue I got on Live Version.
could be a few things. Did you update the env variables inside of vercel on your project page? Also, did you use the secret key from stripe that is in production and update the URL to the production URL
@@brettwestwooddeveloper Hi, thank you for your response. I've included the Stripe Secret Key, Stripe Publishable Key, and Production URL. Could we connect on another messenger briefly? I could really use your help to resolve this issue. Thanks a lot.
@@brettwestwooddeveloper heeey thanks for the response, I actually figured it out . I placed a web hook on my app and added it to stripe webhooks. They have a easy to use playground and testing environment. Thank you for the response! Your one of few ppl that actually reply to help! Thank you
Why not make use of the app dir and make "Pricing" an RSC fetching the prices server-side. Doing it in an useEffect is highly inefficient, not rendered on the server, no SEO, etc.
Hey, I have a request, make a full stack app project in NextJs 13.3 for people who are coming straight from react and have never learnt Next js 12 (I did isse NextJs 12 but it's redundant now) Because NextJs 13 is so new for us beginners that the only way to learn it properly is to make a project ( a project with lots of api handling and backend stuff that a typical junior react developer will use in a small project in a company) I don't see a lot of people making such projects yet that explain how handling api calls differs from normal React + node/express setup
@@brettwestwooddeveloper thanks a lot, btw I liked your sidebar video, very clear and concise, generally I don't like long videos but that one was very good, and if possible always implement some accessibility features like aria-labels and roles in your components, not too many just the basic ones that will let screen reader users navigate the website
This man single handedly saved Stripe because they're too lazy to update their docs for Next.js 13 ❤
Thank you so much Bobby!
So is Nextjs...
I'm mobile dev trying to learn web development and I struggled for so long with Strip checkout. Finally managed to implement it thanks to this video. Awesome content!
Creating the UI wasnt so important (for me) but you did it boss and I do think it is important for many of us devs. Very useful content thank you.
Thank you Kris for tuning in! Appreciate it!
Thank you so much for posting this video. I'm using Stripe for the first time in my side project, and it was challenging to implement. But thanks to you, I was able to apply it smoothly.
Wow...thanks a lot for this tutorial...by the way tip for nextjs 14 users: use server actions instead of traditional route handlers
Yes correct! Server actions are recommended over API routes.
thanks alot! your video really helped me, Stripe documentation is not the best but you made it easy, thank you keep going!
Glad it helped! Those Stripe docs can be confusing when it comes to Next.js
Amazing videos Brett!
Thank you!
Thank you so much for this! I am new to NextJS and have been fighting with making this work on my own. Your video was super clear and extremely helpful! Liked and subbed :)
Thank you so much! That is awesome you are starting out with Next.js! Great framework to use
Bro all of ur videos are so helpful and easy to understand.I can even watch them in 2x . PLEASE make more videos on Next js.Thank you for such awesome content and if possible make authentication on next js with mongodb without prisma.
Thank you for the kind words, coming out with a fetching data in NextJS 13 video and more
I would like to add 1000 thumbs up. Thank you so much for this tutorial.
No problem! Thanks for tuning into my channel!
Amazing and Very Helpful Video
Thank you!
Thanks you help me a lot, to have an idea about how I implemented, you're really tallent when it comes to teach
Happy to help! And thank you!
I just love how you try to explain everything. You are a great teacher. Liked and subbed
Thank you for the amazing explanation, Brett
No problem you are welcome! Thanks for tuning in!
Great video. I have learnt so much.
I am glad you did!
Dude this was super helpful, thank you so much!
Glad it helped!
Yo you play AOE 4, that's really dope. your desktop app clutter really gave me pause for a sec there tho😅😅. Loving the video so far.
Thanks for tuning in! And yes I do play AOE4, do you? Yea my desktop has been recently cleaned up it was giving me anxiety as well
That was incredibly helpful. Thank you!
I am glad I could help!
Thank you very much! Your video helped me a lot.
No problem! Glad I can help!
thanks bro very informative and straight forward
You are welcome! Thanks for tuning in!
Awesome video.
If you hit Alt+z in vscode, it will wrap the line so you dont have to scroll to the right to see the whole line.
Thank you for tuning in! and yes I don't know why I didn't do that
The video is a really good tutorial on how to get involved with stripe. The stripe documentation is not so great, as you pointed out, but watching the video, I can tell you put a lot of time into creating this tutorial. Thanks man.@@brettwestwooddeveloper
Hey bro. How do you track if a user has paid for a particular product ?
This will be done through Stripe's dashboard. It will show you what they paid for.
Awesome! Thank you
Thank you!
You always have what I'm looking for (:
Please make a video on how to verify stripe payment using session ID
Hey, really appreciate the tutorial - got me really far. I called the product object api instead of the price by changing the GET method, but I need a picture, description, title, and price and this data is spread between the product and the price objects. I can find no way to set product. default_price (stripe's docs lead to a nebulous or non-existent endpoint) so it appears I need both objects to display all necessary data in one card on the site. So is there one all-encompassing object that I can get with all data (I can't find one)? Or do I need to call both, in which case I need to link them though the same product does not share an id common to both the product and the price obj. Any help on which direction to go would be much appreciated and thanks again for the concise tutorial.
Very effective content. Please continue this kind of content also I want to know how to build a saas and setup free trail. You can continue this series and effectively see your growth because there are less tutorial about next 13 and app router. So, please create videos like this. Thanks for helping me buddy ❤
Will do!
Thanks, bro. That's pretty nice
Glad you like it
great video thank you
No problem! Thanks for tuning in!
Thank you for the tutorial. I'm a bit confused about where the money goes after a successful payment.
the money goes in your stripe account and you link a bank a=account to stripe
@@brettwestwooddeveloper Got it, Thank you so much.
Awesomeeee!! Thank you
when I click on the button, the following runtime error is coming:
1 of 1 unhandled error
Next.js (13.4.5) out of date (learn more)
Unhandled Runtime Error
AxiosError: Request failed with status code 500
Call Stack
AxiosError
node_modules\axios\lib\core\AxiosError.js (22:0)
settle
node_modules\axios\lib\core\settle.js (19:0)
onloadend
node_modules\axios\lib\adapters\xhr.js (107:12)
One question: it works on localhost, in production it does not display the "Elements" (form), why?
You are using the Elements from Stripe? and if so make sure you are using the stripe secret and publishable key
I was following along up until the last bit. There's a form that the users fill out which picks the membership type. I was submitting this membership information to a sheets doc, however when I added stripe, it messed up how my data is saved and instead I get 500 internal errors. Any ideas of how I should do this and work with the flow that I want to implement?
Great video. It would be good include Supabase as the backend to sync customer information, subscription type i.e. Free, Premium or Enterprise for recurring subscription
I will definitely look into making that video. Thanks for the idea and support!
tyyy so much , this is so helpful , please we need source code
source code will be updated in description
I wondered about something. Do we need to write the api part to bring our data on Stripe? Couldn't we bring our data in the client part?
By the way, I can say that it is a great video
Thanks for tuning in and yes this needs to be in an API
Hey guys, does it work with a simple "total" / "amount" ? Or I have to create a "product" for every single product from my database ?
How do your secrets remain secret when you deploy this static site to say S3?
you would just store in env file and I know S3 even has further security that I think is a monthly fee
Hey Brett can you do a simple full-stack with auth and ecommerce?
Can i save this all payment data to my database (MongodDB). How?
You would have to console log the the variable and I know you can save some info but not all of it.
Does anyone have a tutorial for doing your own products? kind of stuff on the return_url and its purpose
Thank you
You are welcome!
Both of my products have a name in Stripe (obviously) but the nickname field comes through as null.
Any ideas? TIA
You have to manually give it a nickname in your Stripe dashboard. So, if you are getting everything back and the nickname is null then you haven't created a nickname
@@brettwestwooddeveloper thanks for the reply. How do I do this mate? I can't see the nickname field anywhere in the Stripe dashboard/settings.
Found it. Update price > Advanced > Price Description
Bro thanks a lot , just save me with the window.locate.assign() !
I was fighting with the Cors so nice tips thank you really great and helpful content 👌
no worries! Glad I can help!
I don't understand these tuts... it just goes to the Stripe payment page... you could literally do this with a single link.
I mean you aren't wrong, you can actually just use the link in an anchor tag
Bro thank you for video, If I turn off test mode, I can accept money for real?
I have deployed the project on Vercel but when I Checkout to Stripe Payment I got error 405 Method not Allowed can you tell me how can I fix this issue Locally it's wokring fine only issue I got on Live Version.
could be a few things. Did you update the env variables inside of vercel on your project page? Also, did you use the secret key from stripe that is in production and update the URL to the production URL
@@brettwestwooddeveloper Hi, thank you for your response. I've included the Stripe Secret Key, Stripe Publishable Key, and Production URL. Could we connect on another messenger briefly? I could really use your help to resolve this issue. Thanks a lot.
join my discord and send me friend request
@@SakibAnsari-e3j
im having issues accessing the payment data and assigning it to a db attached to a User OBJ. that then has to check if subscription is activeor not.
Can you send me some of the code so I can try to debug it, I can invite you to a discord server or you can email. Which do you prefer?
@@brettwestwooddeveloper heeey thanks for the response, I actually figured it out . I placed a web hook on my app and added it to stripe webhooks. They have a easy to use playground and testing environment. Thank you for the response! Your one of few ppl that actually reply to help! Thank you
Why not make use of the app dir and make "Pricing" an RSC fetching the prices server-side. Doing it in an useEffect is highly inefficient, not rendered on the server, no SEO, etc.
you are correct it would be more efficient.
Hey, I have a request, make a full stack app project in NextJs 13.3 for people who are coming straight from react and have never learnt Next js 12 (I did isse NextJs 12 but it's redundant now)
Because NextJs 13 is so new for us beginners that the only way to learn it properly is to make a project ( a project with lots of api handling and backend stuff that a typical junior react developer will use in a small project in a company)
I don't see a lot of people making such projects yet that explain how handling api calls differs from normal React + node/express setup
okay will do
@@brettwestwooddeveloper thanks a lot, btw I liked your sidebar video, very clear and concise, generally I don't like long videos but that one was very good, and if possible always implement some accessibility features like aria-labels and roles in your components, not too many just the basic ones that will let screen reader users navigate the website
@@blackpurple9163 I don't have a sidebar video.
@@brettwestwooddeveloper
This one bro
Side navbar
ua-cam.com/video/8s4DK5PkRNQ/v-deo.html
@@brettwestwooddeveloper ua-cam.com/video/8s4DK5PkRNQ/v-deo.html
This
will this be the same for reocurring prices?
just change mode to subscriptions instead of payment. Also, in Stripe dashboard have payment reoccuring
Kindly zoom in while video making
I did, what device are you watching on and what specific part is hard to see?
Just bigger font size
Is it my eyes or the man's page isn't pure white
Might be your screen settings
👋Hey Brett, Wanna play Fortnite sometime? 😅
I'm down
@@brettwestwooddeveloper Do you play on Middle east server or us one?
@@ziacodes US
please focus on the stripe part rather than the styling part next time man!
Time stamps
BROOO ty so much, the window.locate.assign() save my life!
Legend.
Thank you!