This is a guide for deploying our Gatsby storefront starter on Netlify. Netlify is a platform that offers hosting and backend services for applications and static websites. The steps in this guide will work for most Gatsby projects.
At this point, you should have a local Gatsby storefront project running. If not, check out our starter or use
npx create-medusa-appto set up your application in a matter of minutes. For the latter, see this guide for a small walkthrough.
Install Netlify CLI on your machine using npm:
npm install netlify-cli -g
Connect to your Netlify account from your terminal:
Follow the instructions in your terminal.
In order to deploy the project to Netlify, you need to create a new site, link the storefront Git repository to the site and configure environment variables.
The Netlify CLI is used to achieve this.
Follow the instructions in your terminal to authorize and connect your Git repository.
The default build and deploy settings fit the needs of a Gatsby application, so leave these as is.
netlify env:set GATSBY_STORE_URL "https://your-medusa-server.com"
The above environment variable should point to your Medusa server.
Finally to deploy the storefront, commit and push your changes to the repository connected in step 3.
git add .git commit -m "Deploy Medusa Admin on Netlify"git push origin main
Within a couple of minutes, your Gatsby storefront is up and running on Netlify.
If you experience CORS issues in your new setup, you might need to add your storefront url as part of the STORE_CORS environment variable in your server setup.
If you haven't deployed your Medusa server to use with your new storefront, check out our guide Deploying on Heroku.
Gatsby is not your thing? Check out our Next.js storefront starter.