How can I successfully create a custom checkout for my headless React shop?

How can I successfully create a custom checkout for my headless React shop?

DaveHappl
Shopify Partner
1 0 0

Hello,

 

I’ve come across a common query without a straightforward answer. I'm working on creating a custom checkout for my headless React shop. I’ve successfully updated the address using updateAddress() from the shopify-buy-js SDK. However, I'm facing challenges beyond this point.

I aim to process payments via Stripe and then forward the orders to Shopify. From my understanding, the current methods to achieve this are:

 

  • Create a public app (which can be accessed by anyone) — but I only wish to sell products from my own shop.
  • Turn it into a sales channel, which I've done.
  • I've set up a demo shop for testing purposes. However, when I try to integrate my app with the demo, it requests a URL specific to my app. What should this URL be?
  • How can I connect my headless React shop to this app, or to my shop directly? Do I need a separate React app for this? If so, what role should my main Shopify app play?
  • I also noticed that the "Request payment processing" option isn't located where the documentation indicates.

 

So, my main questions are:

  • Why do I need to create a Shopify app if I only want to sell through my own shop? What should the actual code of this app accomplish? I just need the ability to retrieve products and create orders via the Shopify API on my headless React app.
  • What should the URL for this app be?

 

For added context, perhaps there's an alternate solution for my goal. We run a platform where a manager can gift employees. The manager should be able to select the employee from a dropdown and order the product without seeing the recipient's address. I'd be content with Shopify's hosted checkout if there's a way to hide the address there.

 

Any guidance would be greatly appreciated!

Thank you!

Replies 0 (0)