How to implement Google Pay in React app

#GooglePayInReact #GooglePayWithReact
In this video you'll learn How to implement Google Pay in React app. Google Pay is a fast, safe and secure payment system.
Here is the following link for the npm package which has used in this app:
www.npmjs.com/package/@google...
Please note that only live Credit can be used to test Google Pay implementation as Google Pay api doesn't allow to test with sample Credit card details.
Here is the following github repo link of the source code for the React app used in this video demo:
github.com/festackcode/google...
I have also implemented Google Pay in Angular and Vue app you may also check that video link below:
Angular:
• How to implement Googl...
Vue:
• How to implement Googl...
Here's Google pay api url for your reference:
developers.google.com/pay/api...
If you have liked this video then please don't forget to like, share and subscribe. Please let me know you opinion or suggestions by commenting below it motivates me to keep contributing to the dev community.

[@easywebdev10]

Video was very useful. THANK YOU SO MUCH BUDDY ❤️❤️❤️❤️

[@FeStack]

Thanks I am glad that it helped you.

[@balajmen468]

Thanks man it was so helpful 😊

[@FeStack]

I am glad that it helped you.

[@mohd.yasnnn]

Thank you very much .This video is really helpful.keep going and make new things.

[@FeStack]

You are most welcome. I am glad that it helped you.

[@poomathikumar5776]

Bro, what is the function call in google pay API that tells when a transaction is completed and its successful ( in order to redirect customer to a success page)

[@anassikder1356]

How can I check the payments from Google pay merchant portal for this test payment ?

[@anton-haskevych]

Thank you!!!

[@FeStack]

You're welcome!

[@markyt4960]

I have the value of total price in a variable , now how can I give the value of that variable to the total price ?

[@DaniyalAshraf-i9v]

Can I Use Google Pay with react stripe in react js web application?

[@girishsaundarkar7543]

can you tell how to setup the the gateway

[@segundojaramilloromero9909]

Thank you very much for the video, in the testing environment you can see the fictitious movements or how can you test before going to production?

[@FeStack]

You may follow the official documentation provided in the description of this video. I believe you can still test it with some real credit card. It won't be charged.

[@nehat786]

Brother documentation is quite complicated please help us to configure only the UPI part as most of the user use google pay UPI to make payment. And in you video you use usd and stuff please let us know how to integrate for India. One more thing in test the response token we get after making payment. What to do with that token and how would we know the payment provid? Please don’t tell ,d to follow documentation as it’s damn complicated 🙏

[@vufyczugxkhxickvcigc]

where you use google pay upi

[@rajendradass1280]

** I Support you Google

[@user-wz2vj9mw1k]

How to get google transaction id. Help me please

[@edgarmenesesbarragan4156]

What's up, Google pay charges 30% commission on all purchases that users make? When you upload the app in Play Store

[@saberific23]

Thanks, man! This is really helpful. Followed it and was able to replicate it in a test environment. I am curious aside from the production access what else do I need to complete the transaction and the money credited to a bank account?

[@FeStack]

Glad it helped! For production you may follow GooglePay documentation mentioned in the description of this video.

[@segundojaramilloromero9909]

How do you do the tests in the test environment, is it possible to show the test transactions in the payment gateway?

[@rajendradass1280]

**"OK"

[@mohammadzakaria7962]

I wonder which font are you using? It looks nice.

[@FeStack]

Thanks for your comment. It's Operator Mono. You may follow this tutorial to get this font: kzbin.info/www/bejne/qaKbeqaCh66ah9E

[@guttimallikarjuna9491]

I add visa card but it is disabled and getting Not available for in-app purchase

[@FeStack]

Please follow the documentation mentioned in the description.

[@danishali_official]

thats very informative (y) can you please tell me where can we create merchant id

[@FeStack]

Thanks for your comment and I am glad that you liked it. You may follow below links of Google Pay API documentation: For Merchant Info: developers.google.com/pay/api/web/reference/request-objects#MerchantInfo For Supported Payment Gateways: developers.google.com/pay/api#participating-processors

[@asyncxeno]

I have a question. Can't the end user just mess with the front-end code and change the price so that they have to pay less?

[@FeStack]

It is a compiled code that browser loads. It is impossible to do.

[@sainipunit]

😂😂😂😂

[@sreekarrthikeyan_mahadevan]

Please update a video for implementing in WEBSITE

[@FeStack]

Thanks for your suggestion. But if you follow the documentation of the Google Pay following this video then implementing on the website won't be that difficult.

[@parth-darji]

Is this package available for expo?

[@FeStack]

If you are talking expo.io then it is just like a platform to build apps for mobile and web. Under the hood you can use this package with reactjs. I hope you answered your query.

[@olasalha]

how to find out gateway name and merchant id ?

[@FeStack]

Please follow the official document of GooglePay mentioned in the video description.

[@soulking6982]

NOice Video BRo It really help full Bro Do u have Answer for this Problem =Unable to download payment manifest " im getting this in console

[@FeStack]

Please follow the GooglePay documentation mentioned in the description of this video.

[@soulking6982]

@@FeStack Sorry Bro Something wrong with my code I fix it now BTW thanks for ur concern

[@shivangthacker152]

does Google take any charge on this?

[@FeStack]

Google doesn't charge unless it is in production. For more information please follow the official documentation of GooglePay.

[@sugarjohnny6621]

Hello, thanks for the tutorial. It is very helpful. I have a question on the token data (kzbin.info/www/bejne/d5utfH2vhpVka8U) , it has token:string and type: string, and you have mentioned that will sent to backend. How do you use this confirm the transaction in the backend? In paypal, the when the payment is authorized, a unique orderId will be generated and that id is used to capture or complete the transaction. In google pay response, I do not see such unique id. Any idea? Thanks.