Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub

Gatsby Source Dog

Fetch data from Dog CEO API


Installation

yarn add gatsby-source-dog

How to Use

Visit this or this to get the list of available dog breeds.

In your gatsby-config.js, add the plugin and options:

{
  ...
    plugins: [
      ...
      {
        resolve: 'gatsby-source-dog',
        options: {
          breeds: {
            list: true,
            random: true,
            number: 5,
          },
          breed: [
            "husky",
            "Border Collie",
            "retriever-golden",
            {
              name: "corgi",
            },
            {
              name: "Great Dane",
              random: true,
            },
            {
              name: "pug",
              random: true,
              number: 3,
            },
          ],
        },
      },
    ],
    ...
}

How to Query

To query all images:

  allDogImage {
    edges {
      node {
        id
        breed
        url
        internal {
          ...
        }
      }
    }
  }

To query all images based on dog breed:

  allDogImage(filter: { breed: { eq:  "Border Collie" } }) {
    edges {
      node {
        id
        breed
        url
        internal {
          ...
        }
      }
    }
  }

To query one image based on id:

  dogImage(id: { eq: "cb75eb4f-0bf4-56ca-ba4a-680b5678526d" }) {
    id
    breed
    url
    internal {
      ...
    }
  }
© 2023 Gatsby, Inc.