Vercel changes

Author: thorsten-stripe

Diff for: .env.example renamed to .env.local.example

@@ -1,15 +1,13 @@
-.env
 .DS_Store
 .vscode
 
 # Node files
 node_modules/
-package-lock.json
-yarn.lock
 
 # Typescript
 dist
 
 # Next.js
 .next
-.now
+.vercel
+.env*.local

Diff for: .gitignore

@@ -34,8 +34,6 @@ Read more about testing on Stripe at https://stripe.com/docs/testing.
 ### Included functionality
 
 - [Global CSS styles](https://nextjs.org/blog/next-9-2#built-in-css-support-for-global-stylesheets)
-- Making `.env` variables available to next: [next.config.js](next.config.js)
-  - **Note**: When deploying with Now you need to [add your secrets](https://vercel.com/docs/v2/serverless-functions/env-and-secrets) and specify a [now.json](/now.json) file.
 - Implementation of a Layout component that loads and sets up Stripe.js and Elements for usage with SSR via `loadStripe` helper: [components/Layout.tsx](components/Layout.tsx).
 - Stripe Checkout
   - Custom Amount Donation with redirect to Stripe Checkout:
@@ -78,13 +76,13 @@ cd with-stripe-typescript
 
 ### Required configuration
 
-Copy the `.env.example` file into a file named `.env` in the root directory of this project:
+Copy the `.env.local.example` file into a file named `.env.local` in the root directory of this project:
 
 ```bash
-cp .env.example .env
+cp .env.local.example .env.local
 ```
 
-You will need a Stripe account ([register](https://dashboard.stripe.com/register)) to run this sample. Go to the Stripe [developer dashboard](https://stripe.com/docs/development#api-keys) to find your API keys and replace them in the `.env` file.
+You will need a Stripe account ([register](https://dashboard.stripe.com/register)) to run this sample. Go to the Stripe [developer dashboard](https://stripe.com/docs/development#api-keys) to find your API keys and replace them in the `.env.local` file.
 
 ```bash
 NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=<replace-with-your-publishable-key>
@@ -111,27 +109,29 @@ Next, start the webhook forwarding:
 stripe listen --forward-to localhost:3000/api/webhooks
 ```
 
-The CLI will print a webhook secret key to the console. Set `STRIPE_WEBHOOK_SECRET` to this value in your `.env` file.
+The CLI will print a webhook secret key to the console. Set `STRIPE_WEBHOOK_SECRET` to this value in your `.env.local` file.
 
 ### Deploy
 
+[![Deploy to Vercel](https://vercel.com/button)](https://vercel.com/import/project?template=https://github.com/vercel/next.js/tree/canary/examples/with-stripe-typescript)
+
 Deploy it to the cloud with [Vercel](https://vercel.com/import?filter=next.js&utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)).
 
 **Note**: You must add your Stripe secrets using the Vercel CLI ([Download here](https://vercel.com/download)):
 
 ```bash
-now secrets add stripe_publishable_key pk_***
-now secrets add stripe_secret_key sk_***
-now secrets add stripe_webhook_secret whsec_***
+vercel secrets add stripe_publishable_key pk_***
+vercel secrets add stripe_secret_key sk_***
+vercel secrets add stripe_webhook_secret whsec_***
 ```
 
 After deploying, copy the deployment URL with the webhook path (`https://your-url.now.sh/api/webhooks`) and create a live webhook endpoint [in your Stripe dashboard](https://stripe.com/docs/webhooks/setup#configure-webhook-settings).
 
 **Note**: Your live webhook will have a different secret. To update it in your deployed application you will need to first remove the existing secret and then add the new secret:
 
 ```bash
-now secrets rm stripe_webhook_secret
-now secrets add stripe_webhook_secret whsec_***
+vercel secrets rm stripe_webhook_secret
+vercel secrets add stripe_webhook_secret whsec_***
 ```
 
 As the secrets are set as env vars in the project at deploy time, we will need to redeploy our app after we made changes to the secrets.