Set up a new site for local development with Netlify Dev

Return JSON data from a serverless function using Netlify Functions

Use the native Fetch API to load JSON data into an HTML page

Use HTML templates to display JSON data

Set up a GitHub repository for automatic deploys using Netlify’s CLI

Use Netlify environment variables during local development

Use serverless functions to handle the Stripe Checkout flow on Jamstack sites

Sell Products Using Stripe Checkout and Netlify Functions

Run [Netlify Functions](https://www.netlify.com/products/functions/?utm_source=egghead&utm_medium=stripe-products-jl&utm_campaign=devex) locally with access to environment variables using [Netlify Dev](https://www.netlify.com/products/dev/?utm_source=egghead&utm_medium=stripe-products-jl&utm_campaign=devex).

Jason Lengstorf: [0:00] A really convenient way to develop with Netlify functions is to be able to run them locally, but when you're using environment variables, it can be kind of challenging to do that. Fortunately, Netlify Dev allows us a way to set environment variables in Netlify's dashboard and then use them locally.

[0:15] To show you how this works, we're going to log in to stripe, go to our dashboard, and we're Viewing test data. We're going to go into Developers and then we'll go to API keys and we want to grab our publishable key and our secret key.

[0:33] We're going to keep this open for a second, because next we're going to go to app.netlify.com and we're going to open up the stripe-checkout-netlify-serverless site that we just created. I'm going to go to Deploys and then Deploy settings. Down here, we can see our environment variables for this site.

[0:53] I want to create two environment variables. The first one is going to be called STRIPE_PUBLISHABLE_KEY. The next one is going to be called STRIPE_SECRET_KEY.

[1:06] If I go back over, I can copy this value for the publishable key, and then I can reveal the secret key, copy that value and paste it in here. Then I can save that and now we've got our publishable key and our secret key saved in Netlify.

[1:29] If I come out and run ntl dev, we can see that now the publishable key and the secret key have been brought in by Netlify Dev so we can develop with those values set.

Use Netlify environment variables during local development

Share this video with your friends

Course

Sell Products Using Stripe Checkout and Netlify Functions