Integrate Stripe payment processing into a React-Rails project
Note: There are many, many ways to use the Stripe API. This way is simply one I found to be relatively straightforward.
- React
- Ruby on Rails
- Dotenv
- React-stripe-checkout
We are dealing with both API Keys and payment processing, so it is very important we keep safety in mind while working with Stripe. To do this be sure to remember three things:
- Make sure your Stripe account is in Test mode (it comes in test mode by default), and you are using the Test API keys.
- Make sure your API keys are properly hidden
- Never use real CC information while testing
- Create Stripe Account, set up environment variables
- Integrate Checkout in front-end, pass token to back-end
- Set up controller in back-end to handle token and create Charge
- Check stripe account for activity
Feel free to clone the starter repos and follow along:
- Front-end: https://github.com/shanelonergan/front-end-stripe-workshop
- Back-end: https://github.com/shanelonergan/back-end-stripe-workshop
- Set up dotenv
- Install
react-stripe-checkout
- Add
<StripeCheckout />
component - Create
onToken
function
- Add gems (dotenv and stripe)
- Set up dotenv
- Create charge controller
- Don't forget to add the route!
- Bonus: error handling