Stripe Payment Integration - React and Node.js E-Commerce
Vložit
- čas přidán 9. 07. 2024
- In this video I will show you how to integrate stripe payment system using React and Node.js in a step by step manner. Enjoy!
Starter Files and Source Codes: chaoocharles.dev/source-codes...
Stripe Checkout Documentation: stripe.com/docs/payments/acce...
Complete Shopping Cart with Auth: • Complete Shopping Cart...
✨ Join My Discord Server
/ discord
Donate 🤑
📍Donate with PayPal: www.paypal.com/cgi-bin/webscr...
Sections:
00:00 - app demo
06:08 - starter files
09:32 - stripe docs
12:14 - Node.js stripe api endpoint
20:39 - React Pay Button
36:08 - Charging the Cart Items
41:47 - Collecting Shipping Information
SUPPORT MY CHANNEL
📍SUBSCRIBE: / @chaoocharles
📍Become a Channel Member: / @chaoocharles
📍Join My Fun Channel: / @chaaoo
GET IN TOUCH:
📍 Twitter: / chaoocharles
Disclaimer: This video is not sponsored - Věda a technologie
There are some issues with including the cartItems at the metadata. For now I recommend that you pass an empty array as cartItems. I am also preparing an admin dashboard video, I will make sure to also update you on everything concerning the cartItems, so that we can include them when creating an order. For now follow everything as it is but let cartItems be just an empty array.
Wowwwww!!! i have been finding this video for stripe from long time ago and finally i got it. love you man appreatiate a lot.
I searched youtube for hours for a beginner-friendly stripe integration.. This is what I wanted. Thank you...
You earned a subscriber...🥂🥂❤❤
Thank you very much for this! Appreciate your effort and this tutorial is amazing and very easy to understand! ❤
Thank you very very much it’s a full and enough stripe tutorial very handy
just enough details, not more not less.. subscribed bro!
Finally 😃 I have been waiting for this!
It's finally here 😄
Hi Chaoo Charles, thank you for your tutorial, your explanation is really good
This is gold, thanks 👍
Awesome tutorial! Thanks
Thanks a lot for this tutorial!
This might be the best Kenyan coding channel that I have come across . Thumbs up 👍
Asanti bro
thanks man, THIS is the PERFECT tutorial for stripe checkout and the BEST I have watched so far. You saved my project. I was using sandbox paypal integration but they have lots of errors. And then I saw this tutorial, it saved my project. Thank you so much. You just earned another subscriber!
🙌 I'm glad it was helpful
Thank you very much for helping me with my e-commerce project
Sos el mejor Chao Saludos desde argentina !
Dude you are awesome!
i cant really appreciate you, you did a great job thank you
Good tutorial 👍,KE all the way 🎉
Thank you so much! Well done!!!
Thank youu!
Thanks a lot Chaoo charles from your African brother, keep it up
Great 😊 Bro!! Keep it up 🙂
You're the best 👌👌
a question in the slices/api file that you have put and what it is for?
great work
Awesome job explaining is good 👍
Hey, thank youu 🤝
Thank you so much, this helped only !
You're welcome 😊
@@ChaooCharles Can i contact you privately i need some help with stripe and orders
@@KristijanStosic a bit busy at the moment, but I'm on twitter @chaoocharles
Awesome tutorial, I am having an issue, Once I go to checkout and back without paying its not showing any transactions with incomplete? is that a new feature? or any error
Only showing the succeededs
Everything made perfect sense! Do you know how I should upload my project to cPanel? Having a NodeJS Backend and a react frontend makes it kinda hard. Any help is appreciated thx!
Sir I am using real cards in test more . What error message should it show.
very good!
Thank you sir
Thank you
Hey man, there is a problem when I save order into DB while I use mongoDB product to make order,
when I make order it dose not store the image and id of the product into mongoDB,
could you please help me
tks so much
Such a great job you did here..how about other payment gateway since I am unable to use stripe at the moment in Nigeria and secondly how can I arrange my products in categories and display them on their individual components... Thank you once more and God bless you
I got this problem could someone help me please?
Uncaught TypeError: Cannot read properties of undefined (reading '_id')
hey bro please help me .. when we click on checkout automatic total is coming.. but I want to add extra 3.70$ in subtotal how can I add that. 3.70 is a service charge
Thanks
I also want the order details to be stored in mongodb after payment is completed successfully how do i do that?
Hi My images are not showing in the checkoutpage
Good stuff
thanks
stripe checkout form not showing should i install to react ‘stripe.js’
Great works
Thaanks 🤝
Subscribed
How to apply api call on add to cart button ?
Please make video
Lots of love ❤️ from Nigeria 🇳🇬 @charles 🇰🇪
@@onigbindedavid6630 ❤️❤️
@ChaooCharles please I have a question on this, how can we send the receipt of order created to the customer ??? Immediately the payment is successful or failed
Via email
Brother, I am using the same project, but for some reason the images are not showing up on the stripe payment screen, I tried to log the images content, but i was getting 'undefined'. Please look into this request. Thank you
Did you ever find a solution?
metadata string length for customer is 500 at max.
what is best way to keep cart data other than metadata when cart items are larger than expected ?
For now pass an empty array, I found out that we can get the cartItems from line Items. I'm preparing another video where I will update everything to avoid these errors. But meanwhile you can check this article stripe.com/docs/api/checkout/sessions/line_items
@@ChaooCharles Thanks man, appreciate it. Looking forward to your next video.
@@aponsaha5957 okay, but might take a while coz I'm also covering the admin dashboard
Bro, there's something wrong with the sound in the video, I can't hear any sound from the right side of the headset.
super super
HI its happy to learn from this vedio butt there is one big issue for me . after the session has been created and it redirect the user to payment page and at the same time i want to save oorder in mongo db after paymentt successful ,now suppose our session in created and order is daved in db and user in redirected to session url and if user click on back buttom our payment is cancled and user is redirected automatically to cabcel page and notice one thing our oder is saved in db and payment is not completed yet ,i just want to create order after payment successfull
Try stripe webhooks, try next part of this video
@@ChaooCharles oky start it now
czcams.com/video/_TVrn-pyTo8/video.html check that link,
I see this vedio butt how /webhook api is called after session payment completed ?
@@AbdulQayyum-qe4qz webhook listens to stripe events, you can make it listen to a successful payment and then create order after that
My right ear is felling so alone
I was thinking my right earbuds has been spoil but not.🤣🤣🤣
I had to see for my self. Damnn 😭
hahahahahaahahh
How I can retrieve the data after payment
Check next video, you can use webhooks
I have watched and implemented basically all your build
Is it possible i have your contact details in other to reach out when i have a problem with my personal build..this will mean alot🙏
Client url ?
Can you share your vscode theme?
moonlight II
do mpesa intergration pls
No github code
thanks my nigga, I appreciate your work
Lame
I thought my headphones aren't working after checking out I found out that you has a problem in the sound , man fix your audio I almost messed my headphones cuz of this video
is the payment real or dummy
This is on test mode, so it's dummy
Confused... How many people have been successful by following this video? even the source code has much more than that to make this work...😕
you provide code of something else
There's no voice
Voice is there. Check your settings!
Expecting login using instragram ,facebook and gmail tutorial
Coming soon!