PayPal Integration with ReactJS - React Tutorial
HTML-код
- Опубликовано: 10 сен 2024
- In this video, I show you guys how to integrate the PayPal online payment system into a react application. If you have any doubts, please leave a comment below.
Github Repo: github.com/mac...
Please leave a comment on what topic you guys want me to cover next!
SUBSCRIBE!
Social
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Website: machadopedro.com
Twitter: / machadop1407
Instagram: / _pedro.machado_
Github: github.com/mac...
Email: machadop1407@gmail.com
I was given a take home project by my employer to build an ecommerce website that will integrate Paypal as payment. I searched it on RUclips and Pedro came up. Wow. You definitely got all I need man.
Hahaha thank you! Glad I was able to help!
its a great video but it got error it shows "Indicate whether a cookie is intended to be set in a cross-site context by specifying its SameSite attribute"......can anyone tell how to fix it
I need to implement the PayPal API. I google that shit. And what do I see? My boy Pedro got me covered
Cara, vc solta conteúdo que nem curso pago tem! Seu canal está me ajudando muito muito obrigado
Kkkkkk muito obrigado mano! Fico feliz! Estou preparando um curso pago em react pro futuro, mas meu foco é no conteúdo gratis no youtube mesmo!
@@PedroTechnologies Compro fácil
A fellow Canadian developer! Amazing work man!
Thank you so much. I tried to do it, but I get the bug. The paypal button show twice when I put it to my project. Can you help me to fix it???
Thanks
heh bro you got your word to say in the web dev world. Whenever I'm stuck pedroTech got a solution for me. I'm still at the beginning of my journey but I believe I will make it. Thanks, Man and keep up the good work.
Tx for your videos.
I open your git project, I install (npm install) I run the view but after I click on "checkout" button I receive this error:
TypeError: Cannot read property 'Buttons' of undefined
(anonymous function)
src/components/PayPal.js:7
4 | const paypal = useRef();
5 |
6 | useEffect(() => {
> 7 | window.paypal
| ^ 8 | .Buttons({
9 | createOrder: (data, actions, err) => {
10 | return actions.order.create({
Then I install (npm install @paypal/react-paypal-js) but the problem still there, you know what's the prob?
I have the same problem, were you able to solve it?
Since there's no server-side validation in this tutorial, can't the client just change the value they want to pay?
Thank you so much Pedro that worked like a charm! Fantastic video! :)
I am happy I could help!
I dont have any index.html file
You put your client ID in index.html. Is it safe? Anyone can get your client ID by inspecting the code.
Fantastic. You made it very easy to implement. Thannks
I love it, man. Thanks for the video!
Thank u bro! I appreciate it!
I'm getting an error. The transaction is successful & the seller receives the money. But there is no deduction of money in the buyer's account. I have captured the actions.order but still no changes in buyer's money. Any suggestion is appreciated.
Thank you PedroTech. It's awesome video to me!!
Glad I could Help!
Thanks, Pedro!! Awersome tutorial!
thanks! at last, I could integrate PayPal into my website
Thank you for this video, I just subscribed!
Thank you for subscribing! Glad you liked the video!
thank you, really good work, I really appreciate
Glad you liked it!
you're the man👍
Thank you. Very clear!
Sir I have written same code & it's working but the mode of payment is only by debit card or credit card not paypal balance,, what to do ??
For some reason, if I put the currency in the script tag, it won't work. Everything else is great.
Thank you for the explanation!
Glad you liked it!
Great video. Definitely going to try this today.
great video! However, the balance is not updating on my end for some reason on the buyer side. I logged in from the merchant and it's updated there but on the buyer side, it's not being deducted but can see the transaction being done :3 if anyone can shed some light on as to why this may be happening would really appreciate it.
Thank you so much bro.
Thanks you so much, greetings from ecuador.
This is so fantastic , thanks man ,,,,,,,
can you create another video showing How To Integrate Payfast in ReactJS.
Your welcome! I can definitely check it out and see if I can make a video about it!
@@PedroTechnologies thanks in advance Pedro
Hello it works very well , the problem i have 2 buttons.
How do we secure the client ID, I can see PayPal saying can’t see a secure payment process
Nice explanation tq so much!!
Welcome 😊
Great! Thanks!!
thanks bro, It was really helpful.
How do i get the user id of the payee upon redirecting to success page? I’m planning to create an admin dashboard where i can keep track of them
This was really useful!
Thank you! This is how you do it with real paypal accounts hahaha If I were to actually use my account and make it actually work it would take me some time because I would have to get permission.
This is super great, thank you
Looked like the pyramid of doom to me at first
Muito bom Pedro. Excelente conteudo, parabens pelo trabalho
Solta um video sobre Stripe tambem brother ;)
Obrigado, penso em fazer um sobre stripe! Vou adicionar na lista!
Can anyone tell me how can I just get rid of the Pay with credit card button or if not how to just add information from database to card popup oninit.
Sensacional!! Muito obrigado por compartilhar, me ajudou muuuuito!
can anyone tell me what would i exactly need to change if im going for real paypal account. What changes do i need to make if i have already implemented the code in the video.
The Paypal documentation has a simple explanation on the transition between development and production. The code would be basically the same, but you would have to work around security and link some information. You should checkout the official paypal doc with react
I really appreciate you sir
thanks for awesome info
No problem!
Super Easy ! :) Thank You ! :)
Nice short video explaining the basic implementation. Any chance you know how to render only the basic paypal button and not the pay later or credit/debit buttons?
Thank you! If I recall you can just set their display to none using css.
@@PedroTechnologies .paypal-button-row.paypal-button-number-1 {
display: none;
}
Great video! thanks
Glad you liked it!
I love your videos! You should do a basics how to code
Thank You! I am thinking of doing a few different series, this could be one.
But does the amount being sent to the business account? Or your original account?
it works!!! thats good!
Hello bro, it is a nice a video and I u are very good teacher.
But i wanna ask u question:
if i have 2 subscription on my site (persnal, and multi)
- Personal: work for one month
- Multi: work for one year
-----------------------------------------------------------------------------------------------
and i have the database on firebase, all my users infromation + subscription information, so i wanna save the information of payment in firebase,
how can i connect the payment when done to firebase, then after one month trun off the subscription (or after one year).
So with this simple tutorial I can get real payments from customers?
Good Job, lad!
Thank you!
Hi! Great tutorial. Just one question: How can you show the description property inside the modal, so the user knows not only the money it's gonna cost, but also information about items to be purchased. Do you know is it possible to show? I only could see the description information in the async promise...
Again, tank you Pedro!
Can you make a video on to switch this from sandbox to live so people can send real money
Great video, can you also create a video for apypal subscription with 7 days trail...?
Thank you for your sharing. may I know vs theme u used in this video?
rifado amigo que buen tutorial
Gracias
How to check whom to pay.
Great Video! Can you cover testing this Paypal API with Cypress?
I don't have much experience testing with Cypress, but it is definitely something I can learn!
@@PedroTechnologies I'm just learning too. It's pretty awesome. This video saved me so much time by the way THANK YOU!
Sir how can we do paypal onboarding process in mern?
Thanks bro.
Glas you liked it!
excellent video
Thank you!
Do a Stripe credit card tutorial as well please :D
I'm using WooCommerce for the back-end, so I guess iwll need to do an extra step but hopefully will manage to figure out how to go about doing this.
I can make a video about it! Stripe has a very good API so I can definitely explain it!
Hey Awesome Video! Just Subscribed! Also, could you please tell how to redirect the user to some success route on successful transaction??
Thank you! Just posted a video on redirecting: ruclips.net/video/tiAlSpyWIDs/видео.html
@@PedroTechnologies BROOO You are amazing!!
Capo!! Muchas gracias!!!
thank you!
amazing video bro
Glad you liked it
hey, great video thank you, one question, i need to add multiple buttons in my web, how can i do that?
And how to add styling in paypalbtn?
Cool man!
Thankss!
Perfect video. What is the production version of that script tag in index.html?
For production you would have to create an Application with paypal, and test some transactions through their api. Then finally you would need to submit ur application to review.
Thanks for the tutorial. It's was helpful !
But how to you send data to your PayPal Button Component ? Just to not put a fixed price, or a fixed description ?
I think that probably you can use document.getElementById method
use a valiable name inside curly brackets instead of a string
Can you make apple pay integration with stripe? checkout
Hey, I can make one! I love the stripe api!
Sir,❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️ plz make express.js complete advanced tutorials. There is no at RUclips. Plz tutorials.
You mean like a series building an advanced Node/Express project?
Yes, in series first tuotorials and then project
Interesting! I am thinking of maybe making a series explaining more complex topics behind a Node/Express application. For example, how to implement design patterns / architectures like MVC and SOLID. Or making videos about how to do specific things with express, like uploading images / files, handling errors correctly, authenticating with JWT's. What do you think?
thanks for this, great stuff - could you do one with apple pay through stripe please (react/gatsby)
I never used apple pay, but I love the Stripe API so I can make a video about it!
@@PedroTechnologies me neither tbh, was hoping I’d learn from you :)
In my startup we will eventually implement such integrations and I will end up learning. I will post a video about it!
@@PedroTechnologies look forward to it bro :)
Wow Pedro is there anything you dont know how to do??? Hahaha can you make a video explaining how do you learn this stuff??
Hahahaha Thank you bro! Everything I learned has been by wanting to make something and searching how to do it. In this case, I wanted to integrate both stripe and paypal for a project and I researched how to do it! I can definitely make a video on how to always find new things to learn!
@@PedroTechnologies is Really awesome. I will wait for that video "How to always find new things to learn !"
Now how do I make it give me a dm on discord or my email the name and email and the products they have paid for?