Just Launch It


Tutorials Stripe Subscriptions

Creating a Stripe Checkout to set up a subscription or one-time payment for your product has never been easier.
In this tutorial, we'll go over the required steps and let the pre-configured webhook in Just Launch It handle the rest.
Stripe integration requires a working database setup as well as a Stripe account.


1. Create your products and prices in your Stripe dashboard via [More +] > Product catalog > [+ Add Product]. You should set a name, a monthly or one-off price and other relevant details for your product.
Go to More -> Product Catalog Click on + Add Product
2. After creating your product, in the [Pricing] section, copy the product price ID (starts with price_) and add it to the /src/lib/just-launch-it.config.ts config file.


 1	/**
 2	 * Stripe related configuration options
 3	 */
 4	stripe: {
 5		enabled: true,
 6		isSubscription: true, // True for recurring type products; false for one-time payment products
 7		pricePeriod: 'month', // If a subscription, the period of the subscription cycle
 8		trialPeriodDays: 14, // Optionally configure a trial period, set to 0 for no trial
 9		products: [
10			{
11				priceId: '[YOUR PRICE ID HERE]',
In the same file, you can also configure names, descriptions, prices, features and other settings to be used in the Just Launch It pricing components.
3. Add a checkout button to let your users purchase your product! Just Launch It comes with pre-configured components to make this a breeze, or you can create a custom component for this.


1<script lang="ts">
2	// ...
3	import Pricing from '$lib/sections/pricing.svelte';
4	// ...
7<!-- ... -->
8<Pricing />
9<!-- ... -->
4. After checkout, users are redirected to your /dashboard page. Stripe webhooks are automatically setup and configured to work, but you can add your custom logic in /src/routes/webhooks/stripe/+server.ts. You could include custom logic to send abandoned cart emails etc.
5. Just Launch It automatically handles subscription access which you can use to control access to paid features of your product. For your convenience, any routes created under the /src/routes/(authenticated)/(subscribed) directory are automatically protected by both authentication and active subscription requirements. But you are free to use the hasAccess local variable in any route to check for subscription access.
6. Use the <ManageBilling /> component to let your users manage their subscription and billing details.