https://github.com/northdevelopers/north-react-browser-post-api-without-shopping-cart
This repo includes the front-end code for a JavaScript application that uses the React framework to embed a payment solution with North's Browser Post API.
https://github.com/northdevelopers/north-react-browser-post-api-without-shopping-cart
checkout-form checkout-page ecommerce ecommerce-api ecommerce-application ecommerce-website front-end javascript javascript-ecommerce payment payment-api payment-gateway payment-service payments react reactjs
Last synced: 7 months ago
JSON representation
This repo includes the front-end code for a JavaScript application that uses the React framework to embed a payment solution with North's Browser Post API.
- Host: GitHub
- URL: https://github.com/northdevelopers/north-react-browser-post-api-without-shopping-cart
- Owner: NorthDevelopers
- Created: 2023-06-15T18:19:59.000Z (almost 3 years ago)
- Default Branch: main
- Last Pushed: 2024-12-13T22:50:08.000Z (over 1 year ago)
- Last Synced: 2024-12-13T23:26:18.347Z (over 1 year ago)
- Topics: checkout-form, checkout-page, ecommerce, ecommerce-api, ecommerce-application, ecommerce-website, front-end, javascript, javascript-ecommerce, payment, payment-api, payment-gateway, payment-service, payments, react, reactjs
- Language: CSS
- Homepage: https://developer.north.com/blog/embedded-payments-react-app
- Size: 1.12 MB
- Stars: 4
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Securely Embed Payments in a ReactJS App
This is a JavaScript application that uses the React framework and Node.js to demonstrate an embedded payment solution with [North's Browser Post API](https://developer.north.com/products/online/browser-post). The code in this repository handles the front-end payment process and adds a simple payment form to a website. The code that handles back-end part of the payment process is located in a [separate repository](https://github.com/NorthDevelopers/North-Node-Browser-Post-API), allowing each to be deployed separately. This application does not include a shopping cart, making it a great fit for businesses that sell one item per transaction, such as utility services or other professional services.
For a React ecommerce application with a shopping cart that allows customers to purchase multiple items at once, head over to [this repository](https://github.com/NorthDevelopers/North-React-Browser-Post-API-With-Shopping-Cart) and follow along with [this tutorial](https://developer.north.com/blog/embedded-payments-react-app-shopping-cart).
## Get Sandbox Credentials
To get started, create a free [North Developer Portal account](https://developer.north.com/register). This will allow you to get the sandbox credentials that are required to test the app. Log in to your account to view the official [Browser Post API Integration Guide](https://developer.north.com/products/online/browser-post/integration-guide), then [contact](https://developer.north.com/contact) North's Sales Engineering team to get sandbox credentials added to your Developer Portal account.
## Follow Along with the Tutorial
When you're ready to start building your app, you can follow along with [this tutorial](https://developer.north.com/blog/embedded-payments-react-app) for step-by-step instructions.
## Completed App
Your completed ecommerce app will look similar to the following:

Click the "View Details" button to open a product page:

Click the "Purchase Now" button to open a new tab with a checkout form where customers can enter their payment information and submit an order:
