Skip to content

Stripe

  • in Stripe
  • 2 min read

Stripe Fireship Demo

Pricing Options

  • Freemium
  • Free Trial
  • One-Time Payment
  • Tiered Subscriptions
  • Seat-Based Pricing (charge per user)
  • Metered Billing

Freemium

Free tier + Premium

Some features are free, but you need to purchase to use the full premium experience.

Tiered

Based on things like number of users, or limited number of items etc.

  • Beginner
  • Professional
  • Enterprise

Metered

Tokens, credits.

Charge based on usage, i.e. AWS.

Creating a hono app

npm create hono@latest stripe-hono

You can then chose from different tempate options like aws-lambda, cloudflare-workers, node.js, next.js.

To run the project run

npm run dev

Installing Stripe

To install stripe sdk

npm install stripe

Also install dotenv to use an env file

npm install dotenv

Using Checkout

Create a post request that will use the stripe sdk and pass the price id of the product you created

app.post('/checkout', async (c) => {


  try {
    const session = await stripe.checkout.sessions.create({
      payment_method_types: ['card'],
      line_items: [
        {
          price: 'price_', // get this from the product you created in stripe
          quantity: 1,
        },
      ],
      mode: 'payment',
      success_url: 'http://localhost:3000/success',
      cancel_url: 'http://localhost:3000/cancel',
    });

    return c.json(session);
  } catch (error: any) {
    console.error(error);
    throw new HTTPException(500, { message: error?.message });
  }
});

You can then see that actual payment in the transactions menu.

Webhooks

This is when stripe communicates with your server.

Events include

  • completed
  • expired
  • canceled
  • created
  • delayed
  • subscription updated
  • subscription deleted

In order to test web hook calls from Stripe, we need to install the Stripe CLI.

stripe login

stripe listen -e checkout.session.completed --forward-to http://localhost:3000/webhook 

stripe listen -e checkout.session.completed --forward-to http://localhost:9095/api/webhook

stripe listen -e customer.subscription.updated --forward-to http://localhost:9095/api/webhook

Creating a next.js app

npx create-next-app app-name

# optional styling libraries
npm i -D @tailwindcss/typography daisyui

# install Stripe
npm i stripe @stripe/stripe-js

# serve the site
npm run dev

stripe is used on the backend, stripe-js is used on the front end. Both will be used in next.js.

When using the next application, use the following command to forward webhooks to it.

stripe listen -e customer.subscription.updated,customer.subscription.deleted,checkout.session.completed --forward-to http://localhost:3000/api/webhook

Minimum data to store in the database for a user

  • user_id
  • stripe_customer_id
  • subscription_id
  • plan_active
  • plan_expires

Fireship io uses "send grid" to send an email when a payment goes through.