image

Ishaan

Integrate Stripe Payments for Subscription Plans

Stripe must be configured on both frontend and backend files.

For the frontend:

  • frontend/src/config/staging.tsx
  • frontend/src/environments/environment.staging.ts

For the backend:

  • backend/.env


Save the API keys

  1. Go to the Get your test API keys tab.
  2. Copy the Publishable key to the frontend config file.
  3. Save it on stripePublishableKey.
  4. Copy the Secret key to the backend config file.
  5. Save it on PLAN_STRIPE_SECRET_KEY.

By default, Growth and Enterprise as the plan names. Feel free to change those names, add or remove a plan. This will require changing the code.

  • Name
  • Price
  • Recurring
  • Billing Period

Copy the Price Codes and save on the backend environment variables.

PLAN_STRIPE_PRICES_GROWTH = "price_..."

PLAN_STRIPE_PRICES_ENTERPRISE = "price_..."

Enable the Customer Portal

Go to Settings > Billing > Customer Portal.Enable the functionalities you want on the customer portal.Read more about the customer portal here: https://stripe.com/docs/billing/subscriptions/customer-portal


Create a Webhook

The webhook is responsible for notifying the application when the plans' subscriptions have changed.Go to Developers > Webhooks > Add Endpoint. The backend URL must have this format: https://your_backend_url/api/plan/stripe/webhookEvents you need to capture are:

  • checkout.session.completed
  • customer.subscription.updated
  • customer.subscription.deleted

Now, update the PLAN_STRIPE_WEBHOOK_SIGNIN_SECRET environment variable with the Signing Secret.

Testing the webhooks on localhost

To test the webhooks on localhost, please follow this tutorial:

https://stripe.com/docs/webhooks/test


image

Ishaan

Architect
ishaan@fabbuilder.com

I love finding patterns and concluding insights out of it. After working as Employee, a Consultant, a Freelancer I figured out mostly we start our project or a module or microservice either by copying an existing code or base repositories from GitHub lets say. And then spend a lot of time on customising it, analysing pitfalls, making it work so that I can start wrinting business logic for the work. So, I started POC-ing FAB Builder so that I get a trailered project targetted to my requirements and on which I can start wrinting business logic within few mins. This makes my life easy and my clients get a better quality products which are easy to modify and easy to maintain.