Skip to content

Commit 92b7371

Browse files
authored
Improves getting started section and fixes typos (#317)
1 parent 00aefc9 commit 92b7371

File tree

6 files changed

+19
-13
lines changed

6 files changed

+19
-13
lines changed

docs/docs/usage/components/CartProvider.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ const products = [
5151
]
5252
```
5353

54-
Additionally, you must verify the cartItems on the server-side before creating the CheckoutSession. For this you can use the [validateCartItems() helper](docs/usage/validate-cart-items).
54+
Additionally, you must verify the cartItems on the server-side before creating the CheckoutSession. For this you can use the [validateCartItems() helper](/docs/usage/serverless/validate-cart-items).
5555

5656
## Client-only Checkout mode
5757

docs/docs/welcome/getting-started-client-mode.mdx

+7-3
Original file line numberDiff line numberDiff line change
@@ -46,11 +46,13 @@ https://stripe.com/docs/api/checkout/sessions/object#checkout_session_object-mod
4646

4747
## Using the hook
4848

49-
The hook `useShoppingCart()` provides several utilities and pieces of data for you to use in your application. The examples below won't cover every part of the `useShoppingCart()` API but you can [look at the API](#API) below.
49+
The hook `useShoppingCart()` provides several utilities and pieces of data for you to use in your application. The examples below won't cover every part of the `useShoppingCart()` API but you can explore the documentation to find out more.
5050

5151
### Products Created on Stripe's Dashboard
5252

53-
This is for products you created on the Stripe Dashboard. Stripe provides you with a Price ID String. You don't need a server(less)
53+
To use client only mode, you'll need to add some products on the Stripe Dashboard. Check out [Stripe's documentation](https://stripe.com/docs/products-prices/manage-prices) for more information on how to do this.
54+
55+
Stripe provides you with a Price ID String. You don't need a server(less)
5456
set up to use this library this way unless you want more control over how the payments are handled.
5557

5658
```jsx
@@ -62,21 +64,23 @@ const productData = [
6264
{
6365
name: 'Bananas',
6466
price_id: 'price_GBJ2Ep8246qeeT',
67+
// price in smallest currency unit (e.g. cent for USD)
6568
price: 400,
6669
image: 'https://www.fillmurray.com/300/300',
6770
currency: 'USD'
6871
},
6972
{
7073
name: 'Tangerines',
7174
price_id: 'price_GBJ2WWfMaGNC2Z',
75+
// price in smallest currency unit (e.g. cent for USD)
7276
price: 100,
7377
image: 'https://www.fillmurray.com/300/300',
7478
currency: 'USD'
7579
}
7680
]
7781

7882
export function App() {
79-
/* Gets the totalPrice and a method for redirecting to stripe */
83+
/* Gets the totalPrice and a method for redirecting to Stripe */
8084
const { totalPrice, redirectToCheckout, cartCount } = useShoppingCart()
8185

8286
return (

docs/docs/welcome/getting-started-serverless.mdx

+7-5
Original file line numberDiff line numberDiff line change
@@ -38,19 +38,20 @@ ReactDOM.render(
3838

3939
## Using the hook
4040

41-
The hook `useShoppingCart()` provides several utilities and pieces of data for you to use in your application. The examples below won't cover every part of the `useShoppingCart()` API but you can [look at the API](#API) below.
41+
The hook `useShoppingCart()` provides several utilities and pieces of data for you to use in your application. The examples below won't cover every part of the `useShoppingCart()` API but you can explore the documentation to find out more.
4242

4343
### Serverless implementation
4444

45-
If you're data source isn't coming from Stripe's dashboard, you can still make products and process payments.
45+
If your data source isn't coming from Stripe's dashboard, you can still make products and process payments.
4646

47-
You're product data should look like this:
47+
Your product data should look like this:
4848

4949
```js
5050
const productData = [
5151
{
5252
name: 'Bananas',
5353
id: 'some_unique_id_1',
54+
// price in smallest currency unit (e.g. cent for USD)
5455
price: 400,
5556
image: 'https://www.fillmurray.com/300/300',
5657
currency: 'USD'
@@ -68,6 +69,7 @@ const productData = [
6869
{
6970
name: 'Tangerines',
7071
id: 'some_unique_id_2',
72+
// price in smallest currency unit (e.g. cent for USD)
7173
price: 100,
7274
image: 'https://www.fillmurray.com/300/300',
7375
currency: 'USD',
@@ -85,7 +87,7 @@ const productData = [
8587
]
8688
```
8789

88-
_NOTE_: `price_data` and `product_data` are not required for use-shopping-cart to work, but they are required for creating Sessions with Stripe.
90+
_Note_: `price_data` and `product_data` are not required for use-shopping-cart to work, but they are required for creating Sessions with Stripe.
8991

9092
This library manages `price_data` and `product_data` for you, but if you need to pass extra data to your Sessions, you can add them directly to your
9193
product objects.
@@ -177,7 +179,7 @@ return {
177179
}
178180
```
179181

180-
_NOTE_: `price_data` and `product_data` are not required for use-shopping-cart to work, but they are required for creating Sessions with Stripe.
182+
_Note_: `price_data` and `product_data` are not required for use-shopping-cart to work, but they are required for creating Sessions with Stripe.
181183

182184
This library manages `price_data` and `product_data` for you, but if you need to pass extra data to your Sessions, you can add them directly to your
183185
product objects.

docs/docs/welcome/getting-started.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ There are two ways you can implement this library. Client Only mode and Checkout
99

1010
## Client Only Mode
1111

12-
This is for anyone who wants to make their products on the Stripe dashboard and doesn't want to manage their
12+
This is for anyone who wants to [configure their products](https://stripe.com/docs/products-prices/manage-prices) on the Stripe Dashboard and doesn't want to manage their
1313
own server. This is a secure, easy way to get up and running.
1414

1515
<Link to="/docs/welcome/getting-started-client-mode">

docs/docs/welcome/typescript.mdx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
2-
title: Getting Started with TypeScript
2+
title: Getting started with TypeScript
33
id: getting-started-with-typescript
44
---
55

6-
This library now works with TypeScript! You can use `use-shopping-cart` just the same as before but now with types. Take for example these two files from our very own `typescript-usage` example workspace.
6+
This library now works with TypeScript! You can use `use-shopping-cart` just the same as before but now with types. Take for example these two files from our very own [`typescript-usage` example workspace](https://github.com/dayhaysoos/use-shopping-cart/tree/master/examples/typescript-usage).
77

88
```tsx
99
import * as React from 'react'

docs/src/pages/index.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ const Home = () => {
3737
<Feature
3838
title="Developer friendly API"
3939
imageUrl="img/api.svg"
40-
description="Abstract away the complexity of working with Stripe so that you can focus the products your customers love!"
40+
description="Abstract away the complexity of working with Stripe so that you can focus on the products your customers love!"
4141
/>
4242
<Feature
4343
title="Framework agnostic"

0 commit comments

Comments
 (0)