DEV Community 👩‍💻👨‍💻

Cover image for Implementing Paypal checkout with React - Part 1
Wing Tong
Wing Tong

Posted on

Implementing Paypal checkout with React - Part 1

When we are building an e-commerce project, Paypal is one of the most common ways to handle payment. It is easy and straightforward to apply it to your react project. Let's take a closer look at it. 💰👀

Step 1) Create your sandbox accounts

To communicate with the Paypal API, we have to create or log in to your Paypal account in the developer application.

In the Account on the left menu, they provide two default sandbox accounts for you. One is a Business sandbox account, the other is a Personal sandbox account. We can use these two accounts to login and pay during the development.
Alt Text

Step 2) Create a new Paypal app

Next, we have to create a new app. Click on the My apps & credentials and create a new app.
Alt Text
We will then receive a Client ID after creating the new app. Replace your Client ID with the script below and place it inside the index.html of the public file of the react app.

Alt Text

<script src="https://www.paypal.com/sdk/js?client-id=YOUR_CLIENT_ID&currency=INR"></script>
Enter fullscreen mode Exit fullscreen mode



All the settings are done with the Paypal developer site and our react app! Let's go back to our react app and start building the Paypal component in the next part. 😏

Top comments (1)

Collapse
bertheyman profile image
Bert Heyman

Is part 2 on the way?

🌚 Turn on dark mode

🔠 Change your default font

📚 Adjust your experience level to see more relevant content

 

Head to your account's Settings to do all this and more.