stripe-payments

Name: stripe-payments
Author: jezweb

937stars96forks

How to install stripe-payments?

jezweb/claude-skills/stripe-payments

$npx -y skills add jezweb/claude-skills --skill stripe-payments

Installs into the current project.

Summary

Add Stripe payments to a web app — Checkout Sessions, Payment Intents, subscriptions, webhooks, customer portal, and pricing pages. Covers the decision of which Stripe API to use, produces working integration code, and handles webhook verification. No MCP server needed — uses Str

Files · 1

View on GitHub

SKILL.md

1	# Stripe Payments
2
3	Add Stripe payments to a web app. Covers the common patterns — one-time payments, subscriptions, webhooks, customer portal — with working code. No MCP server needed.
4
5	## Which Stripe API Do I Need?
6
7	\| You want to... \| Use \| Complexity \|
8	\|----------------\|-----\|-----------\|
9	\| Accept a one-time payment \| Checkout Sessions \| Low — Stripe hosts the payment page \|
10	\| Embed a payment form in your UI \| Payment Element + Payment Intents \| Medium — you build the form, Stripe handles the card \|
11	\| Recurring billing / subscriptions \| Checkout Sessions (subscription mode) \| Low-Medium \|
12	\| Save a card for later \| Setup Intents \| Low \|
13	\| Marketplace / platform payments \| Stripe Connect \| High \|
14	\| Let customers manage billing \| Customer Portal \| Low — Stripe hosts it \|
15
16	Default recommendation: Start with Checkout Sessions. It's the fastest path to accepting money. You can always add embedded forms later.
17
18	## Setup
19
20	### Install
21
22	```bash
23	npm install stripe @stripe/stripe-js
24	```
25
26	### API Keys
27
28	```bash
29	# Get keys from: https://dashboard.stripe.com/apikeys
30	# Test keys start with sk_test_ and pk_test_
31	# Live keys start with sk_live_ and pk_live_
32
33	# For Cloudflare Workers — store as secrets:
34	npx wrangler secret put STRIPE_SECRET_KEY
35	npx wrangler secret put STRIPE_WEBHOOK_SECRET
36
37	# For local dev — .dev.vars:
38	STRIPE_SECRET_KEY=sk_test_...
39	STRIPE_WEBHOOK_SECRET=whsec_...
40	STRIPE_PUBLISHABLE_KEY=pk_test_...
41	```
42
43	### Server-Side Client
44
45	```typescript
46	import Stripe from 'stripe';
47
48	// Cloudflare Workers
49	const stripe = new Stripe(c.env.STRIPE_SECRET_KEY);
50
51	// Node.js
52	const stripe = new Stripe(process.env.STRIPE_SECRET_KEY!);
53	```
54
55	## One-Time Payment (Checkout Sessions)
56
57	The fastest way to accept payment. Stripe hosts the entire checkout page.
58
59	### Create a Checkout Session (Server)
60
61	```typescript
62	app.post('/api/checkout', async (c) => {
63	const { priceId, successUrl, cancelUrl } = await c.req.json();
64
65	const session = await stripe.checkout.sessions.create({
66	mode: 'payment',
67	line_items: [{ price: priceId, quantity: 1 }],
68	success_url: successUrl \|\| `${new URL(c.req.url).origin}/success?session_id={CHECKOUT_SESSION_ID}`,
69	cancel_url: cancelUrl \|\| `${new URL(c.req.url).origin}/pricing`,
70	});
71
72	return c.json({ url: session.url });
73	});
74	```
75
76	### Redirect to Checkout (Client)
77
78	```typescript
79	async function handleCheckout(priceId: string) {
80	const res = await fetch('/api/checkout', {
81	method: 'POST',
82	headers: { 'Content-Type': 'application/json' },
83	body: JSON.stringify({ priceId }),
84	});
85	const { url } = await res.json();
86	window.location.href = url;
87	}
88	```
89
90	### Create Products and Prices
91
92	```bash
93	# Via Stripe CLI (recommended for setup)
94	stripe products create --name="Pro Plan" --description="Full access"
95	stripe prices create --product=prod_XXX --unit-amount=2900 --currency=aud --recurring[interval]=month
96
97	# Or via Dashboard: https://dashboard.stripe.com/products
98	```
99
100	Hardcode price IDs in your code (they don't change):
101	```typescript
102	const PRICES = {
103	pro_monthly: 'price_1234567890',
104	pro_yearly: 'price_0987654321',
105	} as const;
106	```
107
108	## Subscriptions
109
110	Same as one-time but with `mode: 'subscription'`:
111
112	```typescript
113	const session = await stripe.checkout.sessions.create({
114	mode: 'subscription',
115	line_items: [{ price: PRICES.pro_monthly, quantity: 1 }],
116	success_url: `${origin}/dashboard?session_id={CHECKOUT_SESSION_ID}`,
117	cancel_url: `${origin}/pricing`,
118	// Link to existing customer if known:
119	customer: customerId, // or customer_email: 'user@example.com'
120	});
121	```
122
123	### Check Subscription Status
124
125	```typescript
126	async function hasActiveSubscription(customerId: string): Promise<boolean> {
127	const subs = await stripe.subscriptions.list({
128	customer: customerId,
129	status: 'active',
130	limit: 1,
131	});
132	return subs.data.length > 0;
133	}
134	```
135
136	## Webhooks
137
138	Stripe sends events to your server when things happen (payment succeeded, subscription cancelled, etc.). You must verify the webhook signature.
139
140	### Webhook Handler (Cloudflare Workers / Hono)
141
142	```typescript
143	app.post('/api/webhooks/stripe', async (c) => {
144	const body = await c.req.text();
145	const sig = c.req.header('stripe-signature')!;
146
147	let event: Stripe.Event;
148	try {
149	// Use constructEventAsync for Workers (no Node crypto)
150	event = await stripe.webhooks.constructEventAsync(
151	body,
152	sig,
153	c.env.STRIPE_WEBHO

People who liked this also viewed

6 picks

Type

stripe-payments

937stars96forks

View on GitHub

How to install stripe-payments?

jezweb/claude-skills/stripe-payments

$npx -y skills add jezweb/claude-skills --skill stripe-payments

Installs into the current project.

Summary

Files · 1

View on GitHub

SKILL.md

1	# Stripe Payments
2
3	Add Stripe payments to a web app. Covers the common patterns — one-time payments, subscriptions, webhooks, customer portal — with working code. No MCP server needed.
4
5	## Which Stripe API Do I Need?
6
7	\| You want to... \| Use \| Complexity \|
8	\|----------------\|-----\|-----------\|
9	\| Accept a one-time payment \| Checkout Sessions \| Low — Stripe hosts the payment page \|
10	\| Embed a payment form in your UI \| Payment Element + Payment Intents \| Medium — you build the form, Stripe handles the card \|
11	\| Recurring billing / subscriptions \| Checkout Sessions (subscription mode) \| Low-Medium \|
12	\| Save a card for later \| Setup Intents \| Low \|
13	\| Marketplace / platform payments \| Stripe Connect \| High \|
14	\| Let customers manage billing \| Customer Portal \| Low — Stripe hosts it \|
15
16	Default recommendation: Start with Checkout Sessions. It's the fastest path to accepting money. You can always add embedded forms later.
17
18	## Setup
19
20	### Install
21
22	```bash
23	npm install stripe @stripe/stripe-js
24	```
25
26	### API Keys
27
28	```bash
29	# Get keys from: https://dashboard.stripe.com/apikeys
30	# Test keys start with sk_test_ and pk_test_
31	# Live keys start with sk_live_ and pk_live_
32
33	# For Cloudflare Workers — store as secrets:
34	npx wrangler secret put STRIPE_SECRET_KEY
35	npx wrangler secret put STRIPE_WEBHOOK_SECRET
36
37	# For local dev — .dev.vars:
38	STRIPE_SECRET_KEY=sk_test_...
39	STRIPE_WEBHOOK_SECRET=whsec_...
40	STRIPE_PUBLISHABLE_KEY=pk_test_...
41	```
42
43	### Server-Side Client
44
45	```typescript
46	import Stripe from 'stripe';
47
48	// Cloudflare Workers
49	const stripe = new Stripe(c.env.STRIPE_SECRET_KEY);
50
51	// Node.js
52	const stripe = new Stripe(process.env.STRIPE_SECRET_KEY!);
53	```
54
55	## One-Time Payment (Checkout Sessions)
56
57	The fastest way to accept payment. Stripe hosts the entire checkout page.
58
59	### Create a Checkout Session (Server)
60
61	```typescript
62	app.post('/api/checkout', async (c) => {
63	const { priceId, successUrl, cancelUrl } = await c.req.json();
64
65	const session = await stripe.checkout.sessions.create({
66	mode: 'payment',
67	line_items: [{ price: priceId, quantity: 1 }],
68	success_url: successUrl \|\| `${new URL(c.req.url).origin}/success?session_id={CHECKOUT_SESSION_ID}`,
69	cancel_url: cancelUrl \|\| `${new URL(c.req.url).origin}/pricing`,
70	});
71
72	return c.json({ url: session.url });
73	});
74	```
75
76	### Redirect to Checkout (Client)
77
78	```typescript
79	async function handleCheckout(priceId: string) {
80	const res = await fetch('/api/checkout', {
81	method: 'POST',
82	headers: { 'Content-Type': 'application/json' },
83	body: JSON.stringify({ priceId }),
84	});
85	const { url } = await res.json();
86	window.location.href = url;
87	}
88	```
89
90	### Create Products and Prices
91
92	```bash
93	# Via Stripe CLI (recommended for setup)
94	stripe products create --name="Pro Plan" --description="Full access"
95	stripe prices create --product=prod_XXX --unit-amount=2900 --currency=aud --recurring[interval]=month
96
97	# Or via Dashboard: https://dashboard.stripe.com/products
98	```
99
100	Hardcode price IDs in your code (they don't change):
101	```typescript
102	const PRICES = {
103	pro_monthly: 'price_1234567890',
104	pro_yearly: 'price_0987654321',
105	} as const;
106	```
107
108	## Subscriptions
109
110	Same as one-time but with `mode: 'subscription'`:
111
112	```typescript
113	const session = await stripe.checkout.sessions.create({
114	mode: 'subscription',
115	line_items: [{ price: PRICES.pro_monthly, quantity: 1 }],
116	success_url: `${origin}/dashboard?session_id={CHECKOUT_SESSION_ID}`,
117	cancel_url: `${origin}/pricing`,
118	// Link to existing customer if known:
119	customer: customerId, // or customer_email: 'user@example.com'
120	});
121	```
122
123	### Check Subscription Status
124
125	```typescript
126	async function hasActiveSubscription(customerId: string): Promise<boolean> {
127	const subs = await stripe.subscriptions.list({
128	customer: customerId,
129	status: 'active',
130	limit: 1,
131	});
132	return subs.data.length > 0;
133	}
134	```
135
136	## Webhooks
137
138	Stripe sends events to your server when things happen (payment succeeded, subscription cancelled, etc.). You must verify the webhook signature.
139
140	### Webhook Handler (Cloudflare Workers / Hono)
141
142	```typescript
143	app.post('/api/webhooks/stripe', async (c) => {
144	const body = await c.req.text();
145	const sig = c.req.header('stripe-signature')!;
146
147	let event: Stripe.Event;
148	try {
149	// Use constructEventAsync for Workers (no Node crypto)
150	event = await stripe.webhooks.constructEventAsync(
151	body,
152	sig,
153	c.env.STRIPE_WEBHO

People who liked this also viewed

6 picks

Type