# Online Payments with Square and React

DevFeed: [Online Payments with Square and React](<https://devfeed.tech/articles/online-payments-with-square-and-react-15789.md>)

Original publisher: [Read original article](<https://developer.squareup.com/blog/online-payments-with-square-and-react>)

Author: Anthony Giuliano

Published: 2022-11-17T05:00:00Z

Content type: tutorial

Language: en

Sources: [Square Corner Blog RSS Feed](<https://devfeed.tech/sources/square-corner-blog-rss-feed.md>)

Topics: [Next.js](<https://devfeed.tech/topics/next-js.md>), [React](<https://devfeed.tech/topics/react.md>), [SDKs](<https://devfeed.tech/topics/sdks.md>), [API](<https://devfeed.tech/topics/api.md>), [Back end](<https://devfeed.tech/topics/backend.md>), [Front end](<https://devfeed.tech/topics/frontend.md>)

Tags: [api](<https://devfeed.tech/tags/api.md>), [apis](<https://devfeed.tech/tags/apis.md>), [back-end](<https://devfeed.tech/tags/back-end.md>), [front-end](<https://devfeed.tech/tags/front-end.md>), [next-js](<https://devfeed.tech/tags/next-js.md>), [payments](<https://devfeed.tech/tags/payments.md>), [react](<https://devfeed.tech/tags/react.md>), [sdk](<https://devfeed.tech/tags/sdk.md>), [tutorial](<https://devfeed.tech/tags/tutorial.md>)

## AI overview

This tutorial explains how to build an end-to-end online payment flow with Square and Next.js. It covers a React payment form, the Square Web Payments SDK, the Square Payments API, and processing on both the front end and back end. The described flow supports credit cards, Google Pay, and Apple Pay.

## Source excerpt

Build an end-to-end payment flow with Square and Next.js.