TALL Stack integration with Stripe

1. Introduction

Stripe is a powerful payment gateway that facilitates secure online payments for both subscription-based services and one-time transactions. In the context of your platform, Stripe can be used by both freelancers and clients to handle payments for different services, whether that’s a recurring subscription fee or a one-time payment for specific projects.

Key Concepts:

The product can be used by multiple model entities at the same time. For testing purpuses we created 2 entity models : Freelancer & Client.

1. Subscription Payments: Regular, recurring payments made by clients for ongoing access to a freelancer’s services, or for subscription-based features within the platform.

Both clients and freelancers can choose subscription plans that are renewed automatically each month. We use webhooks to catch when the customer was charged and the automatically extend the subscription plan.

The chose subscription plan can be canceled at any moment by a customer. With will mean that until the end of the billing circle, the subscription will be active, but after it will reset to default free version.

2. One-Time Payments: Single payments made by clients for individual project-based transactions or for a one-off service rendered by a freelancer.

2. Stripe configuration

In order to setup Stripe you will need to first create an account with Stripe.

Second you will need to create the products. Here there are multiple ways you can set it up, we for this Implementation we created 2 products. One for Subscription prices nad one for one time payments.

And for each product we can define how many prices we want.

In our case for subscription we have 2 prices Subscription:

And 2 prices for the One-Time product:

Next step is to define Stripe keys into your .envfile

Stripe public & secret keys

These are needed in order to initiate transactions with Stripe.

STRIPE_PUBLIC_KEY=pk_*************
STRIPE_PRIVATE_KEY=sk_*************
            

Stripe products price ID's

These are the prices that you will use when you charge your customers for subscriptions or for one-time payment.

STRIPE_SUBSCRIPTION_PRICE_ID_FOR_BUSINESS_PLAN=price_*************
STRIPE_SUBSCRIPTION_PRICE_ID_FOR_PROFESSIONAL_PLAN=price_*************
STRIPE_ONE_TIME_PRICE_ID_FOR_BUSINESS_PLAN=price_*************
STRIPE_ONE_TIME_PRICE_ID_FOR_PROFESSIONAL_PLAN=price_*************
            

Webhook

Since we are using webhook to track the transactions. Firs you will need to define a Webhook in your Stripe account. There you will need to define the API where you will listen for the events trigered by Stripe. In our example I will use the one for this implementation:

Webhook URL

https://stripe.larascripts.io/api/stripe-webhook
            

Webhook secret

STRIPE_WEBHOOK_SECRET=whsec_*************
            

3. Subscription plans

We defined the prices component where we are defined bot subscription and one time payment products.

Each price is loaded from Stripe, so in case you update the product price on Stripe will be automatically updated on your website also.

Subscription plans preview

One-Time plans preview

IMPORTANT! In order to test you will need to be logged in

In that direction we already created 2 accounts:

Freelancer

 freelancer@larascripts.io
 stripe
            

Client

 client@larascripts.io
 stripe
            

IMPORTANT! If you want to have a clean test, you can create your own freelancer and/or client accounts from our admin.

After login you will be able to choose a plan.

4. Payment

Here you can find testing credit cards.

First, when we want to upgrade a plan we need to pay with a new credit card. Also you have the option to save credit card for later payments

In case you saved some of your credit cards, you can use them for fast payment. You also have the ability to remove them or set witch one will be the default one for future payments.

Once that the payment is processed we update the plan and show the time until is valid.

For Monthly based plans, we have the option so that the customer can cancel the subscription.

If the customer decide to Cancel his subscription plan, that will mean that the plan will be active until the end of the month, and after will be revoked

For Yearly (one-time) based plans, we have the option so that the customer can cancel the subscription. Witch means that the plan will be active until the end of the month, and after will be revoked

5. Admin

In order to manage the subscription plans you will need to login as an admin. You can do that by using the following credentials:

 admin@larascripts.io
 stripe
            

For the admin we used Filament. Here you can manage the freelancers and clients, see created subscriptions and track the transactions.

Manage clients

You are able to see all the clients and also to reset the subscription plan, so you can re-test multiple scenarios.

You also are able to create new clients, so you can fully test the integration.

Manage freelancers

You are able to see all the freelancers and also to reset the subscription plan, so you can re-test multiple scenarios.

You also are able to create new freelancers, so you can fully test the integration.

Manage subscriptions

You are able to see all the created subscriptions.

Manage Stripe transactions

You are able to see all the stripe transactions.