Demo Application
Let's learn how to integrate Wise Payouts APIs in a simple React application coupled with the Express backend.
We'll cover the following
This lesson walks us through a simple web application that shows the functionality of Wise Payouts APIs. We used the React library for the client-side implementation and Express.js to make API calls to the Wise server. We'll use the endpoints related to the following operations in the application:
Getting the balance of our account
Listing all recipients
Adding a new recipient
Sending money
Listing current exchange rates for the GBP
Tip: Since it's a demo application, some values and fields may be hardcoded.
Application workflow
Click the “Run” button in the widget below to run the application. Once the application has started, click the URL against “Your app can be found at:” to view the application.
The "Home" page shows the balance in four different currencies and the menu buttons "Recipients," "Add Recipient," "Send Money," and "Exchange Rates." Clicking them will take us to the relevant component.
Note: We use a custom hook,
useFetch
, defined inuseFetch.js
, to fetch the data from any API endpoint. Besides, we have some utility functions to makePOST
requests.
Get hands-on with 1400+ tech skills courses.