Common GraphQL queries for Gatsby

NOTES:

  • can't do string interpolation or use props in a static query

Get all files in a specific folder

You can do that with sourceInstanceName on file

{
  allFile(filter: { sourceInstanceName: { eq: "notes" } }) {
    nodes {
      sourceInstanceName
      name
    }
  }
}

notes is the folder in the above query, and you'll get the names of all files in that folder. Without that filter, you'll get something like this

{
  allFile {
    nodes {
      sourceInstanceName
      name
    }
  }
}
{
  "data": {
    "allFile": {
      "nodes": [
        {
          "sourceInstanceName": "images",
          "name": "Banner-Aamnah-LinkedIn"
        },
        {
          "sourceInstanceName": "images",
          "name": "Logo-white"
        },
        {
          "sourceInstanceName": "images",
          "name": "Logo"
        },
        {
          "sourceInstanceName": "images",
          "name": "gateron-switch-3pin-5pin"
        },
        {
          "sourceInstanceName": "images",
          "name": "email-notification-settings"
        },
        {
          "sourceInstanceName": "images",
          "name": "netlify-contact-submission-response"
        },
        {
          "sourceInstanceName": "images",
          "name": "CherryMX-Switch-Guide"
        },
        {
          "sourceInstanceName": "pages",
          "name": "404"
        },
        {
          "sourceInstanceName": "pages",
          "name": "blog"
        },
        {
          "sourceInstanceName": "pages",
          "name": "index"
        },
        {
          "sourceInstanceName": "blog",
          "name": "first-mechanical-keyboard"
        },
        {
          "sourceInstanceName": "blog",
          "name": "setup-gatsby-mdx-blog"
        },
        {
          "sourceInstanceName": "blog",
          "name": "ukulele-notes"
        },
        {
          "sourceInstanceName": "blog",
          "name": "14_days_social_isolation"
        },
        {
          "sourceInstanceName": "notes",
          "name": "gatsby-netlify-contact-form"
        },
        {
          "sourceInstanceName": "notes",
          "name": "gatsby_graphql_queries"
        }
      ]
    }
  }
}

It picks up the stuff in images, blog, notes and pages directories..

Please note that this site and the posts on it are, and will always be, a work in progress. If i waited for perfection, i’d never get anything done.