react-paypal-smart-button

A simple paypal button, easy and quick to set up.

Usage no npm install needed!

<script type="module">
  import reactPaypalSmartButton from 'https://cdn.skypack.dev/react-paypal-smart-button';
</script>

README

Paypal Smart Button

Sometimes you just want a react component to be simple and work straight away. No Config and only a handful of required props.

This is a PayPal smart button that just works.

Setup

  1. The Hard Bit - if you have not already done so, follow PayPal's instructions to get your Client ID

  2. In your CLI and once navigated to your React JS project, install with the following command:

npm i react-paypal-smart-button
  1. Implement in your app, as per the following example:
import PayPalButton from 'react-paypal-smart-button'

function App() {
  return (
      <PayPalButton 
        price={100}
        description="YOUR_PRODUCT_DESCRIPTION"
        clientId="YOUR_PAYPAL_APP_CLIENT_ID"
        currency="USD"
        paySubmit={() => handlePaypalSuccess()}
       />
  );
}

export default App;

The props are of the following types:

price: number,
description: string,
clientId: string,
currency: string  || this is a three digit currency code e.g. 'EUR', 'GBP' or 'USD'
paySubmit: function || this function will be called following successful payment transaction in your application. Handle the successful transaction however you like.

Dependencies

None, just use it in your react project.

Support My Work

If you find this component useful or like my work, why not buy me a coffee! - Click Here

That's it!