Take your first payment

You can sell things from an app you made this afternoon. Subscriptions, single orders, a bag with three things in it, paid on a phone. This post is the whole path, start to finish, so that when you press the first button you already know where the last one is.

It goes in this order: make your app, connect a test Stripe account, rehearse with play money until the app feels right, then switch it to live. Most of it happens at your own pace. Two steps wait on someone else, and they're marked below so you can plan around them.

Want a hand the first time? The guided shopping cart walks you through every step below, with your own products.

Three pieces

Here is the whole idea, and it's the only theory in this post.

Your app keeps the record. Stripe takes the card. Your Stripe account holds the money.

Your app lists what you sell and keeps track of every order. When a buyer presses Pay, Stripe's own checkout page opens in a new tab, and that's where the card number goes, along with Apple Pay and Google Pay where the buyer's device supports them. The card never touches your app. When the buyer comes back, your app asks Stripe whether the payment went through, and only Stripe's answer marks the order paid.

The money is yours, all of it. Every payment goes straight into your Stripe account, and Vibes DIY takes no cut. We work with the payment provider you may already use rather than standing between you and your buyers; today that's Stripe. Stripe's own fees apply as usual, and your Stripe dashboard shows them.

Your Stripe account comes in two copies. Test is play money: the card 4242 4242 4242 4242 pays, and nothing real moves. Live is real money. Every app starts on test, and you move each one to live on its own, when it's ready.

1. Make your app

Sign in to Vibes DIY and describe your shop. This sentence works for almost any small business, and you can use it as is:

Make an online shop for my business where customers can subscribe to a monthly plan or buy single items at checkout. I add my products and set their prices myself, and I can see every order and every subscriber.

Swap in what you actually sell — coffee, bread, flowers, lessons — or leave it general and fill in the details next.

Your app comes with a Products screen (and Plans, for subscriptions) that only you see. It starts empty: list what you sell, set each price, and change it next week if you like. Checkout always charges the price on your list, a new price applies to the next purchase, and subscribers keep the price they joined at.

Your app also gets a Setup entry that only you see, listing what's left before it can take money. Right now that's Connect Stripe, plus one Stripe page to save if you sell subscriptions. Until then, your visitors see a calm "not open yet" on the buttons, and the rest of the app works as usual.

2. Connect a test Stripe account

The Setup screen links you to your app's Settings tab. Under Payments, check the Country next to the Connect Stripe button — it's where your business is based — then press it.

From here Stripe walks you through its own pages. If you're new to Stripe, you create a login there. If you already sell on Stripe, sign in as usual: Stripe adds a separate account for your Vibes DIY apps under the same login, right beside the one you have, and leaves your shop's account exactly as it was.

Come back to your app and the Pay buttons work, in test mode, with no reload. You connect once; the same Stripe account serves every app you make.

For subscriptions there's one more stop. Your subscribers cancel or change their card on a Stripe page called the Customer portal. Open its settings from the Setup screen; under Cancellations, turn on Cancel subscriptions, choose At end of billing period, and press Save. The Setup screen checks it off the moment you save.

3. Rehearse with play money

Now buy something from yourself. Press Pay, and on Stripe's page use 4242 4242 4242 4242, any future date, any three digits. Come back, and the order is in your list as paid.

A few rehearsals worth doing:

• Close Stripe's tab before it sends you back. The order still shows as paid a few minutes later, because your app checks with Stripe on its own schedule too.
• Hand your phone to a friend. Everyone who opens a test-mode app sees a Test mode badge beside the Pay button, so it's clear the money is pretend.
• Change a price on the Products screen, and watch the next checkout use it.

Take as long as you like here. Test mode is the whole flow, end to end, with play money.

4. Go live

When the app feels right, it's time for real money. This happens in two presses, and the first one is where Stripe gets to know you.

Go live with Stripe, under Payments on the Settings tab, opens Stripe's live setup. Stripe asks for the things any payment company needs: details about your business, who you are, and a bank account for your payouts. You do this once, and it covers every app you make.

Take live payments in this app, on each app's Setup screen, then switches that one app to live. Your other apps keep taking test payments until you switch them too. Test orders stay in the app as rehearsals; live buyers start fresh.

For a subscription shop, make the same Customer portal choices once more in live mode and press Save. The Setup screen links that page too.

Where it waits

Almost every step above happens as fast as you click. Two belong to Stripe and your bank, and it helps to know they're coming:

• Stripe checks who you are before your first live payment. How long that takes varies. If Stripe asks for a photo of your ID or a document, it can take a few days, and your app starts taking live payments as soon as Stripe says your account is ready.
• Your first payout takes a week or two. After your first real payment, Stripe typically schedules the first payout to complete within 7 to 14 days, depending on your country, industry and risk level, and sometimes it takes longer. After that, money arrives on a regular schedule, and your bank may take a little extra time.

So if you're opening on a set date, start Stripe's live setup well ahead of it, and check that live payments are ready before the day.

Prompt it fresh, then remix

The quickest way to your own shop is your own sentence. Start from the one in step 1, or one of these:

• A site to sell my bread, with a weekly subscription and single loaves at checkout.
• Sell $15 tickets to our chili cook-off, 80 seats, with a count of seats left.
• A members page for my book club, $5 a month, that unlocks the reading notes.

Would you rather be walked through it? Add a shopping cart to your site asks what you sell and builds a shopping cart page from your answers. It keeps the steps beside it while you connect Stripe in test mode and make your first test sale, and the products you listed stay on it for real buyers. It finishes with a QR code to see it on your phone, the go-live steps, and a link you can put in your site's header as Shop. Once Stripe is connected, the next cart is quick: one for each product line, look or audience.

The full guide to payments, including memberships, tickets and a restaurant check a whole table can split, is Take payments. Works with Stripe has the short version.