Installation

There are more than one way to integrate the plugin, the simplest is by using the setup script, as shown in the Quick Start guide. The other is by manually installing the web and api side code and adding the integration points. Best for when you don't want your api/src/functions/graphql.js file edited, however you could just temporarily rename the file and run the setup script (much easier).

Preflight

• Stripe CLI for webhook integration
• Stripe API keys nearby

In terminal

yarn add @redwoodjs-stripe/api
yarn add @redwoodjs-stripe/web

Adding Stripe API Keys

Open your .env file in your app root and add your Stripe API keys as below. Make sure that your .env file is being ignored by Git.

STRIPE_SECRET_KEY='sk_...'
STRIPE_PUBLISHABLE_KEY='pk_...'
STRIPE_WEBHOOK_KEY='wk_...'

Importing services and sdl

After installing the plugin you would need to add code to import the services and sdl. In order for your Redwoodjs app to use them they need to be imported and added to your graphQL handler. Below is just the simplest way to add them, but there a few ways depending on what your graphql.js file looks like.

api/src/functions/graphql.js

import { stripeServices, stripeSchemas } from '@redwoodjs-stripe/api'

...

export const handler = createGraphQLHandler({
  loggerConfig: { logger, options: {} },
  directives,
  sdls: { ...sdls, ...stripeSchemas },
  services: { ...services, ...stripeServices },
  onException: () => {
    // Disconnect from your database with an unhandled exception.
    db.$disconnect()
  },
})

Setting up the StripeProvider and user mapping

The plugin uses React's context to keep track of Stripe customers and to manage the plugin cart. To make use of the context you would need to wrap your store's Routes in the . The simplest way is by wrapping the children of a layout.

web/src/layouts/MainLayout

import { StripeProvider } from '@redwoodjs-stripe/web'

...

 return (
    <StripeProvider customer={customer}>
        <Header/>
        {children}
        <Footer />
    </StripeProvider>
  )
}

Once those have been set up all you would need to do would be to use the methods and hooks exported from the plugin. You can find more information on that in the API reference