https://github.com/medusajs/gatsby-starter-medusa

A production-ready Gatsby starter for Medusa
https://github.com/medusajs/gatsby-starter-medusa

Last synced: 6 days ago
JSON representation

A production-ready Gatsby starter for Medusa

• Host: GitHub
• URL: https://github.com/medusajs/gatsby-starter-medusa
• Owner: medusajs
• License: mit
• Created: 2021-12-13T09:23:52.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2023-04-06T15:01:18.000Z (over 1 year ago)
• Last Synced: 2024-10-02T02:26:02.590Z (about 1 month ago)
• Language: JavaScript
• Size: 326 KB
• Stars: 80
• Watchers: 8
• Forks: 51
• Open Issues: 9
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-medusajs - Gatsby starter

README

        


  

    

  





  Medusa Gatsby Starter





Medusa is an open-source headless commerce engine that enables developers to create amazing digital commerce experiences.





  

    

  

  

    

  

  

    

  

  

    

  



> :warning: **This storefront is deprecated and may not work with the latest versions of Medusa. It's recommended to use the [Next.js storefront](https://github.com/medusajs/nextjs-starter-medusa) instead.**

## 🚀 Quick Start

[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/medusajs/gatsby-starter-medusa)

1. **Create a new Gatsby project**

```zsh

  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

```

2. **Install dependencies**

```zsh

  cd my-medusa-storefront

  yarn

```

3. **Link to your backend**

In the folder `my-medusa-storefront` you should have a `.env.template` file with the following content:

```shell

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`.

```zsh

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.

```zsh

GATSBY_MEDUSA_BACKEND_URL=

```

4. **Start development**

You should now be able to start developing your site.

```zsh

yarn start

```

5. **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](https://www.gatsbyjs.com/tutorial/part-five/#introducing-graphiql)._

   Open the `my-medusa-starter` directory in your code editor of choice and edit `src/pages/index.jsx`. Save your changes and the browser will update in real time!