Medusa is an open-source headless commerce engine that enables developers to create amazing digital commerce experiences.
⚠️ This storefront is deprecated and may not work with the latest versions of Medusa. It's recommended to use the Next.js storefront instead.
- Create a new Gatsby project
npx gatsby new my-medusa-storefront https://github.com/medusajs/gatsby-starter-medusa
# or
git clone https://github.com/medusajs/gatsby-starter-medusa.git my-medusa-storefront
- Install dependencies
cd my-medusa-storefront
yarn
- Link to your backend
In the folder my-medusa-storefront
you should have a .env.template
file with the following content:
GATSBY_MEDUSA_BACKEND_URL=http://localhost:9000
Before you can start developing your site you first need to copy this file into a new file named .env.development
.
mv .env.template .env.development
Per default your Medusa server should be running on localhost:9000
, but if you have changed this you will then need to replace GATSBY_MEDUSA_BACKEND_URL
with the URL of your Medusa server.
GATSBY_MEDUSA_BACKEND_URL=<link to your server>
- Start development
You should now be able to start developing your site.
yarn start
-
Open the source code and start editing!
Your site is now running at
http://localhost:8000
!Note: You'll also see a second link:
http://localhost:8000/___graphql
. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the Gatsby tutorial.Open the
my-medusa-starter
directory in your code editor of choice and editsrc/pages/index.jsx
. Save your changes and the browser will update in real time!